@mirohq/design-system-toolbar 3.3.24 → 3.3.26

package/dist/main.js

@@ -162,10 +162,10 @@ const sharedStyles = {
     },
     '&:not([aria-disabled="true"])': {
       "&[data-hovered]": {
-        backgroundColor: "$background-interactive-surface-hover"
+        backgroundColor: "$toolbar-item-background-hover"
       },
       "&:active, &[data-pressed]": {
-        backgroundColor: "$background-interactive-surface-pressed"
+        backgroundColor: "$toolbar-item-background-pressed"
       }
     }
   }
@@ -180,7 +180,7 @@ const StyledIcon = designSystemStitches.styled(BaseItem, {
   variants: {
     active: {
       true: {
-        backgroundColor: "$background-interactive-secondary-selected",
+        backgroundColor: "$toolbar-item-background-selected",
         color: "$icon-on-interactive-selected"
       },
       false: {
@@ -297,7 +297,7 @@ const StyledItem = designSystemStitches.styled(BaseItem, {
   variants: {
     active: {
       true: {
-        backgroundColor: "$background-interactive-secondary-selected",
+        backgroundColor: "$toolbar-item-background-selected",
         color: "$text-on-interactive-selected"
       },
       false: {

package/dist/main.js.map

@@ -1 +1 @@
-{"version":3,"file":"main.js","sources":["../src/toolbar.styled.ts","../src/partials/base-item.styled.ts","../src/partials/base-item.tsx","../src/styles.ts","../src/partials/icon.styled.tsx","../src/hooks/use-toolbar-context.tsx","../src/partials/icon.tsx","../src/partials/separator.styled.ts","../src/partials/separator.tsx","../src/partials/link.styled.tsx","../src/partials/link.tsx","../src/partials/item.styled.tsx","../src/partials/item.tsx","../src/hooks/use-toolbar-keyboard-navigation.ts","../src/toolbar.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Root } from '@radix-ui/react-toolbar'\n\nexport const StyledToolbar = styled(Root, {\n  all: 'unset',\n  display: 'flex',\n  boxSizing: 'border-box',\n  alignItems: 'center',\n  maxWidth: '100%',\n  gap: '$50',\n\n  variants: {\n    variant: {\n      floating: {\n        backgroundColor: '$background-layout',\n        boxShadow: '$elevation-100',\n        border: '0.5px solid $border-subtle',\n        borderRadius: '$toolbar',\n        padding: '$50',\n      },\n      flat: {},\n    },\n    size: {\n      small: {\n        '&[data-orientation=\"vertical\"]': {\n          flexDirection: 'column',\n          width: '$10',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '$10',\n        },\n      },\n      medium: {\n        '&[data-orientation=\"vertical\"]': {\n          flexDirection: 'column',\n          width: '$12',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '$12',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n\nexport type StyledToolbarProps = StrictComponentProps<typeof StyledToolbar>\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport * as RadixToolbar from '@radix-ui/react-toolbar'\n\nexport const sizes = {\n  small: '$8',\n  medium: '$10',\n} as const\n\nexport const StyledBaseItem = styled(RadixToolbar.Button, {\n  boxSizing: 'border-box',\n  cursor: 'pointer',\n  userSelect: 'none',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  flexShrink: 0,\n\n  variants: {\n    size: {\n      small: {\n        height: sizes.small,\n        fontSize: '$175',\n      },\n      medium: {\n        height: sizes.medium,\n        fontSize: '$200',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n\nexport type StyledBaseItemProps = StrictComponentProps<typeof StyledBaseItem>\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { useHover } from '@react-aria/interactions'\nimport type { HoverEvents } from '@react-types/shared'\nimport { mergeProps } from '@react-aria/utils'\nimport { usePress } from '@mirohq/design-system-use-press'\nimport { booleanify } from '@mirohq/design-system-utils'\nimport type { PressEvents } from '@mirohq/design-system-use-press'\nimport { useAriaDisabled } from '@mirohq/design-system-use-aria-disabled'\n\nimport { StyledBaseItem } from './base-item.styled'\nimport type { StyledBaseItemProps } from './base-item.styled'\nimport type { ToolbarSize } from '../types'\n\nexport interface BaseItemProps\n  extends StyledBaseItemProps,\n    HoverEvents,\n    PressEvents {\n  disabled?: boolean\n  size?: ToolbarSize\n}\n\nexport const BaseItem = React.forwardRef<\n  ElementRef<typeof StyledBaseItem>,\n  BaseItemProps\n>(\n  (\n    {\n      disabled = false,\n      'aria-disabled': ariaDisabled,\n      asChild,\n      size,\n      onHoverStart,\n      onHoverEnd,\n      onHoverChange,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const elementProps = useAriaDisabled(\n      {\n        ...restProps,\n        ariaDisabled,\n      },\n      { allowArrows: true }\n    )\n\n    const { pressProps } = usePress({\n      preventFocusOnPress: 'auto',\n      disabled: disabled || booleanify(ariaDisabled),\n      ...elementProps,\n    })\n\n    const { hoverProps, isHovered } = useHover({\n      onHoverStart,\n      onHoverEnd,\n      onHoverChange,\n    })\n\n    return (\n      <StyledBaseItem\n        {...mergeProps(pressProps, hoverProps)}\n        data-hovered={isHovered ? '' : undefined}\n        asChild={asChild}\n        size={size}\n        disabled={disabled}\n        aria-disabled={booleanify(ariaDisabled) ? 'true' : ariaDisabled}\n        ref={forwardRef}\n      />\n    )\n  }\n)\n","import { focus } from '@mirohq/design-system-styles'\n\nexport const disabledSelector = '&[disabled], &[aria-disabled=\"true\"]'\n\nexport const sharedStyles = {\n  base: {\n    backgroundColor: '$transparent',\n    borderRadius: '$toolbar-item',\n    border: 'none',\n    ...focus.css({\n      boxShadow: '$focus',\n    }),\n    '&[disabled]': {\n      pointerEvents: 'none',\n    },\n    '&:not([aria-disabled=\"true\"])': {\n      '&[data-hovered]': {\n        backgroundColor: '$background-interactive-surface-hover',\n      },\n\n      '&:active, &[data-pressed]': {\n        backgroundColor: '$background-interactive-surface-pressed',\n      },\n    },\n  },\n}\n","import { styled } from '@mirohq/design-system-stitches'\nimport { styles as baseIconStyles } from '@mirohq/design-system-base-icon'\n\nimport { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\nimport { sizes } from './base-item.styled'\n\nconst iconSelector = '& svg, & img'\n\nexport const StyledIcon = styled(BaseItem, {\n  padding: 0,\n  font: 'unset',\n  color: '$icon-default',\n  ...sharedStyles.base,\n  variants: {\n    active: {\n      true: {\n        backgroundColor: '$background-interactive-secondary-selected',\n        color: '$icon-on-interactive-selected',\n      },\n      false: {\n        [disabledSelector]: {\n          pointerEvents: 'none',\n          color: '$icon-disabled',\n        },\n      },\n    },\n    size: {\n      small: {\n        width: sizes.small,\n        height: sizes.small,\n        [iconSelector]: {\n          ...baseIconStyles.size.small,\n        },\n      },\n      medium: {\n        width: sizes.medium,\n        height: sizes.medium,\n        [iconSelector]: {\n          ...baseIconStyles.size.medium,\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n","import { createContext, useContext } from 'react'\nimport type { ReactNode } from 'react'\n\nimport type { ToolbarSize } from '../types'\n\ninterface ToolbarContextProps {\n  size: ToolbarSize\n}\n\nexport interface ToolbarProviderProps {\n  children?: ReactNode\n  size?: ToolbarSize\n}\n\nconst ToolbarContext = createContext<ToolbarContextProps>({\n  size: 'medium',\n})\n\nexport const ToolbarProvider = ({\n  children,\n  size = 'medium',\n}: ToolbarProviderProps): JSX.Element => (\n  <ToolbarContext.Provider value={{ size }}>{children}</ToolbarContext.Provider>\n)\n\nexport const useToolbarContext = (): ToolbarContextProps =>\n  useContext(ToolbarContext)\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { StyledIcon } from './icon.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\nexport interface IconProps extends BaseItemProps {\n  /**\n   * Renders icon in enabled/toggled state.\n   * @default false\n   */\n  active?: boolean\n}\n\nexport const Icon = React.forwardRef<ElementRef<typeof StyledIcon>, IconProps>(\n  ({ active = false, ...restProps }, forwardRef) => {\n    const { size } = useToolbarContext()\n\n    return (\n      <StyledIcon {...restProps} active={active} size={size} ref={forwardRef} />\n    )\n  }\n)\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Separator } from '@radix-ui/react-toolbar'\n\nexport const StyledSeparator = styled(Separator, {\n  all: 'unset',\n  display: 'block',\n  boxSizing: 'border-box',\n  backgroundColor: '$border-subtle',\n\n  variants: {\n    size: {\n      small: {\n        '&[data-orientation=\"vertical\"]': {\n          width: '1px',\n          height: '$5',\n          margin: '0 $50',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '1px',\n          width: '$5',\n          margin: '$50 0',\n        },\n      },\n      medium: {\n        '&[data-orientation=\"vertical\"]': {\n          width: '1px',\n          height: '$6',\n          margin: '0 $50',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '1px',\n          width: '$6',\n          margin: '$50 0',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n\nexport type StyledSeparatorProps = StrictComponentProps<typeof StyledSeparator>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { StyledSeparatorProps } from './separator.styled'\nimport { StyledSeparator } from './separator.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\nexport interface SeparatorProps extends StyledSeparatorProps {}\n\nexport const Separator = React.forwardRef<\n  ElementRef<typeof StyledSeparator>,\n  SeparatorProps\n>((props, forwardRef) => {\n  const { size } = useToolbarContext()\n\n  return <StyledSeparator {...props} size={size} ref={forwardRef} />\n})\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\n\nexport const StyledLink = styled(BaseItem, {\n  paddingX: '$150',\n  color: '$text-interactive-primary',\n  textDecoration: 'underline solid',\n  textDecorationThickness: '1px',\n  textUnderlineOffset: '4px',\n  outline: 'none',\n  ...sharedStyles.base,\n\n  [disabledSelector]: {\n    pointerEvents: 'none',\n    color: '$text-disabled',\n  },\n})\n","import React from 'react'\nimport type { ElementRef, AnchorHTMLAttributes } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { StyledLink } from './link.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\ntype ItemPropsWithAnchor = Omit<BaseItemProps, 'ref'> &\n  AnchorHTMLAttributes<typeof StyledLink>\nexport interface LinkProps extends ItemPropsWithAnchor {}\n\nexport const Link = React.forwardRef<ElementRef<'a'>, LinkProps>(\n  ({ children, href, ...restProps }, forwardRef) => {\n    const { size } = useToolbarContext()\n\n    return (\n      <StyledLink {...restProps} size={size} asChild>\n        <a href={href} ref={forwardRef}>\n          {children}\n        </a>\n      </StyledLink>\n    )\n  }\n)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\n\nexport const StyledItem = styled(BaseItem, {\n  ...sharedStyles.base,\n  variants: {\n    active: {\n      true: {\n        backgroundColor: '$background-interactive-secondary-selected',\n        color: '$text-on-interactive-selected',\n      },\n      false: {\n        [disabledSelector]: {\n          pointerEvents: 'none',\n          color: '$text-disabled',\n        },\n      },\n    },\n  },\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { BaseItem } from './base-item'\nimport { StyledItem } from './item.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\nexport interface ItemProps extends BaseItemProps {\n  /**\n   * It's applied by default when using with asChild attribute.\n   * You can still combine default Item styles with your own component by\n   * setting this prop to false.\n   * Note: Must be used together with asChild\n   * @default true\n   */\n  unstyled?: boolean\n\n  /**\n   * Renders item in enabled/toggled state.\n   * @default false\n   */\n  active?: boolean\n}\n\nexport const Item = React.forwardRef<ElementRef<typeof StyledItem>, ItemProps>(\n  ({ active = false, unstyled = true, asChild, ...restProps }, forwardRef) => {\n    const { size } = useToolbarContext()\n    const shouldRenderUnstyled = asChild === true ? unstyled : false\n\n    if (shouldRenderUnstyled) {\n      return <BaseItem {...restProps} asChild={asChild} ref={forwardRef} />\n    }\n\n    return (\n      <StyledItem\n        {...restProps}\n        asChild={asChild}\n        active={active}\n        size={size}\n        ref={forwardRef}\n      />\n    )\n  }\n)\n","import { useCallback } from 'react'\nimport type { KeyboardEvent } from 'react'\nimport { useDirection } from '@radix-ui/react-direction'\n\ninterface UseToolbarKeyboardNavigationProps {\n  orientation?: 'horizontal' | 'vertical'\n  dir?: 'ltr' | 'rtl'\n  loop?: boolean\n  onKeyDown?: (event: KeyboardEvent<HTMLDivElement>) => void\n}\n\n/**\n * Custom keyboard navigation for Radix Toolbar that allows navigation to aria-disabled items.\n *\n * By default, Radix UI Toolbar skips items with aria-disabled=\"true\" during keyboard navigation.\n * This hook intercepts arrow key events and manually handles focus management when aria-disabled\n * items are involved, while delegating to Radix for normal navigation.\n */\nexport const useToolbarKeyboardNavigation = ({\n  orientation = 'horizontal',\n  dir,\n  loop = true,\n  onKeyDown,\n}: UseToolbarKeyboardNavigationProps): ((\n  event: KeyboardEvent<HTMLDivElement>\n) => void) => {\n  const localDir = useDirection(dir ?? 'ltr')\n\n  return useCallback(\n    (event: KeyboardEvent<HTMLDivElement>) => {\n      const { key, currentTarget } = event\n      const isHorizontal = orientation === 'horizontal'\n      const isRTL = localDir === 'rtl'\n\n      const isForward =\n        (isHorizontal && key === (isRTL ? 'ArrowLeft' : 'ArrowRight')) ||\n        (!isHorizontal && key === 'ArrowDown')\n\n      const isBackward =\n        (isHorizontal && key === (isRTL ? 'ArrowRight' : 'ArrowLeft')) ||\n        (!isHorizontal && key === 'ArrowUp')\n\n      if (!isForward && !isBackward) {\n        onKeyDown?.(event)\n        return\n      }\n\n      // Find all navigable items (using Radix's collection attribute)\n      const items = Array.from(\n        currentTarget.querySelectorAll('[data-radix-collection-item]')\n      ).filter(item => !item.hasAttribute('disabled')) as HTMLElement[]\n\n      // Find currently focused item\n      const currentIndex = items.findIndex(item =>\n        item.contains(document.activeElement)\n      )\n\n      if (items.length === 0 || currentIndex === -1) {\n        return onKeyDown?.(event)\n      }\n\n      // Calculate next item index\n      let nextIndex: number\n      if (isForward) {\n        nextIndex = currentIndex + 1\n        if (nextIndex >= items.length) {\n          nextIndex = loop ? 0 : currentIndex\n        }\n      } else {\n        nextIndex = currentIndex - 1\n        if (nextIndex < 0) {\n          nextIndex = loop ? items.length - 1 : currentIndex\n        }\n      }\n\n      // Check if aria-disabled items are involved\n      const currentIsAriaDisabled =\n        items[currentIndex]?.getAttribute('aria-disabled') === 'true'\n      const nextIsAriaDisabled =\n        items[nextIndex]?.getAttribute('aria-disabled') === 'true'\n\n      // Only override Radix if aria-disabled items are involved\n      // Otherwise, let Radix handle it with all their edge cases and optimizations\n      if (!currentIsAriaDisabled && !nextIsAriaDisabled) {\n        onKeyDown?.(event)\n        return\n      }\n\n      // Take control: prevent Radix's handler and manually move focus\n      event.preventDefault()\n      event.stopPropagation()\n\n      if (nextIndex !== currentIndex) {\n        items[nextIndex]?.focus()\n      }\n\n      onKeyDown?.(event)\n    },\n    [orientation, localDir, loop, onKeyDown]\n  )\n}\n","import React from 'react'\nimport type { ElementRef, ForwardRefExoticComponent } from 'react'\n\nimport type { StyledToolbarProps } from './toolbar.styled'\nimport { StyledToolbar } from './toolbar.styled'\nimport { Icon } from './partials/icon'\nimport { Separator } from './partials/separator'\nimport { Link } from './partials/link'\nimport { Item } from './partials/item'\nimport { useToolbarKeyboardNavigation } from './hooks/use-toolbar-keyboard-navigation'\nimport { ToolbarProvider } from './hooks/use-toolbar-context'\nimport type { ToolbarSize } from './types'\n\nexport interface ToolbarProps extends StyledToolbarProps {\n  /**\n   * @deprecated Please use variant for non-floating toolbar\n   */\n  unstyled?: boolean\n\n  /**\n   * When floating, the toolbar has shadow and border to differentiate it from the surface\n   * @default floating\n   */\n  variant?: StyledToolbarProps['variant']\n\n  /**\n   * The orientation of the toolbar\n   * @default 'horizontal'\n   */\n  orientation?: 'horizontal' | 'vertical'\n\n  /**\n   * The reading direction of the toolbar\n   * @default 'ltr'\n   */\n  dir?: 'ltr' | 'rtl'\n\n  /**\n   * When true, keyboard navigation will loop from last tab to first, and vice versa\n   * @default true\n   */\n  loop?: boolean\n\n  /**\n   * The size of toolbar items\n   * @default 'medium'\n   */\n  size?: ToolbarSize\n}\n\nexport const Toolbar = React.forwardRef<\n  ElementRef<typeof StyledToolbar>,\n  ToolbarProps\n>(\n  (\n    {\n      unstyled,\n      orientation = 'horizontal',\n      variant = 'floating',\n      dir = 'ltr',\n      loop = true,\n      size = 'medium',\n      onKeyDown,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const variantProp =\n      unstyled === undefined ? variant : unstyled ? 'flat' : 'floating'\n\n    const handleKeyDown = useToolbarKeyboardNavigation({\n      orientation,\n      dir,\n      loop,\n      onKeyDown,\n    })\n\n    return (\n      <ToolbarProvider size={size}>\n        <StyledToolbar\n          variant={variantProp}\n          orientation={orientation}\n          dir={dir}\n          loop={loop}\n          size={size}\n          onKeyDown={handleKeyDown}\n          ref={forwardRef}\n          {...restProps}\n        />\n      </ToolbarProvider>\n    )\n  }\n) as ForwardRefExoticComponent<ToolbarProps> & Partials\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n  Icon: typeof Icon\n  Item: typeof Item\n  Link: typeof Link\n  Separator: typeof Separator\n}\n\nToolbar.Icon = Icon\nToolbar.Item = Item\nToolbar.Link = Link\nToolbar.Separator = Separator\n"],"names":["styled","Root","RadixToolbar","useAriaDisabled","usePress","booleanify","useHover","jsx","mergeProps","focus","baseIconStyles","createContext","useContext","Separator","useDirection","useCallback"],"mappings":"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"}
+{"version":3,"file":"main.js","sources":["../src/toolbar.styled.ts","../src/partials/base-item.styled.ts","../src/partials/base-item.tsx","../src/styles.ts","../src/partials/icon.styled.tsx","../src/hooks/use-toolbar-context.tsx","../src/partials/icon.tsx","../src/partials/separator.styled.ts","../src/partials/separator.tsx","../src/partials/link.styled.tsx","../src/partials/link.tsx","../src/partials/item.styled.tsx","../src/partials/item.tsx","../src/hooks/use-toolbar-keyboard-navigation.ts","../src/toolbar.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Root } from '@radix-ui/react-toolbar'\n\nexport const StyledToolbar = styled(Root, {\n  all: 'unset',\n  display: 'flex',\n  boxSizing: 'border-box',\n  alignItems: 'center',\n  maxWidth: '100%',\n  gap: '$50',\n\n  variants: {\n    variant: {\n      floating: {\n        backgroundColor: '$background-layout',\n        boxShadow: '$elevation-100',\n        border: '0.5px solid $border-subtle',\n        borderRadius: '$toolbar',\n        padding: '$50',\n      },\n      flat: {},\n    },\n    size: {\n      small: {\n        '&[data-orientation=\"vertical\"]': {\n          flexDirection: 'column',\n          width: '$10',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '$10',\n        },\n      },\n      medium: {\n        '&[data-orientation=\"vertical\"]': {\n          flexDirection: 'column',\n          width: '$12',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '$12',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n\nexport type StyledToolbarProps = StrictComponentProps<typeof StyledToolbar>\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport * as RadixToolbar from '@radix-ui/react-toolbar'\n\nexport const sizes = {\n  small: '$8',\n  medium: '$10',\n} as const\n\nexport const StyledBaseItem = styled(RadixToolbar.Button, {\n  boxSizing: 'border-box',\n  cursor: 'pointer',\n  userSelect: 'none',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  flexShrink: 0,\n\n  variants: {\n    size: {\n      small: {\n        height: sizes.small,\n        fontSize: '$175',\n      },\n      medium: {\n        height: sizes.medium,\n        fontSize: '$200',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n\nexport type StyledBaseItemProps = StrictComponentProps<typeof StyledBaseItem>\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { useHover } from '@react-aria/interactions'\nimport type { HoverEvents } from '@react-types/shared'\nimport { mergeProps } from '@react-aria/utils'\nimport { usePress } from '@mirohq/design-system-use-press'\nimport { booleanify } from '@mirohq/design-system-utils'\nimport type { PressEvents } from '@mirohq/design-system-use-press'\nimport { useAriaDisabled } from '@mirohq/design-system-use-aria-disabled'\n\nimport { StyledBaseItem } from './base-item.styled'\nimport type { StyledBaseItemProps } from './base-item.styled'\nimport type { ToolbarSize } from '../types'\n\nexport interface BaseItemProps\n  extends StyledBaseItemProps,\n    HoverEvents,\n    PressEvents {\n  disabled?: boolean\n  size?: ToolbarSize\n}\n\nexport const BaseItem = React.forwardRef<\n  ElementRef<typeof StyledBaseItem>,\n  BaseItemProps\n>(\n  (\n    {\n      disabled = false,\n      'aria-disabled': ariaDisabled,\n      asChild,\n      size,\n      onHoverStart,\n      onHoverEnd,\n      onHoverChange,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const elementProps = useAriaDisabled(\n      {\n        ...restProps,\n        ariaDisabled,\n      },\n      { allowArrows: true }\n    )\n\n    const { pressProps } = usePress({\n      preventFocusOnPress: 'auto',\n      disabled: disabled || booleanify(ariaDisabled),\n      ...elementProps,\n    })\n\n    const { hoverProps, isHovered } = useHover({\n      onHoverStart,\n      onHoverEnd,\n      onHoverChange,\n    })\n\n    return (\n      <StyledBaseItem\n        {...mergeProps(pressProps, hoverProps)}\n        data-hovered={isHovered ? '' : undefined}\n        asChild={asChild}\n        size={size}\n        disabled={disabled}\n        aria-disabled={booleanify(ariaDisabled) ? 'true' : ariaDisabled}\n        ref={forwardRef}\n      />\n    )\n  }\n)\n","import { focus } from '@mirohq/design-system-styles'\n\nexport const disabledSelector = '&[disabled], &[aria-disabled=\"true\"]'\n\nexport const sharedStyles = {\n  base: {\n    backgroundColor: '$transparent',\n    borderRadius: '$toolbar-item',\n    border: 'none',\n    ...focus.css({\n      boxShadow: '$focus',\n    }),\n    '&[disabled]': {\n      pointerEvents: 'none',\n    },\n    '&:not([aria-disabled=\"true\"])': {\n      '&[data-hovered]': {\n        backgroundColor: '$toolbar-item-background-hover',\n      },\n\n      '&:active, &[data-pressed]': {\n        backgroundColor: '$toolbar-item-background-pressed',\n      },\n    },\n  },\n}\n","import { styled } from '@mirohq/design-system-stitches'\nimport { styles as baseIconStyles } from '@mirohq/design-system-base-icon'\n\nimport { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\nimport { sizes } from './base-item.styled'\n\nconst iconSelector = '& svg, & img'\n\nexport const StyledIcon = styled(BaseItem, {\n  padding: 0,\n  font: 'unset',\n  color: '$icon-default',\n  ...sharedStyles.base,\n  variants: {\n    active: {\n      true: {\n        backgroundColor: '$toolbar-item-background-selected',\n        color: '$icon-on-interactive-selected',\n      },\n      false: {\n        [disabledSelector]: {\n          pointerEvents: 'none',\n          color: '$icon-disabled',\n        },\n      },\n    },\n    size: {\n      small: {\n        width: sizes.small,\n        height: sizes.small,\n        [iconSelector]: {\n          ...baseIconStyles.size.small,\n        },\n      },\n      medium: {\n        width: sizes.medium,\n        height: sizes.medium,\n        [iconSelector]: {\n          ...baseIconStyles.size.medium,\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n","import { createContext, useContext } from 'react'\nimport type { ReactNode } from 'react'\n\nimport type { ToolbarSize } from '../types'\n\ninterface ToolbarContextProps {\n  size: ToolbarSize\n}\n\nexport interface ToolbarProviderProps {\n  children?: ReactNode\n  size?: ToolbarSize\n}\n\nconst ToolbarContext = createContext<ToolbarContextProps>({\n  size: 'medium',\n})\n\nexport const ToolbarProvider = ({\n  children,\n  size = 'medium',\n}: ToolbarProviderProps): JSX.Element => (\n  <ToolbarContext.Provider value={{ size }}>{children}</ToolbarContext.Provider>\n)\n\nexport const useToolbarContext = (): ToolbarContextProps =>\n  useContext(ToolbarContext)\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { StyledIcon } from './icon.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\nexport interface IconProps extends BaseItemProps {\n  /**\n   * Renders icon in enabled/toggled state.\n   * @default false\n   */\n  active?: boolean\n}\n\nexport const Icon = React.forwardRef<ElementRef<typeof StyledIcon>, IconProps>(\n  ({ active = false, ...restProps }, forwardRef) => {\n    const { size } = useToolbarContext()\n\n    return (\n      <StyledIcon {...restProps} active={active} size={size} ref={forwardRef} />\n    )\n  }\n)\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Separator } from '@radix-ui/react-toolbar'\n\nexport const StyledSeparator = styled(Separator, {\n  all: 'unset',\n  display: 'block',\n  boxSizing: 'border-box',\n  backgroundColor: '$border-subtle',\n\n  variants: {\n    size: {\n      small: {\n        '&[data-orientation=\"vertical\"]': {\n          width: '1px',\n          height: '$5',\n          margin: '0 $50',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '1px',\n          width: '$5',\n          margin: '$50 0',\n        },\n      },\n      medium: {\n        '&[data-orientation=\"vertical\"]': {\n          width: '1px',\n          height: '$6',\n          margin: '0 $50',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '1px',\n          width: '$6',\n          margin: '$50 0',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n\nexport type StyledSeparatorProps = StrictComponentProps<typeof StyledSeparator>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { StyledSeparatorProps } from './separator.styled'\nimport { StyledSeparator } from './separator.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\nexport interface SeparatorProps extends StyledSeparatorProps {}\n\nexport const Separator = React.forwardRef<\n  ElementRef<typeof StyledSeparator>,\n  SeparatorProps\n>((props, forwardRef) => {\n  const { size } = useToolbarContext()\n\n  return <StyledSeparator {...props} size={size} ref={forwardRef} />\n})\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\n\nexport const StyledLink = styled(BaseItem, {\n  paddingX: '$150',\n  color: '$text-interactive-primary',\n  textDecoration: 'underline solid',\n  textDecorationThickness: '1px',\n  textUnderlineOffset: '4px',\n  outline: 'none',\n  ...sharedStyles.base,\n\n  [disabledSelector]: {\n    pointerEvents: 'none',\n    color: '$text-disabled',\n  },\n})\n","import React from 'react'\nimport type { ElementRef, AnchorHTMLAttributes } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { StyledLink } from './link.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\ntype ItemPropsWithAnchor = Omit<BaseItemProps, 'ref'> &\n  AnchorHTMLAttributes<typeof StyledLink>\nexport interface LinkProps extends ItemPropsWithAnchor {}\n\nexport const Link = React.forwardRef<ElementRef<'a'>, LinkProps>(\n  ({ children, href, ...restProps }, forwardRef) => {\n    const { size } = useToolbarContext()\n\n    return (\n      <StyledLink {...restProps} size={size} asChild>\n        <a href={href} ref={forwardRef}>\n          {children}\n        </a>\n      </StyledLink>\n    )\n  }\n)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\n\nexport const StyledItem = styled(BaseItem, {\n  ...sharedStyles.base,\n  variants: {\n    active: {\n      true: {\n        backgroundColor: '$toolbar-item-background-selected',\n        color: '$text-on-interactive-selected',\n      },\n      false: {\n        [disabledSelector]: {\n          pointerEvents: 'none',\n          color: '$text-disabled',\n        },\n      },\n    },\n  },\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { BaseItem } from './base-item'\nimport { StyledItem } from './item.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\nexport interface ItemProps extends BaseItemProps {\n  /**\n   * It's applied by default when using with asChild attribute.\n   * You can still combine default Item styles with your own component by\n   * setting this prop to false.\n   * Note: Must be used together with asChild\n   * @default true\n   */\n  unstyled?: boolean\n\n  /**\n   * Renders item in enabled/toggled state.\n   * @default false\n   */\n  active?: boolean\n}\n\nexport const Item = React.forwardRef<ElementRef<typeof StyledItem>, ItemProps>(\n  ({ active = false, unstyled = true, asChild, ...restProps }, forwardRef) => {\n    const { size } = useToolbarContext()\n    const shouldRenderUnstyled = asChild === true ? unstyled : false\n\n    if (shouldRenderUnstyled) {\n      return <BaseItem {...restProps} asChild={asChild} ref={forwardRef} />\n    }\n\n    return (\n      <StyledItem\n        {...restProps}\n        asChild={asChild}\n        active={active}\n        size={size}\n        ref={forwardRef}\n      />\n    )\n  }\n)\n","import { useCallback } from 'react'\nimport type { KeyboardEvent } from 'react'\nimport { useDirection } from '@radix-ui/react-direction'\n\ninterface UseToolbarKeyboardNavigationProps {\n  orientation?: 'horizontal' | 'vertical'\n  dir?: 'ltr' | 'rtl'\n  loop?: boolean\n  onKeyDown?: (event: KeyboardEvent<HTMLDivElement>) => void\n}\n\n/**\n * Custom keyboard navigation for Radix Toolbar that allows navigation to aria-disabled items.\n *\n * By default, Radix UI Toolbar skips items with aria-disabled=\"true\" during keyboard navigation.\n * This hook intercepts arrow key events and manually handles focus management when aria-disabled\n * items are involved, while delegating to Radix for normal navigation.\n */\nexport const useToolbarKeyboardNavigation = ({\n  orientation = 'horizontal',\n  dir,\n  loop = true,\n  onKeyDown,\n}: UseToolbarKeyboardNavigationProps): ((\n  event: KeyboardEvent<HTMLDivElement>\n) => void) => {\n  const localDir = useDirection(dir ?? 'ltr')\n\n  return useCallback(\n    (event: KeyboardEvent<HTMLDivElement>) => {\n      const { key, currentTarget } = event\n      const isHorizontal = orientation === 'horizontal'\n      const isRTL = localDir === 'rtl'\n\n      const isForward =\n        (isHorizontal && key === (isRTL ? 'ArrowLeft' : 'ArrowRight')) ||\n        (!isHorizontal && key === 'ArrowDown')\n\n      const isBackward =\n        (isHorizontal && key === (isRTL ? 'ArrowRight' : 'ArrowLeft')) ||\n        (!isHorizontal && key === 'ArrowUp')\n\n      if (!isForward && !isBackward) {\n        onKeyDown?.(event)\n        return\n      }\n\n      // Find all navigable items (using Radix's collection attribute)\n      const items = Array.from(\n        currentTarget.querySelectorAll('[data-radix-collection-item]')\n      ).filter(item => !item.hasAttribute('disabled')) as HTMLElement[]\n\n      // Find currently focused item\n      const currentIndex = items.findIndex(item =>\n        item.contains(document.activeElement)\n      )\n\n      if (items.length === 0 || currentIndex === -1) {\n        return onKeyDown?.(event)\n      }\n\n      // Calculate next item index\n      let nextIndex: number\n      if (isForward) {\n        nextIndex = currentIndex + 1\n        if (nextIndex >= items.length) {\n          nextIndex = loop ? 0 : currentIndex\n        }\n      } else {\n        nextIndex = currentIndex - 1\n        if (nextIndex < 0) {\n          nextIndex = loop ? items.length - 1 : currentIndex\n        }\n      }\n\n      // Check if aria-disabled items are involved\n      const currentIsAriaDisabled =\n        items[currentIndex]?.getAttribute('aria-disabled') === 'true'\n      const nextIsAriaDisabled =\n        items[nextIndex]?.getAttribute('aria-disabled') === 'true'\n\n      // Only override Radix if aria-disabled items are involved\n      // Otherwise, let Radix handle it with all their edge cases and optimizations\n      if (!currentIsAriaDisabled && !nextIsAriaDisabled) {\n        onKeyDown?.(event)\n        return\n      }\n\n      // Take control: prevent Radix's handler and manually move focus\n      event.preventDefault()\n      event.stopPropagation()\n\n      if (nextIndex !== currentIndex) {\n        items[nextIndex]?.focus()\n      }\n\n      onKeyDown?.(event)\n    },\n    [orientation, localDir, loop, onKeyDown]\n  )\n}\n","import React from 'react'\nimport type { ElementRef, ForwardRefExoticComponent } from 'react'\n\nimport type { StyledToolbarProps } from './toolbar.styled'\nimport { StyledToolbar } from './toolbar.styled'\nimport { Icon } from './partials/icon'\nimport { Separator } from './partials/separator'\nimport { Link } from './partials/link'\nimport { Item } from './partials/item'\nimport { useToolbarKeyboardNavigation } from './hooks/use-toolbar-keyboard-navigation'\nimport { ToolbarProvider } from './hooks/use-toolbar-context'\nimport type { ToolbarSize } from './types'\n\nexport interface ToolbarProps extends StyledToolbarProps {\n  /**\n   * @deprecated Please use variant for non-floating toolbar\n   */\n  unstyled?: boolean\n\n  /**\n   * When floating, the toolbar has shadow and border to differentiate it from the surface\n   * @default floating\n   */\n  variant?: StyledToolbarProps['variant']\n\n  /**\n   * The orientation of the toolbar\n   * @default 'horizontal'\n   */\n  orientation?: 'horizontal' | 'vertical'\n\n  /**\n   * The reading direction of the toolbar\n   * @default 'ltr'\n   */\n  dir?: 'ltr' | 'rtl'\n\n  /**\n   * When true, keyboard navigation will loop from last tab to first, and vice versa\n   * @default true\n   */\n  loop?: boolean\n\n  /**\n   * The size of toolbar items\n   * @default 'medium'\n   */\n  size?: ToolbarSize\n}\n\nexport const Toolbar = React.forwardRef<\n  ElementRef<typeof StyledToolbar>,\n  ToolbarProps\n>(\n  (\n    {\n      unstyled,\n      orientation = 'horizontal',\n      variant = 'floating',\n      dir = 'ltr',\n      loop = true,\n      size = 'medium',\n      onKeyDown,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const variantProp =\n      unstyled === undefined ? variant : unstyled ? 'flat' : 'floating'\n\n    const handleKeyDown = useToolbarKeyboardNavigation({\n      orientation,\n      dir,\n      loop,\n      onKeyDown,\n    })\n\n    return (\n      <ToolbarProvider size={size}>\n        <StyledToolbar\n          variant={variantProp}\n          orientation={orientation}\n          dir={dir}\n          loop={loop}\n          size={size}\n          onKeyDown={handleKeyDown}\n          ref={forwardRef}\n          {...restProps}\n        />\n      </ToolbarProvider>\n    )\n  }\n) as ForwardRefExoticComponent<ToolbarProps> & Partials\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n  Icon: typeof Icon\n  Item: typeof Item\n  Link: typeof Link\n  Separator: typeof Separator\n}\n\nToolbar.Icon = Icon\nToolbar.Item = Item\nToolbar.Link = Link\nToolbar.Separator = Separator\n"],"names":["styled","Root","RadixToolbar","useAriaDisabled","usePress","booleanify","useHover","jsx","mergeProps","focus","baseIconStyles","createContext","useContext","Separator","useDirection","useCallback"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIO,MAAM,aAAA,GAAgBA,4BAAOC,iBAAA,EAAM;AAAA,EACxC,GAAA,EAAK,OAAA;AAAA,EACL,OAAA,EAAS,MAAA;AAAA,EACT,SAAA,EAAW,YAAA;AAAA,EACX,UAAA,EAAY,QAAA;AAAA,EACZ,QAAA,EAAU,MAAA;AAAA,EACV,GAAA,EAAK,KAAA;AAAA,EAEL,QAAA,EAAU;AAAA,IACR,OAAA,EAAS;AAAA,MACP,QAAA,EAAU;AAAA,QACR,eAAA,EAAiB,oBAAA;AAAA,QACjB,SAAA,EAAW,gBAAA;AAAA,QACX,MAAA,EAAQ,4BAAA;AAAA,QACR,YAAA,EAAc,UAAA;AAAA,QACd,OAAA,EAAS;AAAA,OACX;AAAA,MACA,MAAM;AAAC,KACT;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,KAAA,EAAO;AAAA,QACL,gCAAA,EAAkC;AAAA,UAChC,aAAA,EAAe,QAAA;AAAA,UACf,KAAA,EAAO;AAAA,SACT;AAAA,QACA,kCAAA,EAAoC;AAAA,UAClC,MAAA,EAAQ;AAAA;AACV,OACF;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,gCAAA,EAAkC;AAAA,UAChC,aAAA,EAAe,QAAA;AAAA,UACf,KAAA,EAAO;AAAA,SACT;AAAA,QACA,kCAAA,EAAoC;AAAA,UAClC,MAAA,EAAQ;AAAA;AACV;AACF;AACF,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA;AAEV,CAAC,CAAA;;AC3CM,MAAM,KAAA,GAAQ;AAAA,EACnB,KAAA,EAAO,IAAA;AAAA,EACP,MAAA,EAAQ;AACV,CAAA;AAEO,MAAM,cAAA,GAAiBD,2BAAA,CAAOE,uBAAA,CAAa,MAAA,EAAQ;AAAA,EACxD,SAAA,EAAW,YAAA;AAAA,EACX,MAAA,EAAQ,SAAA;AAAA,EACR,UAAA,EAAY,MAAA;AAAA,EACZ,OAAA,EAAS,MAAA;AAAA,EACT,UAAA,EAAY,QAAA;AAAA,EACZ,cAAA,EAAgB,QAAA;AAAA,EAChB,UAAA,EAAY,CAAA;AAAA,EAEZ,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,KAAA,EAAO;AAAA,QACL,QAAQ,KAAA,CAAM,KAAA;AAAA,QACd,QAAA,EAAU;AAAA,OACZ;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,QAAQ,KAAA,CAAM,MAAA;AAAA,QACd,QAAA,EAAU;AAAA;AACZ;AACF,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA;AAEV,CAAC,CAAA;;ACXM,MAAM,WAAW,KAAA,CAAM,UAAA;AAAA,EAI5B,CACE;AAAA,IACE,QAAA,GAAW,KAAA;AAAA,IACX,eAAA,EAAiB,YAAA;AAAA,IACjB,OAAA;AAAA,IACA,IAAA;AAAA,IACA,YAAA;AAAA,IACA,UAAA;AAAA,IACA,aAAA;AAAA,IACA,GAAG;AAAA,KAEL,UAAA,KACG;AACH,IAAA,MAAM,YAAA,GAAeC,2CAAA;AAAA,MACnB;AAAA,QACE,GAAG,SAAA;AAAA,QACH;AAAA,OACF;AAAA,MACA,EAAE,aAAa,IAAA;AAAK,KACtB;AAEA,IAAA,MAAM,EAAE,UAAA,EAAW,GAAIC,6BAAA,CAAS;AAAA,MAC9B,mBAAA,EAAqB,MAAA;AAAA,MACrB,QAAA,EAAU,QAAA,IAAYC,4BAAA,CAAW,YAAY,CAAA;AAAA,MAC7C,GAAG;AAAA,KACJ,CAAA;AAED,IAAA,MAAM,EAAE,UAAA,EAAY,SAAA,EAAU,GAAIC,qBAAA,CAAS;AAAA,MACzC,YAAA;AAAA,MACA,UAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,uBACEC,cAAA;AAAA,MAAC,cAAA;AAAA,MAAA;AAAA,QACE,GAAGC,gBAAA,CAAW,UAAA,EAAY,UAAU,CAAA;AAAA,QACrC,cAAA,EAAc,YAAY,EAAA,GAAK,MAAA;AAAA,QAC/B,OAAA;AAAA,QACA,IAAA;AAAA,QACA,QAAA;AAAA,QACA,eAAA,EAAeH,4BAAA,CAAW,YAAY,CAAA,GAAI,MAAA,GAAS,YAAA;AAAA,QACnD,GAAA,EAAK;AAAA;AAAA,KACP;AAAA,EAEJ;AACF,CAAA;;ACrEO,MAAM,gBAAA,GAAmB,sCAAA;AAEzB,MAAM,YAAA,GAAe;AAAA,EAC1B,IAAA,EAAM;AAAA,IACJ,eAAA,EAAiB,cAAA;AAAA,IACjB,YAAA,EAAc,eAAA;AAAA,IACd,MAAA,EAAQ,MAAA;AAAA,IACR,GAAGI,yBAAM,GAAA,CAAI;AAAA,MACX,SAAA,EAAW;AAAA,KACZ,CAAA;AAAA,IACD,aAAA,EAAe;AAAA,MACb,aAAA,EAAe;AAAA,KACjB;AAAA,IACA,+BAAA,EAAiC;AAAA,MAC/B,iBAAA,EAAmB;AAAA,QACjB,eAAA,EAAiB;AAAA,OACnB;AAAA,MAEA,2BAAA,EAA6B;AAAA,QAC3B,eAAA,EAAiB;AAAA;AACnB;AACF;AAEJ,CAAA;;AClBA,MAAM,YAAA,GAAe,cAAA;AAEd,MAAM,UAAA,GAAaT,4BAAO,QAAA,EAAU;AAAA,EACzC,OAAA,EAAS,CAAA;AAAA,EACT,IAAA,EAAM,OAAA;AAAA,EACN,KAAA,EAAO,eAAA;AAAA,EACP,GAAG,YAAA,CAAa,IAAA;AAAA,EAChB,QAAA,EAAU;AAAA,IACR,MAAA,EAAQ;AAAA,MACN,IAAA,EAAM;AAAA,QACJ,eAAA,EAAiB,mCAAA;AAAA,QACjB,KAAA,EAAO;AAAA,OACT;AAAA,MACA,KAAA,EAAO;AAAA,QACL,CAAC,gBAAgB,GAAG;AAAA,UAClB,aAAA,EAAe,MAAA;AAAA,UACf,KAAA,EAAO;AAAA;AACT;AACF,KACF;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,KAAA,EAAO;AAAA,QACL,OAAO,KAAA,CAAM,KAAA;AAAA,QACb,QAAQ,KAAA,CAAM,KAAA;AAAA,QACd,CAAC,YAAY,GAAG;AAAA,UACd,GAAGU,4BAAe,IAAA,CAAK;AAAA;AACzB,OACF;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,OAAO,KAAA,CAAM,MAAA;AAAA,QACb,QAAQ,KAAA,CAAM,MAAA;AAAA,QACd,CAAC,YAAY,GAAG;AAAA,UACd,GAAGA,4BAAe,IAAA,CAAK;AAAA;AACzB;AACF;AACF,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA;AAEV,CAAC,CAAA;;ACjCD,MAAM,iBAAiBC,mBAAA,CAAmC;AAAA,EACxD,IAAA,EAAM;AACR,CAAC,CAAA;AAEM,MAAM,kBAAkB,CAAC;AAAA,EAC9B,QAAA;AAAA,EACA,IAAA,GAAO;AACT,CAAA,qBACEJ,cAAA,CAAC,eAAe,QAAA,EAAf,EAAwB,OAAO,EAAE,IAAA,IAAS,QAAA,EAAS,CAAA;AAG/C,MAAM,iBAAA,GAAoB,MAC/BK,gBAAA,CAAW,cAAc,CAAA;;ACXpB,MAAM,OAAO,KAAA,CAAM,UAAA;AAAA,EACxB,CAAC,EAAE,MAAA,GAAS,OAAO,GAAG,SAAA,IAAa,UAAA,KAAe;AAChD,IAAA,MAAM,EAAE,IAAA,EAAK,GAAI,iBAAA,EAAkB;AAEnC,IAAA,sCACG,UAAA,EAAA,EAAY,GAAG,WAAW,MAAA,EAAgB,IAAA,EAAY,KAAK,UAAA,EAAY,CAAA;AAAA,EAE5E;AACF,CAAA;;ACnBO,MAAM,eAAA,GAAkBZ,4BAAOa,sBAAA,EAAW;AAAA,EAC/C,GAAA,EAAK,OAAA;AAAA,EACL,OAAA,EAAS,OAAA;AAAA,EACT,SAAA,EAAW,YAAA;AAAA,EACX,eAAA,EAAiB,gBAAA;AAAA,EAEjB,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,KAAA,EAAO;AAAA,QACL,gCAAA,EAAkC;AAAA,UAChC,KAAA,EAAO,KAAA;AAAA,UACP,MAAA,EAAQ,IAAA;AAAA,UACR,MAAA,EAAQ;AAAA,SACV;AAAA,QACA,kCAAA,EAAoC;AAAA,UAClC,MAAA,EAAQ,KAAA;AAAA,UACR,KAAA,EAAO,IAAA;AAAA,UACP,MAAA,EAAQ;AAAA;AACV,OACF;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,gCAAA,EAAkC;AAAA,UAChC,KAAA,EAAO,KAAA;AAAA,UACP,MAAA,EAAQ,IAAA;AAAA,UACR,MAAA,EAAQ;AAAA,SACV;AAAA,QACA,kCAAA,EAAoC;AAAA,UAClC,MAAA,EAAQ,KAAA;AAAA,UACR,KAAA,EAAO,IAAA;AAAA,UACP,MAAA,EAAQ;AAAA;AACV;AACF;AACF,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA;AAEV,CAAC,CAAA;;AChCM,MAAM,SAAA,GAAY,KAAA,CAAM,UAAA,CAG7B,CAAC,OAAO,UAAA,KAAe;AACvB,EAAA,MAAM,EAAE,IAAA,EAAK,GAAI,iBAAA,EAAkB;AAEnC,EAAA,sCAAQ,eAAA,EAAA,EAAiB,GAAG,KAAA,EAAO,IAAA,EAAY,KAAK,UAAA,EAAY,CAAA;AAClE,CAAC,CAAA;;ACXM,MAAM,UAAA,GAAab,4BAAO,QAAA,EAAU;AAAA,EACzC,QAAA,EAAU,MAAA;AAAA,EACV,KAAA,EAAO,2BAAA;AAAA,EACP,cAAA,EAAgB,iBAAA;AAAA,EAChB,uBAAA,EAAyB,KAAA;AAAA,EACzB,mBAAA,EAAqB,KAAA;AAAA,EACrB,OAAA,EAAS,MAAA;AAAA,EACT,GAAG,YAAA,CAAa,IAAA;AAAA,EAEhB,CAAC,gBAAgB,GAAG;AAAA,IAClB,aAAA,EAAe,MAAA;AAAA,IACf,KAAA,EAAO;AAAA;AAEX,CAAC,CAAA;;ACPM,MAAM,OAAO,KAAA,CAAM,UAAA;AAAA,EACxB,CAAC,EAAE,QAAA,EAAU,MAAM,GAAG,SAAA,IAAa,UAAA,KAAe;AAChD,IAAA,MAAM,EAAE,IAAA,EAAK,GAAI,iBAAA,EAAkB;AAEnC,IAAA,uBACEO,cAAA,CAAC,UAAA,EAAA,EAAY,GAAG,SAAA,EAAW,IAAA,EAAY,OAAA,EAAO,IAAA,EAC5C,QAAA,kBAAAA,cAAA,CAAC,GAAA,EAAA,EAAE,IAAA,EAAY,GAAA,EAAK,UAAA,EACjB,UACH,CAAA,EACF,CAAA;AAAA,EAEJ;AACF,CAAA;;AClBO,MAAM,UAAA,GAAaP,4BAAO,QAAA,EAAU;AAAA,EACzC,GAAG,YAAA,CAAa,IAAA;AAAA,EAChB,QAAA,EAAU;AAAA,IACR,MAAA,EAAQ;AAAA,MACN,IAAA,EAAM;AAAA,QACJ,eAAA,EAAiB,mCAAA;AAAA,QACjB,KAAA,EAAO;AAAA,OACT;AAAA,MACA,KAAA,EAAO;AAAA,QACL,CAAC,gBAAgB,GAAG;AAAA,UAClB,aAAA,EAAe,MAAA;AAAA,UACf,KAAA,EAAO;AAAA;AACT;AACF;AACF;AAEJ,CAAC,CAAA;;ACIM,MAAM,OAAO,KAAA,CAAM,UAAA;AAAA,EACxB,CAAC,EAAE,MAAA,GAAS,KAAA,EAAO,QAAA,GAAW,MAAM,OAAA,EAAS,GAAG,SAAA,EAAU,EAAG,UAAA,KAAe;AAC1E,IAAA,MAAM,EAAE,IAAA,EAAK,GAAI,iBAAA,EAAkB;AACnC,IAAA,MAAM,oBAAA,GAAuB,OAAA,KAAY,IAAA,GAAO,QAAA,GAAW,KAAA;AAE3D,IAAA,IAAI,oBAAA,EAAsB;AACxB,MAAA,sCAAQ,QAAA,EAAA,EAAU,GAAG,SAAA,EAAW,OAAA,EAAkB,KAAK,UAAA,EAAY,CAAA;AAAA,IACrE;AAEA,IAAA,uBACEO,cAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACE,GAAG,SAAA;AAAA,QACJ,OAAA;AAAA,QACA,MAAA;AAAA,QACA,IAAA;AAAA,QACA,GAAA,EAAK;AAAA;AAAA,KACP;AAAA,EAEJ;AACF,CAAA;;AC1BO,MAAM,+BAA+B,CAAC;AAAA,EAC3C,WAAA,GAAc,YAAA;AAAA,EACd,GAAA;AAAA,EACA,IAAA,GAAO,IAAA;AAAA,EACP;AACF,CAAA,KAEc;AACZ,EAAA,MAAM,QAAA,GAAWO,2BAAA,CAAa,GAAA,IAAA,IAAA,GAAA,GAAA,GAAO,KAAK,CAAA;AAE1C,EAAA,OAAOC,iBAAA;AAAA,IACL,CAAC,KAAA,KAAyC;AA7B9C,MAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA;AA8BM,MAAA,MAAM,EAAE,GAAA,EAAK,aAAA,EAAc,GAAI,KAAA;AAC/B,MAAA,MAAM,eAAe,WAAA,KAAgB,YAAA;AACrC,MAAA,MAAM,QAAQ,QAAA,KAAa,KAAA;AAE3B,MAAA,MAAM,SAAA,GACH,gBAAgB,GAAA,MAAS,KAAA,GAAQ,cAAc,YAAA,CAAA,IAC/C,CAAC,gBAAgB,GAAA,KAAQ,WAAA;AAE5B,MAAA,MAAM,UAAA,GACH,gBAAgB,GAAA,MAAS,KAAA,GAAQ,eAAe,WAAA,CAAA,IAChD,CAAC,gBAAgB,GAAA,KAAQ,SAAA;AAE5B,MAAA,IAAI,CAAC,SAAA,IAAa,CAAC,UAAA,EAAY;AAC7B,QAAA,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAY,KAAA,CAAA;AACZ,QAAA;AAAA,MACF;AAGA,MAAA,MAAM,QAAQ,KAAA,CAAM,IAAA;AAAA,QAClB,aAAA,CAAc,iBAAiB,8BAA8B;AAAA,QAC7D,MAAA,CAAO,CAAA,IAAA,KAAQ,CAAC,IAAA,CAAK,YAAA,CAAa,UAAU,CAAC,CAAA;AAG/C,MAAA,MAAM,eAAe,KAAA,CAAM,SAAA;AAAA,QAAU,CAAA,IAAA,KACnC,IAAA,CAAK,QAAA,CAAS,QAAA,CAAS,aAAa;AAAA,OACtC;AAEA,MAAA,IAAI,KAAA,CAAM,MAAA,KAAW,CAAA,IAAK,YAAA,KAAiB,EAAA,EAAI;AAC7C,QAAA,OAAO,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAY,KAAA,CAAA;AAAA,MACrB;AAGA,MAAA,IAAI,SAAA;AACJ,MAAA,IAAI,SAAA,EAAW;AACb,QAAA,SAAA,GAAY,YAAA,GAAe,CAAA;AAC3B,QAAA,IAAI,SAAA,IAAa,MAAM,MAAA,EAAQ;AAC7B,UAAA,SAAA,GAAY,OAAO,CAAA,GAAI,YAAA;AAAA,QACzB;AAAA,MACF,CAAA,MAAO;AACL,QAAA,SAAA,GAAY,YAAA,GAAe,CAAA;AAC3B,QAAA,IAAI,YAAY,CAAA,EAAG;AACjB,UAAA,SAAA,GAAY,IAAA,GAAO,KAAA,CAAM,MAAA,GAAS,CAAA,GAAI,YAAA;AAAA,QACxC;AAAA,MACF;AAGA,MAAA,MAAM,0BACJ,EAAA,GAAA,KAAA,CAAM,YAAY,CAAA,KAAlB,IAAA,GAAA,MAAA,GAAA,EAAA,CAAqB,aAAa,eAAA,CAAA,MAAqB,MAAA;AACzD,MAAA,MAAM,uBACJ,EAAA,GAAA,KAAA,CAAM,SAAS,CAAA,KAAf,IAAA,GAAA,MAAA,GAAA,EAAA,CAAkB,aAAa,eAAA,CAAA,MAAqB,MAAA;AAItD,MAAA,IAAI,CAAC,qBAAA,IAAyB,CAAC,kBAAA,EAAoB;AACjD,QAAA,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAY,KAAA,CAAA;AACZ,QAAA;AAAA,MACF;AAGA,MAAA,KAAA,CAAM,cAAA,EAAe;AACrB,MAAA,KAAA,CAAM,eAAA,EAAgB;AAEtB,MAAA,IAAI,cAAc,YAAA,EAAc;AAC9B,QAAA,CAAA,EAAA,GAAA,KAAA,CAAM,SAAS,MAAf,IAAA,GAAA,MAAA,GAAA,EAAA,CAAkB,KAAA,EAAA;AAAA,MACpB;AAEA,MAAA,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAY,KAAA,CAAA;AAAA,IACd,CAAA;AAAA,IACA,CAAC,WAAA,EAAa,QAAA,EAAU,IAAA,EAAM,SAAS;AAAA,GACzC;AACF,CAAA;;AClDO,MAAM,UAAU,KAAA,CAAM,UAAA;AAAA,EAI3B,CACE;AAAA,IACE,QAAA;AAAA,IACA,WAAA,GAAc,YAAA;AAAA,IACd,OAAA,GAAU,UAAA;AAAA,IACV,GAAA,GAAM,KAAA;AAAA,IACN,IAAA,GAAO,IAAA;AAAA,IACP,IAAA,GAAO,QAAA;AAAA,IACP,SAAA;AAAA,IACA,GAAG;AAAA,KAEL,UAAA,KACG;AACH,IAAA,MAAM,WAAA,GACJ,QAAA,KAAa,MAAA,GAAY,OAAA,GAAU,WAAW,MAAA,GAAS,UAAA;AAEzD,IAAA,MAAM,gBAAgB,4BAAA,CAA6B;AAAA,MACjD,WAAA;AAAA,MACA,GAAA;AAAA,MACA,IAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,uBACER,cAAA,CAAC,mBAAgB,IAAA,EACf,QAAA,kBAAAA,cAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAS,WAAA;AAAA,QACT,WAAA;AAAA,QACA,GAAA;AAAA,QACA,IAAA;AAAA,QACA,IAAA;AAAA,QACA,SAAA,EAAW,aAAA;AAAA,QACX,GAAA,EAAK,UAAA;AAAA,QACJ,GAAG;AAAA;AAAA,KACN,EACF,CAAA;AAAA,EAEJ;AACF;AAYA,OAAA,CAAQ,IAAA,GAAO,IAAA;AACf,OAAA,CAAQ,IAAA,GAAO,IAAA;AACf,OAAA,CAAQ,IAAA,GAAO,IAAA;AACf,OAAA,CAAQ,SAAA,GAAY,SAAA;;;;"}

package/dist/module.js

@@ -142,10 +142,10 @@ const sharedStyles = {
     },
     '&:not([aria-disabled="true"])': {
       "&[data-hovered]": {
-        backgroundColor: "$background-interactive-surface-hover"
+        backgroundColor: "$toolbar-item-background-hover"
       },
       "&:active, &[data-pressed]": {
-        backgroundColor: "$background-interactive-surface-pressed"
+        backgroundColor: "$toolbar-item-background-pressed"
       }
     }
   }
@@ -160,7 +160,7 @@ const StyledIcon = styled(BaseItem, {
   variants: {
     active: {
       true: {
-        backgroundColor: "$background-interactive-secondary-selected",
+        backgroundColor: "$toolbar-item-background-selected",
         color: "$icon-on-interactive-selected"
       },
       false: {
@@ -277,7 +277,7 @@ const StyledItem = styled(BaseItem, {
   variants: {
     active: {
       true: {
-        backgroundColor: "$background-interactive-secondary-selected",
+        backgroundColor: "$toolbar-item-background-selected",
         color: "$text-on-interactive-selected"
       },
       false: {

package/dist/module.js.map

@@ -1 +1 @@
-{"version":3,"file":"module.js","sources":["../src/toolbar.styled.ts","../src/partials/base-item.styled.ts","../src/partials/base-item.tsx","../src/styles.ts","../src/partials/icon.styled.tsx","../src/hooks/use-toolbar-context.tsx","../src/partials/icon.tsx","../src/partials/separator.styled.ts","../src/partials/separator.tsx","../src/partials/link.styled.tsx","../src/partials/link.tsx","../src/partials/item.styled.tsx","../src/partials/item.tsx","../src/hooks/use-toolbar-keyboard-navigation.ts","../src/toolbar.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Root } from '@radix-ui/react-toolbar'\n\nexport const StyledToolbar = styled(Root, {\n  all: 'unset',\n  display: 'flex',\n  boxSizing: 'border-box',\n  alignItems: 'center',\n  maxWidth: '100%',\n  gap: '$50',\n\n  variants: {\n    variant: {\n      floating: {\n        backgroundColor: '$background-layout',\n        boxShadow: '$elevation-100',\n        border: '0.5px solid $border-subtle',\n        borderRadius: '$toolbar',\n        padding: '$50',\n      },\n      flat: {},\n    },\n    size: {\n      small: {\n        '&[data-orientation=\"vertical\"]': {\n          flexDirection: 'column',\n          width: '$10',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '$10',\n        },\n      },\n      medium: {\n        '&[data-orientation=\"vertical\"]': {\n          flexDirection: 'column',\n          width: '$12',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '$12',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n\nexport type StyledToolbarProps = StrictComponentProps<typeof StyledToolbar>\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport * as RadixToolbar from '@radix-ui/react-toolbar'\n\nexport const sizes = {\n  small: '$8',\n  medium: '$10',\n} as const\n\nexport const StyledBaseItem = styled(RadixToolbar.Button, {\n  boxSizing: 'border-box',\n  cursor: 'pointer',\n  userSelect: 'none',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  flexShrink: 0,\n\n  variants: {\n    size: {\n      small: {\n        height: sizes.small,\n        fontSize: '$175',\n      },\n      medium: {\n        height: sizes.medium,\n        fontSize: '$200',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n\nexport type StyledBaseItemProps = StrictComponentProps<typeof StyledBaseItem>\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { useHover } from '@react-aria/interactions'\nimport type { HoverEvents } from '@react-types/shared'\nimport { mergeProps } from '@react-aria/utils'\nimport { usePress } from '@mirohq/design-system-use-press'\nimport { booleanify } from '@mirohq/design-system-utils'\nimport type { PressEvents } from '@mirohq/design-system-use-press'\nimport { useAriaDisabled } from '@mirohq/design-system-use-aria-disabled'\n\nimport { StyledBaseItem } from './base-item.styled'\nimport type { StyledBaseItemProps } from './base-item.styled'\nimport type { ToolbarSize } from '../types'\n\nexport interface BaseItemProps\n  extends StyledBaseItemProps,\n    HoverEvents,\n    PressEvents {\n  disabled?: boolean\n  size?: ToolbarSize\n}\n\nexport const BaseItem = React.forwardRef<\n  ElementRef<typeof StyledBaseItem>,\n  BaseItemProps\n>(\n  (\n    {\n      disabled = false,\n      'aria-disabled': ariaDisabled,\n      asChild,\n      size,\n      onHoverStart,\n      onHoverEnd,\n      onHoverChange,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const elementProps = useAriaDisabled(\n      {\n        ...restProps,\n        ariaDisabled,\n      },\n      { allowArrows: true }\n    )\n\n    const { pressProps } = usePress({\n      preventFocusOnPress: 'auto',\n      disabled: disabled || booleanify(ariaDisabled),\n      ...elementProps,\n    })\n\n    const { hoverProps, isHovered } = useHover({\n      onHoverStart,\n      onHoverEnd,\n      onHoverChange,\n    })\n\n    return (\n      <StyledBaseItem\n        {...mergeProps(pressProps, hoverProps)}\n        data-hovered={isHovered ? '' : undefined}\n        asChild={asChild}\n        size={size}\n        disabled={disabled}\n        aria-disabled={booleanify(ariaDisabled) ? 'true' : ariaDisabled}\n        ref={forwardRef}\n      />\n    )\n  }\n)\n","import { focus } from '@mirohq/design-system-styles'\n\nexport const disabledSelector = '&[disabled], &[aria-disabled=\"true\"]'\n\nexport const sharedStyles = {\n  base: {\n    backgroundColor: '$transparent',\n    borderRadius: '$toolbar-item',\n    border: 'none',\n    ...focus.css({\n      boxShadow: '$focus',\n    }),\n    '&[disabled]': {\n      pointerEvents: 'none',\n    },\n    '&:not([aria-disabled=\"true\"])': {\n      '&[data-hovered]': {\n        backgroundColor: '$background-interactive-surface-hover',\n      },\n\n      '&:active, &[data-pressed]': {\n        backgroundColor: '$background-interactive-surface-pressed',\n      },\n    },\n  },\n}\n","import { styled } from '@mirohq/design-system-stitches'\nimport { styles as baseIconStyles } from '@mirohq/design-system-base-icon'\n\nimport { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\nimport { sizes } from './base-item.styled'\n\nconst iconSelector = '& svg, & img'\n\nexport const StyledIcon = styled(BaseItem, {\n  padding: 0,\n  font: 'unset',\n  color: '$icon-default',\n  ...sharedStyles.base,\n  variants: {\n    active: {\n      true: {\n        backgroundColor: '$background-interactive-secondary-selected',\n        color: '$icon-on-interactive-selected',\n      },\n      false: {\n        [disabledSelector]: {\n          pointerEvents: 'none',\n          color: '$icon-disabled',\n        },\n      },\n    },\n    size: {\n      small: {\n        width: sizes.small,\n        height: sizes.small,\n        [iconSelector]: {\n          ...baseIconStyles.size.small,\n        },\n      },\n      medium: {\n        width: sizes.medium,\n        height: sizes.medium,\n        [iconSelector]: {\n          ...baseIconStyles.size.medium,\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n","import { createContext, useContext } from 'react'\nimport type { ReactNode } from 'react'\n\nimport type { ToolbarSize } from '../types'\n\ninterface ToolbarContextProps {\n  size: ToolbarSize\n}\n\nexport interface ToolbarProviderProps {\n  children?: ReactNode\n  size?: ToolbarSize\n}\n\nconst ToolbarContext = createContext<ToolbarContextProps>({\n  size: 'medium',\n})\n\nexport const ToolbarProvider = ({\n  children,\n  size = 'medium',\n}: ToolbarProviderProps): JSX.Element => (\n  <ToolbarContext.Provider value={{ size }}>{children}</ToolbarContext.Provider>\n)\n\nexport const useToolbarContext = (): ToolbarContextProps =>\n  useContext(ToolbarContext)\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { StyledIcon } from './icon.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\nexport interface IconProps extends BaseItemProps {\n  /**\n   * Renders icon in enabled/toggled state.\n   * @default false\n   */\n  active?: boolean\n}\n\nexport const Icon = React.forwardRef<ElementRef<typeof StyledIcon>, IconProps>(\n  ({ active = false, ...restProps }, forwardRef) => {\n    const { size } = useToolbarContext()\n\n    return (\n      <StyledIcon {...restProps} active={active} size={size} ref={forwardRef} />\n    )\n  }\n)\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Separator } from '@radix-ui/react-toolbar'\n\nexport const StyledSeparator = styled(Separator, {\n  all: 'unset',\n  display: 'block',\n  boxSizing: 'border-box',\n  backgroundColor: '$border-subtle',\n\n  variants: {\n    size: {\n      small: {\n        '&[data-orientation=\"vertical\"]': {\n          width: '1px',\n          height: '$5',\n          margin: '0 $50',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '1px',\n          width: '$5',\n          margin: '$50 0',\n        },\n      },\n      medium: {\n        '&[data-orientation=\"vertical\"]': {\n          width: '1px',\n          height: '$6',\n          margin: '0 $50',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '1px',\n          width: '$6',\n          margin: '$50 0',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n\nexport type StyledSeparatorProps = StrictComponentProps<typeof StyledSeparator>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { StyledSeparatorProps } from './separator.styled'\nimport { StyledSeparator } from './separator.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\nexport interface SeparatorProps extends StyledSeparatorProps {}\n\nexport const Separator = React.forwardRef<\n  ElementRef<typeof StyledSeparator>,\n  SeparatorProps\n>((props, forwardRef) => {\n  const { size } = useToolbarContext()\n\n  return <StyledSeparator {...props} size={size} ref={forwardRef} />\n})\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\n\nexport const StyledLink = styled(BaseItem, {\n  paddingX: '$150',\n  color: '$text-interactive-primary',\n  textDecoration: 'underline solid',\n  textDecorationThickness: '1px',\n  textUnderlineOffset: '4px',\n  outline: 'none',\n  ...sharedStyles.base,\n\n  [disabledSelector]: {\n    pointerEvents: 'none',\n    color: '$text-disabled',\n  },\n})\n","import React from 'react'\nimport type { ElementRef, AnchorHTMLAttributes } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { StyledLink } from './link.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\ntype ItemPropsWithAnchor = Omit<BaseItemProps, 'ref'> &\n  AnchorHTMLAttributes<typeof StyledLink>\nexport interface LinkProps extends ItemPropsWithAnchor {}\n\nexport const Link = React.forwardRef<ElementRef<'a'>, LinkProps>(\n  ({ children, href, ...restProps }, forwardRef) => {\n    const { size } = useToolbarContext()\n\n    return (\n      <StyledLink {...restProps} size={size} asChild>\n        <a href={href} ref={forwardRef}>\n          {children}\n        </a>\n      </StyledLink>\n    )\n  }\n)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\n\nexport const StyledItem = styled(BaseItem, {\n  ...sharedStyles.base,\n  variants: {\n    active: {\n      true: {\n        backgroundColor: '$background-interactive-secondary-selected',\n        color: '$text-on-interactive-selected',\n      },\n      false: {\n        [disabledSelector]: {\n          pointerEvents: 'none',\n          color: '$text-disabled',\n        },\n      },\n    },\n  },\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { BaseItem } from './base-item'\nimport { StyledItem } from './item.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\nexport interface ItemProps extends BaseItemProps {\n  /**\n   * It's applied by default when using with asChild attribute.\n   * You can still combine default Item styles with your own component by\n   * setting this prop to false.\n   * Note: Must be used together with asChild\n   * @default true\n   */\n  unstyled?: boolean\n\n  /**\n   * Renders item in enabled/toggled state.\n   * @default false\n   */\n  active?: boolean\n}\n\nexport const Item = React.forwardRef<ElementRef<typeof StyledItem>, ItemProps>(\n  ({ active = false, unstyled = true, asChild, ...restProps }, forwardRef) => {\n    const { size } = useToolbarContext()\n    const shouldRenderUnstyled = asChild === true ? unstyled : false\n\n    if (shouldRenderUnstyled) {\n      return <BaseItem {...restProps} asChild={asChild} ref={forwardRef} />\n    }\n\n    return (\n      <StyledItem\n        {...restProps}\n        asChild={asChild}\n        active={active}\n        size={size}\n        ref={forwardRef}\n      />\n    )\n  }\n)\n","import { useCallback } from 'react'\nimport type { KeyboardEvent } from 'react'\nimport { useDirection } from '@radix-ui/react-direction'\n\ninterface UseToolbarKeyboardNavigationProps {\n  orientation?: 'horizontal' | 'vertical'\n  dir?: 'ltr' | 'rtl'\n  loop?: boolean\n  onKeyDown?: (event: KeyboardEvent<HTMLDivElement>) => void\n}\n\n/**\n * Custom keyboard navigation for Radix Toolbar that allows navigation to aria-disabled items.\n *\n * By default, Radix UI Toolbar skips items with aria-disabled=\"true\" during keyboard navigation.\n * This hook intercepts arrow key events and manually handles focus management when aria-disabled\n * items are involved, while delegating to Radix for normal navigation.\n */\nexport const useToolbarKeyboardNavigation = ({\n  orientation = 'horizontal',\n  dir,\n  loop = true,\n  onKeyDown,\n}: UseToolbarKeyboardNavigationProps): ((\n  event: KeyboardEvent<HTMLDivElement>\n) => void) => {\n  const localDir = useDirection(dir ?? 'ltr')\n\n  return useCallback(\n    (event: KeyboardEvent<HTMLDivElement>) => {\n      const { key, currentTarget } = event\n      const isHorizontal = orientation === 'horizontal'\n      const isRTL = localDir === 'rtl'\n\n      const isForward =\n        (isHorizontal && key === (isRTL ? 'ArrowLeft' : 'ArrowRight')) ||\n        (!isHorizontal && key === 'ArrowDown')\n\n      const isBackward =\n        (isHorizontal && key === (isRTL ? 'ArrowRight' : 'ArrowLeft')) ||\n        (!isHorizontal && key === 'ArrowUp')\n\n      if (!isForward && !isBackward) {\n        onKeyDown?.(event)\n        return\n      }\n\n      // Find all navigable items (using Radix's collection attribute)\n      const items = Array.from(\n        currentTarget.querySelectorAll('[data-radix-collection-item]')\n      ).filter(item => !item.hasAttribute('disabled')) as HTMLElement[]\n\n      // Find currently focused item\n      const currentIndex = items.findIndex(item =>\n        item.contains(document.activeElement)\n      )\n\n      if (items.length === 0 || currentIndex === -1) {\n        return onKeyDown?.(event)\n      }\n\n      // Calculate next item index\n      let nextIndex: number\n      if (isForward) {\n        nextIndex = currentIndex + 1\n        if (nextIndex >= items.length) {\n          nextIndex = loop ? 0 : currentIndex\n        }\n      } else {\n        nextIndex = currentIndex - 1\n        if (nextIndex < 0) {\n          nextIndex = loop ? items.length - 1 : currentIndex\n        }\n      }\n\n      // Check if aria-disabled items are involved\n      const currentIsAriaDisabled =\n        items[currentIndex]?.getAttribute('aria-disabled') === 'true'\n      const nextIsAriaDisabled =\n        items[nextIndex]?.getAttribute('aria-disabled') === 'true'\n\n      // Only override Radix if aria-disabled items are involved\n      // Otherwise, let Radix handle it with all their edge cases and optimizations\n      if (!currentIsAriaDisabled && !nextIsAriaDisabled) {\n        onKeyDown?.(event)\n        return\n      }\n\n      // Take control: prevent Radix's handler and manually move focus\n      event.preventDefault()\n      event.stopPropagation()\n\n      if (nextIndex !== currentIndex) {\n        items[nextIndex]?.focus()\n      }\n\n      onKeyDown?.(event)\n    },\n    [orientation, localDir, loop, onKeyDown]\n  )\n}\n","import React from 'react'\nimport type { ElementRef, ForwardRefExoticComponent } from 'react'\n\nimport type { StyledToolbarProps } from './toolbar.styled'\nimport { StyledToolbar } from './toolbar.styled'\nimport { Icon } from './partials/icon'\nimport { Separator } from './partials/separator'\nimport { Link } from './partials/link'\nimport { Item } from './partials/item'\nimport { useToolbarKeyboardNavigation } from './hooks/use-toolbar-keyboard-navigation'\nimport { ToolbarProvider } from './hooks/use-toolbar-context'\nimport type { ToolbarSize } from './types'\n\nexport interface ToolbarProps extends StyledToolbarProps {\n  /**\n   * @deprecated Please use variant for non-floating toolbar\n   */\n  unstyled?: boolean\n\n  /**\n   * When floating, the toolbar has shadow and border to differentiate it from the surface\n   * @default floating\n   */\n  variant?: StyledToolbarProps['variant']\n\n  /**\n   * The orientation of the toolbar\n   * @default 'horizontal'\n   */\n  orientation?: 'horizontal' | 'vertical'\n\n  /**\n   * The reading direction of the toolbar\n   * @default 'ltr'\n   */\n  dir?: 'ltr' | 'rtl'\n\n  /**\n   * When true, keyboard navigation will loop from last tab to first, and vice versa\n   * @default true\n   */\n  loop?: boolean\n\n  /**\n   * The size of toolbar items\n   * @default 'medium'\n   */\n  size?: ToolbarSize\n}\n\nexport const Toolbar = React.forwardRef<\n  ElementRef<typeof StyledToolbar>,\n  ToolbarProps\n>(\n  (\n    {\n      unstyled,\n      orientation = 'horizontal',\n      variant = 'floating',\n      dir = 'ltr',\n      loop = true,\n      size = 'medium',\n      onKeyDown,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const variantProp =\n      unstyled === undefined ? variant : unstyled ? 'flat' : 'floating'\n\n    const handleKeyDown = useToolbarKeyboardNavigation({\n      orientation,\n      dir,\n      loop,\n      onKeyDown,\n    })\n\n    return (\n      <ToolbarProvider size={size}>\n        <StyledToolbar\n          variant={variantProp}\n          orientation={orientation}\n          dir={dir}\n          loop={loop}\n          size={size}\n          onKeyDown={handleKeyDown}\n          ref={forwardRef}\n          {...restProps}\n        />\n      </ToolbarProvider>\n    )\n  }\n) as ForwardRefExoticComponent<ToolbarProps> & Partials\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n  Icon: typeof Icon\n  Item: typeof Item\n  Link: typeof Link\n  Separator: typeof Separator\n}\n\nToolbar.Icon = Icon\nToolbar.Item = Item\nToolbar.Link = Link\nToolbar.Separator = Separator\n"],"names":["baseIconStyles","Separator"],"mappings":"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"}
+{"version":3,"file":"module.js","sources":["../src/toolbar.styled.ts","../src/partials/base-item.styled.ts","../src/partials/base-item.tsx","../src/styles.ts","../src/partials/icon.styled.tsx","../src/hooks/use-toolbar-context.tsx","../src/partials/icon.tsx","../src/partials/separator.styled.ts","../src/partials/separator.tsx","../src/partials/link.styled.tsx","../src/partials/link.tsx","../src/partials/item.styled.tsx","../src/partials/item.tsx","../src/hooks/use-toolbar-keyboard-navigation.ts","../src/toolbar.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Root } from '@radix-ui/react-toolbar'\n\nexport const StyledToolbar = styled(Root, {\n  all: 'unset',\n  display: 'flex',\n  boxSizing: 'border-box',\n  alignItems: 'center',\n  maxWidth: '100%',\n  gap: '$50',\n\n  variants: {\n    variant: {\n      floating: {\n        backgroundColor: '$background-layout',\n        boxShadow: '$elevation-100',\n        border: '0.5px solid $border-subtle',\n        borderRadius: '$toolbar',\n        padding: '$50',\n      },\n      flat: {},\n    },\n    size: {\n      small: {\n        '&[data-orientation=\"vertical\"]': {\n          flexDirection: 'column',\n          width: '$10',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '$10',\n        },\n      },\n      medium: {\n        '&[data-orientation=\"vertical\"]': {\n          flexDirection: 'column',\n          width: '$12',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '$12',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n\nexport type StyledToolbarProps = StrictComponentProps<typeof StyledToolbar>\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport * as RadixToolbar from '@radix-ui/react-toolbar'\n\nexport const sizes = {\n  small: '$8',\n  medium: '$10',\n} as const\n\nexport const StyledBaseItem = styled(RadixToolbar.Button, {\n  boxSizing: 'border-box',\n  cursor: 'pointer',\n  userSelect: 'none',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  flexShrink: 0,\n\n  variants: {\n    size: {\n      small: {\n        height: sizes.small,\n        fontSize: '$175',\n      },\n      medium: {\n        height: sizes.medium,\n        fontSize: '$200',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n\nexport type StyledBaseItemProps = StrictComponentProps<typeof StyledBaseItem>\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { useHover } from '@react-aria/interactions'\nimport type { HoverEvents } from '@react-types/shared'\nimport { mergeProps } from '@react-aria/utils'\nimport { usePress } from '@mirohq/design-system-use-press'\nimport { booleanify } from '@mirohq/design-system-utils'\nimport type { PressEvents } from '@mirohq/design-system-use-press'\nimport { useAriaDisabled } from '@mirohq/design-system-use-aria-disabled'\n\nimport { StyledBaseItem } from './base-item.styled'\nimport type { StyledBaseItemProps } from './base-item.styled'\nimport type { ToolbarSize } from '../types'\n\nexport interface BaseItemProps\n  extends StyledBaseItemProps,\n    HoverEvents,\n    PressEvents {\n  disabled?: boolean\n  size?: ToolbarSize\n}\n\nexport const BaseItem = React.forwardRef<\n  ElementRef<typeof StyledBaseItem>,\n  BaseItemProps\n>(\n  (\n    {\n      disabled = false,\n      'aria-disabled': ariaDisabled,\n      asChild,\n      size,\n      onHoverStart,\n      onHoverEnd,\n      onHoverChange,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const elementProps = useAriaDisabled(\n      {\n        ...restProps,\n        ariaDisabled,\n      },\n      { allowArrows: true }\n    )\n\n    const { pressProps } = usePress({\n      preventFocusOnPress: 'auto',\n      disabled: disabled || booleanify(ariaDisabled),\n      ...elementProps,\n    })\n\n    const { hoverProps, isHovered } = useHover({\n      onHoverStart,\n      onHoverEnd,\n      onHoverChange,\n    })\n\n    return (\n      <StyledBaseItem\n        {...mergeProps(pressProps, hoverProps)}\n        data-hovered={isHovered ? '' : undefined}\n        asChild={asChild}\n        size={size}\n        disabled={disabled}\n        aria-disabled={booleanify(ariaDisabled) ? 'true' : ariaDisabled}\n        ref={forwardRef}\n      />\n    )\n  }\n)\n","import { focus } from '@mirohq/design-system-styles'\n\nexport const disabledSelector = '&[disabled], &[aria-disabled=\"true\"]'\n\nexport const sharedStyles = {\n  base: {\n    backgroundColor: '$transparent',\n    borderRadius: '$toolbar-item',\n    border: 'none',\n    ...focus.css({\n      boxShadow: '$focus',\n    }),\n    '&[disabled]': {\n      pointerEvents: 'none',\n    },\n    '&:not([aria-disabled=\"true\"])': {\n      '&[data-hovered]': {\n        backgroundColor: '$toolbar-item-background-hover',\n      },\n\n      '&:active, &[data-pressed]': {\n        backgroundColor: '$toolbar-item-background-pressed',\n      },\n    },\n  },\n}\n","import { styled } from '@mirohq/design-system-stitches'\nimport { styles as baseIconStyles } from '@mirohq/design-system-base-icon'\n\nimport { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\nimport { sizes } from './base-item.styled'\n\nconst iconSelector = '& svg, & img'\n\nexport const StyledIcon = styled(BaseItem, {\n  padding: 0,\n  font: 'unset',\n  color: '$icon-default',\n  ...sharedStyles.base,\n  variants: {\n    active: {\n      true: {\n        backgroundColor: '$toolbar-item-background-selected',\n        color: '$icon-on-interactive-selected',\n      },\n      false: {\n        [disabledSelector]: {\n          pointerEvents: 'none',\n          color: '$icon-disabled',\n        },\n      },\n    },\n    size: {\n      small: {\n        width: sizes.small,\n        height: sizes.small,\n        [iconSelector]: {\n          ...baseIconStyles.size.small,\n        },\n      },\n      medium: {\n        width: sizes.medium,\n        height: sizes.medium,\n        [iconSelector]: {\n          ...baseIconStyles.size.medium,\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n","import { createContext, useContext } from 'react'\nimport type { ReactNode } from 'react'\n\nimport type { ToolbarSize } from '../types'\n\ninterface ToolbarContextProps {\n  size: ToolbarSize\n}\n\nexport interface ToolbarProviderProps {\n  children?: ReactNode\n  size?: ToolbarSize\n}\n\nconst ToolbarContext = createContext<ToolbarContextProps>({\n  size: 'medium',\n})\n\nexport const ToolbarProvider = ({\n  children,\n  size = 'medium',\n}: ToolbarProviderProps): JSX.Element => (\n  <ToolbarContext.Provider value={{ size }}>{children}</ToolbarContext.Provider>\n)\n\nexport const useToolbarContext = (): ToolbarContextProps =>\n  useContext(ToolbarContext)\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { StyledIcon } from './icon.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\nexport interface IconProps extends BaseItemProps {\n  /**\n   * Renders icon in enabled/toggled state.\n   * @default false\n   */\n  active?: boolean\n}\n\nexport const Icon = React.forwardRef<ElementRef<typeof StyledIcon>, IconProps>(\n  ({ active = false, ...restProps }, forwardRef) => {\n    const { size } = useToolbarContext()\n\n    return (\n      <StyledIcon {...restProps} active={active} size={size} ref={forwardRef} />\n    )\n  }\n)\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Separator } from '@radix-ui/react-toolbar'\n\nexport const StyledSeparator = styled(Separator, {\n  all: 'unset',\n  display: 'block',\n  boxSizing: 'border-box',\n  backgroundColor: '$border-subtle',\n\n  variants: {\n    size: {\n      small: {\n        '&[data-orientation=\"vertical\"]': {\n          width: '1px',\n          height: '$5',\n          margin: '0 $50',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '1px',\n          width: '$5',\n          margin: '$50 0',\n        },\n      },\n      medium: {\n        '&[data-orientation=\"vertical\"]': {\n          width: '1px',\n          height: '$6',\n          margin: '0 $50',\n        },\n        '&[data-orientation=\"horizontal\"]': {\n          height: '1px',\n          width: '$6',\n          margin: '$50 0',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n})\n\nexport type StyledSeparatorProps = StrictComponentProps<typeof StyledSeparator>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { StyledSeparatorProps } from './separator.styled'\nimport { StyledSeparator } from './separator.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\nexport interface SeparatorProps extends StyledSeparatorProps {}\n\nexport const Separator = React.forwardRef<\n  ElementRef<typeof StyledSeparator>,\n  SeparatorProps\n>((props, forwardRef) => {\n  const { size } = useToolbarContext()\n\n  return <StyledSeparator {...props} size={size} ref={forwardRef} />\n})\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\n\nexport const StyledLink = styled(BaseItem, {\n  paddingX: '$150',\n  color: '$text-interactive-primary',\n  textDecoration: 'underline solid',\n  textDecorationThickness: '1px',\n  textUnderlineOffset: '4px',\n  outline: 'none',\n  ...sharedStyles.base,\n\n  [disabledSelector]: {\n    pointerEvents: 'none',\n    color: '$text-disabled',\n  },\n})\n","import React from 'react'\nimport type { ElementRef, AnchorHTMLAttributes } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { StyledLink } from './link.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\ntype ItemPropsWithAnchor = Omit<BaseItemProps, 'ref'> &\n  AnchorHTMLAttributes<typeof StyledLink>\nexport interface LinkProps extends ItemPropsWithAnchor {}\n\nexport const Link = React.forwardRef<ElementRef<'a'>, LinkProps>(\n  ({ children, href, ...restProps }, forwardRef) => {\n    const { size } = useToolbarContext()\n\n    return (\n      <StyledLink {...restProps} size={size} asChild>\n        <a href={href} ref={forwardRef}>\n          {children}\n        </a>\n      </StyledLink>\n    )\n  }\n)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\n\nexport const StyledItem = styled(BaseItem, {\n  ...sharedStyles.base,\n  variants: {\n    active: {\n      true: {\n        backgroundColor: '$toolbar-item-background-selected',\n        color: '$text-on-interactive-selected',\n      },\n      false: {\n        [disabledSelector]: {\n          pointerEvents: 'none',\n          color: '$text-disabled',\n        },\n      },\n    },\n  },\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { BaseItem } from './base-item'\nimport { StyledItem } from './item.styled'\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\n\nexport interface ItemProps extends BaseItemProps {\n  /**\n   * It's applied by default when using with asChild attribute.\n   * You can still combine default Item styles with your own component by\n   * setting this prop to false.\n   * Note: Must be used together with asChild\n   * @default true\n   */\n  unstyled?: boolean\n\n  /**\n   * Renders item in enabled/toggled state.\n   * @default false\n   */\n  active?: boolean\n}\n\nexport const Item = React.forwardRef<ElementRef<typeof StyledItem>, ItemProps>(\n  ({ active = false, unstyled = true, asChild, ...restProps }, forwardRef) => {\n    const { size } = useToolbarContext()\n    const shouldRenderUnstyled = asChild === true ? unstyled : false\n\n    if (shouldRenderUnstyled) {\n      return <BaseItem {...restProps} asChild={asChild} ref={forwardRef} />\n    }\n\n    return (\n      <StyledItem\n        {...restProps}\n        asChild={asChild}\n        active={active}\n        size={size}\n        ref={forwardRef}\n      />\n    )\n  }\n)\n","import { useCallback } from 'react'\nimport type { KeyboardEvent } from 'react'\nimport { useDirection } from '@radix-ui/react-direction'\n\ninterface UseToolbarKeyboardNavigationProps {\n  orientation?: 'horizontal' | 'vertical'\n  dir?: 'ltr' | 'rtl'\n  loop?: boolean\n  onKeyDown?: (event: KeyboardEvent<HTMLDivElement>) => void\n}\n\n/**\n * Custom keyboard navigation for Radix Toolbar that allows navigation to aria-disabled items.\n *\n * By default, Radix UI Toolbar skips items with aria-disabled=\"true\" during keyboard navigation.\n * This hook intercepts arrow key events and manually handles focus management when aria-disabled\n * items are involved, while delegating to Radix for normal navigation.\n */\nexport const useToolbarKeyboardNavigation = ({\n  orientation = 'horizontal',\n  dir,\n  loop = true,\n  onKeyDown,\n}: UseToolbarKeyboardNavigationProps): ((\n  event: KeyboardEvent<HTMLDivElement>\n) => void) => {\n  const localDir = useDirection(dir ?? 'ltr')\n\n  return useCallback(\n    (event: KeyboardEvent<HTMLDivElement>) => {\n      const { key, currentTarget } = event\n      const isHorizontal = orientation === 'horizontal'\n      const isRTL = localDir === 'rtl'\n\n      const isForward =\n        (isHorizontal && key === (isRTL ? 'ArrowLeft' : 'ArrowRight')) ||\n        (!isHorizontal && key === 'ArrowDown')\n\n      const isBackward =\n        (isHorizontal && key === (isRTL ? 'ArrowRight' : 'ArrowLeft')) ||\n        (!isHorizontal && key === 'ArrowUp')\n\n      if (!isForward && !isBackward) {\n        onKeyDown?.(event)\n        return\n      }\n\n      // Find all navigable items (using Radix's collection attribute)\n      const items = Array.from(\n        currentTarget.querySelectorAll('[data-radix-collection-item]')\n      ).filter(item => !item.hasAttribute('disabled')) as HTMLElement[]\n\n      // Find currently focused item\n      const currentIndex = items.findIndex(item =>\n        item.contains(document.activeElement)\n      )\n\n      if (items.length === 0 || currentIndex === -1) {\n        return onKeyDown?.(event)\n      }\n\n      // Calculate next item index\n      let nextIndex: number\n      if (isForward) {\n        nextIndex = currentIndex + 1\n        if (nextIndex >= items.length) {\n          nextIndex = loop ? 0 : currentIndex\n        }\n      } else {\n        nextIndex = currentIndex - 1\n        if (nextIndex < 0) {\n          nextIndex = loop ? items.length - 1 : currentIndex\n        }\n      }\n\n      // Check if aria-disabled items are involved\n      const currentIsAriaDisabled =\n        items[currentIndex]?.getAttribute('aria-disabled') === 'true'\n      const nextIsAriaDisabled =\n        items[nextIndex]?.getAttribute('aria-disabled') === 'true'\n\n      // Only override Radix if aria-disabled items are involved\n      // Otherwise, let Radix handle it with all their edge cases and optimizations\n      if (!currentIsAriaDisabled && !nextIsAriaDisabled) {\n        onKeyDown?.(event)\n        return\n      }\n\n      // Take control: prevent Radix's handler and manually move focus\n      event.preventDefault()\n      event.stopPropagation()\n\n      if (nextIndex !== currentIndex) {\n        items[nextIndex]?.focus()\n      }\n\n      onKeyDown?.(event)\n    },\n    [orientation, localDir, loop, onKeyDown]\n  )\n}\n","import React from 'react'\nimport type { ElementRef, ForwardRefExoticComponent } from 'react'\n\nimport type { StyledToolbarProps } from './toolbar.styled'\nimport { StyledToolbar } from './toolbar.styled'\nimport { Icon } from './partials/icon'\nimport { Separator } from './partials/separator'\nimport { Link } from './partials/link'\nimport { Item } from './partials/item'\nimport { useToolbarKeyboardNavigation } from './hooks/use-toolbar-keyboard-navigation'\nimport { ToolbarProvider } from './hooks/use-toolbar-context'\nimport type { ToolbarSize } from './types'\n\nexport interface ToolbarProps extends StyledToolbarProps {\n  /**\n   * @deprecated Please use variant for non-floating toolbar\n   */\n  unstyled?: boolean\n\n  /**\n   * When floating, the toolbar has shadow and border to differentiate it from the surface\n   * @default floating\n   */\n  variant?: StyledToolbarProps['variant']\n\n  /**\n   * The orientation of the toolbar\n   * @default 'horizontal'\n   */\n  orientation?: 'horizontal' | 'vertical'\n\n  /**\n   * The reading direction of the toolbar\n   * @default 'ltr'\n   */\n  dir?: 'ltr' | 'rtl'\n\n  /**\n   * When true, keyboard navigation will loop from last tab to first, and vice versa\n   * @default true\n   */\n  loop?: boolean\n\n  /**\n   * The size of toolbar items\n   * @default 'medium'\n   */\n  size?: ToolbarSize\n}\n\nexport const Toolbar = React.forwardRef<\n  ElementRef<typeof StyledToolbar>,\n  ToolbarProps\n>(\n  (\n    {\n      unstyled,\n      orientation = 'horizontal',\n      variant = 'floating',\n      dir = 'ltr',\n      loop = true,\n      size = 'medium',\n      onKeyDown,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const variantProp =\n      unstyled === undefined ? variant : unstyled ? 'flat' : 'floating'\n\n    const handleKeyDown = useToolbarKeyboardNavigation({\n      orientation,\n      dir,\n      loop,\n      onKeyDown,\n    })\n\n    return (\n      <ToolbarProvider size={size}>\n        <StyledToolbar\n          variant={variantProp}\n          orientation={orientation}\n          dir={dir}\n          loop={loop}\n          size={size}\n          onKeyDown={handleKeyDown}\n          ref={forwardRef}\n          {...restProps}\n        />\n      </ToolbarProvider>\n    )\n  }\n) as ForwardRefExoticComponent<ToolbarProps> & Partials\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n  Icon: typeof Icon\n  Item: typeof Item\n  Link: typeof Link\n  Separator: typeof Separator\n}\n\nToolbar.Icon = Icon\nToolbar.Item = Item\nToolbar.Link = Link\nToolbar.Separator = Separator\n"],"names":["baseIconStyles","Separator"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mirohq/design-system-toolbar",
-  "version": "3.3.24",
+  "version": "3.3.26",
   "description": "",
   "author": "Miro",
   "source": "src/index.ts",
@@ -33,11 +33,11 @@
     "@react-aria/utils": "^3.31.0",
     "@react-types/shared": "^3.16.0",
     "@mirohq/design-system-base-icon": "^1.2.1",
-    "@mirohq/design-system-stitches": "^3.3.24",
+    "@mirohq/design-system-styles": "^3.2.25",
     "@mirohq/design-system-use-aria-disabled": "^1.1.4",
+    "@mirohq/design-system-utils": "^1.3.0",
     "@mirohq/design-system-use-press": "^1.1.4",
-    "@mirohq/design-system-styles": "^3.2.24",
-    "@mirohq/design-system-utils": "^1.3.0"
+    "@mirohq/design-system-stitches": "^3.3.25"
   },
   "scripts": {
     "build": "rollup -c ../../../rollup.config.js",