@mirohq/design-system-toolbar 2.7.0-new-focus-keyboard.1 → 3.0.0-pdl-removing-ffs.0

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.
package/dist/main.js CHANGED
@@ -4,7 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var React = require('react');
7
- var designSystemExperiments = require('@mirohq/design-system-experiments');
8
7
  var designSystemStitches = require('@mirohq/design-system-stitches');
9
8
  var RadixToolbar = require('@radix-ui/react-toolbar');
10
9
  var interactions = require('@react-aria/interactions');
@@ -52,37 +51,17 @@ const StyledToolbar = designSystemStitches.styled(RadixToolbar.Root, {
52
51
  height: "$12"
53
52
  },
54
53
  variants: {
55
- v1: {
56
- true: {}
57
- },
58
54
  variant: {
59
- floating: {},
60
- flat: {}
61
- }
62
- },
63
- compoundVariants: [
64
- {
65
- variant: "floating",
66
- v1: false,
67
- css: {
68
- backgroundColor: "$background-neutrals-container",
69
- boxShadow: "$50",
70
- borderRadius: "$50",
71
- padding: "2px"
72
- }
73
- },
74
- {
75
- variant: "floating",
76
- v1: true,
77
- css: {
55
+ floating: {
78
56
  backgroundColor: "$background-neutrals-layout",
79
- boxShadow: "0px 1px 8px 0px rgba(34, 36, 40, 0.05)",
57
+ boxShadow: "$elevation-100",
80
58
  border: "0.5px solid $border-neutrals-subtle",
81
59
  borderRadius: "$100",
82
60
  padding: "$50"
83
- }
61
+ },
62
+ flat: {}
84
63
  }
85
- ]
64
+ }
86
65
  });
87
66
 
88
67
  const StyledBaseItem = designSystemStitches.styled(RadixToolbar__namespace.Button, {
@@ -147,29 +126,8 @@ const sharedStyles = {
147
126
  height: "$10",
148
127
  border: "none",
149
128
  ...designSystemStyles.focus.css({
150
- boxShadow: "$focus-keyboard"
151
- })
152
- },
153
- old: {
154
- [disabledSelector]: {
155
- cursor: "default",
156
- color: "$text-neutrals-disabled"
157
- },
158
- "&[disabled]": {
159
- pointerEvents: "none"
160
- },
161
- '&:not([aria-disabled="true"])': {
162
- "&[data-hovered]": {
163
- backgroundColor: "$background-primary-subtle-hover",
164
- color: "$icon-primary-hover"
165
- },
166
- "&:active, &[data-pressed]": {
167
- backgroundColor: "$background-primary-subtle-active",
168
- color: "$icon-primary-active"
169
- }
170
- }
171
- },
172
- v1: {
129
+ boxShadow: "$focus"
130
+ }),
173
131
  "&[disabled]": {
174
132
  pointerEvents: "none"
175
133
  },
@@ -191,78 +149,30 @@ const StyledIcon = designSystemStitches.styled(BaseItem, {
191
149
  color: "$icon-neutrals",
192
150
  ...sharedStyles.base,
193
151
  variants: {
194
- v1: {
195
- true: {},
196
- false: {}
197
- },
198
152
  active: {
199
- true: {},
200
- false: {}
201
- }
202
- },
203
- compoundVariants: [
204
- {
205
- v1: true,
206
- active: true,
207
- css: {
208
- backgroundColor: "$background-primary-subtle",
209
- color: "$icon-primary-selected"
210
- }
211
- },
212
- {
213
- v1: false,
214
- active: true,
215
- css: {
153
+ true: {
216
154
  backgroundColor: "$background-primary-subtle-selected",
217
155
  color: "$icon-primary-selected"
218
- }
219
- },
220
- {
221
- v1: true,
222
- active: false,
223
- css: {
224
- ...sharedStyles.v1,
156
+ },
157
+ false: {
225
158
  [disabledSelector]: {
226
159
  pointerEvents: "none",
227
160
  color: "$icon-neutrals-disabled"
228
161
  }
229
162
  }
230
- },
231
- {
232
- v1: false,
233
- active: false,
234
- css: sharedStyles.old
235
163
  }
236
- ]
237
- });
238
-
239
- const ToolbarContext = React.createContext({});
240
- const ToolbarProvider = ({
241
- children,
242
- ...restProps
243
- }) => /* @__PURE__ */ jsxRuntime.jsx(
244
- ToolbarContext.Provider,
245
- {
246
- value: {
247
- ...restProps
248
- },
249
- children
250
164
  }
251
- );
252
- const useToolbarContext = () => React.useContext(ToolbarContext);
165
+ });
253
166
 
254
167
  const Icon = React__default["default"].forwardRef(
255
- ({ active = false, ...restProps }, forwardRef) => {
256
- const { v1 } = useToolbarContext();
257
- return /* @__PURE__ */ jsxRuntime.jsx(StyledIcon, { ...restProps, v1, active, ref: forwardRef });
258
- }
168
+ ({ active = false, ...restProps }, forwardRef) => /* @__PURE__ */ jsxRuntime.jsx(StyledIcon, { ...restProps, active, ref: forwardRef })
259
169
  );
260
170
 
