@mirohq/design-system-base-button 0.2.2 → 0.2.4

package/dist/main.js

@@ -3,7 +3,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var designSystemUtils = require('@mirohq/design-system-utils');
 var button = require('@react-aria/button');
 var interactions = require('@react-aria/interactions');
 var utils = require('@react-aria/utils');
@@ -187,14 +186,6 @@ const BaseButton = React__default["default"].forwardRef(
       hoverProps,
       focusPropsRing
     );
-    const formattedChildren = variant === "solid-prominent" ? designSystemUtils.addPropsToChildren(
-      children,
-      (child) => {
-        var _a;
-        return ((_a = child == null ? void 0 : child.type) == null ? void 0 : _a.displayName) === "Badge";
-      },
-      { inverted: true }
-    ) : children;
     return /* @__PURE__ */ React__default["default"].createElement(StyledBaseButton, {
       ...elementProps,
       variant,
@@ -210,7 +201,7 @@ const BaseButton = React__default["default"].forwardRef(
       href,
       target,
       rel: target === "_blank" ? `noopener noreferrer ${rel}` : rel
-    }, formattedChildren) : formattedChildren);
+    }, children) : children);
   }
 );
 

package/dist/main.js.map

@@ -1 +1 @@
-{"version":3,"file":"main.js","sources":["../src/base-button.styled.ts","../src/base-button.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\n// todo move to general focus styles (focus-small)\nconst focusFilled = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 2px var(--colors-blue-200), inset 0 0 0 2px var(--colors-blue-500), inset 0 0 0 3px var(--colors-white)`,\n    outline: 'none',\n  },\n}\n\nconst focusOutline = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 2px var(--colors-blue-200), inset 0 0 0 1px var(--colors-blue-500), inset 0 0 0 2px var(--colors-white)`,\n    outline: 'none',\n    borderColor: '$blue-500',\n  },\n}\n\nconst activeSelector = '&:active, &[data-pressed]'\n\nexport const StyledBaseButton = styled(Primitive.button, {\n  all: 'unset',\n  display: 'inline-flex',\n  alignItems: 'center',\n  boxSizing: 'border-box',\n  borderRadius: '$50',\n  cursor: 'pointer',\n\n  '&[disabled]': {\n    pointerEvents: 'none',\n  },\n\n  variants: {\n    variant: {\n      'solid-prominent': {\n        backgroundColor: '$background-primary-prominent',\n        color: '$icon-primary-inverted',\n        ...focusFilled,\n\n        '&:hover': {\n          backgroundColor: '$background-primary-prominent-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-primary-prominent-active',\n        },\n        '&[disabled]': {\n          backgroundColor: '$background-neutrals-disabled',\n          color: '$icon-neutrals-disabled',\n        },\n      },\n      'solid-subtle': {\n        backgroundColor: '$background-neutrals-subtle',\n        color: '$icon-neutrals',\n        ...focusFilled,\n\n        '&:hover': {\n          backgroundColor: '$background-neutrals-subtle-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-neutrals-subtle-active',\n        },\n        '&[disabled]': {\n          backgroundColor: '$background-neutrals-disabled',\n          color: '$icon-neutrals-disabled',\n        },\n      },\n      outline: {\n        backgroundColor: '$background-neutrals',\n        color: '$icon-neutrals',\n        border: '1px solid $border-neutrals',\n\n        '&:hover': {\n          backgroundColor: '$background-neutrals-subtle-hover',\n          borderColor: '$border-neutrals-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-neutrals-subtle-active',\n          borderColor: '$border-neutrals-active',\n        },\n        '&[disabled]': {\n          backgroundColor: '$background-neutrals-disabled',\n          color: '$icon-neutrals-disabled',\n          borderColor: '$border-neutrals-disabled',\n        },\n\n        // order is important because of borderColor\n        ...focusOutline,\n      },\n      ghost: {\n        color: '$icon-neutrals',\n        backgroundColor: 'transparent',\n        ...focusFilled,\n\n        '&:hover': {\n          backgroundColor: '$background-neutrals-subtle-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-neutrals-subtle-active',\n        },\n        '&[disabled]': {\n          color: '$icon-neutrals-disabled',\n        },\n      },\n    },\n    size: {\n      medium: {\n        height: '$8',\n        paddingX: '$50',\n      },\n      large: {\n        height: '$10',\n        paddingX: '$100',\n      },\n      'x-large': {\n        height: '$12',\n        paddingX: '$150',\n      },\n    },\n  },\n})\n\nexport type StyledBaseButtonProps = ComponentPropsWithRef<\n  typeof StyledBaseButton\n>\n","import React, { useRef } from 'react'\nimport type { ElementRef, ReactNode } from 'react'\nimport type { BadgeProps } from '@mirohq/design-system-badge'\nimport { addPropsToChildren } from '@mirohq/design-system-utils'\nimport { useButton } from '@react-aria/button'\nimport { useHover } from '@react-aria/interactions'\nimport { mergeProps } from '@react-aria/utils'\nimport { useLink } from '@react-aria/link'\nimport { useFocusRing } from '@react-aria/focus'\nimport type { HoverEvents, FocusEvents } from '@react-types/shared'\nimport type { AriaButtonProps } from '@react-types/button'\n\nimport { StyledBaseButton } from './base-button.styled'\nimport type { StyledBaseButtonProps } from './base-button.styled'\n\ntype ButtonPropsA11y = StyledBaseButtonProps & AriaButtonProps<'button'>\n\nexport interface BaseButtonProps\n  extends FocusEvents,\n    HoverEvents,\n    Omit<\n      ButtonPropsA11y,\n      | 'onClick'\n      | 'isDisabled'\n      | 'elementType'\n      | 'onBlur'\n      | 'onFocus'\n      | 'onPressUp'\n    > {\n  /**\n   * The content\n   */\n  children: ReactNode\n\n  /**\n   * Change the button style\n   */\n  variant?: StyledBaseButtonProps['variant']\n\n  /**\n   * Change the button size\n   */\n  size?: StyledBaseButtonProps['size']\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 BaseButton = React.forwardRef<\n  ElementRef<typeof StyledBaseButton>,\n  BaseButtonProps\n>(\n  (\n    {\n      variant,\n      size,\n      disabled = false,\n      href,\n      target,\n      rel,\n      children,\n      onClick,\n      asChild,\n      onHoverStart,\n      onHoverEnd,\n      onHoverChange,\n      onPress,\n      onPressStart,\n      onPressEnd,\n      onPressChange,\n      onFocus,\n      onBlur,\n      onFocusChange,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const asLink = href != null\n\n    const ref = useRef<HTMLButtonElement | HTMLAnchorElement>(null)\n    const refWithFallback = forwardRef ?? ref\n\n    const commonProps = {\n      isDisabled: disabled,\n      onPress: onPress ?? onClick,\n      onPressStart,\n      onPressEnd,\n      onPressChange,\n      onFocusChange,\n      onFocus,\n      onBlur,\n    }\n\n    const { buttonProps, isPressed } = useButton(\n      {\n        href,\n        // @ts-expect-error\n        allowFocusWhenDisabled: false,\n        ...commonProps,\n        ...restProps,\n      },\n      refWithFallback\n    )\n\n    const { linkProps } = useLink(\n      { ...commonProps, ...restProps },\n      // @ts-expect-error\n      refWithFallback\n    )\n    const tabIndexProp = disabled && {\n      tabIndex: -1,\n    }\n\n    const { isFocusVisible, focusProps: focusPropsRing } = useFocusRing()\n\n    const { hoverProps, isHovered } = useHover({\n      onHoverStart: e => onHoverStart?.(e),\n      onHoverEnd: e => onHoverEnd?.(e),\n      onHoverChange: e => onHoverChange?.(e),\n    })\n\n    const elementProps = mergeProps(\n      restProps,\n      asLink ? linkProps : buttonProps,\n      hoverProps,\n      focusPropsRing\n    )\n\n    const formattedChildren =\n      variant === 'solid-prominent'\n        ? addPropsToChildren<BadgeProps>(\n            children,\n            // @ts-expect-error\n            child => child?.type?.displayName === 'Badge',\n            { inverted: true }\n          )\n        : children\n\n    return (\n      <StyledBaseButton\n        {...elementProps}\n        variant={variant}\n        size={size}\n        disabled={disabled}\n        asChild={asLink || asChild}\n        {...tabIndexProp}\n        data-pressed={isPressed ? '' : undefined}\n        data-focused={isFocusVisible ? '' : undefined}\n        data-hovered={isHovered ? '' : 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            {formattedChildren}\n          </a>\n        ) : (\n          formattedChildren\n        )}\n      </StyledBaseButton>\n    )\n  }\n)\n"],"names":["styled","Primitive","React","useRef","useButton","useLink","useFocusRing","useHover","mergeProps","addPropsToChildren"],"mappings":"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"}
+{"version":3,"file":"main.js","sources":["../src/base-button.styled.ts","../src/base-button.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\n// todo move to general focus styles (focus-small)\nconst focusFilled = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 2px var(--colors-blue-200), inset 0 0 0 2px var(--colors-blue-500), inset 0 0 0 3px var(--colors-white)`,\n    outline: 'none',\n  },\n}\n\nconst focusOutline = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 2px var(--colors-blue-200), inset 0 0 0 1px var(--colors-blue-500), inset 0 0 0 2px var(--colors-white)`,\n    outline: 'none',\n    borderColor: '$blue-500',\n  },\n}\n\nconst activeSelector = '&:active, &[data-pressed]'\n\nexport const StyledBaseButton = styled(Primitive.button, {\n  all: 'unset',\n  display: 'inline-flex',\n  alignItems: 'center',\n  boxSizing: 'border-box',\n  borderRadius: '$50',\n  cursor: 'pointer',\n\n  '&[disabled]': {\n    pointerEvents: 'none',\n  },\n\n  variants: {\n    variant: {\n      'solid-prominent': {\n        backgroundColor: '$background-primary-prominent',\n        color: '$icon-primary-inverted',\n        ...focusFilled,\n\n        '&:hover': {\n          backgroundColor: '$background-primary-prominent-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-primary-prominent-active',\n        },\n        '&[disabled]': {\n          backgroundColor: '$background-neutrals-disabled',\n          color: '$icon-neutrals-disabled',\n        },\n      },\n      'solid-subtle': {\n        backgroundColor: '$background-neutrals-subtle',\n        color: '$icon-neutrals',\n        ...focusFilled,\n\n        '&:hover': {\n          backgroundColor: '$background-neutrals-subtle-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-neutrals-subtle-active',\n        },\n        '&[disabled]': {\n          backgroundColor: '$background-neutrals-disabled',\n          color: '$icon-neutrals-disabled',\n        },\n      },\n      outline: {\n        backgroundColor: '$background-neutrals',\n        color: '$icon-neutrals',\n        border: '1px solid $border-neutrals',\n\n        '&:hover': {\n          backgroundColor: '$background-neutrals-subtle-hover',\n          borderColor: '$border-neutrals-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-neutrals-subtle-active',\n          borderColor: '$border-neutrals-active',\n        },\n        '&[disabled]': {\n          backgroundColor: '$background-neutrals-disabled',\n          color: '$icon-neutrals-disabled',\n          borderColor: '$border-neutrals-disabled',\n        },\n\n        // order is important because of borderColor\n        ...focusOutline,\n      },\n      ghost: {\n        color: '$icon-neutrals',\n        backgroundColor: 'transparent',\n        ...focusFilled,\n\n        '&:hover': {\n          backgroundColor: '$background-neutrals-subtle-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-neutrals-subtle-active',\n        },\n        '&[disabled]': {\n          color: '$icon-neutrals-disabled',\n        },\n      },\n    },\n    size: {\n      medium: {\n        height: '$8',\n        paddingX: '$50',\n      },\n      large: {\n        height: '$10',\n        paddingX: '$100',\n      },\n      'x-large': {\n        height: '$12',\n        paddingX: '$150',\n      },\n    },\n  },\n})\n\nexport type StyledBaseButtonProps = ComponentPropsWithRef<\n  typeof StyledBaseButton\n>\n","import React, { useRef } from 'react'\nimport type { ElementRef, ReactNode } from 'react'\nimport { useButton } from '@react-aria/button'\nimport { useHover } from '@react-aria/interactions'\nimport { mergeProps } from '@react-aria/utils'\nimport { useLink } from '@react-aria/link'\nimport { useFocusRing } from '@react-aria/focus'\nimport type { HoverEvents, FocusEvents } from '@react-types/shared'\nimport type { AriaButtonProps } from '@react-types/button'\n\nimport { StyledBaseButton } from './base-button.styled'\nimport type { StyledBaseButtonProps } from './base-button.styled'\n\ntype ButtonPropsA11y = StyledBaseButtonProps & AriaButtonProps<'button'>\n\nexport interface BaseButtonProps\n  extends FocusEvents,\n    HoverEvents,\n    Omit<\n      ButtonPropsA11y,\n      | 'onClick'\n      | 'isDisabled'\n      | 'elementType'\n      | 'onBlur'\n      | 'onFocus'\n      | 'onPressUp'\n    > {\n  /**\n   * The content\n   */\n  children: ReactNode\n\n  /**\n   * Change the button style\n   */\n  variant?: StyledBaseButtonProps['variant']\n\n  /**\n   * Change the button size\n   */\n  size?: StyledBaseButtonProps['size']\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 BaseButton = React.forwardRef<\n  ElementRef<typeof StyledBaseButton>,\n  BaseButtonProps\n>(\n  (\n    {\n      variant,\n      size,\n      disabled = false,\n      href,\n      target,\n      rel,\n      children,\n      onClick,\n      asChild,\n      onHoverStart,\n      onHoverEnd,\n      onHoverChange,\n      onPress,\n      onPressStart,\n      onPressEnd,\n      onPressChange,\n      onFocus,\n      onBlur,\n      onFocusChange,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const asLink = href != null\n\n    const ref = useRef<HTMLButtonElement | HTMLAnchorElement>(null)\n    const refWithFallback = forwardRef ?? ref\n\n    const commonProps = {\n      isDisabled: disabled,\n      onPress: onPress ?? onClick,\n      onPressStart,\n      onPressEnd,\n      onPressChange,\n      onFocusChange,\n      onFocus,\n      onBlur,\n    }\n\n    const { buttonProps, isPressed } = useButton(\n      {\n        href,\n        // @ts-expect-error\n        allowFocusWhenDisabled: false,\n        ...commonProps,\n        ...restProps,\n      },\n      refWithFallback\n    )\n\n    const { linkProps } = useLink(\n      { ...commonProps, ...restProps },\n      // @ts-expect-error\n      refWithFallback\n    )\n    const tabIndexProp = disabled && {\n      tabIndex: -1,\n    }\n\n    const { isFocusVisible, focusProps: focusPropsRing } = useFocusRing()\n\n    const { hoverProps, isHovered } = useHover({\n      onHoverStart: e => onHoverStart?.(e),\n      onHoverEnd: e => onHoverEnd?.(e),\n      onHoverChange: e => onHoverChange?.(e),\n    })\n\n    const elementProps = mergeProps(\n      restProps,\n      asLink ? linkProps : buttonProps,\n      hoverProps,\n      focusPropsRing\n    )\n\n    return (\n      <StyledBaseButton\n        {...elementProps}\n        variant={variant}\n        size={size}\n        disabled={disabled}\n        asChild={asLink || asChild}\n        {...tabIndexProp}\n        data-pressed={isPressed ? '' : undefined}\n        data-focused={isFocusVisible ? '' : undefined}\n        data-hovered={isHovered ? '' : 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            {children}\n          </a>\n        ) : (\n          children\n        )}\n      </StyledBaseButton>\n    )\n  }\n)\n"],"names":["styled","Primitive","React","useRef","useButton","useLink","useFocusRing","useHover","mergeProps"],"mappings":"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"}

