@mirohq/design-system-button 3.2.0-deprecated-button.0 → 3.2.0-deprecated-button.1

package/dist/main.js

@@ -340,7 +340,7 @@ const Button = React__default["default"].forwardRef(
       spinnerSize = "medium";
     }
     const _loading = loading === "true" || loading === true;
-    const shouldBeDisabled = disabled || _loading;
+    const shouldBeDisabled = disabled === true || _loading;
     const asLink = href != null;
     const ref = React.useRef(null);
     const refWithFallback = forwardRef != null ? forwardRef : ref;
@@ -349,10 +349,10 @@ const Button = React__default["default"].forwardRef(
         isDisabled: shouldBeDisabled,
         href,
         onPress: onPress != null ? onPress : onClick,
-        // @ts-expect-error
         allowFocusWhenDisabled: false,
         ...restProps
       },
+      // @ts-expect-error
       refWithFallback
     );
     const { linkProps } = link.useLink(

package/dist/main.js.map

@@ -1 +1 @@
-{"version":3,"file":"main.js","sources":["../src/button.styled.ts","../src/button.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const focusFilled = {\n  '&[data-focused]': {\n    boxShadow: `inset 0 0 0 1px white, 0 0 0 1px rgba(104, 129, 255, 1), 0 0 0 5px rgba(217, 224, 255, 1)`,\n  },\n}\n\nexport const focusOutline = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 1px rgba(104, 129, 255, 1), 0 0 0 5px rgba(217, 224, 255, 1)`,\n    borderColor: 'transparent',\n  },\n}\n\nconst focusDefault = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 1px rgba(104, 129, 255, 1), 0 0 0 5px rgba(217, 224, 255, 1)`,\n  },\n}\n\nconst pressedSelector = '&:active, &[data-pressed]'\n\nexport const StyledButton = styled(Primitive.button, {\n  boxSizing: 'border-box',\n  display: 'inline-block',\n  outline: 'none',\n  whiteSpace: 'nowrap',\n  textOverflow: 'ellipsis',\n  textAlign: 'center',\n  verticalAlign: 'middle',\n  userSelect: 'none',\n  fontFamily: 'inherit',\n  fontStyle: 'normal',\n  fontStretch: 'normal',\n  letterSpacing: 'normal',\n  fontWeight: 'normal',\n  position: 'relative',\n  cursor: 'pointer',\n  border: 'none',\n  textDecoration: 'none',\n  backgroundColor: 'transparent',\n  '&[disabled]': {\n    pointerEvents: 'none',\n    opacity: 0.4,\n  },\n  variants: {\n    variant: {\n      primary: {},\n      secondary: {},\n      danger: {},\n    },\n    appearance: {\n      filled: {},\n      outlined: {},\n      flat: {},\n    },\n    size: {\n      large: {\n        padding: '14px 32px 18px 32px',\n        fontSize: '20px',\n        lineHeight: '28px',\n        height: '60px',\n      },\n      medium: {\n        padding: '11px 24px 13px 24px',\n        fontSize: '16px',\n        lineHeight: '24px',\n        height: '48px',\n      },\n      small: {\n        padding: '7px 16px 9px 16px',\n        fontSize: '14px',\n        lineHeight: '20px',\n        height: '36px',\n      },\n      'x-small': {\n        padding: '5px 12px 7px',\n        fontSize: '14px',\n        lineHeight: '20px',\n        height: '32px',\n      },\n      'xx-small': {\n        padding: '3px 12px',\n        fontSize: '12px',\n        lineHeight: '18px',\n        height: '24px',\n      },\n    },\n    rounded: {\n      true: {\n        borderRadius: '$half',\n      },\n    },\n    loading: {\n      true: {\n        '&[disabled]': {\n          cursor: 'default',\n          opacity: 1,\n          pointerEvents: 'none',\n          '& > span': {\n            visibility: 'hidden',\n          },\n        },\n      },\n    },\n    fluid: {\n      true: {\n        width: '100%',\n        display: 'block',\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      size: 'small',\n      rounded: true,\n      css: {\n        padding: '10px 16px',\n        height: '40px',\n      },\n    },\n    {\n      size: 'large',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'medium',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'small',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'x-small',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'xx-small',\n      rounded: false,\n      css: {\n        borderRadius: '$25',\n      },\n    },\n    {\n      variant: 'primary',\n      appearance: 'filled',\n      css: {\n        color: '#FFFFFF',\n        backgroundColor: '#3859FF',\n        ...focusFilled,\n        '&:hover': {\n          color: '#FFFFFF',\n          backgroundColor: '#3F53D9',\n        },\n        [pressedSelector]: {\n          backgroundColor: '#122277',\n        },\n      },\n    },\n    {\n      variant: 'primary',\n      appearance: 'outlined',\n      css: {\n        color: 'rgba(66, 98, 255, 1)',\n        border: '1px solid rgba(66, 98, 255, 1)',\n        ...focusOutline,\n        '&:hover': {\n          color: 'rgba(66, 98, 255, 1)',\n          backgroundColor: 'rgba(244, 246, 255, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(240, 242, 255, 1)',\n        },\n      },\n    },\n    {\n      variant: 'primary',\n      appearance: 'flat',\n      css: {\n        color: 'rgba(66, 98, 255, 1)',\n        ...focusDefault,\n        '&:hover': {\n          color: 'rgba(69, 91, 237, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n        [pressedSelector]: {\n          color: 'rgba(61, 81, 212, 1)',\n        },\n      },\n    },\n    {\n      variant: 'secondary',\n      appearance: 'filled',\n      css: {\n        color: 'rgba(5, 0, 56, 1)',\n        backgroundColor: 'rgba(245, 245, 247, 1)',\n        ...focusFilled,\n        '&:hover': {\n          color: 'rgba(5, 0, 56, 1)',\n          backgroundColor: 'rgba(240, 240, 243, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(235, 235, 239, 1)',\n        },\n      },\n    },\n    {\n      variant: 'secondary',\n      appearance: 'outlined',\n      css: {\n        color: 'rgba(5, 0, 56, 1)',\n        border: '1px solid rgba(205, 204, 215, 1)',\n        ...focusOutline,\n        '&:hover': {\n          color: 'rgba(5, 0, 56, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(235, 235, 239, 1)',\n        },\n      },\n    },\n    {\n      variant: 'secondary',\n      appearance: 'flat',\n      css: {\n        color: 'rgba(5, 0, 56, 1)',\n        ...focusDefault,\n        '&:hover': {\n          color: 'rgba(5, 0, 56, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n      },\n    },\n    {\n      variant: 'danger',\n      appearance: 'filled',\n      css: {\n        color: '#FFFFFF',\n        backgroundColor: 'rgba(217, 41, 41, 1)',\n        ...focusFilled,\n        '&:hover': {\n          backgroundColor: 'rgba(199, 20, 20, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(184, 13, 13, 1)',\n        },\n      },\n    },\n    {\n      variant: 'danger',\n      appearance: 'outlined',\n      css: {\n        color: 'rgba(217, 41, 41, 1)',\n        border: '1px solid rgba(217, 41, 41, 1)',\n        ...focusOutline,\n        '&:hover': {\n          color: 'rgba(217, 41, 41, 1)',\n          backgroundColor: 'rgba(254, 247, 247, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(253, 242, 242, 1)',\n        },\n      },\n    },\n    {\n      variant: 'danger',\n      appearance: 'flat',\n      css: {\n        color: 'rgba(217, 41, 41, 1)',\n        ...focusDefault,\n        '&:hover': {\n          color: 'rgba(217, 41, 41, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n      },\n    },\n  ],\n})\n\nexport const StyledSpinnerBox = styled(Primitive.div, {\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  bottom: 0,\n  right: 0,\n  margin: 'auto',\n})\n\nexport type StyledButtonProps = ComponentPropsWithRef<typeof StyledButton>\n","import React, { useRef } from 'react'\nimport type { ElementRef, ReactNode } from 'react'\nimport { useButton } from '@react-aria/button'\nimport type { AriaButtonProps } from '@react-types/button'\nimport { mergeProps } from '@react-aria/utils'\nimport type { SpinnerProps } from '@mirohq/design-system-spinner'\nimport { Spinner } from '@mirohq/design-system-spinner'\nimport { useLink } from '@react-aria/link'\nimport { useFocusRing } from '@react-aria/focus'\n\nimport type { StyledButtonProps } from './button.styled'\nimport { StyledButton, StyledSpinnerBox } from './button.styled'\n\ntype ButtonPropsA11y = StyledButtonProps & AriaButtonProps\n\nexport interface ButtonProps\n  extends Omit<ButtonPropsA11y, 'onClick' | 'isDisabled' | 'elementType'> {\n  /**\n   * The content\n   */\n  children: ReactNode\n\n  /**\n   * Change the button color\n   */\n  variant?: StyledButtonProps['variant']\n\n  /**\n   * Change the button style\n   */\n  appearance?: StyledButtonProps['appearance']\n\n  /**\n   * Change the button height and font-size\n   */\n  size?: StyledButtonProps['size']\n\n  /**\n   * Make border-radius circle\n   */\n  rounded?: StyledButtonProps['rounded']\n\n  /**\n   * Add spinner and disable\n   */\n  loading?: StyledButtonProps['loading']\n\n  /**\n   * Make width 100%\n   */\n  fluid?: StyledButtonProps['fluid']\n\n  /**\n   * Prevent pointer events\n   */\n  disabled?: boolean\n\n  /**\n   * A URL to link when using the button as a link\n   */\n  href?: string\n\n  /**\n   * The target window using the button as a link\n   */\n  target?: string\n\n  /**\n   * The relationship between the linked resource and the current page. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel)\n   */\n  rel?: string\n\n  /**\n   * Alias for onPress\n   */\n  onClick?: AriaButtonProps['onPress']\n}\n\nexport const Button = React.forwardRef<\n  ElementRef<typeof StyledButton | 'a'>,\n  ButtonProps\n>(\n  (\n    {\n      variant = 'primary',\n      appearance = 'filled',\n      size = 'medium',\n      loading = false,\n      rounded = false,\n      fluid = false,\n      disabled = false,\n      href,\n      target,\n      rel,\n      children,\n      onPress,\n      onClick,\n      asChild,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    let spinnerSize: SpinnerProps['size']\n\n    if (typeof size === 'string') {\n      spinnerSize = ['x-small', 'xx-small'].includes(size) ? 'small' : 'medium'\n    } else {\n      spinnerSize = 'medium'\n    }\n\n    const _loading = loading === 'true' || loading === true\n    const shouldBeDisabled = disabled || _loading\n\n    const asLink = href != null\n\n    const ref = useRef<HTMLButtonElement | HTMLAnchorElement>(null)\n    const refWithFallback = forwardRef ?? ref\n    const { buttonProps, isPressed } = useButton(\n      {\n        isDisabled: shouldBeDisabled,\n        href,\n        onPress: onPress ?? onClick,\n        // @ts-expect-error\n        allowFocusWhenDisabled: false,\n        ...restProps,\n      },\n      refWithFallback\n    )\n\n    const { linkProps } = useLink(\n      {\n        isDisabled: disabled,\n        onPress: onPress ?? onClick,\n        ...restProps,\n      },\n      // @ts-expect-error\n      refWithFallback\n    )\n\n    const Content = (\n      <>\n        {_loading && (\n          <StyledSpinnerBox>\n            <Spinner size={spinnerSize} />\n          </StyledSpinnerBox>\n        )}\n        <span>{children}</span>\n      </>\n    )\n\n    const tabIndexProp = shouldBeDisabled && {\n      tabIndex: -1,\n    }\n\n    const { isFocusVisible, focusProps } = useFocusRing()\n\n    const elementProps = mergeProps(\n      restProps,\n      asLink ? linkProps : buttonProps,\n      focusProps\n    )\n\n    return (\n      <StyledButton\n        {...elementProps}\n        variant={variant}\n        appearance={appearance}\n        size={size}\n        loading={loading}\n        rounded={rounded}\n        fluid={fluid}\n        disabled={shouldBeDisabled}\n        asChild={asLink || asChild}\n        {...tabIndexProp}\n        data-pressed={isPressed ? '' : undefined}\n        data-focused={isFocusVisible ? '' : undefined}\n        // @ts-expect-error\n        ref={refWithFallback}\n      >\n        {asLink ? (\n          <a\n            href={href}\n            target={target}\n            rel={target === '_blank' ? `noopener noreferrer ${rel}` : rel}\n          >\n            {Content}\n          </a>\n        ) : (\n          Content\n        )}\n      </StyledButton>\n    )\n  }\n)\n"],"names":["styled","Primitive","React","useRef","useButton","useLink","jsxs","Fragment","jsx","Spinner","useFocusRing","mergeProps"],"mappings":"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"}
+{"version":3,"file":"main.js","sources":["../src/button.styled.ts","../src/button.tsx"],"sourcesContent":["import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const focusFilled = {\n  '&[data-focused]': {\n    boxShadow: `inset 0 0 0 1px white, 0 0 0 1px rgba(104, 129, 255, 1), 0 0 0 5px rgba(217, 224, 255, 1)`,\n  },\n}\n\nexport const focusOutline = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 1px rgba(104, 129, 255, 1), 0 0 0 5px rgba(217, 224, 255, 1)`,\n    borderColor: 'transparent',\n  },\n}\n\nconst focusDefault = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 1px rgba(104, 129, 255, 1), 0 0 0 5px rgba(217, 224, 255, 1)`,\n  },\n}\n\nconst pressedSelector = '&:active, &[data-pressed]'\n\nexport const StyledButton = styled(Primitive.button, {\n  boxSizing: 'border-box',\n  display: 'inline-block',\n  outline: 'none',\n  whiteSpace: 'nowrap',\n  textOverflow: 'ellipsis',\n  textAlign: 'center',\n  verticalAlign: 'middle',\n  userSelect: 'none',\n  fontFamily: 'inherit',\n  fontStyle: 'normal',\n  fontStretch: 'normal',\n  letterSpacing: 'normal',\n  fontWeight: 'normal',\n  position: 'relative',\n  cursor: 'pointer',\n  border: 'none',\n  textDecoration: 'none',\n  backgroundColor: 'transparent',\n  '&[disabled]': {\n    pointerEvents: 'none',\n    opacity: 0.4,\n  },\n  variants: {\n    variant: {\n      primary: {},\n      secondary: {},\n      danger: {},\n    },\n    appearance: {\n      filled: {},\n      outlined: {},\n      flat: {},\n    },\n    size: {\n      large: {\n        padding: '14px 32px 18px 32px',\n        fontSize: '20px',\n        lineHeight: '28px',\n        height: '60px',\n      },\n      medium: {\n        padding: '11px 24px 13px 24px',\n        fontSize: '16px',\n        lineHeight: '24px',\n        height: '48px',\n      },\n      small: {\n        padding: '7px 16px 9px 16px',\n        fontSize: '14px',\n        lineHeight: '20px',\n        height: '36px',\n      },\n      'x-small': {\n        padding: '5px 12px 7px',\n        fontSize: '14px',\n        lineHeight: '20px',\n        height: '32px',\n      },\n      'xx-small': {\n        padding: '3px 12px',\n        fontSize: '12px',\n        lineHeight: '18px',\n        height: '24px',\n      },\n    },\n    rounded: {\n      true: {\n        borderRadius: '$half',\n      },\n    },\n    loading: {\n      true: {\n        '&[disabled]': {\n          cursor: 'default',\n          opacity: 1,\n          pointerEvents: 'none',\n          '& > span': {\n            visibility: 'hidden',\n          },\n        },\n      },\n    },\n    fluid: {\n      true: {\n        width: '100%',\n        display: 'block',\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      size: 'small',\n      rounded: true,\n      css: {\n        padding: '10px 16px',\n        height: '40px',\n      },\n    },\n    {\n      size: 'large',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'medium',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'small',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'x-small',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'xx-small',\n      rounded: false,\n      css: {\n        borderRadius: '$25',\n      },\n    },\n    {\n      variant: 'primary',\n      appearance: 'filled',\n      css: {\n        color: '#FFFFFF',\n        backgroundColor: '#3859FF',\n        ...focusFilled,\n        '&:hover': {\n          color: '#FFFFFF',\n          backgroundColor: '#3F53D9',\n        },\n        [pressedSelector]: {\n          backgroundColor: '#122277',\n        },\n      },\n    },\n    {\n      variant: 'primary',\n      appearance: 'outlined',\n      css: {\n        color: 'rgba(66, 98, 255, 1)',\n        border: '1px solid rgba(66, 98, 255, 1)',\n        ...focusOutline,\n        '&:hover': {\n          color: 'rgba(66, 98, 255, 1)',\n          backgroundColor: 'rgba(244, 246, 255, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(240, 242, 255, 1)',\n        },\n      },\n    },\n    {\n      variant: 'primary',\n      appearance: 'flat',\n      css: {\n        color: 'rgba(66, 98, 255, 1)',\n        ...focusDefault,\n        '&:hover': {\n          color: 'rgba(69, 91, 237, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n        [pressedSelector]: {\n          color: 'rgba(61, 81, 212, 1)',\n        },\n      },\n    },\n    {\n      variant: 'secondary',\n      appearance: 'filled',\n      css: {\n        color: 'rgba(5, 0, 56, 1)',\n        backgroundColor: 'rgba(245, 245, 247, 1)',\n        ...focusFilled,\n        '&:hover': {\n          color: 'rgba(5, 0, 56, 1)',\n          backgroundColor: 'rgba(240, 240, 243, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(235, 235, 239, 1)',\n        },\n      },\n    },\n    {\n      variant: 'secondary',\n      appearance: 'outlined',\n      css: {\n        color: 'rgba(5, 0, 56, 1)',\n        border: '1px solid rgba(205, 204, 215, 1)',\n        ...focusOutline,\n        '&:hover': {\n          color: 'rgba(5, 0, 56, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(235, 235, 239, 1)',\n        },\n      },\n    },\n    {\n      variant: 'secondary',\n      appearance: 'flat',\n      css: {\n        color: 'rgba(5, 0, 56, 1)',\n        ...focusDefault,\n        '&:hover': {\n          color: 'rgba(5, 0, 56, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n      },\n    },\n    {\n      variant: 'danger',\n      appearance: 'filled',\n      css: {\n        color: '#FFFFFF',\n        backgroundColor: 'rgba(217, 41, 41, 1)',\n        ...focusFilled,\n        '&:hover': {\n          backgroundColor: 'rgba(199, 20, 20, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(184, 13, 13, 1)',\n        },\n      },\n    },\n    {\n      variant: 'danger',\n      appearance: 'outlined',\n      css: {\n        color: 'rgba(217, 41, 41, 1)',\n        border: '1px solid rgba(217, 41, 41, 1)',\n        ...focusOutline,\n        '&:hover': {\n          color: 'rgba(217, 41, 41, 1)',\n          backgroundColor: 'rgba(254, 247, 247, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(253, 242, 242, 1)',\n        },\n      },\n    },\n    {\n      variant: 'danger',\n      appearance: 'flat',\n      css: {\n        color: 'rgba(217, 41, 41, 1)',\n        ...focusDefault,\n        '&:hover': {\n          color: 'rgba(217, 41, 41, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n      },\n    },\n  ],\n})\n\nexport const StyledSpinnerBox = styled(Primitive.div, {\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  bottom: 0,\n  right: 0,\n  margin: 'auto',\n})\n","import React, { useRef } from 'react'\nimport type { ElementRef } from 'react'\nimport { useButton } from '@react-aria/button'\nimport { mergeProps } from '@react-aria/utils'\nimport type { SpinnerProps } from '@mirohq/design-system-spinner'\nimport { Spinner } from '@mirohq/design-system-spinner'\nimport { useLink } from '@react-aria/link'\nimport { useFocusRing } from '@react-aria/focus'\n\nimport { StyledButton, StyledSpinnerBox } from './button.styled'\n\nexport type ButtonProps = any\n\nexport const Button = React.forwardRef<\n  ElementRef<typeof StyledButton | 'a'>,\n  ButtonProps\n>(\n  (\n    {\n      variant = 'primary',\n      appearance = 'filled',\n      size = 'medium',\n      loading = false,\n      rounded = false,\n      fluid = false,\n      disabled = false,\n      href,\n      target,\n      rel,\n      children,\n      onPress,\n      onClick,\n      asChild,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    let spinnerSize: SpinnerProps['size']\n\n    if (typeof size === 'string') {\n      spinnerSize = ['x-small', 'xx-small'].includes(size) ? 'small' : 'medium'\n    } else {\n      spinnerSize = 'medium'\n    }\n\n    const _loading = loading === 'true' || loading === true\n    const shouldBeDisabled = disabled === true || _loading\n\n    const asLink = href != null\n\n    const ref = useRef<HTMLButtonElement | HTMLAnchorElement>(null)\n    const refWithFallback = forwardRef ?? ref\n    const { buttonProps, isPressed } = useButton(\n      {\n        isDisabled: shouldBeDisabled,\n        href,\n        onPress: onPress ?? onClick,\n        allowFocusWhenDisabled: false,\n        ...restProps,\n      },\n      // @ts-expect-error\n      refWithFallback\n    )\n\n    const { linkProps } = useLink(\n      {\n        isDisabled: disabled,\n        onPress: onPress ?? onClick,\n        ...restProps,\n      },\n      // @ts-expect-error\n      refWithFallback\n    )\n\n    const Content = (\n      <>\n        {_loading && (\n          <StyledSpinnerBox>\n            <Spinner size={spinnerSize} />\n          </StyledSpinnerBox>\n        )}\n        <span>{children}</span>\n      </>\n    )\n\n    const tabIndexProp = shouldBeDisabled && {\n      tabIndex: -1,\n    }\n\n    const { isFocusVisible, focusProps } = useFocusRing()\n\n    const elementProps = mergeProps(\n      restProps,\n      asLink ? linkProps : buttonProps,\n      focusProps\n    )\n\n    return (\n      <StyledButton\n        {...elementProps}\n        variant={variant}\n        appearance={appearance}\n        size={size}\n        loading={loading}\n        rounded={rounded}\n        fluid={fluid}\n        disabled={shouldBeDisabled}\n        asChild={asLink || asChild}\n        {...tabIndexProp}\n        data-pressed={isPressed ? '' : undefined}\n        data-focused={isFocusVisible ? '' : undefined}\n        ref={refWithFallback}\n      >\n        {asLink ? (\n          <a\n            href={href}\n            target={target}\n            rel={target === '_blank' ? `noopener noreferrer ${rel}` : rel}\n          >\n            {Content}\n          </a>\n        ) : (\n          Content\n        )}\n      </StyledButton>\n    )\n  }\n)\n"],"names":["styled","Primitive","React","useRef","useButton","useLink","jsxs","Fragment","jsx","Spinner","useFocusRing","mergeProps"],"mappings":"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"}

package/dist/module.js

@@ -332,7 +332,7 @@ const Button = React.forwardRef(
       spinnerSize = "medium";
     }
     const _loading = loading === "true" || loading === true;
-    const shouldBeDisabled = disabled || _loading;
+    const shouldBeDisabled = disabled === true || _loading;
     const asLink = href != null;
     const ref = useRef(null);
     const refWithFallback = forwardRef != null ? forwardRef : ref;
@@ -341,10 +341,10 @@ const Button = React.forwardRef(
         isDisabled: shouldBeDisabled,
         href,
         onPress: onPress != null ? onPress : onClick,
-        // @ts-expect-error
         allowFocusWhenDisabled: false,
         ...restProps
       },
+      // @ts-expect-error
       refWithFallback
     );
     const { linkProps } = useLink(

package/dist/module.js.map

@@ -1 +1 @@
-{"version":3,"file":"module.js","sources":["../src/button.styled.ts","../src/button.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const focusFilled = {\n  '&[data-focused]': {\n    boxShadow: `inset 0 0 0 1px white, 0 0 0 1px rgba(104, 129, 255, 1), 0 0 0 5px rgba(217, 224, 255, 1)`,\n  },\n}\n\nexport const focusOutline = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 1px rgba(104, 129, 255, 1), 0 0 0 5px rgba(217, 224, 255, 1)`,\n    borderColor: 'transparent',\n  },\n}\n\nconst focusDefault = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 1px rgba(104, 129, 255, 1), 0 0 0 5px rgba(217, 224, 255, 1)`,\n  },\n}\n\nconst pressedSelector = '&:active, &[data-pressed]'\n\nexport const StyledButton = styled(Primitive.button, {\n  boxSizing: 'border-box',\n  display: 'inline-block',\n  outline: 'none',\n  whiteSpace: 'nowrap',\n  textOverflow: 'ellipsis',\n  textAlign: 'center',\n  verticalAlign: 'middle',\n  userSelect: 'none',\n  fontFamily: 'inherit',\n  fontStyle: 'normal',\n  fontStretch: 'normal',\n  letterSpacing: 'normal',\n  fontWeight: 'normal',\n  position: 'relative',\n  cursor: 'pointer',\n  border: 'none',\n  textDecoration: 'none',\n  backgroundColor: 'transparent',\n  '&[disabled]': {\n    pointerEvents: 'none',\n    opacity: 0.4,\n  },\n  variants: {\n    variant: {\n      primary: {},\n      secondary: {},\n      danger: {},\n    },\n    appearance: {\n      filled: {},\n      outlined: {},\n      flat: {},\n    },\n    size: {\n      large: {\n        padding: '14px 32px 18px 32px',\n        fontSize: '20px',\n        lineHeight: '28px',\n        height: '60px',\n      },\n      medium: {\n        padding: '11px 24px 13px 24px',\n        fontSize: '16px',\n        lineHeight: '24px',\n        height: '48px',\n      },\n      small: {\n        padding: '7px 16px 9px 16px',\n        fontSize: '14px',\n        lineHeight: '20px',\n        height: '36px',\n      },\n      'x-small': {\n        padding: '5px 12px 7px',\n        fontSize: '14px',\n        lineHeight: '20px',\n        height: '32px',\n      },\n      'xx-small': {\n        padding: '3px 12px',\n        fontSize: '12px',\n        lineHeight: '18px',\n        height: '24px',\n      },\n    },\n    rounded: {\n      true: {\n        borderRadius: '$half',\n      },\n    },\n    loading: {\n      true: {\n        '&[disabled]': {\n          cursor: 'default',\n          opacity: 1,\n          pointerEvents: 'none',\n          '& > span': {\n            visibility: 'hidden',\n          },\n        },\n      },\n    },\n    fluid: {\n      true: {\n        width: '100%',\n        display: 'block',\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      size: 'small',\n      rounded: true,\n      css: {\n        padding: '10px 16px',\n        height: '40px',\n      },\n    },\n    {\n      size: 'large',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'medium',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'small',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'x-small',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'xx-small',\n      rounded: false,\n      css: {\n        borderRadius: '$25',\n      },\n    },\n    {\n      variant: 'primary',\n      appearance: 'filled',\n      css: {\n        color: '#FFFFFF',\n        backgroundColor: '#3859FF',\n        ...focusFilled,\n        '&:hover': {\n          color: '#FFFFFF',\n          backgroundColor: '#3F53D9',\n        },\n        [pressedSelector]: {\n          backgroundColor: '#122277',\n        },\n      },\n    },\n    {\n      variant: 'primary',\n      appearance: 'outlined',\n      css: {\n        color: 'rgba(66, 98, 255, 1)',\n        border: '1px solid rgba(66, 98, 255, 1)',\n        ...focusOutline,\n        '&:hover': {\n          color: 'rgba(66, 98, 255, 1)',\n          backgroundColor: 'rgba(244, 246, 255, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(240, 242, 255, 1)',\n        },\n      },\n    },\n    {\n      variant: 'primary',\n      appearance: 'flat',\n      css: {\n        color: 'rgba(66, 98, 255, 1)',\n        ...focusDefault,\n        '&:hover': {\n          color: 'rgba(69, 91, 237, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n        [pressedSelector]: {\n          color: 'rgba(61, 81, 212, 1)',\n        },\n      },\n    },\n    {\n      variant: 'secondary',\n      appearance: 'filled',\n      css: {\n        color: 'rgba(5, 0, 56, 1)',\n        backgroundColor: 'rgba(245, 245, 247, 1)',\n        ...focusFilled,\n        '&:hover': {\n          color: 'rgba(5, 0, 56, 1)',\n          backgroundColor: 'rgba(240, 240, 243, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(235, 235, 239, 1)',\n        },\n      },\n    },\n    {\n      variant: 'secondary',\n      appearance: 'outlined',\n      css: {\n        color: 'rgba(5, 0, 56, 1)',\n        border: '1px solid rgba(205, 204, 215, 1)',\n        ...focusOutline,\n        '&:hover': {\n          color: 'rgba(5, 0, 56, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(235, 235, 239, 1)',\n        },\n      },\n    },\n    {\n      variant: 'secondary',\n      appearance: 'flat',\n      css: {\n        color: 'rgba(5, 0, 56, 1)',\n        ...focusDefault,\n        '&:hover': {\n          color: 'rgba(5, 0, 56, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n      },\n    },\n    {\n      variant: 'danger',\n      appearance: 'filled',\n      css: {\n        color: '#FFFFFF',\n        backgroundColor: 'rgba(217, 41, 41, 1)',\n        ...focusFilled,\n        '&:hover': {\n          backgroundColor: 'rgba(199, 20, 20, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(184, 13, 13, 1)',\n        },\n      },\n    },\n    {\n      variant: 'danger',\n      appearance: 'outlined',\n      css: {\n        color: 'rgba(217, 41, 41, 1)',\n        border: '1px solid rgba(217, 41, 41, 1)',\n        ...focusOutline,\n        '&:hover': {\n          color: 'rgba(217, 41, 41, 1)',\n          backgroundColor: 'rgba(254, 247, 247, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(253, 242, 242, 1)',\n        },\n      },\n    },\n    {\n      variant: 'danger',\n      appearance: 'flat',\n      css: {\n        color: 'rgba(217, 41, 41, 1)',\n        ...focusDefault,\n        '&:hover': {\n          color: 'rgba(217, 41, 41, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n      },\n    },\n  ],\n})\n\nexport const StyledSpinnerBox = styled(Primitive.div, {\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  bottom: 0,\n  right: 0,\n  margin: 'auto',\n})\n\nexport type StyledButtonProps = ComponentPropsWithRef<typeof StyledButton>\n","import React, { useRef } from 'react'\nimport type { ElementRef, ReactNode } from 'react'\nimport { useButton } from '@react-aria/button'\nimport type { AriaButtonProps } from '@react-types/button'\nimport { mergeProps } from '@react-aria/utils'\nimport type { SpinnerProps } from '@mirohq/design-system-spinner'\nimport { Spinner } from '@mirohq/design-system-spinner'\nimport { useLink } from '@react-aria/link'\nimport { useFocusRing } from '@react-aria/focus'\n\nimport type { StyledButtonProps } from './button.styled'\nimport { StyledButton, StyledSpinnerBox } from './button.styled'\n\ntype ButtonPropsA11y = StyledButtonProps & AriaButtonProps\n\nexport interface ButtonProps\n  extends Omit<ButtonPropsA11y, 'onClick' | 'isDisabled' | 'elementType'> {\n  /**\n   * The content\n   */\n  children: ReactNode\n\n  /**\n   * Change the button color\n   */\n  variant?: StyledButtonProps['variant']\n\n  /**\n   * Change the button style\n   */\n  appearance?: StyledButtonProps['appearance']\n\n  /**\n   * Change the button height and font-size\n   */\n  size?: StyledButtonProps['size']\n\n  /**\n   * Make border-radius circle\n   */\n  rounded?: StyledButtonProps['rounded']\n\n  /**\n   * Add spinner and disable\n   */\n  loading?: StyledButtonProps['loading']\n\n  /**\n   * Make width 100%\n   */\n  fluid?: StyledButtonProps['fluid']\n\n  /**\n   * Prevent pointer events\n   */\n  disabled?: boolean\n\n  /**\n   * A URL to link when using the button as a link\n   */\n  href?: string\n\n  /**\n   * The target window using the button as a link\n   */\n  target?: string\n\n  /**\n   * The relationship between the linked resource and the current page. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel)\n   */\n  rel?: string\n\n  /**\n   * Alias for onPress\n   */\n  onClick?: AriaButtonProps['onPress']\n}\n\nexport const Button = React.forwardRef<\n  ElementRef<typeof StyledButton | 'a'>,\n  ButtonProps\n>(\n  (\n    {\n      variant = 'primary',\n      appearance = 'filled',\n      size = 'medium',\n      loading = false,\n      rounded = false,\n      fluid = false,\n      disabled = false,\n      href,\n      target,\n      rel,\n      children,\n      onPress,\n      onClick,\n      asChild,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    let spinnerSize: SpinnerProps['size']\n\n    if (typeof size === 'string') {\n      spinnerSize = ['x-small', 'xx-small'].includes(size) ? 'small' : 'medium'\n    } else {\n      spinnerSize = 'medium'\n    }\n\n    const _loading = loading === 'true' || loading === true\n    const shouldBeDisabled = disabled || _loading\n\n    const asLink = href != null\n\n    const ref = useRef<HTMLButtonElement | HTMLAnchorElement>(null)\n    const refWithFallback = forwardRef ?? ref\n    const { buttonProps, isPressed } = useButton(\n      {\n        isDisabled: shouldBeDisabled,\n        href,\n        onPress: onPress ?? onClick,\n        // @ts-expect-error\n        allowFocusWhenDisabled: false,\n        ...restProps,\n      },\n      refWithFallback\n    )\n\n    const { linkProps } = useLink(\n      {\n        isDisabled: disabled,\n        onPress: onPress ?? onClick,\n        ...restProps,\n      },\n      // @ts-expect-error\n      refWithFallback\n    )\n\n    const Content = (\n      <>\n        {_loading && (\n          <StyledSpinnerBox>\n            <Spinner size={spinnerSize} />\n          </StyledSpinnerBox>\n        )}\n        <span>{children}</span>\n      </>\n    )\n\n    const tabIndexProp = shouldBeDisabled && {\n      tabIndex: -1,\n    }\n\n    const { isFocusVisible, focusProps } = useFocusRing()\n\n    const elementProps = mergeProps(\n      restProps,\n      asLink ? linkProps : buttonProps,\n      focusProps\n    )\n\n    return (\n      <StyledButton\n        {...elementProps}\n        variant={variant}\n        appearance={appearance}\n        size={size}\n        loading={loading}\n        rounded={rounded}\n        fluid={fluid}\n        disabled={shouldBeDisabled}\n        asChild={asLink || asChild}\n        {...tabIndexProp}\n        data-pressed={isPressed ? '' : undefined}\n        data-focused={isFocusVisible ? '' : undefined}\n        // @ts-expect-error\n        ref={refWithFallback}\n      >\n        {asLink ? (\n          <a\n            href={href}\n            target={target}\n            rel={target === '_blank' ? `noopener noreferrer ${rel}` : rel}\n          >\n            {Content}\n          </a>\n        ) : (\n          Content\n        )}\n      </StyledButton>\n    )\n  }\n)\n"],"names":[],"mappings":";;;;;;;;;;AAIO,MAAM,WAAc,GAAA;AAAA,EACzB,iBAAmB,EAAA;AAAA,IACjB,SAAW,EAAA,2FAAA;AAAA,GACb;AACF,CAAA,CAAA;AAEO,MAAM,YAAe,GAAA;AAAA,EAC1B,iBAAmB,EAAA;AAAA,IACjB,SAAW,EAAA,oEAAA;AAAA,IACX,WAAa,EAAA,aAAA;AAAA,GACf;AACF,CAAA,CAAA;AAEA,MAAM,YAAe,GAAA;AAAA,EACnB,iBAAmB,EAAA;AAAA,IACjB,SAAW,EAAA,oEAAA;AAAA,GACb;AACF,CAAA,CAAA;AAEA,MAAM,eAAkB,GAAA,2BAAA,CAAA;AAEX,MAAA,YAAA,GAAe,MAAO,CAAA,SAAA,CAAU,MAAQ,EAAA;AAAA,EACnD,SAAW,EAAA,YAAA;AAAA,EACX,OAAS,EAAA,cAAA;AAAA,EACT,OAAS,EAAA,MAAA;AAAA,EACT,UAAY,EAAA,QAAA;AAAA,EACZ,YAAc,EAAA,UAAA;AAAA,EACd,SAAW,EAAA,QAAA;AAAA,EACX,aAAe,EAAA,QAAA;AAAA,EACf,UAAY,EAAA,MAAA;AAAA,EACZ,UAAY,EAAA,SAAA;AAAA,EACZ,SAAW,EAAA,QAAA;AAAA,EACX,WAAa,EAAA,QAAA;AAAA,EACb,aAAe,EAAA,QAAA;AAAA,EACf,UAAY,EAAA,QAAA;AAAA,EACZ,QAAU,EAAA,UAAA;AAAA,EACV,MAAQ,EAAA,SAAA;AAAA,EACR,MAAQ,EAAA,MAAA;AAAA,EACR,cAAgB,EAAA,MAAA;AAAA,EAChB,eAAiB,EAAA,aAAA;AAAA,EACjB,aAAe,EAAA;AAAA,IACb,aAAe,EAAA,MAAA;AAAA,IACf,OAAS,EAAA,GAAA;AAAA,GACX;AAAA,EACA,QAAU,EAAA;AAAA,IACR,OAAS,EAAA;AAAA,MACP,SAAS,EAAC;AAAA,MACV,WAAW,EAAC;AAAA,MACZ,QAAQ,EAAC;AAAA,KACX;AAAA,IACA,UAAY,EAAA;AAAA,MACV,QAAQ,EAAC;AAAA,MACT,UAAU,EAAC;AAAA,MACX,MAAM,EAAC;AAAA,KACT;AAAA,IACA,IAAM,EAAA;AAAA,MACJ,KAAO,EAAA;AAAA,QACL,OAAS,EAAA,qBAAA;AAAA,QACT,QAAU,EAAA,MAAA;AAAA,QACV,UAAY,EAAA,MAAA;AAAA,QACZ,MAAQ,EAAA,MAAA;AAAA,OACV;AAAA,MACA,MAAQ,EAAA;AAAA,QACN,OAAS,EAAA,qBAAA;AAAA,QACT,QAAU,EAAA,MAAA;AAAA,QACV,UAAY,EAAA,MAAA;AAAA,QACZ,MAAQ,EAAA,MAAA;AAAA,OACV;AAAA,MACA,KAAO,EAAA;AAAA,QACL,OAAS,EAAA,mBAAA;AAAA,QACT,QAAU,EAAA,MAAA;AAAA,QACV,UAAY,EAAA,MAAA;AAAA,QACZ,MAAQ,EAAA,MAAA;AAAA,OACV;AAAA,MACA,SAAW,EAAA;AAAA,QACT,OAAS,EAAA,cAAA;AAAA,QACT,QAAU,EAAA,MAAA;AAAA,QACV,UAAY,EAAA,MAAA;AAAA,QACZ,MAAQ,EAAA,MAAA;AAAA,OACV;AAAA,MACA,UAAY,EAAA;AAAA,QACV,OAAS,EAAA,UAAA;AAAA,QACT,QAAU,EAAA,MAAA;AAAA,QACV,UAAY,EAAA,MAAA;AAAA,QACZ,MAAQ,EAAA,MAAA;AAAA,OACV;AAAA,KACF;AAAA,IACA,OAAS,EAAA;AAAA,MACP,IAAM,EAAA;AAAA,QACJ,YAAc,EAAA,OAAA;AAAA,OAChB;AAAA,KACF;AAAA,IACA,OAAS,EAAA;AAAA,MACP,IAAM,EAAA;AAAA,QACJ,aAAe,EAAA;AAAA,UACb,MAAQ,EAAA,SAAA;AAAA,UACR,OAAS,EAAA,CAAA;AAAA,UACT,aAAe,EAAA,MAAA;AAAA,UACf,UAAY,EAAA;AAAA,YACV,UAAY,EAAA,QAAA;AAAA,WACd;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAAA,IACA,KAAO,EAAA;AAAA,MACL,IAAM,EAAA;AAAA,QACJ,KAAO,EAAA,MAAA;AAAA,QACP,OAAS,EAAA,OAAA;AAAA,OACX;AAAA,KACF;AAAA,GACF;AAAA,EACA,gBAAkB,EAAA;AAAA,IAChB;AAAA,MACE,IAAM,EAAA,OAAA;AAAA,MACN,OAAS,EAAA,IAAA;AAAA,MACT,GAAK,EAAA;AAAA,QACH,OAAS,EAAA,WAAA;AAAA,QACT,MAAQ,EAAA,MAAA;AAAA,OACV;AAAA,KACF;AAAA,IACA;AAAA,MACE,IAAM,EAAA,OAAA;AAAA,MACN,OAAS,EAAA,KAAA;AAAA,MACT,GAAK,EAAA;AAAA,QACH,YAAc,EAAA,KAAA;AAAA,OAChB;AAAA,KACF;AAAA,IACA;AAAA,MACE,IAAM,EAAA,QAAA;AAAA,MACN,OAAS,EAAA,KAAA;AAAA,MACT,GAAK,EAAA;AAAA,QACH,YAAc,EAAA,KAAA;AAAA,OAChB;AAAA,KACF;AAAA,IACA;AAAA,MACE,IAAM,EAAA,OAAA;AAAA,MACN,OAAS,EAAA,KAAA;AAAA,MACT,GAAK,EAAA;AAAA,QACH,YAAc,EAAA,KAAA;AAAA,OAChB;AAAA,KACF;AAAA,IACA;AAAA,MACE,IAAM,EAAA,SAAA;AAAA,MACN,OAAS,EAAA,KAAA;AAAA,MACT,GAAK,EAAA;AAAA,QACH,YAAc,EAAA,KAAA;AAAA,OAChB;AAAA,KACF;AAAA,IACA;AAAA,MACE,IAAM,EAAA,UAAA;AAAA,MACN,OAAS,EAAA,KAAA;AAAA,MACT,GAAK,EAAA;AAAA,QACH,YAAc,EAAA,KAAA;AAAA,OAChB;AAAA,KACF;AAAA,IACA;AAAA,MACE,OAAS,EAAA,SAAA;AAAA,MACT,UAAY,EAAA,QAAA;AAAA,MACZ,GAAK,EAAA;AAAA,QACH,KAAO,EAAA,SAAA;AAAA,QACP,eAAiB,EAAA,SAAA;AAAA,QACjB,GAAG,WAAA;AAAA,QACH,SAAW,EAAA;AAAA,UACT,KAAO,EAAA,SAAA;AAAA,UACP,eAAiB,EAAA,SAAA;AAAA,SACnB;AAAA,QACA,CAAC,eAAe,GAAG;AAAA,UACjB,eAAiB,EAAA,SAAA;AAAA,SACnB;AAAA,OACF;AAAA,KACF;AAAA,IACA;AAAA,MACE,OAAS,EAAA,SAAA;AAAA,MACT,UAAY,EAAA,UAAA;AAAA,MACZ,GAAK,EAAA;AAAA,QACH,KAAO,EAAA,sBAAA;AAAA,QACP,MAAQ,EAAA,gCAAA;AAAA,QACR,GAAG,YAAA;AAAA,QACH,SAAW,EAAA;AAAA,UACT,KAAO,EAAA,sBAAA;AAAA,UACP,eAAiB,EAAA,wBAAA;AAAA,SACnB;AAAA,QACA,CAAC,eAAe,GAAG;AAAA,UACjB,eAAiB,EAAA,wBAAA;AAAA,SACnB;AAAA,OACF;AAAA,KACF;AAAA,IACA;AAAA,MACE,OAAS,EAAA,SAAA;AAAA,MACT,UAAY,EAAA,MAAA;AAAA,MACZ,GAAK,EAAA;AAAA,QACH,KAAO,EAAA,sBAAA;AAAA,QACP,GAAG,YAAA;AAAA,QACH,SAAW,EAAA;AAAA,UACT,KAAO,EAAA,sBAAA;AAAA,UACP,eAAiB,EAAA,wBAAA;AAAA,SACnB;AAAA,QACA,CAAC,eAAe,GAAG;AAAA,UACjB,KAAO,EAAA,sBAAA;AAAA,SACT;AAAA,OACF;AAAA,KACF;AAAA,IACA;AAAA,MACE,OAAS,EAAA,WAAA;AAAA,MACT,UAAY,EAAA,QAAA;AAAA,MACZ,GAAK,EAAA;AAAA,QACH,KAAO,EAAA,mBAAA;AAAA,QACP,eAAiB,EAAA,wBAAA;AAAA,QACjB,GAAG,WAAA;AAAA,QACH,SAAW,EAAA;AAAA,UACT,KAAO,EAAA,mBAAA;AAAA,UACP,eAAiB,EAAA,wBAAA;AAAA,SACnB;AAAA,QACA,CAAC,eAAe,GAAG;AAAA,UACjB,eAAiB,EAAA,wBAAA;AAAA,SACnB;AAAA,OACF;AAAA,KACF;AAAA,IACA;AAAA,MACE,OAAS,EAAA,WAAA;AAAA,MACT,UAAY,EAAA,UAAA;AAAA,MACZ,GAAK,EAAA;AAAA,QACH,KAAO,EAAA,mBAAA;AAAA,QACP,MAAQ,EAAA,kCAAA;AAAA,QACR,GAAG,YAAA;AAAA,QACH,SAAW,EAAA;AAAA,UACT,KAAO,EAAA,mBAAA;AAAA,UACP,eAAiB,EAAA,wBAAA;AAAA,SACnB;AAAA,QACA,CAAC,eAAe,GAAG;AAAA,UACjB,eAAiB,EAAA,wBAAA;AAAA,SACnB;AAAA,OACF;AAAA,KACF;AAAA,IACA;AAAA,MACE,OAAS,EAAA,WAAA;AAAA,MACT,UAAY,EAAA,MAAA;AAAA,MACZ,GAAK,EAAA;AAAA,QACH,KAAO,EAAA,mBAAA;AAAA,QACP,GAAG,YAAA;AAAA,QACH,SAAW,EAAA;AAAA,UACT,KAAO,EAAA,mBAAA;AAAA,UACP,eAAiB,EAAA,wBAAA;AAAA,SACnB;AAAA,OACF;AAAA,KACF;AAAA,IACA;AAAA,MACE,OAAS,EAAA,QAAA;AAAA,MACT,UAAY,EAAA,QAAA;AAAA,MACZ,GAAK,EAAA;AAAA,QACH,KAAO,EAAA,SAAA;AAAA,QACP,eAAiB,EAAA,sBAAA;AAAA,QACjB,GAAG,WAAA;AAAA,QACH,SAAW,EAAA;AAAA,UACT,eAAiB,EAAA,sBAAA;AAAA,SACnB;AAAA,QACA,CAAC,eAAe,GAAG;AAAA,UACjB,eAAiB,EAAA,sBAAA;AAAA,SACnB;AAAA,OACF;AAAA,KACF;AAAA,IACA;AAAA,MACE,OAAS,EAAA,QAAA;AAAA,MACT,UAAY,EAAA,UAAA;AAAA,MACZ,GAAK,EAAA;AAAA,QACH,KAAO,EAAA,sBAAA;AAAA,QACP,MAAQ,EAAA,gCAAA;AAAA,QACR,GAAG,YAAA;AAAA,QACH,SAAW,EAAA;AAAA,UACT,KAAO,EAAA,sBAAA;AAAA,UACP,eAAiB,EAAA,wBAAA;AAAA,SACnB;AAAA,QACA,CAAC,eAAe,GAAG;AAAA,UACjB,eAAiB,EAAA,wBAAA;AAAA,SACnB;AAAA,OACF;AAAA,KACF;AAAA,IACA;AAAA,MACE,OAAS,EAAA,QAAA;AAAA,MACT,UAAY,EAAA,MAAA;AAAA,MACZ,GAAK,EAAA;AAAA,QACH,KAAO,EAAA,sBAAA;AAAA,QACP,GAAG,YAAA;AAAA,QACH,SAAW,EAAA;AAAA,UACT,KAAO,EAAA,sBAAA;AAAA,UACP,eAAiB,EAAA,wBAAA;AAAA,SACnB;AAAA,OACF;AAAA,KACF;AAAA,GACF;AACF,CAAC,CAAA,CAAA;AAEY,MAAA,gBAAA,GAAmB,MAAO,CAAA,SAAA,CAAU,GAAK,EAAA;AAAA,EACpD,OAAS,EAAA,MAAA;AAAA,EACT,UAAY,EAAA,QAAA;AAAA,EACZ,cAAgB,EAAA,QAAA;AAAA,EAChB,QAAU,EAAA,UAAA;AAAA,EACV,GAAK,EAAA,CAAA;AAAA,EACL,IAAM,EAAA,CAAA;AAAA,EACN,MAAQ,EAAA,CAAA;AAAA,EACR,KAAO,EAAA,CAAA;AAAA,EACP,MAAQ,EAAA,MAAA;AACV,CAAC,CAAA;;ACpOM,MAAM,SAAS,KAAM,CAAA,UAAA;AAAA,EAI1B,CACE;AAAA,IACE,OAAU,GAAA,SAAA;AAAA,IACV,UAAa,GAAA,QAAA;AAAA,IACb,IAAO,GAAA,QAAA;AAAA,IACP,OAAU,GAAA,KAAA;AAAA,IACV,OAAU,GAAA,KAAA;AAAA,IACV,KAAQ,GAAA,KAAA;AAAA,IACR,QAAW,GAAA,KAAA;AAAA,IACX,IAAA;AAAA,IACA,MAAA;AAAA,IACA,GAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,GAAG,SAAA;AAAA,KAEL,UACG,KAAA;AACH,IAAI,IAAA,WAAA,CAAA;AAEJ,IAAI,IAAA,OAAO,SAAS,QAAU,EAAA;AAC5B,MAAA,WAAA,GAAc,CAAC,SAAW,EAAA,UAAU,EAAE,QAAS,CAAA,IAAI,IAAI,OAAU,GAAA,QAAA,CAAA;AAAA,KAC5D,MAAA;AACL,MAAc,WAAA,GAAA,QAAA,CAAA;AAAA,KAChB;AAEA,IAAM,MAAA,QAAA,GAAW,OAAY,KAAA,MAAA,IAAU,OAAY,KAAA,IAAA,CAAA;AACnD,IAAA,MAAM,mBAAmB,QAAY,IAAA,QAAA,CAAA;AAErC,IAAA,MAAM,SAAS,IAAQ,IAAA,IAAA,CAAA;AAEvB,IAAM,MAAA,GAAA,GAAM,OAA8C,IAAI,CAAA,CAAA;AAC9D,IAAA,MAAM,kBAAkB,UAAc,IAAA,IAAA,GAAA,UAAA,GAAA,GAAA,CAAA;AACtC,IAAM,MAAA,EAAE,WAAa,EAAA,SAAA,EAAc,GAAA,SAAA;AAAA,MACjC;AAAA,QACE,UAAY,EAAA,gBAAA;AAAA,QACZ,IAAA;AAAA,QACA,SAAS,OAAW,IAAA,IAAA,GAAA,OAAA,GAAA,OAAA;AAAA;AAAA,QAEpB,sBAAwB,EAAA,KAAA;AAAA,QACxB,GAAG,SAAA;AAAA,OACL;AAAA,MACA,eAAA;AAAA,KACF,CAAA;AAEA,IAAM,MAAA,EAAE,WAAc,GAAA,OAAA;AAAA,MACpB;AAAA,QACE,UAAY,EAAA,QAAA;AAAA,QACZ,SAAS,OAAW,IAAA,IAAA,GAAA,OAAA,GAAA,OAAA;AAAA,QACpB,GAAG,SAAA;AAAA,OACL;AAAA;AAAA,MAEA,eAAA;AAAA,KACF,CAAA;AAEA,IAAA,MAAM,0BAED,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,MAAA,QAAA,wBACE,gBACC,EAAA,EAAA,QAAA,kBAAA,GAAA,CAAC,OAAQ,EAAA,EAAA,IAAA,EAAM,aAAa,CAC9B,EAAA,CAAA;AAAA,sBAEF,GAAA,CAAC,UAAM,QAAS,EAAA,CAAA;AAAA,KAClB,EAAA,CAAA,CAAA;AAGF,IAAA,MAAM,eAAe,gBAAoB,IAAA;AAAA,MACvC,QAAU,EAAA,CAAA,CAAA;AAAA,KACZ,CAAA;AAEA,IAAA,MAAM,EAAE,cAAA,EAAgB,UAAW,EAAA,GAAI,YAAa,EAAA,CAAA;AAEpD,IAAA,MAAM,YAAe,GAAA,UAAA;AAAA,MACnB,SAAA;AAAA,MACA,SAAS,SAAY,GAAA,WAAA;AAAA,MACrB,UAAA;AAAA,KACF,CAAA;AAEA,IACE,uBAAA,GAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACE,GAAG,YAAA;AAAA,QACJ,OAAA;AAAA,QACA,UAAA;AAAA,QACA,IAAA;AAAA,QACA,OAAA;AAAA,QACA,OAAA;AAAA,QACA,KAAA;AAAA,QACA,QAAU,EAAA,gBAAA;AAAA,QACV,SAAS,MAAU,IAAA,OAAA;AAAA,QAClB,GAAG,YAAA;AAAA,QACJ,cAAA,EAAc,YAAY,EAAK,GAAA,KAAA,CAAA;AAAA,QAC/B,cAAA,EAAc,iBAAiB,EAAK,GAAA,KAAA,CAAA;AAAA,QAEpC,GAAK,EAAA,eAAA;AAAA,QAEJ,QACC,EAAA,MAAA,mBAAA,GAAA;AAAA,UAAC,GAAA;AAAA,UAAA;AAAA,YACC,IAAA;AAAA,YACA,MAAA;AAAA,YACA,GAAK,EAAA,MAAA,KAAW,QAAW,GAAA,sBAAA,CAAuB,MAAQ,CAAA,GAAA,CAAA,GAAA,GAAA;AAAA,YAEzD,QAAA,EAAA,OAAA;AAAA,WAAA;AAAA,SAGH,GAAA,OAAA;AAAA,OAAA;AAAA,KAEJ,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"module.js","sources":["../src/button.styled.ts","../src/button.tsx"],"sourcesContent":["import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const focusFilled = {\n  '&[data-focused]': {\n    boxShadow: `inset 0 0 0 1px white, 0 0 0 1px rgba(104, 129, 255, 1), 0 0 0 5px rgba(217, 224, 255, 1)`,\n  },\n}\n\nexport const focusOutline = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 1px rgba(104, 129, 255, 1), 0 0 0 5px rgba(217, 224, 255, 1)`,\n    borderColor: 'transparent',\n  },\n}\n\nconst focusDefault = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 1px rgba(104, 129, 255, 1), 0 0 0 5px rgba(217, 224, 255, 1)`,\n  },\n}\n\nconst pressedSelector = '&:active, &[data-pressed]'\n\nexport const StyledButton = styled(Primitive.button, {\n  boxSizing: 'border-box',\n  display: 'inline-block',\n  outline: 'none',\n  whiteSpace: 'nowrap',\n  textOverflow: 'ellipsis',\n  textAlign: 'center',\n  verticalAlign: 'middle',\n  userSelect: 'none',\n  fontFamily: 'inherit',\n  fontStyle: 'normal',\n  fontStretch: 'normal',\n  letterSpacing: 'normal',\n  fontWeight: 'normal',\n  position: 'relative',\n  cursor: 'pointer',\n  border: 'none',\n  textDecoration: 'none',\n  backgroundColor: 'transparent',\n  '&[disabled]': {\n    pointerEvents: 'none',\n    opacity: 0.4,\n  },\n  variants: {\n    variant: {\n      primary: {},\n      secondary: {},\n      danger: {},\n    },\n    appearance: {\n      filled: {},\n      outlined: {},\n      flat: {},\n    },\n    size: {\n      large: {\n        padding: '14px 32px 18px 32px',\n        fontSize: '20px',\n        lineHeight: '28px',\n        height: '60px',\n      },\n      medium: {\n        padding: '11px 24px 13px 24px',\n        fontSize: '16px',\n        lineHeight: '24px',\n        height: '48px',\n      },\n      small: {\n        padding: '7px 16px 9px 16px',\n        fontSize: '14px',\n        lineHeight: '20px',\n        height: '36px',\n      },\n      'x-small': {\n        padding: '5px 12px 7px',\n        fontSize: '14px',\n        lineHeight: '20px',\n        height: '32px',\n      },\n      'xx-small': {\n        padding: '3px 12px',\n        fontSize: '12px',\n        lineHeight: '18px',\n        height: '24px',\n      },\n    },\n    rounded: {\n      true: {\n        borderRadius: '$half',\n      },\n    },\n    loading: {\n      true: {\n        '&[disabled]': {\n          cursor: 'default',\n          opacity: 1,\n          pointerEvents: 'none',\n          '& > span': {\n            visibility: 'hidden',\n          },\n        },\n      },\n    },\n    fluid: {\n      true: {\n        width: '100%',\n        display: 'block',\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      size: 'small',\n      rounded: true,\n      css: {\n        padding: '10px 16px',\n        height: '40px',\n      },\n    },\n    {\n      size: 'large',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'medium',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'small',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'x-small',\n      rounded: false,\n      css: {\n        borderRadius: '$50',\n      },\n    },\n    {\n      size: 'xx-small',\n      rounded: false,\n      css: {\n        borderRadius: '$25',\n      },\n    },\n    {\n      variant: 'primary',\n      appearance: 'filled',\n      css: {\n        color: '#FFFFFF',\n        backgroundColor: '#3859FF',\n        ...focusFilled,\n        '&:hover': {\n          color: '#FFFFFF',\n          backgroundColor: '#3F53D9',\n        },\n        [pressedSelector]: {\n          backgroundColor: '#122277',\n        },\n      },\n    },\n    {\n      variant: 'primary',\n      appearance: 'outlined',\n      css: {\n        color: 'rgba(66, 98, 255, 1)',\n        border: '1px solid rgba(66, 98, 255, 1)',\n        ...focusOutline,\n        '&:hover': {\n          color: 'rgba(66, 98, 255, 1)',\n          backgroundColor: 'rgba(244, 246, 255, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(240, 242, 255, 1)',\n        },\n      },\n    },\n    {\n      variant: 'primary',\n      appearance: 'flat',\n      css: {\n        color: 'rgba(66, 98, 255, 1)',\n        ...focusDefault,\n        '&:hover': {\n          color: 'rgba(69, 91, 237, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n        [pressedSelector]: {\n          color: 'rgba(61, 81, 212, 1)',\n        },\n      },\n    },\n    {\n      variant: 'secondary',\n      appearance: 'filled',\n      css: {\n        color: 'rgba(5, 0, 56, 1)',\n        backgroundColor: 'rgba(245, 245, 247, 1)',\n        ...focusFilled,\n        '&:hover': {\n          color: 'rgba(5, 0, 56, 1)',\n          backgroundColor: 'rgba(240, 240, 243, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(235, 235, 239, 1)',\n        },\n      },\n    },\n    {\n      variant: 'secondary',\n      appearance: 'outlined',\n      css: {\n        color: 'rgba(5, 0, 56, 1)',\n        border: '1px solid rgba(205, 204, 215, 1)',\n        ...focusOutline,\n        '&:hover': {\n          color: 'rgba(5, 0, 56, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(235, 235, 239, 1)',\n        },\n      },\n    },\n    {\n      variant: 'secondary',\n      appearance: 'flat',\n      css: {\n        color: 'rgba(5, 0, 56, 1)',\n        ...focusDefault,\n        '&:hover': {\n          color: 'rgba(5, 0, 56, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n      },\n    },\n    {\n      variant: 'danger',\n      appearance: 'filled',\n      css: {\n        color: '#FFFFFF',\n        backgroundColor: 'rgba(217, 41, 41, 1)',\n        ...focusFilled,\n        '&:hover': {\n          backgroundColor: 'rgba(199, 20, 20, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(184, 13, 13, 1)',\n        },\n      },\n    },\n    {\n      variant: 'danger',\n      appearance: 'outlined',\n      css: {\n        color: 'rgba(217, 41, 41, 1)',\n        border: '1px solid rgba(217, 41, 41, 1)',\n        ...focusOutline,\n        '&:hover': {\n          color: 'rgba(217, 41, 41, 1)',\n          backgroundColor: 'rgba(254, 247, 247, 1)',\n        },\n        [pressedSelector]: {\n          backgroundColor: 'rgba(253, 242, 242, 1)',\n        },\n      },\n    },\n    {\n      variant: 'danger',\n      appearance: 'flat',\n      css: {\n        color: 'rgba(217, 41, 41, 1)',\n        ...focusDefault,\n        '&:hover': {\n          color: 'rgba(217, 41, 41, 1)',\n          backgroundColor: 'rgba(245, 245, 247, 1)',\n        },\n      },\n    },\n  ],\n})\n\nexport const StyledSpinnerBox = styled(Primitive.div, {\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  bottom: 0,\n  right: 0,\n  margin: 'auto',\n})\n","import React, { useRef } from 'react'\nimport type { ElementRef } from 'react'\nimport { useButton } from '@react-aria/button'\nimport { mergeProps } from '@react-aria/utils'\nimport type { SpinnerProps } from '@mirohq/design-system-spinner'\nimport { Spinner } from '@mirohq/design-system-spinner'\nimport { useLink } from '@react-aria/link'\nimport { useFocusRing } from '@react-aria/focus'\n\nimport { StyledButton, StyledSpinnerBox } from './button.styled'\n\nexport type ButtonProps = any\n\nexport const Button = React.forwardRef<\n  ElementRef<typeof StyledButton | 'a'>,\n  ButtonProps\n>(\n  (\n    {\n      variant = 'primary',\n      appearance = 'filled',\n      size = 'medium',\n      loading = false,\n      rounded = false,\n      fluid = false,\n      disabled = false,\n      href,\n      target,\n      rel,\n      children,\n      onPress,\n      onClick,\n      asChild,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    let spinnerSize: SpinnerProps['size']\n\n    if (typeof size === 'string') {\n      spinnerSize = ['x-small', 'xx-small'].includes(size) ? 'small' : 'medium'\n    } else {\n      spinnerSize = 'medium'\n    }\n\n    const _loading = loading === 'true' || loading === true\n    const shouldBeDisabled = disabled === true || _loading\n\n    const asLink = href != null\n\n    const ref = useRef<HTMLButtonElement | HTMLAnchorElement>(null)\n    const refWithFallback = forwardRef ?? ref\n    const { buttonProps, isPressed } = useButton(\n      {\n        isDisabled: shouldBeDisabled,\n        href,\n        onPress: onPress ?? onClick,\n        allowFocusWhenDisabled: false,\n        ...restProps,\n      },\n      // @ts-expect-error\n      refWithFallback\n    )\n\n    const { linkProps } = useLink(\n      {\n        isDisabled: disabled,\n        onPress: onPress ?? onClick,\n        ...restProps,\n      },\n      // @ts-expect-error\n      refWithFallback\n    )\n\n    const Content = (\n      <>\n        {_loading && (\n          <StyledSpinnerBox>\n            <Spinner size={spinnerSize} />\n          </StyledSpinnerBox>\n        )}\n        <span>{children}</span>\n      </>\n    )\n\n    const tabIndexProp = shouldBeDisabled && {\n      tabIndex: -1,\n    }\n\n    const { isFocusVisible, focusProps } = useFocusRing()\n\n    const elementProps = mergeProps(\n      restProps,\n      asLink ? linkProps : buttonProps,\n      focusProps\n    )\n\n    return (\n      <StyledButton\n        {...elementProps}\n        variant={variant}\n        appearance={appearance}\n        size={size}\n        loading={loading}\n        rounded={rounded}\n        fluid={fluid}\n        disabled={shouldBeDisabled}\n        asChild={asLink || asChild}\n        {...tabIndexProp}\n        data-pressed={isPressed ? '' : undefined}\n        data-focused={isFocusVisible ? '' : undefined}\n        ref={refWithFallback}\n      >\n        {asLink ? (\n          <a\n            href={href}\n            target={target}\n            rel={target === '_blank' ? `noopener noreferrer ${rel}` : rel}\n          >\n            {Content}\n          </a>\n        ) : (\n          Content\n        )}\n      </StyledButton>\n    )\n  }\n)\n"],"names":[],"mappings":"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"}

package/dist/types.d.ts

@@ -1,607 +1,6 @@
-import * as react from 'react';
-import react__default, { ComponentPropsWithRef, ReactNode } from 'react';
-import { AriaButtonProps } from '@react-types/button';
-import * as _mirohq_design_system_stitches from '@mirohq/design-system-stitches';
-import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
-import * as _stitches_react_types_css_util from '@stitches/react/types/css-util';
-import * as _mirohq_design_system_primitive from '@mirohq/design-system-primitive';
+import React from 'react';
 
-declare const StyledButton: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"button">>, {}, {}, _stitches_react_types_css_util.CSS<{}, {
-    'border-widths': {
-        readonly none: 0;
-        readonly sm: "1px";
-        readonly md: "2px";
-        readonly lg: "4px";
-    };
-    colors: {
-        readonly black: any;
-        readonly 'blue-50': any;
-        readonly 'blue-100': any;
-        readonly 'blue-150': any;
-        readonly 'blue-200': any;
-        readonly 'blue-250': any;
-        readonly 'blue-300': any;
-        readonly 'blue-350': any;
-        readonly 'blue-400': any;
-        readonly 'blue-450': any;
-        readonly 'blue-500': any;
-        readonly 'blue-550': any;
-        readonly 'blue-600': any;
-        readonly 'blue-650': any;
-        readonly 'blue-700': any;
-        readonly 'blue-750': any;
-        readonly 'blue-800': any;
-        readonly 'blue-850': any;
-        readonly 'blue-900': any;
-        readonly 'blue-950': any;
-        readonly 'gray-50': any;
-        readonly 'gray-100': any;
-        readonly 'gray-150': any;
-        readonly 'gray-200': any;
-        readonly 'gray-250': any;
-        readonly 'gray-300': any;
-        readonly 'gray-350': any;
-        readonly 'gray-400': any;
-        readonly 'gray-450': any;
-        readonly 'gray-500': any;
-        readonly 'gray-550': any;
-        readonly 'gray-600': any;
-        readonly 'gray-650': any;
-        readonly 'gray-700': any;
-        readonly 'gray-750': any;
-        readonly 'gray-800': any;
-        readonly 'gray-850': any;
-        readonly 'gray-900': any;
-        readonly 'gray-950': any;
-        readonly 'green-50': any;
-        readonly 'green-100': any;
-        readonly 'green-150': any;
-        readonly 'green-200': any;
-        readonly 'green-250': any;
-        readonly 'green-300': any;
-        readonly 'green-350': any;
-        readonly 'green-400': any;
-        readonly 'green-450': any;
-        readonly 'green-500': any;
-        readonly 'green-550': any;
-        readonly 'green-600': any;
-        readonly 'green-650': any;
-        readonly 'green-700': any;
-        readonly 'green-750': any;
-        readonly 'green-800': any;
-        readonly 'green-850': any;
-        readonly 'green-900': any;
-        readonly 'green-950': any;
-        readonly 'red-50': any;
-        readonly 'red-100': any;
-        readonly 'red-150': any;
-        readonly 'red-200': any;
-        readonly 'red-250': any;
-        readonly 'red-300': any;
-        readonly 'red-350': any;
-        readonly 'red-400': any;
-        readonly 'red-450': any;
-        readonly 'red-500': any;
-        readonly 'red-550': any;
-        readonly 'red-600': any;
-        readonly 'red-650': any;
-        readonly 'red-700': any;
-        readonly 'red-750': any;
-        readonly 'red-800': any;
-        readonly 'red-850': any;
-        readonly 'red-900': any;
-        readonly 'red-950': any;
-        readonly transparent: any;
-        readonly white: any;
-        readonly 'yellow-50': any;
-        readonly 'yellow-100': any;
-        readonly 'yellow-150': any;
-        readonly 'yellow-200': any;
-        readonly 'yellow-250': any;
-        readonly 'yellow-300': any;
-        readonly 'yellow-350': any;
-        readonly 'yellow-400': any;
-        readonly 'yellow-450': any;
-        readonly 'yellow-500': any;
-        readonly 'yellow-550': any;
-        readonly 'yellow-600': any;
-        readonly 'yellow-650': any;
-        readonly 'yellow-700': any;
-        readonly 'yellow-750': any;
-        readonly 'yellow-800': any;
-        readonly 'yellow-850': any;
-        readonly 'yellow-900': any;
-        readonly 'yellow-950': any;
-        "background-alpha-active"?: any;
-        "background-alpha-hover"?: any;
-        "background-danger-prominent"?: any;
-        "background-danger-prominent-active"?: any;
-        "background-danger-prominent-hover"?: any;
-        "background-danger-subtle"?: any;
-        "background-danger-subtle-active"?: any;
-        "background-danger-subtle-hover"?: any;
-        "background-neutrals"?: any;
-        "background-neutrals-active"?: any;
-        "background-neutrals-container"?: any;
-        "background-neutrals-controls-disabled"?: any;
-        "background-neutrals-disabled"?: any;
-        "background-neutrals-hover"?: any;
-        "background-neutrals-inactive"?: any;
-        "background-neutrals-inactive-hover"?: any;
-        "background-neutrals-inverted"?: any;
-        "background-neutrals-inverted-subtle"?: any;
-        "background-neutrals-page"?: any;
-        "background-neutrals-page-subtle"?: any;
-        "background-neutrals-scrollbar"?: any;
-        "background-neutrals-scrollbar-active"?: any;
-        "background-neutrals-scrollbar-hover"?: any;
-        "background-neutrals-subtle"?: any;
-        "background-neutrals-subtle-active"?: any;
-        "background-neutrals-subtle-hover"?: any;
-        "background-primary-prominent"?: any;
-        "background-primary-prominent-active"?: any;
-        "background-primary-prominent-hover"?: any;
-        "background-primary-prominent-selected"?: any;
-        "background-primary-subtle"?: any;
-        "background-primary-subtle-active"?: any;
-        "background-primary-subtle-hover"?: any;
-        "background-primary-subtle-selected"?: any;
-        "background-success"?: any;
-        "background-success-prominent"?: any;
-        "background-success-prominent-active"?: any;
-        "background-success-prominent-hover"?: any;
-        "background-warning-prominent"?: any;
-        "background-warning-subtle"?: any;
-        "border-danger"?: any;
-        "border-danger-active"?: any;
-        "border-danger-hover"?: any;
-        "border-focus-error-inner"?: any;
-        "border-focus-error-middle"?: any;
-        "border-focus-error-outer"?: any;
-        "border-focus-inner"?: any;
-        "border-focus-middle"?: any;
-        "border-focus-outer"?: any;
-        "border-focus-success-inner"?: any;
-        "border-focus-success-middle"?: any;
-        "border-focus-success-outer"?: any;
-        "border-neutrals"?: any;
-        "border-neutrals-active"?: any;
-        "border-neutrals-controls"?: any;
-        "border-neutrals-controls-disabled"?: any;
-        "border-neutrals-disabled"?: any;
-        "border-neutrals-hover"?: any;
-        "border-neutrals-inverted"?: any;
-        "border-neutrals-subtle"?: any;
-        "border-neutrals-text"?: any;
-        "border-neutrals-text-active"?: any;
-        "border-neutrals-text-hover"?: any;
-        "border-neutrals-text-subtle"?: any;
-        "border-neutrals-text-subtle-active"?: any;
-        "border-neutrals-text-subtle-hover"?: any;
-        "border-neutrals-transparent"?: any;
-        "border-primary"?: any;
-        "border-primary-active"?: any;
-        "border-primary-hover"?: any;
-        "border-primary-inverted"?: any;
-        "border-success"?: any;
-        "border-success-active"?: any;
-        "border-success-hover"?: any;
-        "border-warning"?: any;
-        "icon-danger"?: any;
-        "icon-danger-active"?: any;
-        "icon-danger-hover"?: any;
-        "icon-danger-inverted"?: any;
-        "icon-neutrals"?: any;
-        "icon-neutrals-disabled"?: any;
-        "icon-neutrals-inactive"?: any;
-        "icon-neutrals-inactive-hover"?: any;
-        "icon-neutrals-inverted"?: any;
-        "icon-neutrals-search"?: any;
-        "icon-neutrals-subtle"?: any;
-        "icon-neutrals-text"?: any;
-        "icon-primary"?: any;
-        "icon-primary-active"?: any;
-        "icon-primary-hover"?: any;
-        "icon-primary-inverted"?: any;
-        "icon-primary-selected"?: any;
-        "icon-success"?: any;
-        "icon-success-active"?: any;
-        "icon-success-hover"?: any;
-        "icon-success-inverted"?: any;
-        "icon-warning"?: any;
-        "icon-warning-prominent"?: any;
-        "icon-warning-subtle"?: any;
-        "text-danger"?: any;
-        "text-danger-active"?: any;
-        "text-danger-hover"?: any;
-        "text-danger-inverted"?: any;
-        "text-neutrals"?: any;
-        "text-neutrals-active"?: any;
-        "text-neutrals-disabled"?: any;
-        "text-neutrals-hover"?: any;
-        "text-neutrals-inverted"?: any;
-        "text-neutrals-placeholder"?: any;
-        "text-neutrals-placeholder-only"?: any;
-        "text-neutrals-subtle"?: any;
-        "text-neutrals-subtle-active"?: any;
-        "text-neutrals-subtle-hover"?: any;
-        "text-primary"?: any;
-        "text-primary-active"?: any;
-        "text-primary-hover"?: any;
-        "text-primary-inverted"?: any;
-        "text-primary-inverted-subtle"?: any;
-        "text-primary-selected"?: any;
-        "text-success"?: any;
-        "text-success-active"?: any;
-        "text-success-hover"?: any;
-        "text-success-inverted"?: any;
-        "text-warning"?: any;
-        "text-warning-subtle"?: any;
-    };
-    'font-sizes': {
-        readonly 150: "0.75rem";
-        readonly 175: "0.875rem";
-        readonly 200: "1rem";
-        readonly 225: "1.125rem";
-        readonly 250: "1.25rem";
-        readonly 300: "1.5rem";
-        readonly 400: "2rem";
-        readonly 500: "2.5rem";
-        readonly 600: "3rem";
-        readonly 800: "4rem";
-        readonly 900: "4.5rem";
-    };
-    fonts: {
-        readonly heading: "Roobert, sans-serif";
-        readonly body: "Open Sans, sans-serif";
-    };
-    radii: {
-        readonly 25: "2px";
-        readonly 50: "4px";
-        readonly 75: "6px";
-        readonly 100: "8px";
-        readonly 200: "16px";
-        readonly half: "999px";
-        readonly none: "0px";
-    };
-    shadows: {
-        50: any;
-        100: any;
-        "focus-small": any;
-        "focus-small-outline": any;
-        "focus-large": any;
-        "focus-controls": any;
-        "focus-controls-error": any;
-        "focus-controls-success": any;
-    };
-    sizes: {
-        readonly number: string;
-        readonly 'icon-200': "16px";
-        readonly 'icon-300': "24px";
-        readonly 'icon-400': "32px";
-    };
-    space: {
-        readonly 0: "0px";
-        readonly 25: "2px";
-        readonly 50: "4px";
-        readonly 100: "8px";
-        readonly 150: "12px";
-        readonly 200: "16px";
-        readonly 300: "24px";
-        readonly 400: "32px";
-        readonly 500: "40px";
-        readonly 600: "48px";
-        readonly 700: "56px";
-        readonly 800: "64px";
-        readonly 1200: "96px";
-        readonly 1600: "128px";
-    };
-    'space-gap': {
-        readonly 0: any;
-        readonly 50: any;
-        readonly 100: any;
-        readonly 200: any;
-        readonly 300: any;
-    };
-    'space-inset': {
-        readonly 0: any;
-        readonly 50: any;
-        readonly 100: any;
-        readonly 150: any;
-        readonly 200: any;
-        readonly 300: any;
-        readonly 400: any;
-        readonly 500: any;
-        readonly 600: any;
-        readonly 700: any;
-        readonly 800: any;
-        readonly 1200: any;
-        readonly 1600: any;
-    };
-    'space-offset': {
-        readonly 0: any;
-        readonly 50: any;
-        readonly 100: any;
-        readonly 150: any;
-        readonly 200: any;
-        readonly 300: any;
-        readonly 400: any;
-        readonly 600: any;
-        readonly 800: any;
-        readonly 1200: any;
-        readonly 1600: any;
-        readonly 'stacking-0': any;
-        readonly 'stacking-100': any;
-        readonly 'stacking-200': any;
-        readonly 'stacking-300': any;
-        readonly 'stacking-400': any;
-        readonly 'stacking-500': any;
-        readonly 'stacking-800': any;
-    };
-    'stroke-width': {
-        readonly thin: "1.5px";
-        readonly normal: "2px";
-        readonly bold: "4px";
-    };
-    'z-indices': {
-        readonly dropdownMenu: 100;
-        readonly select: 200;
-        readonly popover: 300;
-        readonly tooltip: 400;
-    };
-}, {
-    readonly background: "colors";
-    readonly backgroundColor: "colors";
-    readonly backgroundImage: "colors";
-    readonly blockSize: "sizes";
-    readonly border: "colors";
-    readonly borderBlock: "colors";
-    readonly borderBlockEnd: "colors";
-    readonly borderBlockStart: "colors";
-    readonly borderBottom: "colors";
-    readonly borderBottomColor: "colors";
-    readonly borderBottomLeftRadius: "radii";
-    readonly borderBottomRightRadius: "radii";
-    readonly borderBottomStyle: "border-styles";
-    readonly borderBottomWidth: "border-widths";
-    readonly borderColor: "colors";
-    readonly borderImage: "colors";
-    readonly borderInline: "colors";
-    readonly borderInlineEnd: "colors";
-    readonly borderInlineStart: "colors";
-    readonly borderLeft: "colors";
-    readonly borderLeftColor: "colors";
-    readonly borderLeftStyle: "border-styles";
-    readonly borderLeftWidth: "border-widths";
-    readonly borderRadius: "radii";
-    readonly borderRight: "colors";
-    readonly borderRightColor: "colors";
-    readonly borderRightStyle: "border-styles";
-    readonly borderRightWidth: "border-widths";
-    readonly borderSpacing: "space-offset";
-    readonly borderStyle: "border-styles";
-    readonly borderTop: "colors";
-    readonly borderTopColor: "colors";
-    readonly borderTopLeftRadius: "radii";
-    readonly borderTopRightRadius: "radii";
-    readonly borderTopStyle: "border-styles";
-    readonly borderTopWidth: "border-widths";
-    readonly borderWidth: "border-widths";
-    readonly bottom: "space";
-    readonly boxShadow: "shadows";
-    readonly caretColor: "colors";
-    readonly color: "colors";
-    readonly columnGap: "space-gap";
-    readonly columnRuleColor: "colors";
-    readonly fill: "colors";
-    readonly flexBasis: "sizes";
-    readonly fontFamily: "fonts";
-    readonly fontSize: "font-sizes";
-    readonly fontWeight: "font-weights";
-    readonly gap: "space-gap";
-    readonly gridColumnGap: "space-gap";
-    readonly gridGap: "space-gap";
-    readonly gridRowGap: "space-gap";
-    readonly gridTemplateColumns: "sizes";
-    readonly gridTemplateRows: "sizes";
-    readonly height: "sizes";
-    readonly inlineSize: "sizes";
-    readonly inset: "space-inset";
-    readonly insetBlock: "space-inset";
-    readonly insetBlockEnd: "space-inset";
-    readonly insetBlockStart: "space-inset";
-    readonly insetInline: "space-inset";
-    readonly insetInlineEnd: "space-inset";
-    readonly insetInlineStart: "space-inset";
-    readonly left: "space";
-    readonly letterSpacing: "letter-spacings";
-    readonly lineHeight: "line-heights";
-    readonly margin: "space-offset";
-    readonly marginBlock: "space-offset";
-    readonly marginBlockEnd: "space-offset";
-    readonly marginBlockStart: "space-offset";
-    readonly marginBottom: "space-offset";
-    readonly marginInline: "space-offset";
-    readonly marginInlineEnd: "space-offset";
-    readonly marginInlineStart: "space-offset";
-    readonly marginLeft: "space-offset";
-    readonly marginRight: "space-offset";
-    readonly marginTop: "space-offset";
-    readonly maxBlockSize: "sizes";
-    readonly maxHeight: "sizes";
-    readonly maxInlineSize: "sizes";
-    readonly maxWidth: "sizes";
-    readonly minBlockSize: "sizes";
-    readonly minHeight: "sizes";
-    readonly minInlineSize: "sizes";
-    readonly minWidth: "sizes";
-    readonly outline: "colors";
-    readonly outlineColor: "colors";
-    readonly padding: "space-inset";
-    readonly paddingBlock: "space-inset";
-    readonly paddingBlockEnd: "space-inset";
-    readonly paddingBlockStart: "space-inset";
-    readonly paddingBottom: "space-inset";
-    readonly paddingInline: "space-inset";
-    readonly paddingInlineEnd: "space-inset";
-    readonly paddingInlineStart: "space-inset";
-    readonly paddingLeft: "space-inset";
-    readonly paddingRight: "space-inset";
-    readonly paddingTop: "space-inset";
-    readonly right: "space";
-    readonly rowGap: "space-gap";
-    readonly scrollMargin: "space-offset";
-    readonly scrollMarginBlock: "space-offset";
-    readonly scrollMarginBlockEnd: "space-offset";
-    readonly scrollMarginBlockStart: "space-offset";
-    readonly scrollMarginBottom: "space-offset";
-    readonly scrollMarginInline: "space-offset";
-    readonly scrollMarginInlineEnd: "space-offset";
-    readonly scrollMarginInlineStart: "space-offset";
-    readonly scrollMarginLeft: "space-offset";
-    readonly scrollMarginRight: "space-offset";
-    readonly scrollMarginTop: "space-offset";
-    readonly scrollPadding: "space-inset";
-    readonly scrollPaddingBlock: "space-inset";
-    readonly scrollPaddingBlockEnd: "space-inset";
-    readonly scrollPaddingBlockStart: "space-inset";
-    readonly scrollPaddingBottom: "space-inset";
-    readonly scrollPaddingInline: "space-inset";
-    readonly scrollPaddingInlineEnd: "space-inset";
-    readonly scrollPaddingInlineStart: "space-inset";
-    readonly scrollPaddingLeft: "space-inset";
-    readonly scrollPaddingRight: "space-inset";
-    readonly scrollPaddingTop: "space-inset";
-    readonly stroke: "colors";
-    readonly strokeWidth: "stroke-width";
-    readonly textDecorationColor: "colors";
-    readonly textShadow: "shadows";
-    readonly top: "space";
-    readonly transition: "transitions";
-    readonly width: "sizes";
-    readonly zIndex: "z-indices";
-}, {
-    paddingX: (value: {
-        readonly [$$PropertyValue]: "padding";
-    }) => {
-        paddingLeft: {
-            readonly [$$PropertyValue]: "padding";
-        };
-        paddingRight: {
-            readonly [$$PropertyValue]: "padding";
-        };
-    };
-    paddingY: (value: {
-        readonly [$$PropertyValue]: "padding";
-    }) => {
-        paddingTop: {
-            readonly [$$PropertyValue]: "padding";
-        };
-        paddingBottom: {
-            readonly [$$PropertyValue]: "padding";
-        };
-    };
-    marginX: (value: {
-        readonly [$$PropertyValue]: "margin";
-    }) => {
-        marginLeft: {
-            readonly [$$PropertyValue]: "margin";
-        };
-        marginRight: {
-            readonly [$$PropertyValue]: "margin";
-        };
-    };
-    marginY: (value: {
-        readonly [$$PropertyValue]: "margin";
-    }) => {
-        marginTop: {
-            readonly [$$PropertyValue]: "margin";
-        };
-        marginBottom: {
-            readonly [$$PropertyValue]: "margin";
-        };
-    };
-    square: (value: {
-        readonly [$$PropertyValue]: "width";
-    }) => {
-        width: {
-            readonly [$$PropertyValue]: "width";
-        };
-        height: {
-            readonly [$$PropertyValue]: "width";
-        };
-    };
-    _hover: (css: _stitches_react_types_css_util.CSSProperties) => {
-        '&:hover, &[data-hovered]': _stitches_react_types_css_util.CSSProperties;
-    };
-}>>>, "size" | "loading" | "appearance" | "variant" | "rounded" | "fluid"> & _stitches_react_types_styled_component.TransformProps<{
-    variant?: "primary" | "secondary" | "danger" | undefined;
-    appearance?: "filled" | "flat" | "outlined" | undefined;
-    size?: "small" | "medium" | "large" | "x-small" | "xx-small" | undefined;
-    rounded?: boolean | "true" | undefined;
-    loading?: boolean | "true" | undefined;
-    fluid?: boolean | "true" | undefined;
-}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLButtonElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"button">>, {
-    variant?: "primary" | "secondary" | "danger" | undefined;
-    appearance?: "filled" | "flat" | "outlined" | undefined;
-    size?: "small" | "medium" | "large" | "x-small" | "xx-small" | undefined;
-    rounded?: boolean | "true" | undefined;
-    loading?: boolean | "true" | undefined;
-    fluid?: boolean | "true" | undefined;
-}, {}>;
-declare type StyledButtonProps = ComponentPropsWithRef<typeof StyledButton>;
-
-declare type ButtonPropsA11y = StyledButtonProps & AriaButtonProps;
-interface ButtonProps extends Omit<ButtonPropsA11y, 'onClick' | 'isDisabled' | 'elementType'> {
-    /**
-     * The content
-     */
-    children: ReactNode;
-    /**
-     * Change the button color
-     */
-    variant?: StyledButtonProps['variant'];
-    /**
-     * Change the button style
-     */
-    appearance?: StyledButtonProps['appearance'];
-    /**
-     * Change the button height and font-size
-     */
-    size?: StyledButtonProps['size'];
-    /**
-     * Make border-radius circle
-     */
-    rounded?: StyledButtonProps['rounded'];
-    /**
-     * Add spinner and disable
-     */
-    loading?: StyledButtonProps['loading'];
-    /**
-     * Make width 100%
-     */
-    fluid?: StyledButtonProps['fluid'];
-    /**
-     * Prevent pointer events
-     */
-    disabled?: boolean;
-    /**
-     * A URL to link when using the button as a link
-     */
-    href?: string;
-    /**
-     * The target window using the button as a link
-     */
-    target?: string;
-    /**
-     * The relationship between the linked resource and the current page. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel)
-     */
-    rel?: string;
-    /**
-     * Alias for onPress
-     */
-    onClick?: AriaButtonProps['onPress'];
-}
-declare const Button: react__default.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & react__default.RefAttributes<HTMLButtonElement | HTMLAnchorElement>>;
+declare type ButtonProps = any;
+declare const Button: React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<HTMLButtonElement | HTMLAnchorElement>>;
 
 export { Button, ButtonProps };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mirohq/design-system-button",
-  "version": "3.2.0-deprecated-button.0",
+  "version": "3.2.0-deprecated-button.1",
   "description": "",
   "author": "Miro",
   "source": "src/index.ts",
@@ -30,17 +30,9 @@
     "@react-aria/focus": "^3.10.0",
     "@react-aria/link": "^3.3.0",
     "@react-aria/utils": "^3.13.0",
-    "@react-types/button": "^3.5.0",
-    "@mirohq/design-system-primitive": "^1.1.2",
-    "@mirohq/design-system-styles": "^1.1.20",
-    "@mirohq/design-system-spinner": "^1.1.35",
-    "@mirohq/design-system-stitches": "^2.6.1",
-    "@mirohq/design-system-types": "^0.6.2",
-    "@mirohq/design-system-utils": "^0.15.0"
-  },
-  "devDependencies": {
-    "@types/lodash.capitalize": "^4.2.7",
-    "lodash.capitalize": "^3.0.0"
+    "@mirohq/design-system-stitches": "^2.6.14",
+    "@mirohq/design-system-spinner": "^1.1.48",
+    "@mirohq/design-system-primitive": "^1.1.2"
   },
   "scripts": {
     "build": "rollup -c ../../../rollup.config.js",