diff --git a/ui/components/component-library/button-link/README.mdx b/ui/components/component-library/button-link/README.mdx index 413564658..cd37a4c7d 100644 --- a/ui/components/component-library/button-link/README.mdx +++ b/ui/components/component-library/button-link/README.mdx @@ -15,10 +15,6 @@ The `ButtonLink` is an extension of `ButtonBase` to support link styles -The `ButtonLink` accepts all [ButtonBase](/docs/components-componentlibrary-buttonbase--default-story#props) component props - - - ### Size Use the `size` prop and the `ButtonLinkSize` enum from `./ui/components/component-library` to change the size of `ButtonLink`. Defaults to `ButtonLinkSize.Auto` diff --git a/ui/components/component-library/button-link/button-link.tsx b/ui/components/component-library/button-link/button-link.tsx index 3462dde8e..221866183 100644 --- a/ui/components/component-library/button-link/button-link.tsx +++ b/ui/components/component-library/button-link/button-link.tsx @@ -15,9 +15,9 @@ export const ButtonLink: ButtonLinkComponent = React.forwardRef( { className, color, - danger, - disabled, - loading, + danger = false, + disabled = false, + loading = false, size = ButtonLinkSize.Auto, ...props }: ButtonLinkProps, diff --git a/ui/components/component-library/button-link/button-link.types.ts b/ui/components/component-library/button-link/button-link.types.ts index 5d4552c47..5ffe76076 100644 --- a/ui/components/component-library/button-link/button-link.types.ts +++ b/ui/components/component-library/button-link/button-link.types.ts @@ -16,20 +16,20 @@ export interface ButtonLinkStyleUtilityProps /** * Boolean to change button type to Danger when true */ - danger: boolean; + danger?: boolean; /** * Boolean to disable button */ - disabled: boolean; + disabled?: boolean; /** * Boolean to show loading spinner in button */ - loading: boolean; + loading?: boolean; /** * Possible size values: 'ButtonLinkSize.Auto'(auto), 'ButtonLinkSize.Sm'(32px), 'ButtonLinkSize.Md'(40px), 'ButtonLinkSize.Lg'(48px), 'ButtonLinkSize.Inherit'(inherits parents font-size) * Default value is 'ButtonLinkSize.Auto'. */ - size: ButtonLinkSize; + size?: ButtonLinkSize; } export type ButtonLinkProps = diff --git a/ui/components/component-library/button-primary/button-primary.tsx b/ui/components/component-library/button-primary/button-primary.tsx index 1bb863b15..c439364bf 100644 --- a/ui/components/component-library/button-primary/button-primary.tsx +++ b/ui/components/component-library/button-primary/button-primary.tsx @@ -18,8 +18,8 @@ export const ButtonPrimary: ButtonPrimaryComponent = React.forwardRef( ( { className, - danger, - disabled, + danger = false, + disabled = false, size = ButtonPrimarySize.Md, ...props }: ButtonPrimaryProps, diff --git a/ui/components/component-library/button-primary/button-primary.types.ts b/ui/components/component-library/button-primary/button-primary.types.ts index 87d6868a5..070c4b838 100644 --- a/ui/components/component-library/button-primary/button-primary.types.ts +++ b/ui/components/component-library/button-primary/button-primary.types.ts @@ -13,21 +13,21 @@ export interface ButtonPrimaryStyleUtilityProps /** * Boolean to change button type to Danger when true */ - danger: boolean; + danger?: boolean; /** * Boolean to disable button */ - disabled: boolean; + disabled?: boolean; /** * Boolean to show loading spinner in button */ - loading: boolean; + loading?: boolean; /** * Possible size values: 'ButtonPrimarySize.Sm'(32px), * 'ButtonPrimarySize.Md'(40px), 'ButtonPrimarySize.Lg'(48px) * Default value is 'ButtonPrimarySize.Auto'. */ - size: ButtonPrimarySize; + size?: ButtonPrimarySize; } export type ButtonPrimaryProps = diff --git a/ui/components/component-library/button-secondary/button-secondary.tsx b/ui/components/component-library/button-secondary/button-secondary.tsx index 404b97301..4daa72903 100644 --- a/ui/components/component-library/button-secondary/button-secondary.tsx +++ b/ui/components/component-library/button-secondary/button-secondary.tsx @@ -14,8 +14,8 @@ export const ButtonSecondary: ButtonSecondaryComponent = React.forwardRef( ( { className = '', - danger, - disabled, + danger = false, + disabled = false, size = ButtonSecondarySize.Md, ...props }: ButtonSecondaryProps, @@ -28,8 +28,8 @@ export const ButtonSecondary: ButtonSecondaryComponent = React.forwardRef( borderColor={buttonColor} color={buttonColor} className={classnames(className, 'mm-button-secondary', { - 'mm-button-secondary--type-danger': Boolean(danger), - 'mm-button-secondary--disabled': Boolean(disabled), + 'mm-button-secondary--type-danger': danger, + 'mm-button-secondary--disabled': disabled, })} size={size} ref={ref}