Skip to content

feat(react-utilities): add custom RefAttributes interface which is used within ForwardRefComponent to mitigate React.RefAttributes expansion causing breaking changes in v8/v9 mixed context - shipped as patch release in @types/[email protected] #34572

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged

Conversation

Hotell
Copy link
Contributor

@Hotell Hotell commented Jun 2, 2025

Previous Behavior

New Behavior

Introduces a custom RefAttributes type to address compatibility issues with React.RefAttributes across different versions of React (17, 18, and 19).

The changes ensure consistent types for ref props in components and mitigate type issues caused by breaking union extension changes in React's type definitions (RefAttributes ref property) (see DefinitelyTyped/DefinitelyTyped#68720).

Uses the new RefAttributes type as part of ForwardRefComponent to ship deterministic type no matter what @types/react version is used

Before:

import * as React from 'react';

interface Props extends React.RefAttributes<HTMLElement> {}

const Component = React.forwardRef<HTMLElement,Props>((props,ref)=>{...});

After:

import * as React from 'react';
import type { RefAttributes, ForwardRefComponent } from '@fluentui/react-utilities';

interface Props extends RefAttributes<HTMLElement> {}

// Don't instatiate forwardRef generic, rather cast to ForwardRefComponent
const Component = React.forwardRef((props,ref)=>{...}) as ForwardRefComponent<Props>;

Related Issue(s)

@Hotell Hotell changed the title feat: add custom RefAttributes interface which is used within ForwardRefComponent to mitigate breaking changes shipped as patch release in @types/[email protected] feat: add custom RefAttributes interface which is used within ForwardRefComponent to mitigate breaking changes shipped as patch release in @types/[email protected] Jun 2, 2025
@Hotell Hotell changed the title feat: add custom RefAttributes interface which is used within ForwardRefComponent to mitigate breaking changes shipped as patch release in @types/[email protected] feat(react-utilities): add custom RefAttributes interface which is used within ForwardRefComponent to mitigate breaking changes shipped as patch release in @types/[email protected] Jun 2, 2025
Copy link

github-actions bot commented Jun 2, 2025

Pull request demo site: URL

Copy link

github-actions bot commented Jun 2, 2025

📊 Bundle size report

✅ No changes found

@Hotell Hotell changed the title feat(react-utilities): add custom RefAttributes interface which is used within ForwardRefComponent to mitigate breaking changes shipped as patch release in @types/[email protected] feat(react-utilities): add custom RefAttributes interface which is used within ForwardRefComponent to mitigate unexpected React.RefAttributes changes shipped as patch release in @types/[email protected] Jun 3, 2025
@Hotell Hotell changed the title feat(react-utilities): add custom RefAttributes interface which is used within ForwardRefComponent to mitigate unexpected React.RefAttributes changes shipped as patch release in @types/[email protected] feat(react-utilities): add custom RefAttributes interface which is used within ForwardRefComponent to mitigate React.RefAttributes expansion causing breaking changes in v8/v9 mixed context - shipped as patch release in @types/[email protected] Jun 3, 2025
@Hotell Hotell force-pushed the react-18/introduce-custom-ref-html-and-migrate branch from df780d9 to 89e436b Compare June 3, 2025 13:37
@Hotell Hotell force-pushed the react-18/introduce-custom-ref-html-and-migrate branch from 89e436b to 813b1fb Compare June 4, 2025 09:14
@Hotell Hotell marked this pull request as ready for review June 4, 2025 10:07
@Hotell Hotell requested review from a team as code owners June 4, 2025 10:07
@Hotell Hotell requested a review from dmytrokirpa June 4, 2025 10:16
@Hotell Hotell merged commit 82db061 into microsoft:master Jun 6, 2025
12 of 15 checks passed
@Hotell Hotell deleted the react-18/introduce-custom-ref-html-and-migrate branch June 6, 2025 12:14
mainframev pushed a commit to mainframev/fluentui that referenced this pull request Jun 9, 2025
…used within ForwardRefComponent to mitigate `React.RefAttributes` expansion causing breaking changes in v8/v9 mixed context - shipped as patch release in @types/[email protected] (microsoft#34572)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants