fix: switch from defaultProps to JS default params (#6568)

react-bootstrap · Mar 30, 2023 · 1d5b726 · 1d5b726
1 parent e969b7e
commit 1d5b726
Show file tree

Hide file tree

Showing 40 changed files with 635 additions and 751 deletions.
diff --git a/src/AbstractModalHeader.tsx b/src/AbstractModalHeader.tsx
@@ -39,17 +39,19 @@ const propTypes = {
   onHide: PropTypes.func,
 };
 
-const defaultProps = {
-  closeLabel: 'Close',
-  closeButton: false,
-};
-
 const AbstractModalHeader = React.forwardRef<
   HTMLDivElement,
   AbstractModalHeaderProps
 >(
   (
-    { closeLabel, closeVariant, closeButton, onHide, children, ...props },
+    {
+      closeLabel = 'Close',
+      closeVariant,
+      closeButton = false,
+      onHide,
+      children,
+      ...props
+    },
     ref,
   ) => {
     const context = useContext(ModalContext);
@@ -76,6 +78,5 @@ const AbstractModalHeader = React.forwardRef<
 );
 
 AbstractModalHeader.propTypes = propTypes;
-AbstractModalHeader.defaultProps = defaultProps;
 
 export default AbstractModalHeader;
diff --git a/src/Alert.tsx b/src/Alert.tsx
@@ -86,26 +86,19 @@ const propTypes = {
   transition: PropTypes.oneOfType([PropTypes.bool, elementType]),
 };
 
-const defaultProps = {
-  variant: 'primary',
-  show: true,
-  transition: Fade,
-  closeLabel: 'Close alert',
-};
-
 const Alert = React.forwardRef<HTMLDivElement, AlertProps>(
   (uncontrolledProps: AlertProps, ref) => {
     const {
       bsPrefix,
-      show,
-      closeLabel,
+      show = true,
+      closeLabel = 'Close alert',
       closeVariant,
       className,
       children,
-      variant,
+      variant = 'primary',
       onClose,
       dismissible,
-      transition,
+      transition = Fade,
       ...props
     } = useUncontrolled(uncontrolledProps, {
       show: 'onClose',
@@ -152,7 +145,6 @@ const Alert = React.forwardRef<HTMLDivElement, AlertProps>(
 );
 
 Alert.displayName = 'Alert';
-Alert.defaultProps = defaultProps;
 Alert.propTypes = propTypes;
 
 export default Object.assign(Alert, {

diff --git a/src/Badge.tsx b/src/Badge.tsx
@@ -42,15 +42,18 @@ const propTypes = {
   as: PropTypes.elementType,
 };
 
-const defaultProps = {
-  bg: 'primary',
-  pill: false,
-};
-
 const Badge: BsPrefixRefForwardingComponent<'span', BadgeProps> =
   React.forwardRef<HTMLElement, BadgeProps>(
     (
-      { bsPrefix, bg, pill, text, className, as: Component = 'span', ...props },
+      {
+        bsPrefix,
+        bg = 'primary',
+        pill = false,
+        text,
+        className,
+        as: Component = 'span',
+        ...props
+      },
       ref,
     ) => {
       const prefix = useBootstrapPrefix(bsPrefix, 'badge');
@@ -72,6 +75,5 @@ const Badge: BsPrefixRefForwardingComponent<'span', BadgeProps> =
 
 Badge.displayName = 'Badge';
 Badge.propTypes = propTypes;
-Badge.defaultProps = defaultProps;
 
 export default Badge;
diff --git a/src/Breadcrumb.tsx b/src/Breadcrumb.tsx
@@ -33,20 +33,15 @@ const propTypes = {
   as: PropTypes.elementType,
 };
 
-const defaultProps = {
-  label: 'breadcrumb',
-  listProps: {},
-};
-
 const Breadcrumb: BsPrefixRefForwardingComponent<'nav', BreadcrumbProps> =
   React.forwardRef<HTMLElement, BreadcrumbProps>(
     (
       {
         bsPrefix,
         className,
-        listProps,
+        listProps = {},
         children,
-        label,
+        label = 'breadcrumb',
         // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
         as: Component = 'nav',
         ...props
@@ -75,7 +70,6 @@ const Breadcrumb: BsPrefixRefForwardingComponent<'nav', BreadcrumbProps> =
 
 Breadcrumb.displayName = 'Breadcrumb';
 Breadcrumb.propTypes = propTypes;
-Breadcrumb.defaultProps = defaultProps;
 
 export default Object.assign(Breadcrumb, {
   Item: BreadcrumbItem,

diff --git a/src/BreadcrumbItem.tsx b/src/BreadcrumbItem.tsx
@@ -50,25 +50,20 @@ const propTypes = {
   as: PropTypes.elementType,
 };
 
-const defaultProps = {
-  active: false,
-  linkProps: {},
-};
-
 const BreadcrumbItem: BsPrefixRefForwardingComponent<
   'li',
   BreadcrumbItemProps
 > = React.forwardRef<HTMLElement, BreadcrumbItemProps>(
   (
     {
       bsPrefix,
-      active,
+      active = false,
       children,
       className,
       // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
       as: Component = 'li',
       linkAs: LinkComponent = Anchor,
-      linkProps,
+      linkProps = {},
       href,
       title,
       target,
@@ -104,6 +99,5 @@ const BreadcrumbItem: BsPrefixRefForwardingComponent<
 
 BreadcrumbItem.displayName = 'BreadcrumbItem';
 BreadcrumbItem.propTypes = propTypes;
-BreadcrumbItem.defaultProps = defaultProps;
 
 export default BreadcrumbItem;
diff --git a/src/Button.tsx b/src/Button.tsx
@@ -67,18 +67,25 @@ const propTypes = {
   as: PropTypes.elementType,
 };
 
-const defaultProps = {
-  variant: 'primary',
-  active: false,
-  disabled: false,
-};
-
 const Button: BsPrefixRefForwardingComponent<'button', ButtonProps> =
   React.forwardRef<HTMLButtonElement, ButtonProps>(
-    ({ as, bsPrefix, variant, size, active, className, ...props }, ref) => {
+    (
+      {
+        as,
+        bsPrefix,
+        variant = 'primary',
+        size,
+        active = false,
+        disabled = false,
+        className,
+        ...props
+      },
+      ref,
+    ) => {
       const prefix = useBootstrapPrefix(bsPrefix, 'btn');
       const [buttonProps, { tagName }] = useButtonProps({
         tagName: as,
+        disabled,
         ...props,
       });
 
@@ -89,13 +96,14 @@ const Button: BsPrefixRefForwardingComponent<'button', ButtonProps> =
           {...buttonProps}
           {...props}
           ref={ref}
+          disabled={disabled}
           className={classNames(
             className,
             prefix,
             active && 'active',
             variant && `${prefix}-${variant}`,
             size && `${prefix}-${size}`,
-            props.href && props.disabled && 'disabled',
+            props.href && disabled && 'disabled',
           )}
         />
       );
@@ -104,6 +112,5 @@ const Button: BsPrefixRefForwardingComponent<'button', ButtonProps> =
 
 Button.displayName = 'Button';
 Button.propTypes = propTypes;
-Button.defaultProps = defaultProps;
 
 export default Button;
diff --git a/src/ButtonGroup.tsx b/src/ButtonGroup.tsx
@@ -38,23 +38,19 @@ const propTypes = {
   as: PropTypes.elementType,
 };
 
-const defaultProps = {
-  vertical: false,
-  role: 'group',
-};
-
 const ButtonGroup: BsPrefixRefForwardingComponent<'div', ButtonGroupProps> =
   React.forwardRef(
     (
       {
         bsPrefix,
         size,
-        vertical,
+        vertical = false,
         className,
+        role = 'group',
         // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
         as: Component = 'div',
         ...rest
-      }: ButtonGroupProps,
+      },
       ref,
     ) => {
       const prefix = useBootstrapPrefix(bsPrefix, 'btn-group');
@@ -66,6 +62,7 @@ const ButtonGroup: BsPrefixRefForwardingComponent<'div', ButtonGroupProps> =
         <Component
           {...rest}
           ref={ref}
+          role={role}
           className={classNames(
             className,
             baseClass,
@@ -78,6 +75,5 @@ const ButtonGroup: BsPrefixRefForwardingComponent<'div', ButtonGroupProps> =
 
 ButtonGroup.displayName = 'ButtonGroup';
 ButtonGroup.propTypes = propTypes;
-ButtonGroup.defaultProps = defaultProps;
 
 export default ButtonGroup;
diff --git a/src/ButtonToolbar.tsx b/src/ButtonToolbar.tsx
@@ -24,21 +24,22 @@ const propTypes = {
   role: PropTypes.string,
 };
 
-const defaultProps = {
-  role: 'toolbar',
-};
-
 const ButtonToolbar = React.forwardRef<HTMLDivElement, ButtonToolbarProps>(
-  ({ bsPrefix, className, ...props }, ref) => {
+  ({ bsPrefix, className, role = 'toolbar', ...props }, ref) => {
     const prefix = useBootstrapPrefix(bsPrefix, 'btn-toolbar');
 
     return (
-      <div {...props} ref={ref} className={classNames(className, prefix)} />
+      <div
+        {...props}
+        ref={ref}
+        className={classNames(className, prefix)}
+        role={role}
+      />
     );
   },
 );
 
 ButtonToolbar.displayName = 'ButtonToolbar';
 ButtonToolbar.propTypes = propTypes;
-ButtonToolbar.defaultProps = defaultProps;
+
 export default ButtonToolbar;
diff --git a/src/Card.tsx b/src/Card.tsx
@@ -69,10 +69,6 @@ const propTypes = {
   as: PropTypes.elementType,
 };
 
-const defaultProps = {
-  body: false,
-};
-
 const Card: BsPrefixRefForwardingComponent<'div', CardProps> = React.forwardRef<
   HTMLElement,
   CardProps
@@ -84,7 +80,7 @@ const Card: BsPrefixRefForwardingComponent<'div', CardProps> = React.forwardRef<
       bg,
       text,
       border,
-      body,
+      body = false,
       children,
       // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
       as: Component = 'div',
@@ -114,7 +110,6 @@ const Card: BsPrefixRefForwardingComponent<'div', CardProps> = React.forwardRef<
 
 Card.displayName = 'Card';
 Card.propTypes = propTypes;
-Card.defaultProps = defaultProps;
 
 export default Object.assign(Card, {
   Img: CardImg,