Revert "refactor(button): Inline default props"

This inline method is not picked up as default props in TS This reverts commit f66b4b1f97cb84d1d15189f231d47d4962f3555f.
Workday · Feb 20, 2020 · bdfd860 · bdfd860
1 parent a05b8a0
commit bdfd860
Show file tree

Hide file tree

Showing 7 changed files with 41 additions and 44 deletions.
diff --git a/modules/_labs/button/react/lib/Button.tsx b/modules/_labs/button/react/lib/Button.tsx
@@ -31,15 +31,7 @@ export interface ButtonProps extends React.HTMLAttributes<HTMLButtonElement>, Gr
 }
 
 const Button = (props: ButtonProps) => {
-  const {
-    variant = ButtonVariant.Secondary,
-    size = ButtonSize.Medium,
-    buttonRef,
-    dataLabel,
-    icon,
-    children,
-    ...elemProps
-  } = props;
+  const {variant, size, buttonRef, dataLabel, icon, children, ...elemProps} = props;
 
   return (
     // eslint-disable-next-line no-use-before-define
@@ -54,6 +46,11 @@ const Button = (props: ButtonProps) => {
 Button.Variant = ButtonVariant;
 Button.Size = ButtonSize;
 
+Button.defaultProps = {
+  variant: ButtonVariant.Secondary,
+  size: ButtonSize.Medium,
+};
+
 export default Button;
 
 export const getButtonColors = (variant: ButtonVariant | DropdownButtonVariant): ButtonColors => {

diff --git a/modules/_labs/button/react/lib/DeleteButton.tsx b/modules/_labs/button/react/lib/DeleteButton.tsx
@@ -36,7 +36,7 @@ const getDeleteButtonColors = (): ButtonColors => ({
 });
 
 const DeleteButton = (props: DeleteButtonProps) => {
-  const {size = ButtonSize.Medium, buttonRef, children, ...elemProps} = props;
+  const {size, buttonRef, children, ...elemProps} = props;
   return (
     <ButtonContainer
       colors={getDeleteButtonColors()}
@@ -51,4 +51,8 @@ const DeleteButton = (props: DeleteButtonProps) => {
 
 DeleteButton.Size = ButtonSize;
 
+DeleteButton.defaultProps = {
+  size: ButtonSize.Medium,
+};
+
 export default DeleteButton;
diff --git a/modules/_labs/button/react/lib/DropdownButton.tsx b/modules/_labs/button/react/lib/DropdownButton.tsx
@@ -25,13 +25,7 @@ export interface DropdownButtonProps
 }
 
 const DropdownButton = (props: DropdownButtonProps) => {
-  const {
-    variant = DropdownButtonVariant.Secondary,
-    size = ButtonSize.Medium,
-    buttonRef,
-    children,
-    ...elemProps
-  } = props;
+  const {variant, size, buttonRef, children, ...elemProps} = props;
   return (
     <ButtonContainer
       colors={getButtonColors(variant)}
@@ -56,4 +50,9 @@ DropdownButton.Size = {
   Large: ButtonSize.Large,
 };
 
+DropdownButton.defaultProps = {
+  variant: DropdownButtonVariant.Secondary,
+  size: ButtonSize.Medium,
+};
+
 export default DropdownButton;
diff --git a/modules/_labs/button/react/lib/HighlightButton.tsx b/modules/_labs/button/react/lib/HighlightButton.tsx
@@ -61,7 +61,7 @@ const getHighlightButtonColors = (): ButtonColors => ({
 });
 
 const HighlightButton = (props: HighlightButtonProps) => {
-  const {size = ButtonSize.Medium, buttonRef, dataLabel, icon, children, ...elemProps} = props;
+  const {size, buttonRef, dataLabel, icon, children, ...elemProps} = props;
   return (
     <ButtonContainer
       colors={getHighlightButtonColors()}
@@ -81,4 +81,8 @@ HighlightButton.Size = {
   Large: ButtonSize.Large,
 };
 
+HighlightButton.defaultProps = {
+  size: ButtonSize.Medium,
+};
+
 export default HighlightButton;
diff --git a/modules/_labs/button/react/lib/IconButton.tsx b/modules/_labs/button/react/lib/IconButton.tsx
@@ -41,16 +41,7 @@ export interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEl
 }
 
 const IconButton = (props: IconButtonProps) => {
-  const {
-    variant = IconButtonVariant.Circle,
-    size = ButtonSize.Medium,
-    buttonRef,
-    onToggleChange,
-    icon,
-    toggled,
-    children,
-    ...elemProps
-  } = props;
+  const {buttonRef, size, variant, onToggleChange, icon, toggled, children, ...elemProps} = props;
 
   React.useEffect(() => {
     if (typeof props.onToggleChange === 'function') {
@@ -98,6 +89,11 @@ IconButton.Size = {
   Medium: ButtonSize.Medium,
 };
 
+IconButton.defaultProps = {
+  variant: IconButtonVariant.Circle,
+  size: ButtonSize.Medium,
+};
+
 export default IconButton;
 
 const getIconButtonColors = (variant: IconButtonVariant, toggled?: boolean): ButtonColors => {

diff --git a/modules/_labs/button/react/lib/TextButton.tsx b/modules/_labs/button/react/lib/TextButton.tsx
@@ -89,15 +89,7 @@ const containerStyles = {
 };
 
 const TextButton = (props: TextButtonProps) => {
-  const {
-    variant = TextButtonVariant.Default,
-    size = ButtonSize.Medium,
-    iconPosition = ButtonIconPosition.Left,
-    buttonRef,
-    children,
-    icon,
-    ...elemProps
-  } = props;
+  const {buttonRef, children, iconPosition, size, variant, icon, ...elemProps} = props;
 
   // Note: We don't use ButtonLabel because they label styles differ from other button types
   const allContainerStyles =
@@ -140,4 +132,10 @@ TextButton.Size = {
   Medium: ButtonSize.Medium,
 };
 
+TextButton.defaultProps = {
+  iconPosition: ButtonIconPosition.Left,
+  variant: TextButtonVariant.Default,
+  size: ButtonSize.Medium,
+};
+
 export default TextButton;
diff --git a/modules/_labs/button/react/lib/deprecated_Button.tsx b/modules/_labs/button/react/lib/deprecated_Button.tsx
@@ -158,13 +158,7 @@ const Container = styled('button')<DeprecatedButtonProps>(
 );
 
 const DeprecatedButton = (props: DeprecatedButtonProps) => {
-  const {
-    variant = DeprecatedButtonVariant.Secondary,
-    size = ButtonSize.Medium,
-    buttonRef,
-    children,
-    ...elemProps
-  } = props;
+  const {variant, size, buttonRef, children, ...elemProps} = props;
 
   React.useEffect(() => {
     console.warn('This component is now deprecated, consider using the new Button component');
@@ -180,4 +174,9 @@ const DeprecatedButton = (props: DeprecatedButtonProps) => {
 DeprecatedButton.Variant = DeprecatedButtonVariant;
 DeprecatedButton.Size = ButtonSize;
 
+DeprecatedButton.defaultProps = {
+  variant: DeprecatedButtonVariant.Secondary,
+  size: ButtonSize.Medium,
+};
+
 export default DeprecatedButton;