package/dist/module.js

@@ -1,5 +1,4 @@
 import React, { useRef } from 'react';
-import { addPropsToChildren } from '@mirohq/design-system-utils';
 import { useButton } from '@react-aria/button';
 import { useHover } from '@react-aria/interactions';
 import { mergeProps } from '@react-aria/utils';
@@ -179,14 +178,6 @@ const BaseButton = React.forwardRef(
       hoverProps,
       focusPropsRing
     );
-    const formattedChildren = variant === "solid-prominent" ? addPropsToChildren(
-      children,
-      (child) => {
-        var _a;
-        return ((_a = child == null ? void 0 : child.type) == null ? void 0 : _a.displayName) === "Badge";
-      },
-      { inverted: true }
-    ) : children;
     return /* @__PURE__ */ React.createElement(StyledBaseButton, {
       ...elementProps,
       variant,
@@ -202,7 +193,7 @@ const BaseButton = React.forwardRef(
       href,
       target,
       rel: target === "_blank" ? `noopener noreferrer ${rel}` : rel
-    }, formattedChildren) : formattedChildren);
+    }, children) : children);
   }
 );
 

package/dist/module.js.map

@@ -1 +1 @@
-{"version":3,"file":"module.js","sources":["../src/base-button.styled.ts","../src/base-button.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\n// todo move to general focus styles (focus-small)\nconst focusFilled = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 2px var(--colors-blue-200), inset 0 0 0 2px var(--colors-blue-500), inset 0 0 0 3px var(--colors-white)`,\n    outline: 'none',\n  },\n}\n\nconst focusOutline = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 2px var(--colors-blue-200), inset 0 0 0 1px var(--colors-blue-500), inset 0 0 0 2px var(--colors-white)`,\n    outline: 'none',\n    borderColor: '$blue-500',\n  },\n}\n\nconst activeSelector = '&:active, &[data-pressed]'\n\nexport const StyledBaseButton = styled(Primitive.button, {\n  all: 'unset',\n  display: 'inline-flex',\n  alignItems: 'center',\n  boxSizing: 'border-box',\n  borderRadius: '$50',\n  cursor: 'pointer',\n\n  '&[disabled]': {\n    pointerEvents: 'none',\n  },\n\n  variants: {\n    variant: {\n      'solid-prominent': {\n        backgroundColor: '$background-primary-prominent',\n        color: '$icon-primary-inverted',\n        ...focusFilled,\n\n        '&:hover': {\n          backgroundColor: '$background-primary-prominent-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-primary-prominent-active',\n        },\n        '&[disabled]': {\n          backgroundColor: '$background-neutrals-disabled',\n          color: '$icon-neutrals-disabled',\n        },\n      },\n      'solid-subtle': {\n        backgroundColor: '$background-neutrals-subtle',\n        color: '$icon-neutrals',\n        ...focusFilled,\n\n        '&:hover': {\n          backgroundColor: '$background-neutrals-subtle-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-neutrals-subtle-active',\n        },\n        '&[disabled]': {\n          backgroundColor: '$background-neutrals-disabled',\n          color: '$icon-neutrals-disabled',\n        },\n      },\n      outline: {\n        backgroundColor: '$background-neutrals',\n        color: '$icon-neutrals',\n        border: '1px solid $border-neutrals',\n\n        '&:hover': {\n          backgroundColor: '$background-neutrals-subtle-hover',\n          borderColor: '$border-neutrals-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-neutrals-subtle-active',\n          borderColor: '$border-neutrals-active',\n        },\n        '&[disabled]': {\n          backgroundColor: '$background-neutrals-disabled',\n          color: '$icon-neutrals-disabled',\n          borderColor: '$border-neutrals-disabled',\n        },\n\n        // order is important because of borderColor\n        ...focusOutline,\n      },\n      ghost: {\n        color: '$icon-neutrals',\n        backgroundColor: 'transparent',\n        ...focusFilled,\n\n        '&:hover': {\n          backgroundColor: '$background-neutrals-subtle-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-neutrals-subtle-active',\n        },\n        '&[disabled]': {\n          color: '$icon-neutrals-disabled',\n        },\n      },\n    },\n    size: {\n      medium: {\n        height: '$8',\n        paddingX: '$50',\n      },\n      large: {\n        height: '$10',\n        paddingX: '$100',\n      },\n      'x-large': {\n        height: '$12',\n        paddingX: '$150',\n      },\n    },\n  },\n})\n\nexport type StyledBaseButtonProps = ComponentPropsWithRef<\n  typeof StyledBaseButton\n>\n","import React, { useRef } from 'react'\nimport type { ElementRef, ReactNode } from 'react'\nimport type { BadgeProps } from '@mirohq/design-system-badge'\nimport { addPropsToChildren } from '@mirohq/design-system-utils'\nimport { useButton } from '@react-aria/button'\nimport { useHover } from '@react-aria/interactions'\nimport { mergeProps } from '@react-aria/utils'\nimport { useLink } from '@react-aria/link'\nimport { useFocusRing } from '@react-aria/focus'\nimport type { HoverEvents, FocusEvents } from '@react-types/shared'\nimport type { AriaButtonProps } from '@react-types/button'\n\nimport { StyledBaseButton } from './base-button.styled'\nimport type { StyledBaseButtonProps } from './base-button.styled'\n\ntype ButtonPropsA11y = StyledBaseButtonProps & AriaButtonProps<'button'>\n\nexport interface BaseButtonProps\n  extends FocusEvents,\n    HoverEvents,\n    Omit<\n      ButtonPropsA11y,\n      | 'onClick'\n      | 'isDisabled'\n      | 'elementType'\n      | 'onBlur'\n      | 'onFocus'\n      | 'onPressUp'\n    > {\n  /**\n   * The content\n   */\n  children: ReactNode\n\n  /**\n   * Change the button style\n   */\n  variant?: StyledBaseButtonProps['variant']\n\n  /**\n   * Change the button size\n   */\n  size?: StyledBaseButtonProps['size']\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 BaseButton = React.forwardRef<\n  ElementRef<typeof StyledBaseButton>,\n  BaseButtonProps\n>(\n  (\n    {\n      variant,\n      size,\n      disabled = false,\n      href,\n      target,\n      rel,\n      children,\n      onClick,\n      asChild,\n      onHoverStart,\n      onHoverEnd,\n      onHoverChange,\n      onPress,\n      onPressStart,\n      onPressEnd,\n      onPressChange,\n      onFocus,\n      onBlur,\n      onFocusChange,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const asLink = href != null\n\n    const ref = useRef<HTMLButtonElement | HTMLAnchorElement>(null)\n    const refWithFallback = forwardRef ?? ref\n\n    const commonProps = {\n      isDisabled: disabled,\n      onPress: onPress ?? onClick,\n      onPressStart,\n      onPressEnd,\n      onPressChange,\n      onFocusChange,\n      onFocus,\n      onBlur,\n    }\n\n    const { buttonProps, isPressed } = useButton(\n      {\n        href,\n        // @ts-expect-error\n        allowFocusWhenDisabled: false,\n        ...commonProps,\n        ...restProps,\n      },\n      refWithFallback\n    )\n\n    const { linkProps } = useLink(\n      { ...commonProps, ...restProps },\n      // @ts-expect-error\n      refWithFallback\n    )\n    const tabIndexProp = disabled && {\n      tabIndex: -1,\n    }\n\n    const { isFocusVisible, focusProps: focusPropsRing } = useFocusRing()\n\n    const { hoverProps, isHovered } = useHover({\n      onHoverStart: e => onHoverStart?.(e),\n      onHoverEnd: e => onHoverEnd?.(e),\n      onHoverChange: e => onHoverChange?.(e),\n    })\n\n    const elementProps = mergeProps(\n      restProps,\n      asLink ? linkProps : buttonProps,\n      hoverProps,\n      focusPropsRing\n    )\n\n    const formattedChildren =\n      variant === 'solid-prominent'\n        ? addPropsToChildren<BadgeProps>(\n            children,\n            // @ts-expect-error\n            child => child?.type?.displayName === 'Badge',\n            { inverted: true }\n          )\n        : children\n\n    return (\n      <StyledBaseButton\n        {...elementProps}\n        variant={variant}\n        size={size}\n        disabled={disabled}\n        asChild={asLink || asChild}\n        {...tabIndexProp}\n        data-pressed={isPressed ? '' : undefined}\n        data-focused={isFocusVisible ? '' : undefined}\n        data-hovered={isHovered ? '' : 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            {formattedChildren}\n          </a>\n        ) : (\n          formattedChildren\n        )}\n      </StyledBaseButton>\n    )\n  }\n)\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"module.js","sources":["../src/base-button.styled.ts","../src/base-button.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\n// todo move to general focus styles (focus-small)\nconst focusFilled = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 2px var(--colors-blue-200), inset 0 0 0 2px var(--colors-blue-500), inset 0 0 0 3px var(--colors-white)`,\n    outline: 'none',\n  },\n}\n\nconst focusOutline = {\n  '&[data-focused]': {\n    boxShadow: `0 0 0 2px var(--colors-blue-200), inset 0 0 0 1px var(--colors-blue-500), inset 0 0 0 2px var(--colors-white)`,\n    outline: 'none',\n    borderColor: '$blue-500',\n  },\n}\n\nconst activeSelector = '&:active, &[data-pressed]'\n\nexport const StyledBaseButton = styled(Primitive.button, {\n  all: 'unset',\n  display: 'inline-flex',\n  alignItems: 'center',\n  boxSizing: 'border-box',\n  borderRadius: '$50',\n  cursor: 'pointer',\n\n  '&[disabled]': {\n    pointerEvents: 'none',\n  },\n\n  variants: {\n    variant: {\n      'solid-prominent': {\n        backgroundColor: '$background-primary-prominent',\n        color: '$icon-primary-inverted',\n        ...focusFilled,\n\n        '&:hover': {\n          backgroundColor: '$background-primary-prominent-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-primary-prominent-active',\n        },\n        '&[disabled]': {\n          backgroundColor: '$background-neutrals-disabled',\n          color: '$icon-neutrals-disabled',\n        },\n      },\n      'solid-subtle': {\n        backgroundColor: '$background-neutrals-subtle',\n        color: '$icon-neutrals',\n        ...focusFilled,\n\n        '&:hover': {\n          backgroundColor: '$background-neutrals-subtle-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-neutrals-subtle-active',\n        },\n        '&[disabled]': {\n          backgroundColor: '$background-neutrals-disabled',\n          color: '$icon-neutrals-disabled',\n        },\n      },\n      outline: {\n        backgroundColor: '$background-neutrals',\n        color: '$icon-neutrals',\n        border: '1px solid $border-neutrals',\n\n        '&:hover': {\n          backgroundColor: '$background-neutrals-subtle-hover',\n          borderColor: '$border-neutrals-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-neutrals-subtle-active',\n          borderColor: '$border-neutrals-active',\n        },\n        '&[disabled]': {\n          backgroundColor: '$background-neutrals-disabled',\n          color: '$icon-neutrals-disabled',\n          borderColor: '$border-neutrals-disabled',\n        },\n\n        // order is important because of borderColor\n        ...focusOutline,\n      },\n      ghost: {\n        color: '$icon-neutrals',\n        backgroundColor: 'transparent',\n        ...focusFilled,\n\n        '&:hover': {\n          backgroundColor: '$background-neutrals-subtle-hover',\n        },\n        [activeSelector]: {\n          backgroundColor: '$background-neutrals-subtle-active',\n        },\n        '&[disabled]': {\n          color: '$icon-neutrals-disabled',\n        },\n      },\n    },\n    size: {\n      medium: {\n        height: '$8',\n        paddingX: '$50',\n      },\n      large: {\n        height: '$10',\n        paddingX: '$100',\n      },\n      'x-large': {\n        height: '$12',\n        paddingX: '$150',\n      },\n    },\n  },\n})\n\nexport type StyledBaseButtonProps = ComponentPropsWithRef<\n  typeof StyledBaseButton\n>\n","import React, { useRef } from 'react'\nimport type { ElementRef, ReactNode } from 'react'\nimport { useButton } from '@react-aria/button'\nimport { useHover } from '@react-aria/interactions'\nimport { mergeProps } from '@react-aria/utils'\nimport { useLink } from '@react-aria/link'\nimport { useFocusRing } from '@react-aria/focus'\nimport type { HoverEvents, FocusEvents } from '@react-types/shared'\nimport type { AriaButtonProps } from '@react-types/button'\n\nimport { StyledBaseButton } from './base-button.styled'\nimport type { StyledBaseButtonProps } from './base-button.styled'\n\ntype ButtonPropsA11y = StyledBaseButtonProps & AriaButtonProps<'button'>\n\nexport interface BaseButtonProps\n  extends FocusEvents,\n    HoverEvents,\n    Omit<\n      ButtonPropsA11y,\n      | 'onClick'\n      | 'isDisabled'\n      | 'elementType'\n      | 'onBlur'\n      | 'onFocus'\n      | 'onPressUp'\n    > {\n  /**\n   * The content\n   */\n  children: ReactNode\n\n  /**\n   * Change the button style\n   */\n  variant?: StyledBaseButtonProps['variant']\n\n  /**\n   * Change the button size\n   */\n  size?: StyledBaseButtonProps['size']\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 BaseButton = React.forwardRef<\n  ElementRef<typeof StyledBaseButton>,\n  BaseButtonProps\n>(\n  (\n    {\n      variant,\n      size,\n      disabled = false,\n      href,\n      target,\n      rel,\n      children,\n      onClick,\n      asChild,\n      onHoverStart,\n      onHoverEnd,\n      onHoverChange,\n      onPress,\n      onPressStart,\n      onPressEnd,\n      onPressChange,\n      onFocus,\n      onBlur,\n      onFocusChange,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const asLink = href != null\n\n    const ref = useRef<HTMLButtonElement | HTMLAnchorElement>(null)\n    const refWithFallback = forwardRef ?? ref\n\n    const commonProps = {\n      isDisabled: disabled,\n      onPress: onPress ?? onClick,\n      onPressStart,\n      onPressEnd,\n      onPressChange,\n      onFocusChange,\n      onFocus,\n      onBlur,\n    }\n\n    const { buttonProps, isPressed } = useButton(\n      {\n        href,\n        // @ts-expect-error\n        allowFocusWhenDisabled: false,\n        ...commonProps,\n        ...restProps,\n      },\n      refWithFallback\n    )\n\n    const { linkProps } = useLink(\n      { ...commonProps, ...restProps },\n      // @ts-expect-error\n      refWithFallback\n    )\n    const tabIndexProp = disabled && {\n      tabIndex: -1,\n    }\n\n    const { isFocusVisible, focusProps: focusPropsRing } = useFocusRing()\n\n    const { hoverProps, isHovered } = useHover({\n      onHoverStart: e => onHoverStart?.(e),\n      onHoverEnd: e => onHoverEnd?.(e),\n      onHoverChange: e => onHoverChange?.(e),\n    })\n\n    const elementProps = mergeProps(\n      restProps,\n      asLink ? linkProps : buttonProps,\n      hoverProps,\n      focusPropsRing\n    )\n\n    return (\n      <StyledBaseButton\n        {...elementProps}\n        variant={variant}\n        size={size}\n        disabled={disabled}\n        asChild={asLink || asChild}\n        {...tabIndexProp}\n        data-pressed={isPressed ? '' : undefined}\n        data-focused={isFocusVisible ? '' : undefined}\n        data-hovered={isHovered ? '' : 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            {children}\n          </a>\n        ) : (\n          children\n        )}\n      </StyledBaseButton>\n    )\n  }\n)\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mirohq/design-system-base-button",
-  "version": "0.2.2",
+  "version": "0.2.4",
   "description": "",
   "author": "Miro",
   "source": "src/index.ts",
@@ -33,10 +33,8 @@
     "@react-aria/utils": "^3.13.0",
     "@react-types/button": "^3.5.0",
     "@react-types/shared": "^3.16.0",
-    "@mirohq/design-system-badge": "^0.1.2",
     "@mirohq/design-system-primitive": "^1.0.4",
-    "@mirohq/design-system-stitches": "^2.0.11",
-    "@mirohq/design-system-utils": "^0.11.0"
+    "@mirohq/design-system-stitches": "^2.0.11"
   },
   "devDependencies": {
     "@mirohq/design-system-icons": "^0.3.1"