@mirohq/design-system-toolbar 2.5.2-combobox.0 → 2.5.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/main.js +1 -1
  2. package/dist/main.js.map +1 -1
  3. package/dist/module.js +1 -1
  4. package/dist/module.js.map +1 -1
  5. package/dist/types.d.ts +276 -116
  6. package/package.json +5 -5
package/dist/main.js CHANGED
@@ -83,7 +83,7 @@ const StyledItem = designSystemStitches.styled(RadixToolbar__namespace.Button, {
83
83
  height: "$10",
84
84
  ...designSystemStyles.focus.css({
85
85
  boxShadow: "$focus-small-outline",
86
- borderColor: "$blue-500 !important"
86
+ borderColor: "$blue-400 !important"
87
87
  }),
88
88
  [disabledSelector]: {
89
89
  pointerEvents: "none",
package/dist/main.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"main.js","sources":["../src/toolbar.styled.ts","../src/partials/item.styled.ts","../src/partials/item.tsx","../src/partials/icon.styled.tsx","../src/partials/icon.tsx","../src/partials/separator.styled.ts","../src/partials/separator.tsx","../src/partials/link.styled.tsx","../src/partials/link.tsx","../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 '&[data-orientation=\"vertical\"]': {\n flexDirection: 'column',\n width: '$12',\n },\n\n '&[data-orientation=\"horizontal\"]': {\n height: '$12',\n },\n\n variants: {\n unstyled: {\n false: {\n backgroundColor: '$background-neutrals-container',\n boxShadow: '$50',\n borderRadius: '$50',\n padding: '2px',\n },\n },\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'\nimport { focus } from '@mirohq/design-system-styles'\n\nconst defaultStyles = {\n boxSizing: 'border-box',\n cursor: 'pointer',\n userSelect: 'none',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n}\n\nconst disabledSelector = '&[disabled], &[aria-disabled=\"true\"]'\n\nexport const StyledItem = styled(RadixToolbar.Button, {\n variants: {\n unstyled: {\n true: {\n ...defaultStyles,\n },\n false: {\n ...defaultStyles,\n borderRadius: 4,\n height: '$10',\n\n ...focus.css({\n boxShadow: '$focus-small-outline',\n borderColor: '$blue-500 !important',\n }),\n\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$text-neutrals-disabled',\n },\n\n '&[data-hovered]': {\n backgroundColor: '$background-primary-subtle-hover',\n color: '$icon-primary-hover',\n },\n\n '&:active, &[data-pressed]': {\n backgroundColor: '$background-primary-subtle-active',\n color: '$icon-primary-active',\n },\n },\n },\n wrapper: {\n true: {\n backgroundColor: 'transparent',\n border: 'none',\n cursor: 'pointer',\n },\n },\n active: {\n true: {},\n false: {},\n },\n },\n\n '&[tabindex=\"0\"]': {\n zIndex: '1',\n },\n\n compoundVariants: [\n {\n unstyled: false,\n active: true,\n css: {\n '&&': {\n backgroundColor: '$background-primary-subtle-selected',\n color: '$icon-primary-selected',\n },\n },\n },\n ],\n})\n\nexport type StyledItemProps = StrictComponentProps<typeof StyledItem>\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'\n\nimport { StyledItem } from './item.styled'\nimport type { StyledItemProps } from './item.styled'\n\nexport interface ItemProps extends StyledItemProps, HoverEvents, PressEvents {\n /**\n * Renders item in enabled/toggled state.\n * @default false\n */\n active?: boolean\n\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 disabled?: boolean\n}\n\nexport const Item = React.forwardRef<ElementRef<typeof StyledItem>, ItemProps>(\n (\n {\n disabled = false,\n 'aria-disabled': ariaDisabled,\n asChild,\n unstyled = true,\n active = false,\n onHoverStart,\n onHoverEnd,\n onHoverChange,\n ...restProps\n },\n forwardRef\n ) => {\n let elementProps = restProps\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 elementProps = mergeProps(pressProps, hoverProps)\n\n return (\n <StyledItem\n {...elementProps}\n data-hovered={isHovered ? '' : undefined}\n asChild={asChild}\n active={active}\n unstyled={asChild === true ? unstyled : false}\n wrapper={asChild !== true}\n disabled={disabled}\n aria-disabled={booleanify(ariaDisabled) ? 'true' : ariaDisabled}\n ref={forwardRef}\n />\n )\n }\n)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { Item } from './item'\n\nexport const StyledIcon = styled(Item, {\n padding: 0,\n border: 'none',\n font: 'unset',\n width: '$10',\n color: '$icon-neutrals',\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { ItemProps } from './item'\nimport { StyledIcon } from './icon.styled'\n\nexport type IconProps = Omit<ItemProps, 'unstyled'>\n\nexport const Icon = React.forwardRef<ElementRef<typeof StyledIcon>, IconProps>(\n (props, forwardRef) => (\n <StyledIcon unstyled={false} {...props} ref={forwardRef} />\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: 'rgba(205, 204, 215, 1)',\n\n '&[data-orientation=\"vertical\"]': {\n width: '1px',\n height: '$6',\n margin: '0 $50',\n },\n\n '&[data-orientation=\"horizontal\"]': {\n height: '1px',\n width: '$6',\n margin: '$50 0',\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'\n\nexport interface SeparatorProps extends StyledSeparatorProps {}\n\nexport const Separator = React.forwardRef<\n ElementRef<typeof StyledSeparator>,\n SeparatorProps\n>((props, forwardRef) => <StyledSeparator {...props} ref={forwardRef} />)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { Item } from './item'\n\nexport const StyledLink = styled(Item, {\n paddingX: '$150',\n textDecoration: 'none',\n})\n","import React from 'react'\nimport type { ElementRef, AnchorHTMLAttributes } from 'react'\n\nimport type { ItemProps } from './item'\nimport { StyledLink } from './link.styled'\n\ntype ItemPropsWithAnchor = Omit<ItemProps, 'unstyled'> &\n AnchorHTMLAttributes<typeof StyledLink>\nexport interface LinkProps extends ItemPropsWithAnchor {}\n\nexport const Link = React.forwardRef<ElementRef<typeof StyledLink>, LinkProps>(\n ({ children, href, ...restProps }, forwardRef) => (\n <StyledLink asChild unstyled={false} {...restProps} ref={forwardRef}>\n <a href={href}>{children}</a>\n </StyledLink>\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'\n\nexport interface ToolbarProps extends StyledToolbarProps {\n /**\n * Defines whether the toolbar has default styles (e.g. background, shadow, etc.)\n * @default false\n */\n unstyled?: boolean\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 * The reading direction of the toolbar\n * @deprecated use dir instead\n */\n direction?: '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\nexport const Toolbar = React.forwardRef<\n ElementRef<typeof StyledToolbar>,\n ToolbarProps\n>(\n (\n {\n unstyled = false,\n orientation = 'horizontal',\n dir = 'ltr',\n loop = true,\n direction,\n ...restProps\n },\n forwardRef\n ) => (\n <StyledToolbar\n unstyled={unstyled}\n orientation={orientation}\n dir={direction ?? dir}\n loop={loop}\n ref={forwardRef}\n {...restProps}\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","focus","React","usePress","booleanify","useHover","mergeProps","jsx","Separator"],"mappings":"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"}
1
+ {"version":3,"file":"main.js","sources":["../src/toolbar.styled.ts","../src/partials/item.styled.ts","../src/partials/item.tsx","../src/partials/icon.styled.tsx","../src/partials/icon.tsx","../src/partials/separator.styled.ts","../src/partials/separator.tsx","../src/partials/link.styled.tsx","../src/partials/link.tsx","../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 '&[data-orientation=\"vertical\"]': {\n flexDirection: 'column',\n width: '$12',\n },\n\n '&[data-orientation=\"horizontal\"]': {\n height: '$12',\n },\n\n variants: {\n unstyled: {\n false: {\n backgroundColor: '$background-neutrals-container',\n boxShadow: '$50',\n borderRadius: '$50',\n padding: '2px',\n },\n },\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'\nimport { focus } from '@mirohq/design-system-styles'\n\nconst defaultStyles = {\n boxSizing: 'border-box',\n cursor: 'pointer',\n userSelect: 'none',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n}\n\nconst disabledSelector = '&[disabled], &[aria-disabled=\"true\"]'\n\nexport const StyledItem = styled(RadixToolbar.Button, {\n variants: {\n unstyled: {\n true: {\n ...defaultStyles,\n },\n false: {\n ...defaultStyles,\n borderRadius: 4,\n height: '$10',\n\n ...focus.css({\n boxShadow: '$focus-small-outline',\n borderColor: '$blue-400 !important',\n }),\n\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$text-neutrals-disabled',\n },\n\n '&[data-hovered]': {\n backgroundColor: '$background-primary-subtle-hover',\n color: '$icon-primary-hover',\n },\n\n '&:active, &[data-pressed]': {\n backgroundColor: '$background-primary-subtle-active',\n color: '$icon-primary-active',\n },\n },\n },\n wrapper: {\n true: {\n backgroundColor: 'transparent',\n border: 'none',\n cursor: 'pointer',\n },\n },\n active: {\n true: {},\n false: {},\n },\n },\n\n '&[tabindex=\"0\"]': {\n zIndex: '1',\n },\n\n compoundVariants: [\n {\n unstyled: false,\n active: true,\n css: {\n '&&': {\n backgroundColor: '$background-primary-subtle-selected',\n color: '$icon-primary-selected',\n },\n },\n },\n ],\n})\n\nexport type StyledItemProps = StrictComponentProps<typeof StyledItem>\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'\n\nimport { StyledItem } from './item.styled'\nimport type { StyledItemProps } from './item.styled'\n\nexport interface ItemProps extends StyledItemProps, HoverEvents, PressEvents {\n /**\n * Renders item in enabled/toggled state.\n * @default false\n */\n active?: boolean\n\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 disabled?: boolean\n}\n\nexport const Item = React.forwardRef<ElementRef<typeof StyledItem>, ItemProps>(\n (\n {\n disabled = false,\n 'aria-disabled': ariaDisabled,\n asChild,\n unstyled = true,\n active = false,\n onHoverStart,\n onHoverEnd,\n onHoverChange,\n ...restProps\n },\n forwardRef\n ) => {\n let elementProps = restProps\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 elementProps = mergeProps(pressProps, hoverProps)\n\n return (\n <StyledItem\n {...elementProps}\n data-hovered={isHovered ? '' : undefined}\n asChild={asChild}\n active={active}\n unstyled={asChild === true ? unstyled : false}\n wrapper={asChild !== true}\n disabled={disabled}\n aria-disabled={booleanify(ariaDisabled) ? 'true' : ariaDisabled}\n ref={forwardRef}\n />\n )\n }\n)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { Item } from './item'\n\nexport const StyledIcon = styled(Item, {\n padding: 0,\n border: 'none',\n font: 'unset',\n width: '$10',\n color: '$icon-neutrals',\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { ItemProps } from './item'\nimport { StyledIcon } from './icon.styled'\n\nexport type IconProps = Omit<ItemProps, 'unstyled'>\n\nexport const Icon = React.forwardRef<ElementRef<typeof StyledIcon>, IconProps>(\n (props, forwardRef) => (\n <StyledIcon unstyled={false} {...props} ref={forwardRef} />\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: 'rgba(205, 204, 215, 1)',\n\n '&[data-orientation=\"vertical\"]': {\n width: '1px',\n height: '$6',\n margin: '0 $50',\n },\n\n '&[data-orientation=\"horizontal\"]': {\n height: '1px',\n width: '$6',\n margin: '$50 0',\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'\n\nexport interface SeparatorProps extends StyledSeparatorProps {}\n\nexport const Separator = React.forwardRef<\n ElementRef<typeof StyledSeparator>,\n SeparatorProps\n>((props, forwardRef) => <StyledSeparator {...props} ref={forwardRef} />)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { Item } from './item'\n\nexport const StyledLink = styled(Item, {\n paddingX: '$150',\n textDecoration: 'none',\n})\n","import React from 'react'\nimport type { ElementRef, AnchorHTMLAttributes } from 'react'\n\nimport type { ItemProps } from './item'\nimport { StyledLink } from './link.styled'\n\ntype ItemPropsWithAnchor = Omit<ItemProps, 'unstyled'> &\n AnchorHTMLAttributes<typeof StyledLink>\nexport interface LinkProps extends ItemPropsWithAnchor {}\n\nexport const Link = React.forwardRef<ElementRef<typeof StyledLink>, LinkProps>(\n ({ children, href, ...restProps }, forwardRef) => (\n <StyledLink asChild unstyled={false} {...restProps} ref={forwardRef}>\n <a href={href}>{children}</a>\n </StyledLink>\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'\n\nexport interface ToolbarProps extends StyledToolbarProps {\n /**\n * Defines whether the toolbar has default styles (e.g. background, shadow, etc.)\n * @default false\n */\n unstyled?: boolean\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 * The reading direction of the toolbar\n * @deprecated use dir instead\n */\n direction?: '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\nexport const Toolbar = React.forwardRef<\n ElementRef<typeof StyledToolbar>,\n ToolbarProps\n>(\n (\n {\n unstyled = false,\n orientation = 'horizontal',\n dir = 'ltr',\n loop = true,\n direction,\n ...restProps\n },\n forwardRef\n ) => (\n <StyledToolbar\n unstyled={unstyled}\n orientation={orientation}\n dir={direction ?? dir}\n loop={loop}\n ref={forwardRef}\n {...restProps}\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","focus","React","usePress","booleanify","useHover","mergeProps","jsx","Separator"],"mappings":"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"}
package/dist/module.js CHANGED
@@ -57,7 +57,7 @@ const StyledItem = styled(RadixToolbar.Button, {
57
57
  height: "$10",
58
58
  ...focus.css({
59
59
  boxShadow: "$focus-small-outline",
60
- borderColor: "$blue-500 !important"
60
+ borderColor: "$blue-400 !important"
61
61
  }),
62
62
  [disabledSelector]: {
63
63
  pointerEvents: "none",
package/dist/module.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"module.js","sources":["../src/toolbar.styled.ts","../src/partials/item.styled.ts","../src/partials/item.tsx","../src/partials/icon.styled.tsx","../src/partials/icon.tsx","../src/partials/separator.styled.ts","../src/partials/separator.tsx","../src/partials/link.styled.tsx","../src/partials/link.tsx","../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 '&[data-orientation=\"vertical\"]': {\n flexDirection: 'column',\n width: '$12',\n },\n\n '&[data-orientation=\"horizontal\"]': {\n height: '$12',\n },\n\n variants: {\n unstyled: {\n false: {\n backgroundColor: '$background-neutrals-container',\n boxShadow: '$50',\n borderRadius: '$50',\n padding: '2px',\n },\n },\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'\nimport { focus } from '@mirohq/design-system-styles'\n\nconst defaultStyles = {\n boxSizing: 'border-box',\n cursor: 'pointer',\n userSelect: 'none',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n}\n\nconst disabledSelector = '&[disabled], &[aria-disabled=\"true\"]'\n\nexport const StyledItem = styled(RadixToolbar.Button, {\n variants: {\n unstyled: {\n true: {\n ...defaultStyles,\n },\n false: {\n ...defaultStyles,\n borderRadius: 4,\n height: '$10',\n\n ...focus.css({\n boxShadow: '$focus-small-outline',\n borderColor: '$blue-500 !important',\n }),\n\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$text-neutrals-disabled',\n },\n\n '&[data-hovered]': {\n backgroundColor: '$background-primary-subtle-hover',\n color: '$icon-primary-hover',\n },\n\n '&:active, &[data-pressed]': {\n backgroundColor: '$background-primary-subtle-active',\n color: '$icon-primary-active',\n },\n },\n },\n wrapper: {\n true: {\n backgroundColor: 'transparent',\n border: 'none',\n cursor: 'pointer',\n },\n },\n active: {\n true: {},\n false: {},\n },\n },\n\n '&[tabindex=\"0\"]': {\n zIndex: '1',\n },\n\n compoundVariants: [\n {\n unstyled: false,\n active: true,\n css: {\n '&&': {\n backgroundColor: '$background-primary-subtle-selected',\n color: '$icon-primary-selected',\n },\n },\n },\n ],\n})\n\nexport type StyledItemProps = StrictComponentProps<typeof StyledItem>\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'\n\nimport { StyledItem } from './item.styled'\nimport type { StyledItemProps } from './item.styled'\n\nexport interface ItemProps extends StyledItemProps, HoverEvents, PressEvents {\n /**\n * Renders item in enabled/toggled state.\n * @default false\n */\n active?: boolean\n\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 disabled?: boolean\n}\n\nexport const Item = React.forwardRef<ElementRef<typeof StyledItem>, ItemProps>(\n (\n {\n disabled = false,\n 'aria-disabled': ariaDisabled,\n asChild,\n unstyled = true,\n active = false,\n onHoverStart,\n onHoverEnd,\n onHoverChange,\n ...restProps\n },\n forwardRef\n ) => {\n let elementProps = restProps\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 elementProps = mergeProps(pressProps, hoverProps)\n\n return (\n <StyledItem\n {...elementProps}\n data-hovered={isHovered ? '' : undefined}\n asChild={asChild}\n active={active}\n unstyled={asChild === true ? unstyled : false}\n wrapper={asChild !== true}\n disabled={disabled}\n aria-disabled={booleanify(ariaDisabled) ? 'true' : ariaDisabled}\n ref={forwardRef}\n />\n )\n }\n)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { Item } from './item'\n\nexport const StyledIcon = styled(Item, {\n padding: 0,\n border: 'none',\n font: 'unset',\n width: '$10',\n color: '$icon-neutrals',\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { ItemProps } from './item'\nimport { StyledIcon } from './icon.styled'\n\nexport type IconProps = Omit<ItemProps, 'unstyled'>\n\nexport const Icon = React.forwardRef<ElementRef<typeof StyledIcon>, IconProps>(\n (props, forwardRef) => (\n <StyledIcon unstyled={false} {...props} ref={forwardRef} />\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: 'rgba(205, 204, 215, 1)',\n\n '&[data-orientation=\"vertical\"]': {\n width: '1px',\n height: '$6',\n margin: '0 $50',\n },\n\n '&[data-orientation=\"horizontal\"]': {\n height: '1px',\n width: '$6',\n margin: '$50 0',\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'\n\nexport interface SeparatorProps extends StyledSeparatorProps {}\n\nexport const Separator = React.forwardRef<\n ElementRef<typeof StyledSeparator>,\n SeparatorProps\n>((props, forwardRef) => <StyledSeparator {...props} ref={forwardRef} />)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { Item } from './item'\n\nexport const StyledLink = styled(Item, {\n paddingX: '$150',\n textDecoration: 'none',\n})\n","import React from 'react'\nimport type { ElementRef, AnchorHTMLAttributes } from 'react'\n\nimport type { ItemProps } from './item'\nimport { StyledLink } from './link.styled'\n\ntype ItemPropsWithAnchor = Omit<ItemProps, 'unstyled'> &\n AnchorHTMLAttributes<typeof StyledLink>\nexport interface LinkProps extends ItemPropsWithAnchor {}\n\nexport const Link = React.forwardRef<ElementRef<typeof StyledLink>, LinkProps>(\n ({ children, href, ...restProps }, forwardRef) => (\n <StyledLink asChild unstyled={false} {...restProps} ref={forwardRef}>\n <a href={href}>{children}</a>\n </StyledLink>\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'\n\nexport interface ToolbarProps extends StyledToolbarProps {\n /**\n * Defines whether the toolbar has default styles (e.g. background, shadow, etc.)\n * @default false\n */\n unstyled?: boolean\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 * The reading direction of the toolbar\n * @deprecated use dir instead\n */\n direction?: '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\nexport const Toolbar = React.forwardRef<\n ElementRef<typeof StyledToolbar>,\n ToolbarProps\n>(\n (\n {\n unstyled = false,\n orientation = 'horizontal',\n dir = 'ltr',\n loop = true,\n direction,\n ...restProps\n },\n forwardRef\n ) => (\n <StyledToolbar\n unstyled={unstyled}\n orientation={orientation}\n dir={direction ?? dir}\n loop={loop}\n ref={forwardRef}\n {...restProps}\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":["Separator"],"mappings":"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"}
1
+ {"version":3,"file":"module.js","sources":["../src/toolbar.styled.ts","../src/partials/item.styled.ts","../src/partials/item.tsx","../src/partials/icon.styled.tsx","../src/partials/icon.tsx","../src/partials/separator.styled.ts","../src/partials/separator.tsx","../src/partials/link.styled.tsx","../src/partials/link.tsx","../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 '&[data-orientation=\"vertical\"]': {\n flexDirection: 'column',\n width: '$12',\n },\n\n '&[data-orientation=\"horizontal\"]': {\n height: '$12',\n },\n\n variants: {\n unstyled: {\n false: {\n backgroundColor: '$background-neutrals-container',\n boxShadow: '$50',\n borderRadius: '$50',\n padding: '2px',\n },\n },\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'\nimport { focus } from '@mirohq/design-system-styles'\n\nconst defaultStyles = {\n boxSizing: 'border-box',\n cursor: 'pointer',\n userSelect: 'none',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n}\n\nconst disabledSelector = '&[disabled], &[aria-disabled=\"true\"]'\n\nexport const StyledItem = styled(RadixToolbar.Button, {\n variants: {\n unstyled: {\n true: {\n ...defaultStyles,\n },\n false: {\n ...defaultStyles,\n borderRadius: 4,\n height: '$10',\n\n ...focus.css({\n boxShadow: '$focus-small-outline',\n borderColor: '$blue-400 !important',\n }),\n\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$text-neutrals-disabled',\n },\n\n '&[data-hovered]': {\n backgroundColor: '$background-primary-subtle-hover',\n color: '$icon-primary-hover',\n },\n\n '&:active, &[data-pressed]': {\n backgroundColor: '$background-primary-subtle-active',\n color: '$icon-primary-active',\n },\n },\n },\n wrapper: {\n true: {\n backgroundColor: 'transparent',\n border: 'none',\n cursor: 'pointer',\n },\n },\n active: {\n true: {},\n false: {},\n },\n },\n\n '&[tabindex=\"0\"]': {\n zIndex: '1',\n },\n\n compoundVariants: [\n {\n unstyled: false,\n active: true,\n css: {\n '&&': {\n backgroundColor: '$background-primary-subtle-selected',\n color: '$icon-primary-selected',\n },\n },\n },\n ],\n})\n\nexport type StyledItemProps = StrictComponentProps<typeof StyledItem>\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'\n\nimport { StyledItem } from './item.styled'\nimport type { StyledItemProps } from './item.styled'\n\nexport interface ItemProps extends StyledItemProps, HoverEvents, PressEvents {\n /**\n * Renders item in enabled/toggled state.\n * @default false\n */\n active?: boolean\n\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 disabled?: boolean\n}\n\nexport const Item = React.forwardRef<ElementRef<typeof StyledItem>, ItemProps>(\n (\n {\n disabled = false,\n 'aria-disabled': ariaDisabled,\n asChild,\n unstyled = true,\n active = false,\n onHoverStart,\n onHoverEnd,\n onHoverChange,\n ...restProps\n },\n forwardRef\n ) => {\n let elementProps = restProps\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 elementProps = mergeProps(pressProps, hoverProps)\n\n return (\n <StyledItem\n {...elementProps}\n data-hovered={isHovered ? '' : undefined}\n asChild={asChild}\n active={active}\n unstyled={asChild === true ? unstyled : false}\n wrapper={asChild !== true}\n disabled={disabled}\n aria-disabled={booleanify(ariaDisabled) ? 'true' : ariaDisabled}\n ref={forwardRef}\n />\n )\n }\n)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { Item } from './item'\n\nexport const StyledIcon = styled(Item, {\n padding: 0,\n border: 'none',\n font: 'unset',\n width: '$10',\n color: '$icon-neutrals',\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { ItemProps } from './item'\nimport { StyledIcon } from './icon.styled'\n\nexport type IconProps = Omit<ItemProps, 'unstyled'>\n\nexport const Icon = React.forwardRef<ElementRef<typeof StyledIcon>, IconProps>(\n (props, forwardRef) => (\n <StyledIcon unstyled={false} {...props} ref={forwardRef} />\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: 'rgba(205, 204, 215, 1)',\n\n '&[data-orientation=\"vertical\"]': {\n width: '1px',\n height: '$6',\n margin: '0 $50',\n },\n\n '&[data-orientation=\"horizontal\"]': {\n height: '1px',\n width: '$6',\n margin: '$50 0',\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'\n\nexport interface SeparatorProps extends StyledSeparatorProps {}\n\nexport const Separator = React.forwardRef<\n ElementRef<typeof StyledSeparator>,\n SeparatorProps\n>((props, forwardRef) => <StyledSeparator {...props} ref={forwardRef} />)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { Item } from './item'\n\nexport const StyledLink = styled(Item, {\n paddingX: '$150',\n textDecoration: 'none',\n})\n","import React from 'react'\nimport type { ElementRef, AnchorHTMLAttributes } from 'react'\n\nimport type { ItemProps } from './item'\nimport { StyledLink } from './link.styled'\n\ntype ItemPropsWithAnchor = Omit<ItemProps, 'unstyled'> &\n AnchorHTMLAttributes<typeof StyledLink>\nexport interface LinkProps extends ItemPropsWithAnchor {}\n\nexport const Link = React.forwardRef<ElementRef<typeof StyledLink>, LinkProps>(\n ({ children, href, ...restProps }, forwardRef) => (\n <StyledLink asChild unstyled={false} {...restProps} ref={forwardRef}>\n <a href={href}>{children}</a>\n </StyledLink>\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'\n\nexport interface ToolbarProps extends StyledToolbarProps {\n /**\n * Defines whether the toolbar has default styles (e.g. background, shadow, etc.)\n * @default false\n */\n unstyled?: boolean\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 * The reading direction of the toolbar\n * @deprecated use dir instead\n */\n direction?: '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\nexport const Toolbar = React.forwardRef<\n ElementRef<typeof StyledToolbar>,\n ToolbarProps\n>(\n (\n {\n unstyled = false,\n orientation = 'horizontal',\n dir = 'ltr',\n loop = true,\n direction,\n ...restProps\n },\n forwardRef\n ) => (\n <StyledToolbar\n unstyled={unstyled}\n orientation={orientation}\n dir={direction ?? dir}\n loop={loop}\n ref={forwardRef}\n {...restProps}\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":["Separator"],"mappings":"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"}
package/dist/types.d.ts CHANGED
@@ -17,63 +17,103 @@ declare const StyledToolbar: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_d
17
17
  };
18
18
  colors: {
19
19
  readonly black: any;
20
+ readonly 'blue-50': any;
20
21
  readonly 'blue-100': any;
22
+ readonly 'blue-150': any;
21
23
  readonly 'blue-200': any;
24
+ readonly 'blue-250': any;
22
25
  readonly 'blue-300': any;
26
+ readonly 'blue-350': any;
23
27
  readonly 'blue-400': any;
28
+ readonly 'blue-450': any;
24
29
  readonly 'blue-500': any;
30
+ readonly 'blue-550': any;
25
31
  readonly 'blue-600': any;
32
+ readonly 'blue-650': any;
26
33
  readonly 'blue-700': any;
34
+ readonly 'blue-750': any;
27
35
  readonly 'blue-800': any;
36
+ readonly 'blue-850': any;
28
37
  readonly 'blue-900': any;
29
- readonly 'blue-1000': any;
38
+ readonly 'blue-950': any;
39
+ readonly 'gray-50': any;
30
40
  readonly 'gray-100': any;
41
+ readonly 'gray-150': any;
31
42
  readonly 'gray-200': any;
43
+ readonly 'gray-250': any;
32
44
  readonly 'gray-300': any;
45
+ readonly 'gray-350': any;
33
46
  readonly 'gray-400': any;
47
+ readonly 'gray-450': any;
34
48
  readonly 'gray-500': any;
49
+ readonly 'gray-550': any;
35
50
  readonly 'gray-600': any;
51
+ readonly 'gray-650': any;
36
52
  readonly 'gray-700': any;
53
+ readonly 'gray-750': any;
37
54
  readonly 'gray-800': any;
55
+ readonly 'gray-850': any;
38
56
  readonly 'gray-900': any;
57
+ readonly 'gray-950': any;
58
+ readonly 'green-50': any;
39
59
  readonly 'green-100': any;
60
+ readonly 'green-150': any;
40
61
  readonly 'green-200': any;
62
+ readonly 'green-250': any;
41
63
  readonly 'green-300': any;
64
+ readonly 'green-350': any;
42
65
  readonly 'green-400': any;
66
+ readonly 'green-450': any;
43
67
  readonly 'green-500': any;
68
+ readonly 'green-550': any;
44
69
  readonly 'green-600': any;
70
+ readonly 'green-650': any;
45
71
  readonly 'green-700': any;
72
+ readonly 'green-750': any;
46
73
  readonly 'green-800': any;
74
+ readonly 'green-850': any;
47
75
  readonly 'green-900': any;
48
- readonly 'indigo-100': any;
49
- readonly 'indigo-200': any;
50
- readonly 'indigo-300': any;
51
- readonly 'indigo-400': any;
52
- readonly 'indigo-500': any;
53
- readonly 'indigo-600': any;
54
- readonly 'indigo-700': any;
55
- readonly 'indigo-800': any;
56
- readonly 'indigo-900': any;
76
+ readonly 'green-950': any;
77
+ readonly 'red-50': any;
57
78
  readonly 'red-100': any;
79
+ readonly 'red-150': any;
58
80
  readonly 'red-200': any;
81
+ readonly 'red-250': any;
59
82
  readonly 'red-300': any;
83
+ readonly 'red-350': any;
60
84
  readonly 'red-400': any;
85
+ readonly 'red-450': any;
61
86
  readonly 'red-500': any;
87
+ readonly 'red-550': any;
62
88
  readonly 'red-600': any;
89
+ readonly 'red-650': any;
63
90
  readonly 'red-700': any;
91
+ readonly 'red-750': any;
64
92
  readonly 'red-800': any;
93
+ readonly 'red-850': any;
65
94
  readonly 'red-900': any;
95
+ readonly 'red-950': any;
66
96
  readonly transparent: any;
67
97
  readonly white: any;
98
+ readonly 'yellow-50': any;
68
99
  readonly 'yellow-100': any;
100
+ readonly 'yellow-150': any;
69
101
  readonly 'yellow-200': any;
102
+ readonly 'yellow-250': any;
70
103
  readonly 'yellow-300': any;
104
+ readonly 'yellow-350': any;
71
105
  readonly 'yellow-400': any;
106
+ readonly 'yellow-450': any;
72
107
  readonly 'yellow-500': any;
108
+ readonly 'yellow-550': any;
73
109
  readonly 'yellow-600': any;
110
+ readonly 'yellow-650': any;
74
111
  readonly 'yellow-700': any;
112
+ readonly 'yellow-750': any;
75
113
  readonly 'yellow-800': any;
114
+ readonly 'yellow-850': any;
76
115
  readonly 'yellow-900': any;
116
+ readonly 'yellow-950': any;
77
117
  "background-alpha-active"?: any;
78
118
  "background-alpha-hover"?: any;
79
119
  "background-danger-prominent"?: any;
@@ -94,27 +134,19 @@ declare const StyledToolbar: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_d
94
134
  "background-neutrals-inverted-subtle"?: any;
95
135
  "background-neutrals-page"?: any;
96
136
  "background-neutrals-page-subtle"?: any;
97
- "background-neutrals-scrolls"?: any;
98
- "background-neutrals-scrolls-expanded"?: any;
99
- "background-neutrals-scrolls-hover"?: any;
100
- "background-neutrals-scrolls-pressed"?: any;
101
- "background-neutrals-scrolls-pressed-hover"?: any;
137
+ "background-neutrals-scrollbar"?: any;
138
+ "background-neutrals-scrollbar-active"?: any;
139
+ "background-neutrals-scrollbar-hover"?: any;
102
140
  "background-neutrals-subtle"?: any;
103
141
  "background-neutrals-subtle-active"?: any;
104
142
  "background-neutrals-subtle-hover"?: any;
105
143
  "background-primary-prominent"?: any;
106
144
  "background-primary-prominent-active"?: any;
107
- "background-primary-prominent-expanded"?: any;
108
145
  "background-primary-prominent-hover"?: any;
109
- "background-primary-prominent-pressed"?: any;
110
- "background-primary-prominent-pressed-hover"?: any;
111
146
  "background-primary-prominent-selected"?: any;
112
147
  "background-primary-subtle"?: any;
113
148
  "background-primary-subtle-active"?: any;
114
- "background-primary-subtle-expanded"?: any;
115
149
  "background-primary-subtle-hover"?: any;
116
- "background-primary-subtle-pressed"?: any;
117
- "background-primary-subtle-pressed-hover"?: any;
118
150
  "background-primary-subtle-selected"?: any;
119
151
  "background-success"?: any;
120
152
  "background-success-prominent"?: any;
@@ -125,9 +157,15 @@ declare const StyledToolbar: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_d
125
157
  "border-danger"?: any;
126
158
  "border-danger-active"?: any;
127
159
  "border-danger-hover"?: any;
160
+ "border-focus-error-inner"?: any;
161
+ "border-focus-error-middle"?: any;
162
+ "border-focus-error-outer"?: any;
128
163
  "border-focus-inner"?: any;
129
164
  "border-focus-middle"?: any;
130
165
  "border-focus-outer"?: any;
166
+ "border-focus-success-inner"?: any;
167
+ "border-focus-success-middle"?: any;
168
+ "border-focus-success-outer"?: any;
131
169
  "border-neutrals"?: any;
132
170
  "border-neutrals-active"?: any;
133
171
  "border-neutrals-controls"?: any;
@@ -220,21 +258,23 @@ declare const StyledToolbar: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_d
220
258
  readonly body: "Open Sans, sans-serif";
221
259
  };
222
260
  radii: {
223
- readonly none: 0;
224
- readonly half: "999em";
225
261
  readonly 25: "2px";
226
262
  readonly 50: "4px";
227
263
  readonly 75: "6px";
228
264
  readonly 100: "8px";
229
265
  readonly 200: "16px";
266
+ readonly half: "999px";
267
+ readonly none: "0px";
230
268
  };
231
269
  shadows: {
232
- readonly 'focus-small': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-inner";
233
- readonly 'focus-small-outline': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 1px $colors$border-focus-middle, inset 0 0 0 2px $colors$border-focus-inner";
234
- readonly 'focus-large': "0 0 0 4px $colors$border-focus-inner, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-outer";
235
- readonly 'focus-controls': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-focus-middle, 0 0 0 5px $colors$border-focus-outer";
236
- readonly 'focus-controls-error': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-danger, 0 0 0 5px $colors$background-danger-subtle-hover";
237
- readonly 'focus-controls-success': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$background-success-prominent, 0 0 0 5px $colors$background-success";
270
+ 50: any;
271
+ 100: any;
272
+ "focus-small": any;
273
+ "focus-small-outline": any;
274
+ "focus-large": any;
275
+ "focus-controls": any;
276
+ "focus-controls-error": any;
277
+ "focus-controls-success": any;
238
278
  };
239
279
  sizes: {
240
280
  readonly number: string;
@@ -512,63 +552,103 @@ declare const StyledItem: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_desi
512
552
  };
513
553
  colors: {
514
554
  readonly black: any;
555
+ readonly 'blue-50': any;
515
556
  readonly 'blue-100': any;
557
+ readonly 'blue-150': any;
516
558
  readonly 'blue-200': any;
559
+ readonly 'blue-250': any;
517
560
  readonly 'blue-300': any;
561
+ readonly 'blue-350': any;
518
562
  readonly 'blue-400': any;
563
+ readonly 'blue-450': any;
519
564
  readonly 'blue-500': any;
565
+ readonly 'blue-550': any;
520
566
  readonly 'blue-600': any;
567
+ readonly 'blue-650': any;
521
568
  readonly 'blue-700': any;
569
+ readonly 'blue-750': any;
522
570
  readonly 'blue-800': any;
571
+ readonly 'blue-850': any;
523
572
  readonly 'blue-900': any;
524
- readonly 'blue-1000': any;
573
+ readonly 'blue-950': any;
574
+ readonly 'gray-50': any;
525
575
  readonly 'gray-100': any;
576
+ readonly 'gray-150': any;
526
577
  readonly 'gray-200': any;
578
+ readonly 'gray-250': any;
527
579
  readonly 'gray-300': any;
580
+ readonly 'gray-350': any;
528
581
  readonly 'gray-400': any;
582
+ readonly 'gray-450': any;
529
583
  readonly 'gray-500': any;
584
+ readonly 'gray-550': any;
530
585
  readonly 'gray-600': any;
586
+ readonly 'gray-650': any;
531
587
  readonly 'gray-700': any;
588
+ readonly 'gray-750': any;
532
589
  readonly 'gray-800': any;
590
+ readonly 'gray-850': any;
533
591
  readonly 'gray-900': any;
592
+ readonly 'gray-950': any;
593
+ readonly 'green-50': any;
534
594
  readonly 'green-100': any;
595
+ readonly 'green-150': any;
535
596
  readonly 'green-200': any;
597
+ readonly 'green-250': any;
536
598
  readonly 'green-300': any;
599
+ readonly 'green-350': any;
537
600
  readonly 'green-400': any;
601
+ readonly 'green-450': any;
538
602
  readonly 'green-500': any;
603
+ readonly 'green-550': any;
539
604
  readonly 'green-600': any;
605
+ readonly 'green-650': any;
540
606
  readonly 'green-700': any;
607
+ readonly 'green-750': any;
541
608
  readonly 'green-800': any;
609
+ readonly 'green-850': any;
542
610
  readonly 'green-900': any;
543
- readonly 'indigo-100': any;
544
- readonly 'indigo-200': any;
545
- readonly 'indigo-300': any;
546
- readonly 'indigo-400': any;
547
- readonly 'indigo-500': any;
548
- readonly 'indigo-600': any;
549
- readonly 'indigo-700': any;
550
- readonly 'indigo-800': any;
551
- readonly 'indigo-900': any;
611
+ readonly 'green-950': any;
612
+ readonly 'red-50': any;
552
613
  readonly 'red-100': any;
614
+ readonly 'red-150': any;
553
615
  readonly 'red-200': any;
616
+ readonly 'red-250': any;
554
617
  readonly 'red-300': any;
618
+ readonly 'red-350': any;
555
619
  readonly 'red-400': any;
620
+ readonly 'red-450': any;
556
621
  readonly 'red-500': any;
622
+ readonly 'red-550': any;
557
623
  readonly 'red-600': any;
624
+ readonly 'red-650': any;
558
625
  readonly 'red-700': any;
626
+ readonly 'red-750': any;
559
627
  readonly 'red-800': any;
628
+ readonly 'red-850': any;
560
629
  readonly 'red-900': any;
630
+ readonly 'red-950': any;
561
631
  readonly transparent: any;
562
632
  readonly white: any;
633
+ readonly 'yellow-50': any;
563
634
  readonly 'yellow-100': any;
635
+ readonly 'yellow-150': any;
564
636
  readonly 'yellow-200': any;
637
+ readonly 'yellow-250': any;
565
638
  readonly 'yellow-300': any;
639
+ readonly 'yellow-350': any;
566
640
  readonly 'yellow-400': any;
641
+ readonly 'yellow-450': any;
567
642
  readonly 'yellow-500': any;
643
+ readonly 'yellow-550': any;
568
644
  readonly 'yellow-600': any;
645
+ readonly 'yellow-650': any;
569
646
  readonly 'yellow-700': any;
647
+ readonly 'yellow-750': any;
570
648
  readonly 'yellow-800': any;
649
+ readonly 'yellow-850': any;
571
650
  readonly 'yellow-900': any;
651
+ readonly 'yellow-950': any;
572
652
  "background-alpha-active"?: any;
573
653
  "background-alpha-hover"?: any;
574
654
  "background-danger-prominent"?: any;
@@ -589,27 +669,19 @@ declare const StyledItem: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_desi
589
669
  "background-neutrals-inverted-subtle"?: any;
590
670
  "background-neutrals-page"?: any;
591
671
  "background-neutrals-page-subtle"?: any;
592
- "background-neutrals-scrolls"?: any;
593
- "background-neutrals-scrolls-expanded"?: any;
594
- "background-neutrals-scrolls-hover"?: any;
595
- "background-neutrals-scrolls-pressed"?: any;
596
- "background-neutrals-scrolls-pressed-hover"?: any;
672
+ "background-neutrals-scrollbar"?: any;
673
+ "background-neutrals-scrollbar-active"?: any;
674
+ "background-neutrals-scrollbar-hover"?: any;
597
675
  "background-neutrals-subtle"?: any;
598
676
  "background-neutrals-subtle-active"?: any;
599
677
  "background-neutrals-subtle-hover"?: any;
600
678
  "background-primary-prominent"?: any;
601
679
  "background-primary-prominent-active"?: any;
602
- "background-primary-prominent-expanded"?: any;
603
680
  "background-primary-prominent-hover"?: any;
604
- "background-primary-prominent-pressed"?: any;
605
- "background-primary-prominent-pressed-hover"?: any;
606
681
  "background-primary-prominent-selected"?: any;
607
682
  "background-primary-subtle"?: any;
608
683
  "background-primary-subtle-active"?: any;
609
- "background-primary-subtle-expanded"?: any;
610
684
  "background-primary-subtle-hover"?: any;
611
- "background-primary-subtle-pressed"?: any;
612
- "background-primary-subtle-pressed-hover"?: any;
613
685
  "background-primary-subtle-selected"?: any;
614
686
  "background-success"?: any;
615
687
  "background-success-prominent"?: any;
@@ -620,9 +692,15 @@ declare const StyledItem: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_desi
620
692
  "border-danger"?: any;
621
693
  "border-danger-active"?: any;
622
694
  "border-danger-hover"?: any;
695
+ "border-focus-error-inner"?: any;
696
+ "border-focus-error-middle"?: any;
697
+ "border-focus-error-outer"?: any;
623
698
  "border-focus-inner"?: any;
624
699
  "border-focus-middle"?: any;
625
700
  "border-focus-outer"?: any;
701
+ "border-focus-success-inner"?: any;
702
+ "border-focus-success-middle"?: any;
703
+ "border-focus-success-outer"?: any;
626
704
  "border-neutrals"?: any;
627
705
  "border-neutrals-active"?: any;
628
706
  "border-neutrals-controls"?: any;
@@ -715,21 +793,23 @@ declare const StyledItem: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_desi
715
793
  readonly body: "Open Sans, sans-serif";
716
794
  };
717
795
  radii: {
718
- readonly none: 0;
719
- readonly half: "999em";
720
796
  readonly 25: "2px";
721
797
  readonly 50: "4px";
722
798
  readonly 75: "6px";
723
799
  readonly 100: "8px";
724
800
  readonly 200: "16px";
801
+ readonly half: "999px";
802
+ readonly none: "0px";
725
803
  };
726
804
  shadows: {
727
- readonly 'focus-small': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-inner";
728
- readonly 'focus-small-outline': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 1px $colors$border-focus-middle, inset 0 0 0 2px $colors$border-focus-inner";
729
- readonly 'focus-large': "0 0 0 4px $colors$border-focus-inner, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-outer";
730
- readonly 'focus-controls': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-focus-middle, 0 0 0 5px $colors$border-focus-outer";
731
- readonly 'focus-controls-error': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-danger, 0 0 0 5px $colors$background-danger-subtle-hover";
732
- readonly 'focus-controls-success': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$background-success-prominent, 0 0 0 5px $colors$background-success";
805
+ 50: any;
806
+ 100: any;
807
+ "focus-small": any;
808
+ "focus-small-outline": any;
809
+ "focus-large": any;
810
+ "focus-controls": any;
811
+ "focus-controls-error": any;
812
+ "focus-controls-success": any;
733
813
  };
734
814
  sizes: {
735
815
  readonly number: string;
@@ -1032,63 +1112,103 @@ declare const StyledSeparator: react.ForwardRefExoticComponent<Omit<Omit<_mirohq
1032
1112
  };
1033
1113
  colors: {
1034
1114
  readonly black: any;
1115
+ readonly 'blue-50': any;
1035
1116
  readonly 'blue-100': any;
1117
+ readonly 'blue-150': any;
1036
1118
  readonly 'blue-200': any;
1119
+ readonly 'blue-250': any;
1037
1120
  readonly 'blue-300': any;
1121
+ readonly 'blue-350': any;
1038
1122
  readonly 'blue-400': any;
1123
+ readonly 'blue-450': any;
1039
1124
  readonly 'blue-500': any;
1125
+ readonly 'blue-550': any;
1040
1126
  readonly 'blue-600': any;
1127
+ readonly 'blue-650': any;
1041
1128
  readonly 'blue-700': any;
1129
+ readonly 'blue-750': any;
1042
1130
  readonly 'blue-800': any;
1131
+ readonly 'blue-850': any;
1043
1132
  readonly 'blue-900': any;
1044
- readonly 'blue-1000': any;
1133
+ readonly 'blue-950': any;
1134
+ readonly 'gray-50': any;
1045
1135
  readonly 'gray-100': any;
1136
+ readonly 'gray-150': any;
1046
1137
  readonly 'gray-200': any;
1138
+ readonly 'gray-250': any;
1047
1139
  readonly 'gray-300': any;
1140
+ readonly 'gray-350': any;
1048
1141
  readonly 'gray-400': any;
1142
+ readonly 'gray-450': any;
1049
1143
  readonly 'gray-500': any;
1144
+ readonly 'gray-550': any;
1050
1145
  readonly 'gray-600': any;
1146
+ readonly 'gray-650': any;
1051
1147
  readonly 'gray-700': any;
1148
+ readonly 'gray-750': any;
1052
1149
  readonly 'gray-800': any;
1150
+ readonly 'gray-850': any;
1053
1151
  readonly 'gray-900': any;
1152
+ readonly 'gray-950': any;
1153
+ readonly 'green-50': any;
1054
1154
  readonly 'green-100': any;
1155
+ readonly 'green-150': any;
1055
1156
  readonly 'green-200': any;
1157
+ readonly 'green-250': any;
1056
1158
  readonly 'green-300': any;
1159
+ readonly 'green-350': any;
1057
1160
  readonly 'green-400': any;
1161
+ readonly 'green-450': any;
1058
1162
  readonly 'green-500': any;
1163
+ readonly 'green-550': any;
1059
1164
  readonly 'green-600': any;
1165
+ readonly 'green-650': any;
1060
1166
  readonly 'green-700': any;
1167
+ readonly 'green-750': any;
1061
1168
  readonly 'green-800': any;
1169
+ readonly 'green-850': any;
1062
1170
  readonly 'green-900': any;
1063
- readonly 'indigo-100': any;
1064
- readonly 'indigo-200': any;
1065
- readonly 'indigo-300': any;
1066
- readonly 'indigo-400': any;
1067
- readonly 'indigo-500': any;
1068
- readonly 'indigo-600': any;
1069
- readonly 'indigo-700': any;
1070
- readonly 'indigo-800': any;
1071
- readonly 'indigo-900': any;
1171
+ readonly 'green-950': any;
1172
+ readonly 'red-50': any;
1072
1173
  readonly 'red-100': any;
1174
+ readonly 'red-150': any;
1073
1175
  readonly 'red-200': any;
1176
+ readonly 'red-250': any;
1074
1177
  readonly 'red-300': any;
1178
+ readonly 'red-350': any;
1075
1179
  readonly 'red-400': any;
1180
+ readonly 'red-450': any;
1076
1181
  readonly 'red-500': any;
1182
+ readonly 'red-550': any;
1077
1183
  readonly 'red-600': any;
1184
+ readonly 'red-650': any;
1078
1185
  readonly 'red-700': any;
1186
+ readonly 'red-750': any;
1079
1187
  readonly 'red-800': any;
1188
+ readonly 'red-850': any;
1080
1189
  readonly 'red-900': any;
1190
+ readonly 'red-950': any;
1081
1191
  readonly transparent: any;
1082
1192
  readonly white: any;
1193
+ readonly 'yellow-50': any;
1083
1194
  readonly 'yellow-100': any;
1195
+ readonly 'yellow-150': any;
1084
1196
  readonly 'yellow-200': any;
1197
+ readonly 'yellow-250': any;
1085
1198
  readonly 'yellow-300': any;
1199
+ readonly 'yellow-350': any;
1086
1200
  readonly 'yellow-400': any;
1201
+ readonly 'yellow-450': any;
1087
1202
  readonly 'yellow-500': any;
1203
+ readonly 'yellow-550': any;
1088
1204
  readonly 'yellow-600': any;
1205
+ readonly 'yellow-650': any;
1089
1206
  readonly 'yellow-700': any;
1207
+ readonly 'yellow-750': any;
1090
1208
  readonly 'yellow-800': any;
1209
+ readonly 'yellow-850': any;
1091
1210
  readonly 'yellow-900': any;
1211
+ readonly 'yellow-950': any;
1092
1212
  "background-alpha-active"?: any;
1093
1213
  "background-alpha-hover"?: any;
1094
1214
  "background-danger-prominent"?: any;
@@ -1109,27 +1229,19 @@ declare const StyledSeparator: react.ForwardRefExoticComponent<Omit<Omit<_mirohq
1109
1229
  "background-neutrals-inverted-subtle"?: any;
1110
1230
  "background-neutrals-page"?: any;
1111
1231
  "background-neutrals-page-subtle"?: any;
1112
- "background-neutrals-scrolls"?: any;
1113
- "background-neutrals-scrolls-expanded"?: any;
1114
- "background-neutrals-scrolls-hover"?: any;
1115
- "background-neutrals-scrolls-pressed"?: any;
1116
- "background-neutrals-scrolls-pressed-hover"?: any;
1232
+ "background-neutrals-scrollbar"?: any;
1233
+ "background-neutrals-scrollbar-active"?: any;
1234
+ "background-neutrals-scrollbar-hover"?: any;
1117
1235
  "background-neutrals-subtle"?: any;
1118
1236
  "background-neutrals-subtle-active"?: any;
1119
1237
  "background-neutrals-subtle-hover"?: any;
1120
1238
  "background-primary-prominent"?: any;
1121
1239
  "background-primary-prominent-active"?: any;
1122
- "background-primary-prominent-expanded"?: any;
1123
1240
  "background-primary-prominent-hover"?: any;
1124
- "background-primary-prominent-pressed"?: any;
1125
- "background-primary-prominent-pressed-hover"?: any;
1126
1241
  "background-primary-prominent-selected"?: any;
1127
1242
  "background-primary-subtle"?: any;
1128
1243
  "background-primary-subtle-active"?: any;
1129
- "background-primary-subtle-expanded"?: any;
1130
1244
  "background-primary-subtle-hover"?: any;
1131
- "background-primary-subtle-pressed"?: any;
1132
- "background-primary-subtle-pressed-hover"?: any;
1133
1245
  "background-primary-subtle-selected"?: any;
1134
1246
  "background-success"?: any;
1135
1247
  "background-success-prominent"?: any;
@@ -1140,9 +1252,15 @@ declare const StyledSeparator: react.ForwardRefExoticComponent<Omit<Omit<_mirohq
1140
1252
  "border-danger"?: any;
1141
1253
  "border-danger-active"?: any;
1142
1254
  "border-danger-hover"?: any;
1255
+ "border-focus-error-inner"?: any;
1256
+ "border-focus-error-middle"?: any;
1257
+ "border-focus-error-outer"?: any;
1143
1258
  "border-focus-inner"?: any;
1144
1259
  "border-focus-middle"?: any;
1145
1260
  "border-focus-outer"?: any;
1261
+ "border-focus-success-inner"?: any;
1262
+ "border-focus-success-middle"?: any;
1263
+ "border-focus-success-outer"?: any;
1146
1264
  "border-neutrals"?: any;
1147
1265
  "border-neutrals-active"?: any;
1148
1266
  "border-neutrals-controls"?: any;
@@ -1235,21 +1353,23 @@ declare const StyledSeparator: react.ForwardRefExoticComponent<Omit<Omit<_mirohq
1235
1353
  readonly body: "Open Sans, sans-serif";
1236
1354
  };
1237
1355
  radii: {
1238
- readonly none: 0;
1239
- readonly half: "999em";
1240
1356
  readonly 25: "2px";
1241
1357
  readonly 50: "4px";
1242
1358
  readonly 75: "6px";
1243
1359
  readonly 100: "8px";
1244
1360
  readonly 200: "16px";
1361
+ readonly half: "999px";
1362
+ readonly none: "0px";
1245
1363
  };
1246
1364
  shadows: {
1247
- readonly 'focus-small': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-inner";
1248
- readonly 'focus-small-outline': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 1px $colors$border-focus-middle, inset 0 0 0 2px $colors$border-focus-inner";
1249
- readonly 'focus-large': "0 0 0 4px $colors$border-focus-inner, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-outer";
1250
- readonly 'focus-controls': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-focus-middle, 0 0 0 5px $colors$border-focus-outer";
1251
- readonly 'focus-controls-error': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-danger, 0 0 0 5px $colors$background-danger-subtle-hover";
1252
- readonly 'focus-controls-success': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$background-success-prominent, 0 0 0 5px $colors$background-success";
1365
+ 50: any;
1366
+ 100: any;
1367
+ "focus-small": any;
1368
+ "focus-small-outline": any;
1369
+ "focus-large": any;
1370
+ "focus-controls": any;
1371
+ "focus-controls-error": any;
1372
+ "focus-controls-success": any;
1253
1373
  };
1254
1374
  sizes: {
1255
1375
  readonly number: string;
@@ -1527,63 +1647,103 @@ declare const StyledLink: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_desi
1527
1647
  };
1528
1648
  colors: {
1529
1649
  readonly black: any;
1650
+ readonly 'blue-50': any;
1530
1651
  readonly 'blue-100': any;
1652
+ readonly 'blue-150': any;
1531
1653
  readonly 'blue-200': any;
1654
+ readonly 'blue-250': any;
1532
1655
  readonly 'blue-300': any;
1656
+ readonly 'blue-350': any;
1533
1657
  readonly 'blue-400': any;
1658
+ readonly 'blue-450': any;
1534
1659
  readonly 'blue-500': any;
1660
+ readonly 'blue-550': any;
1535
1661
  readonly 'blue-600': any;
1662
+ readonly 'blue-650': any;
1536
1663
  readonly 'blue-700': any;
1664
+ readonly 'blue-750': any;
1537
1665
  readonly 'blue-800': any;
1666
+ readonly 'blue-850': any;
1538
1667
  readonly 'blue-900': any;
1539
- readonly 'blue-1000': any;
1668
+ readonly 'blue-950': any;
1669
+ readonly 'gray-50': any;
1540
1670
  readonly 'gray-100': any;
1671
+ readonly 'gray-150': any;
1541
1672
  readonly 'gray-200': any;
1673
+ readonly 'gray-250': any;
1542
1674
  readonly 'gray-300': any;
1675
+ readonly 'gray-350': any;
1543
1676
  readonly 'gray-400': any;
1677
+ readonly 'gray-450': any;
1544
1678
  readonly 'gray-500': any;
1679
+ readonly 'gray-550': any;
1545
1680
  readonly 'gray-600': any;
1681
+ readonly 'gray-650': any;
1546
1682
  readonly 'gray-700': any;
1683
+ readonly 'gray-750': any;
1547
1684
  readonly 'gray-800': any;
1685
+ readonly 'gray-850': any;
1548
1686
  readonly 'gray-900': any;
1687
+ readonly 'gray-950': any;
1688
+ readonly 'green-50': any;
1549
1689
  readonly 'green-100': any;
1690
+ readonly 'green-150': any;
1550
1691
  readonly 'green-200': any;
1692
+ readonly 'green-250': any;
1551
1693
  readonly 'green-300': any;
1694
+ readonly 'green-350': any;
1552
1695
  readonly 'green-400': any;
1696
+ readonly 'green-450': any;
1553
1697
  readonly 'green-500': any;
1698
+ readonly 'green-550': any;
1554
1699
  readonly 'green-600': any;
1700
+ readonly 'green-650': any;
1555
1701
  readonly 'green-700': any;
1702
+ readonly 'green-750': any;
1556
1703
  readonly 'green-800': any;
1704
+ readonly 'green-850': any;
1557
1705
  readonly 'green-900': any;
1558
- readonly 'indigo-100': any;
1559
- readonly 'indigo-200': any;
1560
- readonly 'indigo-300': any;
1561
- readonly 'indigo-400': any;
1562
- readonly 'indigo-500': any;
1563
- readonly 'indigo-600': any;
1564
- readonly 'indigo-700': any;
1565
- readonly 'indigo-800': any;
1566
- readonly 'indigo-900': any;
1706
+ readonly 'green-950': any;
1707
+ readonly 'red-50': any;
1567
1708
  readonly 'red-100': any;
1709
+ readonly 'red-150': any;
1568
1710
  readonly 'red-200': any;
1711
+ readonly 'red-250': any;
1569
1712
  readonly 'red-300': any;
1713
+ readonly 'red-350': any;
1570
1714
  readonly 'red-400': any;
1715
+ readonly 'red-450': any;
1571
1716
  readonly 'red-500': any;
1717
+ readonly 'red-550': any;
1572
1718
  readonly 'red-600': any;
1719
+ readonly 'red-650': any;
1573
1720
  readonly 'red-700': any;
1721
+ readonly 'red-750': any;
1574
1722
  readonly 'red-800': any;
1723
+ readonly 'red-850': any;
1575
1724
  readonly 'red-900': any;
1725
+ readonly 'red-950': any;
1576
1726
  readonly transparent: any;
1577
1727
  readonly white: any;
1728
+ readonly 'yellow-50': any;
1578
1729
  readonly 'yellow-100': any;
1730
+ readonly 'yellow-150': any;
1579
1731
  readonly 'yellow-200': any;
1732
+ readonly 'yellow-250': any;
1580
1733
  readonly 'yellow-300': any;
1734
+ readonly 'yellow-350': any;
1581
1735
  readonly 'yellow-400': any;
1736
+ readonly 'yellow-450': any;
1582
1737
  readonly 'yellow-500': any;
1738
+ readonly 'yellow-550': any;
1583
1739
  readonly 'yellow-600': any;
1740
+ readonly 'yellow-650': any;
1584
1741
  readonly 'yellow-700': any;
1742
+ readonly 'yellow-750': any;
1585
1743
  readonly 'yellow-800': any;
1744
+ readonly 'yellow-850': any;
1586
1745
  readonly 'yellow-900': any;
1746
+ readonly 'yellow-950': any;
1587
1747
  "background-alpha-active"?: any;
1588
1748
  "background-alpha-hover"?: any;
1589
1749
  "background-danger-prominent"?: any;
@@ -1604,27 +1764,19 @@ declare const StyledLink: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_desi
1604
1764
  "background-neutrals-inverted-subtle"?: any;
1605
1765
  "background-neutrals-page"?: any;
1606
1766
  "background-neutrals-page-subtle"?: any;
1607
- "background-neutrals-scrolls"?: any;
1608
- "background-neutrals-scrolls-expanded"?: any;
1609
- "background-neutrals-scrolls-hover"?: any;
1610
- "background-neutrals-scrolls-pressed"?: any;
1611
- "background-neutrals-scrolls-pressed-hover"?: any;
1767
+ "background-neutrals-scrollbar"?: any;
1768
+ "background-neutrals-scrollbar-active"?: any;
1769
+ "background-neutrals-scrollbar-hover"?: any;
1612
1770
  "background-neutrals-subtle"?: any;
1613
1771
  "background-neutrals-subtle-active"?: any;
1614
1772
  "background-neutrals-subtle-hover"?: any;
1615
1773
  "background-primary-prominent"?: any;
1616
1774
  "background-primary-prominent-active"?: any;
1617
- "background-primary-prominent-expanded"?: any;
1618
1775
  "background-primary-prominent-hover"?: any;
1619
- "background-primary-prominent-pressed"?: any;
1620
- "background-primary-prominent-pressed-hover"?: any;
1621
1776
  "background-primary-prominent-selected"?: any;
1622
1777
  "background-primary-subtle"?: any;
1623
1778
  "background-primary-subtle-active"?: any;
1624
- "background-primary-subtle-expanded"?: any;
1625
1779
  "background-primary-subtle-hover"?: any;
1626
- "background-primary-subtle-pressed"?: any;
1627
- "background-primary-subtle-pressed-hover"?: any;
1628
1780
  "background-primary-subtle-selected"?: any;
1629
1781
  "background-success"?: any;
1630
1782
  "background-success-prominent"?: any;
@@ -1635,9 +1787,15 @@ declare const StyledLink: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_desi
1635
1787
  "border-danger"?: any;
1636
1788
  "border-danger-active"?: any;
1637
1789
  "border-danger-hover"?: any;
1790
+ "border-focus-error-inner"?: any;
1791
+ "border-focus-error-middle"?: any;
1792
+ "border-focus-error-outer"?: any;
1638
1793
  "border-focus-inner"?: any;
1639
1794
  "border-focus-middle"?: any;
1640
1795
  "border-focus-outer"?: any;
1796
+ "border-focus-success-inner"?: any;
1797
+ "border-focus-success-middle"?: any;
1798
+ "border-focus-success-outer"?: any;
1641
1799
  "border-neutrals"?: any;
1642
1800
  "border-neutrals-active"?: any;
1643
1801
  "border-neutrals-controls"?: any;
@@ -1730,21 +1888,23 @@ declare const StyledLink: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_desi
1730
1888
  readonly body: "Open Sans, sans-serif";
1731
1889
  };
1732
1890
  radii: {
1733
- readonly none: 0;
1734
- readonly half: "999em";
1735
1891
  readonly 25: "2px";
1736
1892
  readonly 50: "4px";
1737
1893
  readonly 75: "6px";
1738
1894
  readonly 100: "8px";
1739
1895
  readonly 200: "16px";
1896
+ readonly half: "999px";
1897
+ readonly none: "0px";
1740
1898
  };
1741
1899
  shadows: {
1742
- readonly 'focus-small': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-inner";
1743
- readonly 'focus-small-outline': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 1px $colors$border-focus-middle, inset 0 0 0 2px $colors$border-focus-inner";
1744
- readonly 'focus-large': "0 0 0 4px $colors$border-focus-inner, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-outer";
1745
- readonly 'focus-controls': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-focus-middle, 0 0 0 5px $colors$border-focus-outer";
1746
- readonly 'focus-controls-error': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-danger, 0 0 0 5px $colors$background-danger-subtle-hover";
1747
- readonly 'focus-controls-success': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$background-success-prominent, 0 0 0 5px $colors$background-success";
1900
+ 50: any;
1901
+ 100: any;
1902
+ "focus-small": any;
1903
+ "focus-small-outline": any;
1904
+ "focus-large": any;
1905
+ "focus-controls": any;
1906
+ "focus-controls-error": any;
1907
+ "focus-controls-success": any;
1748
1908
  };
1749
1909
  sizes: {
1750
1910
  readonly number: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mirohq/design-system-toolbar",
3
- "version": "2.5.2-combobox.0",
3
+ "version": "2.5.3",
4
4
  "description": "",
5
5
  "author": "Miro",
6
6
  "source": "src/index.ts",
@@ -31,10 +31,10 @@
31
31
  "@react-aria/interactions": "^3.13.0",
32
32
  "@react-aria/utils": "^3.13.0",
33
33
  "@react-types/shared": "^3.16.0",
34
- "@mirohq/design-system-stitches": "^2.6.0",
35
- "@mirohq/design-system-styles": "^1.1.20-combobox.0",
36
- "@mirohq/design-system-use-press": "^0.3.1",
37
- "@mirohq/design-system-utils": "^0.15.0"
34
+ "@mirohq/design-system-stitches": "^2.6.1",
35
+ "@mirohq/design-system-styles": "^1.2.0",
36
+ "@mirohq/design-system-utils": "^0.15.0",
37
+ "@mirohq/design-system-use-press": "^0.3.1"
38
38
  },
39
39
  "scripts": {
40
40
  "build": "rollup -c ../../../rollup.config.js",