261
171
  const StyledSeparator = designSystemStitches.styled(RadixToolbar.Separator, {
262
172
  all: "unset",
263
173
  display: "block",
264
174
  boxSizing: "border-box",
265
- backgroundColor: "rgba(205, 204, 215, 1)",
175
+ backgroundColor: "$border-neutrals-subtle",
266
176
  '&[data-orientation="vertical"]': {
267
177
  width: "1px",
268
178
  height: "$6",
@@ -272,100 +182,49 @@ const StyledSeparator = designSystemStitches.styled(RadixToolbar.Separator, {
272
182
  height: "1px",
273
183
  width: "$6",
274
184
  margin: "$50 0"
275
- },
276
- variants: {
277
- v1: {
278
- true: { backgroundColor: "$border-neutrals-subtle" }
279
- }
280
185
  }
281
186
  });
282
187
 
283
- const Separator = React__default["default"].forwardRef((props, forwardRef) => {
284
- const { v1 } = useToolbarContext();
285
- return /* @__PURE__ */ jsxRuntime.jsx(StyledSeparator, { ...props, v1, ref: forwardRef });
286
- });
188
+ const Separator = React__default["default"].forwardRef((props, forwardRef) => /* @__PURE__ */ jsxRuntime.jsx(StyledSeparator, { ...props, ref: forwardRef }));
287
189
 
288
190
  const StyledLink = designSystemStitches.styled(BaseItem, {
289
191
  paddingX: "$150",
290
- textDecoration: "none",
291
192
  ...sharedStyles.base,
292
- variants: {
293
- v1: {
294
- true: {
295
- ...sharedStyles.v1,
296
- color: "$text-primary",
297
- textDecoration: "underline solid",
298
- textDecorationThickness: "1px",
299
- textUnderlineOffset: "4px",
300
- outline: "none",
301
- [disabledSelector]: {
302
- pointerEvents: "none",
303
- color: "$text-neutrals-disabled"
304
- }
305
- },
306
- false: sharedStyles.old
307
- }
193
+ color: "$text-primary",
194
+ textDecoration: "underline solid",
195
+ textDecorationThickness: "1px",
196
+ textUnderlineOffset: "4px",
197
+ outline: "none",
198
+ [disabledSelector]: {
199
+ pointerEvents: "none",
200
+ color: "$text-neutrals-disabled"
308
201
  }
309
202
  });
310
203
 
311
204
  const Link = React__default["default"].forwardRef(
312
- ({ children, href, ...restProps }, forwardRef) => {
313
- const { v1 } = useToolbarContext();
314
- return /* @__PURE__ */ jsxRuntime.jsx(StyledLink, { ...restProps, asChild: true, v1, children: /* @__PURE__ */ jsxRuntime.jsx("a", { href, ref: forwardRef, children }) });
315
- }
205
+ ({ children, href, ...restProps }, forwardRef) => /* @__PURE__ */ jsxRuntime.jsx(StyledLink, { ...restProps, asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("a", { href, ref: forwardRef, children }) })
316
206
  );
317
207
 
318
208
  const StyledItem = designSystemStitches.styled(BaseItem, {
319
209
  ...sharedStyles.base,
320
210
  variants: {
321
- v1: {
322
- true: {},
323
- false: {}
324
- },
325
211
  active: {
326
- true: {},
327
- false: {}
328
- }
329
- },
330
- compoundVariants: [
331
- {
332
- v1: true,
333
- active: true,
334
- css: {
335
- backgroundColor: "$background-primary-subtle",
336
- color: "$text-primary-selected"
337
- }
338
- },
339
- {
340
- v1: false,
341
- active: true,
342
- css: {
212
+ true: {
343
213
  backgroundColor: "$background-primary-subtle-selected",
344
214
  color: "$text-primary-selected"
345
- }
346
- },
347
- {
348
- v1: true,
349
- active: false,
350
- css: {
351
- ...sharedStyles.v1,
215
+ },
216
+ false: {
352
217
  [disabledSelector]: {
353
218
  pointerEvents: "none",
354
219
  color: "$text-neutrals-disabled"
355
220
  }
356
221
  }
357
- },
358
- {
359
- v1: false,
360
- active: false,
361
- css: sharedStyles.old
362
222
  }
363
- ]
223
+ }
364
224
  });
365
225
 
366
226
  const Item = React__default["default"].forwardRef(
367
227
  ({ active = false, unstyled = true, asChild, ...restProps }, forwardRef) => {
368
- const { v1 } = useToolbarContext();
369
228
  const shouldRenderUnstyled = asChild === true ? unstyled : false;
370
229
  if (shouldRenderUnstyled) {
371
230
  return /* @__PURE__ */ jsxRuntime.jsx(BaseItem, { ...restProps, asChild, ref: forwardRef });
@@ -375,7 +234,6 @@ const Item = React__default["default"].forwardRef(
375
234
  {
376
235
  ...restProps,
377
236
  asChild,
378
- v1,
379
237
  active,
380
238
  ref: forwardRef
381
239
  }
@@ -392,12 +250,10 @@ const Toolbar = React__default["default"].forwardRef(
392
250
  loop = true,
393
251
  ...restProps
394
252
  }, forwardRef) => {
395
- const [v1] = designSystemExperiments.useNewDesignLanguage();
396
253
  const variantProp = unstyled === void 0 ? variant : unstyled ? "flat" : "floating";
397
- return /* @__PURE__ */ jsxRuntime.jsx(ToolbarProvider, { v1, children: /* @__PURE__ */ jsxRuntime.jsx(
254
+ return /* @__PURE__ */ jsxRuntime.jsx(
398
255
  StyledToolbar,
399
256
  {
400
- v1,
401
257
  variant: variantProp,
402
258
  orientation,
403
259
  dir,
@@ -405,7 +261,7 @@ const Toolbar = React__default["default"].forwardRef(
405
261
  ref: forwardRef,
406
262
  ...restProps
407
263
  }
408
- ) });
264
+ );
409
265
  }
410
266
  );
411
267
  Toolbar.Icon = Icon;
package/dist/main.js.map CHANGED
@@ -1 +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/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 v1: {\n true: {},\n },\n variant: {\n floating: {},\n flat: {},\n },\n },\n compoundVariants: [\n {\n variant: 'floating',\n v1: false,\n css: {\n backgroundColor: '$background-neutrals-container',\n boxShadow: '$50',\n borderRadius: '$50',\n padding: '2px',\n },\n },\n {\n variant: 'floating',\n v1: true,\n css: {\n backgroundColor: '$background-neutrals-layout',\n boxShadow: '0px 1px 8px 0px rgba(34, 36, 40, 0.05)',\n border: '0.5px solid $border-neutrals-subtle',\n borderRadius: '$100',\n padding: '$50',\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'\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 '&[tabindex=\"0\"]': {\n zIndex: '1',\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'\n\nexport interface BaseItemProps\n extends StyledBaseItemProps,\n HoverEvents,\n PressEvents {\n disabled?: boolean\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 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 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: '$50',\n height: '$10',\n border: 'none',\n ...focus.css({\n boxShadow: '$focus-keyboard',\n }),\n },\n old: {\n [disabledSelector]: {\n cursor: 'default',\n color: '$text-neutrals-disabled',\n },\n\n '&[disabled]': {\n pointerEvents: 'none',\n },\n\n '&:not([aria-disabled=\"true\"])': {\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 v1: {\n '&[disabled]': {\n pointerEvents: 'none',\n },\n '&:not([aria-disabled=\"true\"])': {\n '&[data-hovered]': {\n backgroundColor: '$background-neutrals-hover',\n },\n\n '&:active, &[data-pressed]': {\n backgroundColor: '$background-neutrals-active',\n },\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 StyledIcon = styled(BaseItem, {\n padding: 0,\n font: 'unset',\n width: '$10',\n color: '$icon-neutrals',\n\n ...sharedStyles.base,\n\n variants: {\n v1: {\n true: {},\n false: {},\n },\n active: {\n true: {},\n false: {},\n },\n },\n\n compoundVariants: [\n {\n v1: true,\n active: true,\n css: {\n backgroundColor: '$background-primary-subtle',\n color: '$icon-primary-selected',\n },\n },\n {\n v1: false,\n active: true,\n css: {\n backgroundColor: '$background-primary-subtle-selected',\n color: '$icon-primary-selected',\n },\n },\n {\n v1: true,\n active: false,\n css: {\n ...sharedStyles.v1,\n\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$icon-neutrals-disabled',\n },\n },\n },\n {\n v1: false,\n active: false,\n css: sharedStyles.old,\n },\n ],\n})\n","import React, { createContext, useContext } from 'react'\nimport type { PropsWithChildren } from 'react'\n\ninterface ToolbarProps {\n v1: boolean\n}\n\ntype ToolbarContextProps = ToolbarProps\n\nexport type ToolbarProviderProps = ToolbarProps\n\nconst ToolbarContext = createContext<ToolbarContextProps>({} as any)\n\nexport const ToolbarProvider = ({\n children,\n ...restProps\n}: PropsWithChildren<ToolbarProviderProps>): React.ReactElement => (\n <ToolbarContext.Provider\n value={{\n ...restProps,\n }}\n >\n {children}\n </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 { v1 } = useToolbarContext()\n\n return (\n <StyledIcon {...restProps} v1={v1} active={active} 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: '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 variants: {\n v1: {\n true: { backgroundColor: '$border-neutrals-subtle' },\n },\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 Omit<StyledSeparatorProps, 'v1'> {}\n\nexport const Separator = React.forwardRef<\n ElementRef<typeof StyledSeparator>,\n SeparatorProps\n>((props, forwardRef) => {\n const { v1 } = useToolbarContext()\n\n return <StyledSeparator {...props} v1={v1} 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 textDecoration: 'none',\n\n ...sharedStyles.base,\n\n variants: {\n v1: {\n true: {\n ...sharedStyles.v1,\n color: '$text-primary',\n textDecoration: 'underline solid',\n textDecorationThickness: '1px',\n textUnderlineOffset: '4px',\n outline: 'none',\n\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$text-neutrals-disabled',\n },\n },\n false: sharedStyles.old,\n },\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 { v1 } = useToolbarContext()\n\n return (\n <StyledLink {...restProps} asChild v1={v1}>\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\n variants: {\n v1: {\n true: {},\n false: {},\n },\n active: {\n true: {},\n false: {},\n },\n },\n\n compoundVariants: [\n {\n v1: true,\n active: true,\n css: {\n backgroundColor: '$background-primary-subtle',\n color: '$text-primary-selected',\n },\n },\n {\n v1: false,\n active: true,\n css: {\n backgroundColor: '$background-primary-subtle-selected',\n color: '$text-primary-selected',\n },\n },\n {\n v1: true,\n active: false,\n css: {\n ...sharedStyles.v1,\n\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$text-neutrals-disabled',\n },\n },\n },\n {\n v1: false,\n active: false,\n css: sharedStyles.old,\n },\n ],\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\nimport type { BaseItemProps } from './base-item'\nimport { BaseItem } from './base-item'\nimport { StyledItem } from './item.styled'\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 { v1 } = useToolbarContext()\n\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 v1={v1}\n active={active}\n ref={forwardRef}\n />\n )\n }\n)\n","import React from 'react'\nimport type { ElementRef, ForwardRefExoticComponent } from 'react'\nimport { useNewDesignLanguage } from '@mirohq/design-system-experiments'\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 { ToolbarProvider } from './hooks/use-toolbar-context'\n\nexport interface ToolbarProps extends Omit<StyledToolbarProps, 'v1'> {\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\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 ...restProps\n },\n forwardRef\n ) => {\n const [v1] = useNewDesignLanguage()\n\n const variantProp =\n unstyled === undefined ? variant : unstyled ? 'flat' : 'floating'\n\n return (\n <ToolbarProvider v1={v1}>\n <StyledToolbar\n v1={v1}\n variant={variantProp}\n orientation={orientation}\n dir={dir}\n loop={loop}\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","React","useAriaDisabled","usePress","booleanify","useHover","jsx","mergeProps","focus","createContext","useContext","Separator","useNewDesignLanguage"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIa,MAAA,aAAA,GAAgBA,4BAAOC,iBAAM,EAAA;AAAA,EACxC,GAAK,EAAA,OAAA;AAAA,EACL,OAAS,EAAA,MAAA;AAAA,EACT,SAAW,EAAA,YAAA;AAAA,EACX,UAAY,EAAA,QAAA;AAAA,EACZ,QAAU,EAAA,MAAA;AAAA,EACV,GAAK,EAAA,KAAA;AAAA,EAEL,gCAAkC,EAAA;AAAA,IAChC,aAAe,EAAA,QAAA;AAAA,IACf,KAAO,EAAA,KAAA;AAAA,GACT;AAAA,EAEA,kCAAoC,EAAA;AAAA,IAClC,MAAQ,EAAA,KAAA;AAAA,GACV;AAAA,EAEA,QAAU,EAAA;AAAA,IACR,EAAI,EAAA;AAAA,MACF,MAAM,EAAC;AAAA,KACT;AAAA,IACA,OAAS,EAAA;AAAA,MACP,UAAU,EAAC;AAAA,MACX,MAAM,EAAC;AAAA,KACT;AAAA,GACF;AAAA,EACA,gBAAkB,EAAA;AAAA,IAChB;AAAA,MACE,OAAS,EAAA,UAAA;AAAA,MACT,EAAI,EAAA,KAAA;AAAA,MACJ,GAAK,EAAA;AAAA,QACH,eAAiB,EAAA,gCAAA;AAAA,QACjB,SAAW,EAAA,KAAA;AAAA,QACX,YAAc,EAAA,KAAA;AAAA,QACd,OAAS,EAAA,KAAA;AAAA,OACX;AAAA,KACF;AAAA,IACA;AAAA,MACE,OAAS,EAAA,UAAA;AAAA,MACT,EAAI,EAAA,IAAA;AAAA,MACJ,GAAK,EAAA;AAAA,QACH,eAAiB,EAAA,6BAAA;AAAA,QACjB,SAAW,EAAA,wCAAA;AAAA,QACX,MAAQ,EAAA,qCAAA;AAAA,QACR,YAAc,EAAA,MAAA;AAAA,QACd,OAAS,EAAA,KAAA;AAAA,OACX;AAAA,KACF;AAAA,GACF;AACF,CAAC,CAAA;;ACjDY,MAAA,cAAA,GAAiBD,2BAAO,CAAAE,uBAAA,CAAa,MAAQ,EAAA;AAAA,EACxD,SAAW,EAAA,YAAA;AAAA,EACX,MAAQ,EAAA,SAAA;AAAA,EACR,UAAY,EAAA,MAAA;AAAA,EACZ,OAAS,EAAA,MAAA;AAAA,EACT,UAAY,EAAA,QAAA;AAAA,EACZ,cAAgB,EAAA,QAAA;AAAA,EAChB,UAAY,EAAA,CAAA;AAAA,EAEZ,iBAAmB,EAAA;AAAA,IACjB,MAAQ,EAAA,GAAA;AAAA,GACV;AACF,CAAC,CAAA;;ACIM,MAAM,WAAWC,yBAAM,CAAA,UAAA;AAAA,EAI5B,CACE;AAAA,IACE,QAAW,GAAA,KAAA;AAAA,IACX,eAAiB,EAAA,YAAA;AAAA,IACjB,OAAA;AAAA,IACA,YAAA;AAAA,IACA,UAAA;AAAA,IACA,aAAA;AAAA,IACA,GAAG,SAAA;AAAA,KAEL,UACG,KAAA;AACH,IAAA,MAAM,YAAe,GAAAC,2CAAA;AAAA,MACnB;AAAA,QACE,GAAG,SAAA;AAAA,QACH,YAAA;AAAA,OACF;AAAA,MACA,EAAE,aAAa,IAAK,EAAA;AAAA,KACtB,CAAA;AAEA,IAAM,MAAA,EAAE,UAAW,EAAA,GAAIC,6BAAS,CAAA;AAAA,MAC9B,mBAAqB,EAAA,MAAA;AAAA,MACrB,QAAA,EAAU,QAAY,IAAAC,4BAAA,CAAW,YAAY,CAAA;AAAA,MAC7C,GAAG,YAAA;AAAA,KACJ,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,UAAA,EAAY,SAAU,EAAA,GAAIC,qBAAS,CAAA;AAAA,MACzC,YAAA;AAAA,MACA,UAAA;AAAA,MACA,aAAA;AAAA,KACD,CAAA,CAAA;AAED,IACE,uBAAAC,cAAA;AAAA,MAAC,cAAA;AAAA,MAAA;AAAA,QACE,GAAGC,gBAAW,CAAA,UAAA,EAAY,UAAU,CAAA;AAAA,QACrC,cAAA,EAAc,YAAY,EAAK,GAAA,KAAA,CAAA;AAAA,QAC/B,OAAA;AAAA,QACA,QAAA;AAAA,QACA,eAAe,EAAAH,4BAAA,CAAW,YAAY,CAAA,GAAI,MAAS,GAAA,YAAA;AAAA,QACnD,GAAK,EAAA,UAAA;AAAA,OAAA;AAAA,KACP,CAAA;AAAA,GAEJ;AACF,CAAA;;ACjEO,MAAM,gBAAmB,GAAA,sCAAA,CAAA;AAEzB,MAAM,YAAe,GAAA;AAAA,EAC1B,IAAM,EAAA;AAAA,IACJ,eAAiB,EAAA,cAAA;AAAA,IACjB,YAAc,EAAA,KAAA;AAAA,IACd,MAAQ,EAAA,KAAA;AAAA,IACR,MAAQ,EAAA,MAAA;AAAA,IACR,GAAGI,yBAAM,GAAI,CAAA;AAAA,MACX,SAAW,EAAA,iBAAA;AAAA,KACZ,CAAA;AAAA,GACH;AAAA,EACA,GAAK,EAAA;AAAA,IACH,CAAC,gBAAgB,GAAG;AAAA,MAClB,MAAQ,EAAA,SAAA;AAAA,MACR,KAAO,EAAA,yBAAA;AAAA,KACT;AAAA,IAEA,aAAe,EAAA;AAAA,MACb,aAAe,EAAA,MAAA;AAAA,KACjB;AAAA,IAEA,+BAAiC,EAAA;AAAA,MAC/B,iBAAmB,EAAA;AAAA,QACjB,eAAiB,EAAA,kCAAA;AAAA,QACjB,KAAO,EAAA,qBAAA;AAAA,OACT;AAAA,MAEA,2BAA6B,EAAA;AAAA,QAC3B,eAAiB,EAAA,mCAAA;AAAA,QACjB,KAAO,EAAA,sBAAA;AAAA,OACT;AAAA,KACF;AAAA,GACF;AAAA,EACA,EAAI,EAAA;AAAA,IACF,aAAe,EAAA;AAAA,MACb,aAAe,EAAA,MAAA;AAAA,KACjB;AAAA,IACA,+BAAiC,EAAA;AAAA,MAC/B,iBAAmB,EAAA;AAAA,QACjB,eAAiB,EAAA,4BAAA;AAAA,OACnB;AAAA,MAEA,2BAA6B,EAAA;AAAA,QAC3B,eAAiB,EAAA,6BAAA;AAAA,OACnB;AAAA,KACF;AAAA,GACF;AACF,CAAA;;AC7Ca,MAAA,UAAA,GAAaV,4BAAO,QAAU,EAAA;AAAA,EACzC,OAAS,EAAA,CAAA;AAAA,EACT,IAAM,EAAA,OAAA;AAAA,EACN,KAAO,EAAA,KAAA;AAAA,EACP,KAAO,EAAA,gBAAA;AAAA,EAEP,GAAG,YAAa,CAAA,IAAA;AAAA,EAEhB,QAAU,EAAA;AAAA,IACR,EAAI,EAAA;AAAA,MACF,MAAM,EAAC;AAAA,MACP,OAAO,EAAC;AAAA,KACV;AAAA,IACA,MAAQ,EAAA;AAAA,MACN,MAAM,EAAC;AAAA,MACP,OAAO,EAAC;AAAA,KACV;AAAA,GACF;AAAA,EAEA,gBAAkB,EAAA;AAAA,IAChB;AAAA,MACE,EAAI,EAAA,IAAA;AAAA,MACJ,MAAQ,EAAA,IAAA;AAAA,MACR,GAAK,EAAA;AAAA,QACH,eAAiB,EAAA,4BAAA;AAAA,QACjB,KAAO,EAAA,wBAAA;AAAA,OACT;AAAA,KACF;AAAA,IACA;AAAA,MACE,EAAI,EAAA,KAAA;AAAA,MACJ,MAAQ,EAAA,IAAA;AAAA,MACR,GAAK,EAAA;AAAA,QACH,eAAiB,EAAA,qCAAA;AAAA,QACjB,KAAO,EAAA,wBAAA;AAAA,OACT;AAAA,KACF;AAAA,IACA;AAAA,MACE,EAAI,EAAA,IAAA;AAAA,MACJ,MAAQ,EAAA,KAAA;AAAA,MACR,GAAK,EAAA;AAAA,QACH,GAAG,YAAa,CAAA,EAAA;AAAA,QAEhB,CAAC,gBAAgB,GAAG;AAAA,UAClB,aAAe,EAAA,MAAA;AAAA,UACf,KAAO,EAAA,yBAAA;AAAA,SACT;AAAA,OACF;AAAA,KACF;AAAA,IACA;AAAA,MACE,EAAI,EAAA,KAAA;AAAA,MACJ,MAAQ,EAAA,KAAA;AAAA,MACR,KAAK,YAAa,CAAA,GAAA;AAAA,KACpB;AAAA,GACF;AACF,CAAC,CAAA;;AChDD,MAAM,cAAA,GAAiBW,mBAAmC,CAAA,EAAS,CAAA,CAAA;AAE5D,MAAM,kBAAkB,CAAC;AAAA,EAC9B,QAAA;AAAA,EACA,GAAG,SAAA;AACL,CACE,qBAAAH,cAAA;AAAA,EAAC,cAAe,CAAA,QAAA;AAAA,EAAf;AAAA,IACC,KAAO,EAAA;AAAA,MACL,GAAG,SAAA;AAAA,KACL;AAAA,IAEC,QAAA;AAAA,GAAA;AACH,CAAA,CAAA;AAGW,MAAA,iBAAA,GAAoB,MAC/BI,gBAAA,CAAW,cAAc,CAAA;;ACZpB,MAAM,OAAOT,yBAAM,CAAA,UAAA;AAAA,EACxB,CAAC,EAAE,MAAA,GAAS,OAAO,GAAG,SAAA,IAAa,UAAe,KAAA;AAChD,IAAM,MAAA,EAAE,EAAG,EAAA,GAAI,iBAAkB,EAAA,CAAA;AAEjC,IAAA,sCACG,UAAY,EAAA,EAAA,GAAG,WAAW,EAAQ,EAAA,MAAA,EAAgB,KAAK,UAAY,EAAA,CAAA,CAAA;AAAA,GAExE;AACF,CAAA;;ACnBa,MAAA,eAAA,GAAkBH,4BAAOa,sBAAW,EAAA;AAAA,EAC/C,GAAK,EAAA,OAAA;AAAA,EACL,OAAS,EAAA,OAAA;AAAA,EACT,SAAW,EAAA,YAAA;AAAA,EACX,eAAiB,EAAA,wBAAA;AAAA,EAEjB,gCAAkC,EAAA;AAAA,IAChC,KAAO,EAAA,KAAA;AAAA,IACP,MAAQ,EAAA,IAAA;AAAA,IACR,MAAQ,EAAA,OAAA;AAAA,GACV;AAAA,EAEA,kCAAoC,EAAA;AAAA,IAClC,MAAQ,EAAA,KAAA;AAAA,IACR,KAAO,EAAA,IAAA;AAAA,IACP,MAAQ,EAAA,OAAA;AAAA,GACV;AAAA,EAEA,QAAU,EAAA;AAAA,IACR,EAAI,EAAA;AAAA,MACF,IAAA,EAAM,EAAE,eAAA,EAAiB,yBAA0B,EAAA;AAAA,KACrD;AAAA,GACF;AACF,CAAC,CAAA;;AClBM,MAAM,SAAY,GAAAV,yBAAA,CAAM,UAG7B,CAAA,CAAC,OAAO,UAAe,KAAA;AACvB,EAAM,MAAA,EAAE,EAAG,EAAA,GAAI,iBAAkB,EAAA,CAAA;AAEjC,EAAA,sCAAQ,eAAiB,EAAA,EAAA,GAAG,KAAO,EAAA,EAAA,EAAQ,KAAK,UAAY,EAAA,CAAA,CAAA;AAC9D,CAAC,CAAA;;ACXY,MAAA,UAAA,GAAaH,4BAAO,QAAU,EAAA;AAAA,EACzC,QAAU,EAAA,MAAA;AAAA,EACV,cAAgB,EAAA,MAAA;AAAA,EAEhB,GAAG,YAAa,CAAA,IAAA;AAAA,EAEhB,QAAU,EAAA;AAAA,IACR,EAAI,EAAA;AAAA,MACF,IAAM,EAAA;AAAA,QACJ,GAAG,YAAa,CAAA,EAAA;AAAA,QAChB,KAAO,EAAA,eAAA;AAAA,QACP,cAAgB,EAAA,iBAAA;AAAA,QAChB,uBAAyB,EAAA,KAAA;AAAA,QACzB,mBAAqB,EAAA,KAAA;AAAA,QACrB,OAAS,EAAA,MAAA;AAAA,QAET,CAAC,gBAAgB,GAAG;AAAA,UAClB,aAAe,EAAA,MAAA;AAAA,UACf,KAAO,EAAA,yBAAA;AAAA,SACT;AAAA,OACF;AAAA,MACA,OAAO,YAAa,CAAA,GAAA;AAAA,KACtB;AAAA,GACF;AACF,CAAC,CAAA;;AClBM,MAAM,OAAOG,yBAAM,CAAA,UAAA;AAAA,EACxB,CAAC,EAAE,QAAA,EAAU,MAAM,GAAG,SAAA,IAAa,UAAe,KAAA;AAChD,IAAM,MAAA,EAAE,EAAG,EAAA,GAAI,iBAAkB,EAAA,CAAA;AAEjC,IAAA,uBACGK,cAAA,CAAA,UAAA,EAAA,EAAY,GAAG,SAAA,EAAW,OAAO,EAAA,IAAA,EAAC,EACjC,EAAA,QAAA,kBAAAA,cAAA,CAAC,GAAE,EAAA,EAAA,IAAA,EAAY,GAAK,EAAA,UAAA,EACjB,UACH,CACF,EAAA,CAAA,CAAA;AAAA,GAEJ;AACF,CAAA;;AClBa,MAAA,UAAA,GAAaR,4BAAO,QAAU,EAAA;AAAA,EACzC,GAAG,YAAa,CAAA,IAAA;AAAA,EAEhB,QAAU,EAAA;AAAA,IACR,EAAI,EAAA;AAAA,MACF,MAAM,EAAC;AAAA,MACP,OAAO,EAAC;AAAA,KACV;AAAA,IACA,MAAQ,EAAA;AAAA,MACN,MAAM,EAAC;AAAA,MACP,OAAO,EAAC;AAAA,KACV;AAAA,GACF;AAAA,EAEA,gBAAkB,EAAA;AAAA,IAChB;AAAA,MACE,EAAI,EAAA,IAAA;AAAA,MACJ,MAAQ,EAAA,IAAA;AAAA,MACR,GAAK,EAAA;AAAA,QACH,eAAiB,EAAA,4BAAA;AAAA,QACjB,KAAO,EAAA,wBAAA;AAAA,OACT;AAAA,KACF;AAAA,IACA;AAAA,MACE,EAAI,EAAA,KAAA;AAAA,MACJ,MAAQ,EAAA,IAAA;AAAA,MACR,GAAK,EAAA;AAAA,QACH,eAAiB,EAAA,qCAAA;AAAA,QACjB,KAAO,EAAA,wBAAA;AAAA,OACT;AAAA,KACF;AAAA,IACA;AAAA,MACE,EAAI,EAAA,IAAA;AAAA,MACJ,MAAQ,EAAA,KAAA;AAAA,MACR,GAAK,EAAA;AAAA,QACH,GAAG,YAAa,CAAA,EAAA;AAAA,QAEhB,CAAC,gBAAgB,GAAG;AAAA,UAClB,aAAe,EAAA,MAAA;AAAA,UACf,KAAO,EAAA,yBAAA;AAAA,SACT;AAAA,OACF;AAAA,KACF;AAAA,IACA;AAAA,MACE,EAAI,EAAA,KAAA;AAAA,MACJ,MAAQ,EAAA,KAAA;AAAA,MACR,KAAK,YAAa,CAAA,GAAA;AAAA,KACpB;AAAA,GACF;AACF,CAAC,CAAA;;AC7BM,MAAM,OAAOG,yBAAM,CAAA,UAAA;AAAA,EACxB,CAAC,EAAE,MAAA,GAAS,KAAO,EAAA,QAAA,GAAW,MAAM,OAAS,EAAA,GAAG,SAAU,EAAA,EAAG,UAAe,KAAA;AAC1E,IAAM,MAAA,EAAE,EAAG,EAAA,GAAI,iBAAkB,EAAA,CAAA;AAEjC,IAAM,MAAA,oBAAA,GAAuB,OAAY,KAAA,IAAA,GAAO,QAAW,GAAA,KAAA,CAAA;AAE3D,IAAA,IAAI,oBAAsB,EAAA;AACxB,MAAA,sCAAQ,QAAU,EAAA,EAAA,GAAG,SAAW,EAAA,OAAA,EAAkB,KAAK,UAAY,EAAA,CAAA,CAAA;AAAA,KACrE;AAEA,IACE,uBAAAK,cAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACE,GAAG,SAAA;AAAA,QACJ,OAAA;AAAA,QACA,EAAA;AAAA,QACA,MAAA;AAAA,QACA,GAAK,EAAA,UAAA;AAAA,OAAA;AAAA,KACP,CAAA;AAAA,GAEJ;AACF,CAAA;;ACFO,MAAM,UAAUL,yBAAM,CAAA,UAAA;AAAA,EAI3B,CACE;AAAA,IACE,QAAA;AAAA,IACA,WAAc,GAAA,YAAA;AAAA,IACd,OAAU,GAAA,UAAA;AAAA,IACV,GAAM,GAAA,KAAA;AAAA,IACN,IAAO,GAAA,IAAA;AAAA,IACP,GAAG,SAAA;AAAA,KAEL,UACG,KAAA;AACH,IAAM,MAAA,CAAC,EAAE,CAAA,GAAIW,4CAAqB,EAAA,CAAA;AAElC,IAAA,MAAM,WACJ,GAAA,QAAA,KAAa,KAAY,CAAA,GAAA,OAAA,GAAU,WAAW,MAAS,GAAA,UAAA,CAAA;AAEzD,IACE,uBAAAN,cAAA,CAAC,mBAAgB,EACf,EAAA,QAAA,kBAAAA,cAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,OAAS,EAAA,WAAA;AAAA,QACT,WAAA;AAAA,QACA,GAAA;AAAA,QACA,IAAA;AAAA,QACA,GAAK,EAAA,UAAA;AAAA,QACJ,GAAG,SAAA;AAAA,OAAA;AAAA,KAER,EAAA,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAYA,OAAA,CAAQ,IAAO,GAAA,IAAA,CAAA;AACf,OAAA,CAAQ,IAAO,GAAA,IAAA,CAAA;AACf,OAAA,CAAQ,IAAO,GAAA,IAAA,CAAA;AACf,OAAA,CAAQ,SAAY,GAAA,SAAA;;;;"}
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/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/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 variant: {\n floating: {\n backgroundColor: '$background-neutrals-layout',\n boxShadow: '$elevation-100',\n border: '0.5px solid $border-neutrals-subtle',\n borderRadius: '$100',\n padding: '$50',\n },\n flat: {},\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'\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 '&[tabindex=\"0\"]': {\n zIndex: '1',\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'\n\nexport interface BaseItemProps\n extends StyledBaseItemProps,\n HoverEvents,\n PressEvents {\n disabled?: boolean\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 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 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: '$50',\n height: '$10',\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-neutrals-hover',\n },\n\n '&:active, &[data-pressed]': {\n backgroundColor: '$background-neutrals-active',\n },\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 StyledIcon = styled(BaseItem, {\n padding: 0,\n font: 'unset',\n width: '$10',\n color: '$icon-neutrals',\n\n ...sharedStyles.base,\n\n variants: {\n active: {\n true: {\n backgroundColor: '$background-primary-subtle-selected',\n color: '$icon-primary-selected',\n },\n false: {\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$icon-neutrals-disabled',\n },\n },\n },\n },\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { StyledIcon } from './icon.styled'\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 <StyledIcon {...restProps} active={active} 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: '$border-neutrals-subtle',\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 { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\n\nexport const StyledLink = styled(BaseItem, {\n paddingX: '$150',\n\n ...sharedStyles.base,\n color: '$text-primary',\n textDecoration: 'underline solid',\n textDecorationThickness: '1px',\n textUnderlineOffset: '4px',\n outline: 'none',\n\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$text-neutrals-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'\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 <StyledLink {...restProps} asChild>\n <a href={href} ref={forwardRef}>\n {children}\n </a>\n </StyledLink>\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\n variants: {\n active: {\n true: {\n backgroundColor: '$background-primary-subtle-selected',\n color: '$text-primary-selected',\n },\n false: {\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$text-neutrals-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'\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 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 ref={forwardRef}\n />\n )\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 * @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\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 ...restProps\n },\n forwardRef\n ) => {\n const variantProp =\n unstyled === undefined ? variant : unstyled ? 'flat' : 'floating'\n\n return (\n <StyledToolbar\n variant={variantProp}\n orientation={orientation}\n dir={dir}\n loop={loop}\n ref={forwardRef}\n {...restProps}\n />\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","React","useAriaDisabled","usePress","booleanify","useHover","jsx","mergeProps","focus","Separator"],"mappings":"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"}
package/dist/module.js CHANGED
@@ -1,6 +1,5 @@
1
1
  import { jsx } from 'react/jsx-runtime';
2
- import React, { createContext, useContext } from 'react';
3
- import { useNewDesignLanguage } from '@mirohq/design-system-experiments';
2
+ import React from 'react';
4
3
  import { styled } from '@mirohq/design-system-stitches';
5
4
  import * as RadixToolbar from '@radix-ui/react-toolbar';
6
5
  import { Root, Separator as Separator$1 } from '@radix-ui/react-toolbar';
@@ -26,37 +25,17 @@ const StyledToolbar = styled(Root, {
26
25
  height: "$12"
27
26
  },
28
27
  variants: {
29
- v1: {
30
- true: {}
31
- },
32
28
  variant: {
33
- floating: {},
34
- flat: {}
35
- }
36
- },
37
- compoundVariants: [
38
- {
39
- variant: "floating",
40
- v1: false,
41
- css: {
42
- backgroundColor: "$background-neutrals-container",
43
- boxShadow: "$50",
44
- borderRadius: "$50",
45
- padding: "2px"
46
- }
47
- },
48
- {
49
- variant: "floating",
50
- v1: true,
51
- css: {
29
+ floating: {
52
30
  backgroundColor: "$background-neutrals-layout",
53
- boxShadow: "0px 1px 8px 0px rgba(34, 36, 40, 0.05)",
31
+ boxShadow: "$elevation-100",
54
32
  border: "0.5px solid $border-neutrals-subtle",
55
33
  borderRadius: "$100",
56
34
  padding: "$50"
57
- }
35
+ },
36
+ flat: {}
58
37
  }
59
- ]
38
+ }
60
39
  });
61
40
 
62
41
  const StyledBaseItem = styled(RadixToolbar.Button, {
@@ -121,29 +100,8 @@ const sharedStyles = {
121
100
  height: "$10",
122
101
  border: "none",
123
102
  ...focus.css({
124
- boxShadow: "$focus-keyboard"
125
- })
126
- },
127
- old: {
128
- [disabledSelector]: {
129
- cursor: "default",
130
- color: "$text-neutrals-disabled"
131
- },
132
- "&[disabled]": {
133
- pointerEvents: "none"
134
- },
135
- '&:not([aria-disabled="true"])': {
136
- "&[data-hovered]": {
137
- backgroundColor: "$background-primary-subtle-hover",
138
- color: "$icon-primary-hover"
139
- },
140
- "&:active, &[data-pressed]": {
141
- backgroundColor: "$background-primary-subtle-active",
142
- color: "$icon-primary-active"
143
- }
144
- }
145
- },
146
- v1: {
103
+ boxShadow: "$focus"
104
+ }),
147
105
  "&[disabled]": {
148
106
  pointerEvents: "none"
149
107
  },
@@ -165,78 +123,30 @@ const StyledIcon = styled(BaseItem, {
165
123
  color: "$icon-neutrals",
166
124
  ...sharedStyles.base,
167
125
  variants: {
168
- v1: {
169
- true: {},
170
- false: {}
171
- },
172
126
  active: {
173
- true: {},
174
- false: {}
175
- }
176
- },
177
- compoundVariants: [
178
- {
179
- v1: true,
180
- active: true,
181
- css: {
182
- backgroundColor: "$background-primary-subtle",
183
- color: "$icon-primary-selected"
184
- }
185
- },
186
- {
187
- v1: false,
188
- active: true,
189
- css: {
127
+ true: {
190
128
  backgroundColor: "$background-primary-subtle-selected",
191
129
  color: "$icon-primary-selected"
192
- }
193
- },
194
- {
195
- v1: true,
196
- active: false,
197
- css: {
198
- ...sharedStyles.v1,
130
+ },
131
+ false: {
199
132
  [disabledSelector]: {
200
133
  pointerEvents: "none",
201
134
  color: "$icon-neutrals-disabled"
202
135
  }
203
136
  }
204
- },
205
- {
206
- v1: false,
207
- active: false,
208
- css: sharedStyles.old
209
137
  }
210
- ]
211
- });
212
-
213
- const ToolbarContext = createContext({});
214
- const ToolbarProvider = ({
215
- children,
216
- ...restProps
217
- }) => /* @__PURE__ */ jsx(
218
- ToolbarContext.Provider,
219
- {
220
- value: {
221
- ...restProps
222
- },
223
- children
224
138
  }
225
- );
226
- const useToolbarContext = () => useContext(ToolbarContext);
139
+ });
227
140
 
228
141
  const Icon = React.forwardRef(
229
- ({ active = false, ...restProps }, forwardRef) => {
230
- const { v1 } = useToolbarContext();
231
- return /* @__PURE__ */ jsx(StyledIcon, { ...restProps, v1, active, ref: forwardRef });
232
- }
142
+ ({ active = false, ...restProps }, forwardRef) => /* @__PURE__ */ jsx(StyledIcon, { ...restProps, active, ref: forwardRef })
233
143
  );
234
144
 
235
145
  const StyledSeparator = styled(Separator$1, {
236
146
  all: "unset",
237
147
  display: "block",
238
148
  boxSizing: "border-box",
239
- backgroundColor: "rgba(205, 204, 215, 1)",
149
+ backgroundColor: "$border-neutrals-subtle",
240
150
  '&[data-orientation="vertical"]': {
241
151
  width: "1px",
242
152
  height: "$6",
@@ -246,100 +156,49 @@ const StyledSeparator = styled(Separator$1, {
246
156
  height: "1px",
247
157
  width: "$6",
248
158
  margin: "$50 0"
249
- },
250
- variants: {
251
- v1: {
252
- true: { backgroundColor: "$border-neutrals-subtle" }
253
- }
254
159
  }
255
160
  });
256
161
 
257
- const Separator = React.forwardRef((props, forwardRef) => {
258
- const { v1 } = useToolbarContext();
259
- return /* @__PURE__ */ jsx(StyledSeparator, { ...props, v1, ref: forwardRef });
260
- });
162
+ const Separator = React.forwardRef((props, forwardRef) => /* @__PURE__ */ jsx(StyledSeparator, { ...props, ref: forwardRef }));
261
163
 
262
164
  const StyledLink = styled(BaseItem, {
263
165
  paddingX: "$150",
264
- textDecoration: "none",
265
166
  ...sharedStyles.base,
266
- variants: {
267
- v1: {
268
- true: {
269
- ...sharedStyles.v1,
270
- color: "$text-primary",
271
- textDecoration: "underline solid",
272
- textDecorationThickness: "1px",
273
- textUnderlineOffset: "4px",
274
- outline: "none",
275
- [disabledSelector]: {
276
- pointerEvents: "none",
277
- color: "$text-neutrals-disabled"
278
- }
279
- },
280
- false: sharedStyles.old
281
- }
167
+ color: "$text-primary",
168
+ textDecoration: "underline solid",
169
+ textDecorationThickness: "1px",
170
+ textUnderlineOffset: "4px",
171
+ outline: "none",
172
+ [disabledSelector]: {
173
+ pointerEvents: "none",
174
+ color: "$text-neutrals-disabled"
282
175
  }
283
176
  });
284
177
 
285
178
  const Link = React.forwardRef(
286
- ({ children, href, ...restProps }, forwardRef) => {
287
- const { v1 } = useToolbarContext();
288
- return /* @__PURE__ */ jsx(StyledLink, { ...restProps, asChild: true, v1, children: /* @__PURE__ */ jsx("a", { href, ref: forwardRef, children }) });
289
- }
179
+ ({ children, href, ...restProps }, forwardRef) => /* @__PURE__ */ jsx(StyledLink, { ...restProps, asChild: true, children: /* @__PURE__ */ jsx("a", { href, ref: forwardRef, children }) })
290
180
  );
291
181
 
292
182
  const StyledItem = styled(BaseItem, {
293
183
  ...sharedStyles.base,
294
184
  variants: {
295
- v1: {
296
- true: {},
297
- false: {}
298
- },
299
185
  active: {
300
- true: {},
301
- false: {}
302
- }
303
- },
304
- compoundVariants: [
305
- {
306
- v1: true,
307
- active: true,
308
- css: {
309
- backgroundColor: "$background-primary-subtle",
310
- color: "$text-primary-selected"
311
- }
312
- },
313
- {
314
- v1: false,
315
- active: true,
316
- css: {
186
+ true: {
317
187
  backgroundColor: "$background-primary-subtle-selected",
318
188
  color: "$text-primary-selected"
319
- }
320
- },
321
- {
322
- v1: true,
323
- active: false,
324
- css: {
325
- ...sharedStyles.v1,
189
+ },
190
+ false: {
326
191
  [disabledSelector]: {
327
192
  pointerEvents: "none",
328
193
  color: "$text-neutrals-disabled"
329
194
  }
330
195
  }
331
- },
332
- {
333
- v1: false,
334
- active: false,
335
- css: sharedStyles.old
336
196
  }
337
- ]
197
+ }
338
198
  });
339
199
 
340
200
  const Item = React.forwardRef(
341
201
  ({ active = false, unstyled = true, asChild, ...restProps }, forwardRef) => {
342
- const { v1 } = useToolbarContext();
343
202
  const shouldRenderUnstyled = asChild === true ? unstyled : false;
344
203
  if (shouldRenderUnstyled) {
345
204
  return /* @__PURE__ */ jsx(BaseItem, { ...restProps, asChild, ref: forwardRef });
@@ -349,7 +208,6 @@ const Item = React.forwardRef(
349
208
  {
350
209
  ...restProps,
351
210
  asChild,
352
- v1,
353
211
  active,
354
212
  ref: forwardRef
355
213
  }
@@ -366,12 +224,10 @@ const Toolbar = React.forwardRef(
366
224
  loop = true,
367
225
  ...restProps
368
226
  }, forwardRef) => {
369
- const [v1] = useNewDesignLanguage();
370
227
  const variantProp = unstyled === void 0 ? variant : unstyled ? "flat" : "floating";
371
- return /* @__PURE__ */ jsx(ToolbarProvider, { v1, children: /* @__PURE__ */ jsx(
228
+ return /* @__PURE__ */ jsx(
372
229
  StyledToolbar,
373
230
  {
374
- v1,
375
231
  variant: variantProp,
376
232
  orientation,
377
233
  dir,
@@ -379,7 +235,7 @@ const Toolbar = React.forwardRef(
379
235
  ref: forwardRef,
380
236
  ...restProps
381
237
  }
382
- ) });
238
+ );
383
239
  }
384
240
  );
385
241
  Toolbar.Icon = Icon;
@@ -1 +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/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 v1: {\n true: {},\n },\n variant: {\n floating: {},\n flat: {},\n },\n },\n compoundVariants: [\n {\n variant: 'floating',\n v1: false,\n css: {\n backgroundColor: '$background-neutrals-container',\n boxShadow: '$50',\n borderRadius: '$50',\n padding: '2px',\n },\n },\n {\n variant: 'floating',\n v1: true,\n css: {\n backgroundColor: '$background-neutrals-layout',\n boxShadow: '0px 1px 8px 0px rgba(34, 36, 40, 0.05)',\n border: '0.5px solid $border-neutrals-subtle',\n borderRadius: '$100',\n padding: '$50',\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'\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 '&[tabindex=\"0\"]': {\n zIndex: '1',\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'\n\nexport interface BaseItemProps\n extends StyledBaseItemProps,\n HoverEvents,\n PressEvents {\n disabled?: boolean\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 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 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: '$50',\n height: '$10',\n border: 'none',\n ...focus.css({\n boxShadow: '$focus-keyboard',\n }),\n },\n old: {\n [disabledSelector]: {\n cursor: 'default',\n color: '$text-neutrals-disabled',\n },\n\n '&[disabled]': {\n pointerEvents: 'none',\n },\n\n '&:not([aria-disabled=\"true\"])': {\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 v1: {\n '&[disabled]': {\n pointerEvents: 'none',\n },\n '&:not([aria-disabled=\"true\"])': {\n '&[data-hovered]': {\n backgroundColor: '$background-neutrals-hover',\n },\n\n '&:active, &[data-pressed]': {\n backgroundColor: '$background-neutrals-active',\n },\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 StyledIcon = styled(BaseItem, {\n padding: 0,\n font: 'unset',\n width: '$10',\n color: '$icon-neutrals',\n\n ...sharedStyles.base,\n\n variants: {\n v1: {\n true: {},\n false: {},\n },\n active: {\n true: {},\n false: {},\n },\n },\n\n compoundVariants: [\n {\n v1: true,\n active: true,\n css: {\n backgroundColor: '$background-primary-subtle',\n color: '$icon-primary-selected',\n },\n },\n {\n v1: false,\n active: true,\n css: {\n backgroundColor: '$background-primary-subtle-selected',\n color: '$icon-primary-selected',\n },\n },\n {\n v1: true,\n active: false,\n css: {\n ...sharedStyles.v1,\n\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$icon-neutrals-disabled',\n },\n },\n },\n {\n v1: false,\n active: false,\n css: sharedStyles.old,\n },\n ],\n})\n","import React, { createContext, useContext } from 'react'\nimport type { PropsWithChildren } from 'react'\n\ninterface ToolbarProps {\n v1: boolean\n}\n\ntype ToolbarContextProps = ToolbarProps\n\nexport type ToolbarProviderProps = ToolbarProps\n\nconst ToolbarContext = createContext<ToolbarContextProps>({} as any)\n\nexport const ToolbarProvider = ({\n children,\n ...restProps\n}: PropsWithChildren<ToolbarProviderProps>): React.ReactElement => (\n <ToolbarContext.Provider\n value={{\n ...restProps,\n }}\n >\n {children}\n </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 { v1 } = useToolbarContext()\n\n return (\n <StyledIcon {...restProps} v1={v1} active={active} 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: '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 variants: {\n v1: {\n true: { backgroundColor: '$border-neutrals-subtle' },\n },\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 Omit<StyledSeparatorProps, 'v1'> {}\n\nexport const Separator = React.forwardRef<\n ElementRef<typeof StyledSeparator>,\n SeparatorProps\n>((props, forwardRef) => {\n const { v1 } = useToolbarContext()\n\n return <StyledSeparator {...props} v1={v1} 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 textDecoration: 'none',\n\n ...sharedStyles.base,\n\n variants: {\n v1: {\n true: {\n ...sharedStyles.v1,\n color: '$text-primary',\n textDecoration: 'underline solid',\n textDecorationThickness: '1px',\n textUnderlineOffset: '4px',\n outline: 'none',\n\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$text-neutrals-disabled',\n },\n },\n false: sharedStyles.old,\n },\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 { v1 } = useToolbarContext()\n\n return (\n <StyledLink {...restProps} asChild v1={v1}>\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\n variants: {\n v1: {\n true: {},\n false: {},\n },\n active: {\n true: {},\n false: {},\n },\n },\n\n compoundVariants: [\n {\n v1: true,\n active: true,\n css: {\n backgroundColor: '$background-primary-subtle',\n color: '$text-primary-selected',\n },\n },\n {\n v1: false,\n active: true,\n css: {\n backgroundColor: '$background-primary-subtle-selected',\n color: '$text-primary-selected',\n },\n },\n {\n v1: true,\n active: false,\n css: {\n ...sharedStyles.v1,\n\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$text-neutrals-disabled',\n },\n },\n },\n {\n v1: false,\n active: false,\n css: sharedStyles.old,\n },\n ],\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { useToolbarContext } from '../hooks/use-toolbar-context'\nimport type { BaseItemProps } from './base-item'\nimport { BaseItem } from './base-item'\nimport { StyledItem } from './item.styled'\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 { v1 } = useToolbarContext()\n\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 v1={v1}\n active={active}\n ref={forwardRef}\n />\n )\n }\n)\n","import React from 'react'\nimport type { ElementRef, ForwardRefExoticComponent } from 'react'\nimport { useNewDesignLanguage } from '@mirohq/design-system-experiments'\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 { ToolbarProvider } from './hooks/use-toolbar-context'\n\nexport interface ToolbarProps extends Omit<StyledToolbarProps, 'v1'> {\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\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 ...restProps\n },\n forwardRef\n ) => {\n const [v1] = useNewDesignLanguage()\n\n const variantProp =\n unstyled === undefined ? variant : unstyled ? 'flat' : 'floating'\n\n return (\n <ToolbarProvider v1={v1}>\n <StyledToolbar\n v1={v1}\n variant={variantProp}\n orientation={orientation}\n dir={dir}\n loop={loop}\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":["Separator"],"mappings":"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"}
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/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/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 variant: {\n floating: {\n backgroundColor: '$background-neutrals-layout',\n boxShadow: '$elevation-100',\n border: '0.5px solid $border-neutrals-subtle',\n borderRadius: '$100',\n padding: '$50',\n },\n flat: {},\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'\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 '&[tabindex=\"0\"]': {\n zIndex: '1',\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'\n\nexport interface BaseItemProps\n extends StyledBaseItemProps,\n HoverEvents,\n PressEvents {\n disabled?: boolean\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 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 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: '$50',\n height: '$10',\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-neutrals-hover',\n },\n\n '&:active, &[data-pressed]': {\n backgroundColor: '$background-neutrals-active',\n },\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 StyledIcon = styled(BaseItem, {\n padding: 0,\n font: 'unset',\n width: '$10',\n color: '$icon-neutrals',\n\n ...sharedStyles.base,\n\n variants: {\n active: {\n true: {\n backgroundColor: '$background-primary-subtle-selected',\n color: '$icon-primary-selected',\n },\n false: {\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$icon-neutrals-disabled',\n },\n },\n },\n },\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { BaseItemProps } from './base-item'\nimport { StyledIcon } from './icon.styled'\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 <StyledIcon {...restProps} active={active} 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: '$border-neutrals-subtle',\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 { BaseItem } from './base-item'\nimport { disabledSelector, sharedStyles } from '../styles'\n\nexport const StyledLink = styled(BaseItem, {\n paddingX: '$150',\n\n ...sharedStyles.base,\n color: '$text-primary',\n textDecoration: 'underline solid',\n textDecorationThickness: '1px',\n textUnderlineOffset: '4px',\n outline: 'none',\n\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$text-neutrals-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'\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 <StyledLink {...restProps} asChild>\n <a href={href} ref={forwardRef}>\n {children}\n </a>\n </StyledLink>\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\n variants: {\n active: {\n true: {\n backgroundColor: '$background-primary-subtle-selected',\n color: '$text-primary-selected',\n },\n false: {\n [disabledSelector]: {\n pointerEvents: 'none',\n color: '$text-neutrals-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'\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 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 ref={forwardRef}\n />\n )\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 * @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\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 ...restProps\n },\n forwardRef\n ) => {\n const variantProp =\n unstyled === undefined ? variant : unstyled ? 'flat' : 'floating'\n\n return (\n <StyledToolbar\n variant={variantProp}\n orientation={orientation}\n dir={dir}\n loop={loop}\n ref={forwardRef}\n {...restProps}\n />\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
@@ -1,5 +1,5 @@
1
1
  import * as react from 'react';
2
- import react__default, { AnchorHTMLAttributes } from 'react';
2
+ import react__default, { AnchorHTMLAttributes, ForwardRefExoticComponent } from 'react';
3
3
  import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
4
4
  import * as _mirohq_design_system_stitches from '@mirohq/design-system-stitches';
5
5
  import { StrictComponentProps } from '@mirohq/design-system-stitches';
@@ -7,17 +7,15 @@ import * as _radix_ui_react_toolbar from '@radix-ui/react-toolbar';
7
7
  import { HoverEvents } from '@react-types/shared';
8
8
  import { PressEvents } from '@mirohq/design-system-use-press';
9
9
 
10
- declare const StyledToolbar: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_radix_ui_react_toolbar.ToolbarProps & react.RefAttributes<HTMLDivElement>>>, "v1" | "variant"> & _stitches_react_types_styled_component.TransformProps<{
11
- v1?: boolean | "true" | undefined;
10
+ declare const StyledToolbar: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_radix_ui_react_toolbar.ToolbarProps & react.RefAttributes<HTMLDivElement>>>, "variant"> & _stitches_react_types_styled_component.TransformProps<{
12
11
  variant?: "flat" | "floating" | undefined;
13
12
  }, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_radix_ui_react_toolbar.ToolbarProps & react.RefAttributes<HTMLDivElement>>, {
14
- v1?: boolean | "true" | undefined;
15
13
  variant?: "flat" | "floating" | undefined;
16
14
  }, {}>;
17
- declare type StyledToolbarProps = StrictComponentProps<typeof StyledToolbar>;
15
+ type StyledToolbarProps = StrictComponentProps<typeof StyledToolbar>;
18
16
 
19
17
  declare const StyledBaseItem: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_radix_ui_react_toolbar.ToolbarButtonProps & react.RefAttributes<HTMLButtonElement>>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLButtonElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_radix_ui_react_toolbar.ToolbarButtonProps & react.RefAttributes<HTMLButtonElement>>, {}, {}>;
20
- declare type StyledBaseItemProps = StrictComponentProps<typeof StyledBaseItem>;
18
+ type StyledBaseItemProps = StrictComponentProps<typeof StyledBaseItem>;
21
19
 
22
20
  interface BaseItemProps extends StyledBaseItemProps, HoverEvents, PressEvents {
23
21
  disabled?: boolean;
@@ -32,24 +30,16 @@ interface IconProps extends BaseItemProps {
32
30
  }
33
31
  declare const Icon: react__default.ForwardRefExoticComponent<Omit<IconProps, "ref"> & react__default.RefAttributes<HTMLButtonElement>>;
34
32
 
35
- declare const StyledSeparator: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_radix_ui_react_toolbar.ToolbarSeparatorProps & react.RefAttributes<HTMLDivElement>>>, "v1"> & _stitches_react_types_styled_component.TransformProps<{
36
- v1?: boolean | "true" | undefined;
37
- }, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_radix_ui_react_toolbar.ToolbarSeparatorProps & react.RefAttributes<HTMLDivElement>>, {
38
- v1?: boolean | "true" | undefined;
39
- }, {}>;
40
- declare type StyledSeparatorProps = StrictComponentProps<typeof StyledSeparator>;
33
+ declare const StyledSeparator: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_radix_ui_react_toolbar.ToolbarSeparatorProps & react.RefAttributes<HTMLDivElement>>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_radix_ui_react_toolbar.ToolbarSeparatorProps & react.RefAttributes<HTMLDivElement>>, {}, {}>;
34
+ type StyledSeparatorProps = StrictComponentProps<typeof StyledSeparator>;
41
35
 
42
- interface SeparatorProps extends Omit<StyledSeparatorProps, 'v1'> {
36
+ interface SeparatorProps extends StyledSeparatorProps {
43
37
  }
44
38
  declare const Separator: react__default.ForwardRefExoticComponent<Omit<SeparatorProps, "ref"> & react__default.RefAttributes<HTMLDivElement>>;
45
39
 
46
- declare const StyledLink: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<Omit<BaseItemProps, "ref"> & react.RefAttributes<HTMLButtonElement>>>, "v1"> & _stitches_react_types_styled_component.TransformProps<{
47
- v1?: boolean | "true" | "false" | undefined;
48
- }, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLButtonElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<Omit<BaseItemProps, "ref"> & react.RefAttributes<HTMLButtonElement>>, {
49
- v1?: boolean | "true" | "false" | undefined;
50
- }, {}>;
40
+ declare const StyledLink: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<Omit<BaseItemProps, "ref"> & react.RefAttributes<HTMLButtonElement>>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLButtonElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<Omit<BaseItemProps, "ref"> & react.RefAttributes<HTMLButtonElement>>, {}, {}>;
51
41
 
52
- declare type ItemPropsWithAnchor = Omit<BaseItemProps, 'ref'> & AnchorHTMLAttributes<typeof StyledLink>;
42
+ type ItemPropsWithAnchor = Omit<BaseItemProps, 'ref'> & AnchorHTMLAttributes<typeof StyledLink>;
53
43
  interface LinkProps extends ItemPropsWithAnchor {
54
44
  }
55
45
  declare const Link: react__default.ForwardRefExoticComponent<LinkProps & react__default.RefAttributes<HTMLAnchorElement>>;
@@ -71,7 +61,7 @@ interface ItemProps extends BaseItemProps {
71
61
  }
72
62
  declare const Item: react__default.ForwardRefExoticComponent<Omit<ItemProps, "ref"> & react__default.RefAttributes<HTMLButtonElement>>;
73
63
 
74
- interface ToolbarProps extends Omit<StyledToolbarProps, 'v1'> {
64
+ interface ToolbarProps extends StyledToolbarProps {
75
65
  /**
76
66
  * @deprecated Please use variant for non-floating toolbar
77
67
  */
@@ -97,7 +87,7 @@ interface ToolbarProps extends Omit<StyledToolbarProps, 'v1'> {
97
87
  */
98
88
  loop?: boolean;
99
89
  }
100
- declare const Toolbar: react__default.ForwardRefExoticComponent<ToolbarProps> & Partials;
90
+ declare const Toolbar: ForwardRefExoticComponent<ToolbarProps> & Partials;
101
91
  interface Partials {
102
92
  Icon: typeof Icon;
103
93
  Item: typeof Item;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mirohq/design-system-toolbar",
3
- "version": "2.7.0-new-focus-keyboard.1",
3
+ "version": "3.0.0-pdl-removing-ffs.0",
4
4
  "description": "",
5
5
  "author": "Miro",
6
6
  "source": "src/index.ts",
@@ -31,12 +31,11 @@
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-experiments": "^0.2.0",
35
- "@mirohq/design-system-use-aria-disabled": "^0.2.1",
36
- "@mirohq/design-system-use-press": "^0.4.2",
37
- "@mirohq/design-system-utils": "^0.15.5",
38
- "@mirohq/design-system-stitches": "^2.6.31-new-focus-keyboard.1",
39
- "@mirohq/design-system-styles": "^1.2.31-new-focus-keyboard.1"
34
+ "@mirohq/design-system-stitches": "^3.0.0-pdl-removing-ffs.0",
35
+ "@mirohq/design-system-styles": "^2.0.0-pdl-removing-ffs.0",
36
+ "@mirohq/design-system-use-aria-disabled": "^1.0.0-pdl-removing-ffs.0",
37
+ "@mirohq/design-system-utils": "^1.0.0-pdl-removing-ffs.0",
38
+ "@mirohq/design-system-use-press": "^1.0.0-pdl-removing-ffs.0"
40
39
  },
41
40
  "scripts": {
42
41
  "build": "rollup -c ../../../rollup.config.js",