Skip to content

Commit

Permalink
Resolve defaultProps deprecation warning for React v18+ (#5689)
Browse files Browse the repository at this point in the history
* Remove `defaultProps` reference from functional components

* Prettier

* Add changeset

* Change changeset message
  • Loading branch information
Rall3n authored Jul 13, 2023
1 parent a465818 commit 16414bb
Show file tree
Hide file tree
Showing 3 changed files with 45 additions and 32 deletions.
5 changes: 5 additions & 0 deletions .changeset/metal-pens-boil.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'react-select': patch
---

Resolve `defaultProps` deprecation warning for React v18+.
48 changes: 26 additions & 22 deletions packages/react-select/src/components/Menu.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -498,49 +498,53 @@ export const NoOptionsMessage = <
Option,
IsMulti extends boolean,
Group extends GroupBase<Option>
>(
props: NoticeProps<Option, IsMulti, Group>
) => {
const { children, innerProps } = props;
>({
children = 'No options',
innerProps,
...restProps
}: NoticeProps<Option, IsMulti, Group>) => {
return (
<div
{...getStyleProps(props, 'noOptionsMessage', {
'menu-notice': true,
'menu-notice--no-options': true,
})}
{...getStyleProps(
{ ...restProps, children, innerProps },
'noOptionsMessage',
{
'menu-notice': true,
'menu-notice--no-options': true,
}
)}
{...innerProps}
>
{children}
</div>
);
};
NoOptionsMessage.defaultProps = {
children: 'No options',
};

export const LoadingMessage = <
Option,
IsMulti extends boolean,
Group extends GroupBase<Option>
>(
props: NoticeProps<Option, IsMulti, Group>
) => {
const { children, innerProps } = props;
>({
children = 'Loading...',
innerProps,
...restProps
}: NoticeProps<Option, IsMulti, Group>) => {
return (
<div
{...getStyleProps(props, 'loadingMessage', {
'menu-notice': true,
'menu-notice--loading': true,
})}
{...getStyleProps(
{ ...restProps, children, innerProps },
'loadingMessage',
{
'menu-notice': true,
'menu-notice--loading': true,
}
)}
{...innerProps}
>
{children}
</div>
);
};
LoadingMessage.defaultProps = {
children: 'Loading...',
};

// ==============================
// Menu Portal
Expand Down
24 changes: 14 additions & 10 deletions packages/react-select/src/components/indicators.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -287,17 +287,22 @@ export const LoadingIndicator = <
Option,
IsMulti extends boolean,
Group extends GroupBase<Option>
>(
props: LoadingIndicatorProps<Option, IsMulti, Group>
) => {
const { innerProps, isRtl } = props;

>({
innerProps,
isRtl,
size = 4,
...restProps
}: LoadingIndicatorProps<Option, IsMulti, Group>) => {
return (
<div
{...getStyleProps(props, 'loadingIndicator', {
indicator: true,
'loading-indicator': true,
})}
{...getStyleProps(
{ ...restProps, innerProps, isRtl, size },
'loadingIndicator',
{
indicator: true,
'loading-indicator': true,
}
)}
{...innerProps}
>
<LoadingDot delay={0} offset={isRtl} />
Expand All @@ -306,4 +311,3 @@ export const LoadingIndicator = <
</div>
);
};
LoadingIndicator.defaultProps = { size: 4 };

0 comments on commit 16414bb

Please sign in to comment.