@bitrise/bitkit-v2 0.3.462-beta.2927 → 0.3.462

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 (57) hide show
  1. package/dist/components/BitkitCombobox/BitkitCombobox.d.ts +3 -3
  2. package/dist/components/BitkitCombobox/BitkitCombobox.js +2 -6
  3. package/dist/components/BitkitCombobox/BitkitCombobox.js.map +1 -1
  4. package/dist/components/BitkitMultiselect/BitkitMultiselect.d.ts +3 -3
  5. package/dist/components/BitkitMultiselect/BitkitMultiselect.js +1 -4
  6. package/dist/components/BitkitMultiselect/BitkitMultiselect.js.map +1 -1
  7. package/dist/components/BitkitMultiselectMenu/BitkitMultiselectMenu.d.ts +3 -3
  8. package/dist/components/BitkitMultiselectMenu/BitkitMultiselectMenu.js.map +1 -1
  9. package/dist/components/BitkitSelect/BitkitSelect.d.ts +3 -3
  10. package/dist/components/BitkitSelect/BitkitSelect.js +1 -4
  11. package/dist/components/BitkitSelect/BitkitSelect.js.map +1 -1
  12. package/dist/components/BitkitSelectMenu/BitkitSelectMenu.d.ts +2 -7
  13. package/dist/components/BitkitSelectMenu/BitkitSelectMenu.js.map +1 -1
  14. package/dist/components/BitkitSelectMenu/SelectMenuShell.d.ts +3 -3
  15. package/dist/components/BitkitSelectMenu/SelectMenuShell.js +4 -22
  16. package/dist/components/BitkitSelectMenu/SelectMenuShell.js.map +1 -1
  17. package/dist/components/BitkitTreeView/BitkitTreeView.js +4 -1
  18. package/dist/components/BitkitTreeView/BitkitTreeView.js.map +1 -1
  19. package/dist/components/index.d.ts +0 -2
  20. package/dist/main.js +1 -4
  21. package/dist/theme/slot-recipes/DatePickerSelect.recipe.d.ts +2 -14
  22. package/dist/theme/slot-recipes/Select.recipe.d.ts +5 -23
  23. package/dist/theme/slot-recipes/Select.recipe.js +3 -37
  24. package/dist/theme/slot-recipes/Select.recipe.js.map +1 -1
  25. package/dist/theme/slot-recipes/TreeView.recipe.js +9 -6
  26. package/dist/theme/slot-recipes/TreeView.recipe.js.map +1 -1
  27. package/dist/theme/slot-recipes/index.d.ts +7 -150
  28. package/dist/theme/slot-recipes/index.js +1 -3
  29. package/dist/theme/slot-recipes/index.js.map +1 -1
  30. package/package.json +1 -1
  31. package/dist/components/BitkitUISideNav/BitkitUISideNav.d.ts +0 -37
  32. package/dist/components/BitkitUISideNav/BitkitUISideNav.js +0 -167
  33. package/dist/components/BitkitUISideNav/BitkitUISideNav.js.map +0 -1
  34. package/dist/components/BitkitUISideNav/UISideNavBody.d.ts +0 -7
  35. package/dist/components/BitkitUISideNav/UISideNavBody.js +0 -20
  36. package/dist/components/BitkitUISideNav/UISideNavBody.js.map +0 -1
  37. package/dist/components/BitkitUISideNav/UISideNavContext.d.ts +0 -32
  38. package/dist/components/BitkitUISideNav/UISideNavContext.js +0 -28
  39. package/dist/components/BitkitUISideNav/UISideNavContext.js.map +0 -1
  40. package/dist/components/BitkitUISideNav/UISideNavFooter.d.ts +0 -16
  41. package/dist/components/BitkitUISideNav/UISideNavFooter.js +0 -28
  42. package/dist/components/BitkitUISideNav/UISideNavFooter.js.map +0 -1
  43. package/dist/components/BitkitUISideNav/UISideNavFooterHeading.d.ts +0 -12
  44. package/dist/components/BitkitUISideNav/UISideNavFooterHeading.js +0 -26
  45. package/dist/components/BitkitUISideNav/UISideNavFooterHeading.js.map +0 -1
  46. package/dist/components/BitkitUISideNav/UISideNavItem.d.ts +0 -26
  47. package/dist/components/BitkitUISideNav/UISideNavItem.js +0 -33
  48. package/dist/components/BitkitUISideNav/UISideNavItem.js.map +0 -1
  49. package/dist/components/BitkitUISideNav/UISideNavLink.d.ts +0 -30
  50. package/dist/components/BitkitUISideNav/UISideNavLink.js +0 -58
  51. package/dist/components/BitkitUISideNav/UISideNavLink.js.map +0 -1
  52. package/dist/components/BitkitUISideNav/UISideNavWorkspaceSelector.d.ts +0 -45
  53. package/dist/components/BitkitUISideNav/UISideNavWorkspaceSelector.js +0 -119
  54. package/dist/components/BitkitUISideNav/UISideNavWorkspaceSelector.js.map +0 -1
  55. package/dist/theme/slot-recipes/UISideNav.recipe.d.ts +0 -119
  56. package/dist/theme/slot-recipes/UISideNav.recipe.js +0 -416
  57. package/dist/theme/slot-recipes/UISideNav.recipe.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"TreeView.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/TreeView.recipe.ts"],"sourcesContent":["import { treeViewAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst depthOffsetStyle = {\n '--tree-depth': 'calc(var(--depth) - 1)',\n '--tree-indentation-offset': 'calc(var(--tree-indentation) * var(--tree-depth))',\n '--tree-icon-offset': 'calc(var(--tree-icon-size) * var(--tree-depth) * 0.5)',\n '--tree-offset': 'calc(var(--tree-padding-inline-start) + var(--tree-indentation-offset) + var(--tree-icon-offset))',\n paddingInlineStart: 'var(--tree-offset)',\n} as const;\n\nconst baseItemStyle = {\n display: 'flex',\n alignItems: 'flex-start',\n gap: 'var(--tree-item-gap)',\n cursor: 'pointer',\n userSelect: 'none',\n position: 'relative',\n ...depthOffsetStyle,\n focusVisibleRing: 'inside',\n focusRingWidth: '2px',\n _hover: {\n background: 'background/secondary',\n _active: {\n background: 'background/tertiary',\n },\n },\n _active: {\n background: 'background/tertiary',\n },\n _selected: {\n background: 'background/selected',\n _hover: {\n background: 'background/selected-hover',\n _active: {\n background: 'background/selected-hover',\n },\n },\n _active: {\n background: 'background/selected-hover',\n },\n },\n _disabled: {\n opacity: 0.4,\n cursor: 'not-allowed',\n },\n} as const;\n\nconst baseTextStyle = {\n flex: 1,\n minWidth: 0,\n display: 'flex',\n flexDirection: 'column',\n} as const;\n\nconst treeViewSlotRecipe = defineSlotRecipe({\n className: 'bitkit-tree-view',\n slots: [...treeViewAnatomy.keys(), 'actionGroup', 'footer', 'suffixGroup', 'secondaryText'],\n base: {\n root: {\n width: 'full',\n display: 'flex',\n flexDirection: 'column',\n },\n tree: {\n display: 'flex',\n flexDirection: 'column',\n textStyle: 'body/md/regular',\n '--tree-item-gap': 'spacing.8',\n '--tree-indentation': 'spacing.16',\n '--tree-padding-inline-start': 'spacing.8',\n '--tree-icon-size': 'spacing.16',\n _icon: {\n boxSize: 'var(--tree-icon-size)',\n },\n },\n label: {\n fontWeight: 'medium',\n textStyle: 'body/sm/regular',\n },\n branch: {\n position: 'relative',\n },\n branchContent: {\n position: 'relative',\n overflow: 'hidden',\n _open: {\n animationName: 'expand-height, fade-in',\n animationDuration: 'moderate',\n },\n _closed: {\n animationName: 'collapse-height, fade-out',\n animationDuration: 'moderate',\n },\n },\n branchIndicator: {\n display: 'flex',\n justifyContent: 'center',\n color: 'icon/secondary',\n },\n branchTrigger: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n branchControl: {\n ...baseItemStyle,\n },\n item: {\n ...baseItemStyle,\n // Direct-child selector (not Chakra's _icon): the item also hosts SVGs in its suffix and\n // action slots, which keep their own colour.\n '& > svg': {\n color: 'icon/secondary',\n },\n _active: {\n ...baseItemStyle._active,\n '& > svg': {\n color: 'icon/primary',\n },\n },\n _selected: {\n ...baseItemStyle._selected,\n '& > svg': {\n color: 'icon/primary',\n },\n },\n },\n branchText: baseTextStyle,\n itemText: baseTextStyle,\n branchIndentGuide: {},\n itemIndicator: {},\n nodeCheckbox: {\n display: 'inline-flex',\n },\n suffixGroup: {\n display: 'flex',\n gap: '8',\n alignItems: 'center',\n justifyContent: 'flex-end',\n color: 'text/secondary',\n '[data-selected] > &, [data-state=\"open\"] > &': {\n color: 'text/primary',\n },\n paddingInlineStart: '16',\n flexShrink: 0,\n _groupHover: {\n display: 'none',\n },\n },\n footer: depthOffsetStyle,\n actionGroup: {\n display: 'none',\n alignItems: 'center',\n justifyContent: 'flex-end',\n paddingInlineStart: '16',\n flexShrink: 0,\n _groupHover: {\n display: 'flex',\n },\n },\n secondaryText: {\n textStyle: 'body/sm/regular',\n color: 'text/secondary',\n },\n },\n variants: {\n variant: {\n files: {\n branchControl: {\n borderRadius: '4',\n paddingInlineEnd: '16',\n '& > svg': {\n marginBlockStart: '8',\n },\n '& > .badge': {\n marginBlockStart: '6',\n },\n },\n item: {\n borderRadius: '4',\n paddingInlineEnd: '16',\n '& > svg': {\n marginBlockStart: '8',\n },\n '& > .badge': {\n marginBlockStart: '6',\n },\n },\n footer: {\n paddingInlineEnd: '16',\n },\n branchIndicator: {\n alignItems: 'flex-start',\n marginBlockStart: '8',\n alignSelf: 'stretch',\n position: 'relative',\n _open: {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: '16',\n insetBlockEnd: 0,\n insetInlineStart: '50%',\n width: '1',\n background: 'border/regular',\n },\n },\n },\n branchText: {\n paddingBlock: '6',\n },\n itemText: {\n paddingBlock: '6',\n },\n suffixGroup: {\n height: rem(31),\n '& > span': {\n marginBlockEnd: '-1',\n },\n },\n branchIndentGuide: {\n height: '100%',\n width: '1',\n background: 'border/regular',\n position: 'absolute',\n insetBlockStart: 0,\n '--tree-depth': 'calc(var(--depth) - 1)',\n '--tree-indentation-offset': 'calc(var(--tree-indentation) * var(--tree-depth))',\n '--tree-offset': 'calc(var(--tree-padding-inline-start) + var(--tree-indentation-offset))',\n '--tree-icon-offset': 'calc(var(--tree-icon-size) * 0.5 * var(--depth))',\n insetInlineStart: 'calc(var(--tree-offset) + var(--tree-icon-offset))',\n zIndex: 1,\n },\n },\n navigation: {\n branchControl: {\n borderRadius: 0,\n paddingInlineEnd: '16',\n '&:not([data-path=\"0\"])::before': {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: 0,\n insetInlineStart: 'var(--tree-offset)',\n insetInlineEnd: 0,\n height: '1',\n background: 'border/minimal',\n },\n _selected: {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n insetBlock: 0,\n insetInlineEnd: 0,\n width: '4',\n background: 'border/selected',\n borderRadius: '0 2px 2px 0',\n },\n },\n },\n item: {\n borderRadius: 0,\n paddingInlineEnd: '16',\n '&:not([data-path=\"0\"])::before': {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: 0,\n insetInlineStart: 'var(--tree-offset)',\n insetInlineEnd: 0,\n height: '1',\n background: 'border/minimal',\n },\n '& > svg': {\n marginBlockStart: rem(9),\n },\n _selected: {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n insetBlock: 0,\n insetInlineEnd: 0,\n width: '4',\n background: 'border/selected',\n borderRadius: '0 2px 2px 0',\n },\n },\n },\n branchIndicator: {\n marginBlockStart: '8',\n transformOrigin: 'center',\n transitionDuration: 'normal',\n transitionProperty: 'transform',\n transitionTimingFunction: 'default',\n _open: {\n transform: 'rotate(90deg)',\n },\n },\n branchText: {\n paddingBlock: '8',\n gap: '4',\n _open: {\n textStyle: 'body/md/semibold',\n color: 'text/primary',\n },\n },\n itemText: {\n paddingBlock: '8',\n },\n suffixGroup: {\n height: rem(35),\n '& > span': {\n marginBlockEnd: '-1',\n },\n },\n branchIndentGuide: {\n display: 'none',\n },\n },\n },\n },\n defaultVariants: {\n variant: 'files',\n },\n});\n\nexport default treeViewSlotRecipe;\n"],"mappings":"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IACd;IACA,WAAW,EACT,YAAY;KACV,SAAS;KACT,UAAU;KACV,YAAY;KACZ,gBAAgB;KAChB,OAAO;KACP,YAAY;KACZ,cAAc;IAChB,EACF;GACF;GACA,MAAM;IACJ,cAAc;IACd,kBAAkB;IAClB,oCAAkC;KAChC,SAAS;KACT,UAAU;KACV,iBAAiB;KACjB,kBAAkB;KAClB,gBAAgB;KAChB,QAAQ;KACR,YAAY;IACd;IACA,WAAW,EACT,kBAAkB,IAAI,CAAC,EACzB;IACA,WAAW,EACT,YAAY;KACV,SAAS;KACT,UAAU;KACV,YAAY;KACZ,gBAAgB;KAChB,OAAO;KACP,YAAY;KACZ,cAAc;IAChB,EACF;GACF;GACA,iBAAiB;IACf,kBAAkB;IAClB,iBAAiB;IACjB,oBAAoB;IACpB,oBAAoB;IACpB,0BAA0B;IAC1B,OAAO,EACL,WAAW,gBACb;GACF;GACA,YAAY;IACV,cAAc;IACd,KAAK;IACL,OAAO;KACL,WAAW;KACX,OAAO;IACT;GACF;GACA,UAAU,EACR,cAAc,IAChB;GACA,aAAa;IACX,QAAQ,IAAI,EAAE;IACd,YAAY,EACV,gBAAgB,KAClB;GACF;GACA,mBAAmB,EACjB,SAAS,OACX;EACF;CACF,EACF;CACA,iBAAiB,EACf,SAAS,QACX;AACF,CAAC"}
1
+ {"version":3,"file":"TreeView.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/TreeView.recipe.ts"],"sourcesContent":["import { treeViewAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst depthOffsetStyle = {\n '--tree-depth': 'calc(var(--depth) - 1)',\n '--tree-indentation-offset': 'calc(var(--tree-indentation) * var(--tree-depth))',\n '--tree-icon-offset': 'calc(var(--tree-icon-size) * var(--tree-depth) * 0.5)',\n '--tree-offset': 'calc(var(--tree-padding-inline-start) + var(--tree-indentation-offset) + var(--tree-icon-offset))',\n paddingInlineStart: 'var(--tree-offset)',\n} as const;\n\nconst baseItemStyle = {\n display: 'flex',\n alignItems: 'flex-start',\n gap: 'var(--tree-item-gap)',\n cursor: 'pointer',\n userSelect: 'none',\n position: 'relative',\n ...depthOffsetStyle,\n focusVisibleRing: 'inside',\n focusRingWidth: '2px',\n _hover: {\n background: 'background/secondary',\n _active: {\n background: 'background/tertiary',\n },\n },\n _active: {\n background: 'background/tertiary',\n },\n _selected: {\n background: 'background/selected',\n _hover: {\n background: 'background/selected-hover',\n _active: {\n background: 'background/selected-hover',\n },\n },\n _active: {\n background: 'background/selected-hover',\n },\n },\n // Colours, not opacity: the row's actions stay usable on a disabled (empty) node and must not fade with it.\n _disabled: {\n cursor: 'not-allowed',\n },\n} as const;\n\nconst baseTextStyle = {\n flex: 1,\n minWidth: 0,\n display: 'flex',\n flexDirection: 'column',\n _disabled: {\n color: 'text/tertiary',\n },\n} as const;\n\nconst treeViewSlotRecipe = defineSlotRecipe({\n className: 'bitkit-tree-view',\n slots: [...treeViewAnatomy.keys(), 'actionGroup', 'footer', 'suffixGroup', 'secondaryText'],\n base: {\n root: {\n width: 'full',\n display: 'flex',\n flexDirection: 'column',\n },\n tree: {\n display: 'flex',\n flexDirection: 'column',\n textStyle: 'body/md/regular',\n '--tree-item-gap': 'spacing.8',\n '--tree-indentation': 'spacing.16',\n '--tree-padding-inline-start': 'spacing.8',\n '--tree-icon-size': 'spacing.16',\n _icon: {\n boxSize: 'var(--tree-icon-size)',\n },\n },\n label: {\n fontWeight: 'medium',\n textStyle: 'body/sm/regular',\n },\n branch: {\n position: 'relative',\n },\n branchContent: {\n position: 'relative',\n overflow: 'hidden',\n _open: {\n animationName: 'expand-height, fade-in',\n animationDuration: 'moderate',\n },\n _closed: {\n animationName: 'collapse-height, fade-out',\n animationDuration: 'moderate',\n },\n },\n branchIndicator: {\n display: 'flex',\n justifyContent: 'center',\n color: 'icon/secondary',\n _disabled: {\n color: 'icon/disabled',\n },\n },\n branchTrigger: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n branchControl: {\n ...baseItemStyle,\n },\n item: {\n ...baseItemStyle,\n // Direct-child selector (not Chakra's _icon): the item also hosts SVGs in its suffix and\n // action slots, which keep their own colour.\n '& > svg': {\n color: 'icon/secondary',\n },\n _active: {\n ...baseItemStyle._active,\n '& > svg': {\n color: 'icon/primary',\n },\n },\n _selected: {\n ...baseItemStyle._selected,\n '& > svg': {\n color: 'icon/primary',\n },\n },\n _disabled: {\n ...baseItemStyle._disabled,\n '& > svg': {\n color: 'icon/disabled',\n },\n },\n },\n branchText: baseTextStyle,\n itemText: baseTextStyle,\n branchIndentGuide: {},\n itemIndicator: {},\n nodeCheckbox: {\n display: 'inline-flex',\n },\n suffixGroup: {\n display: 'flex',\n gap: '8',\n alignItems: 'center',\n justifyContent: 'flex-end',\n color: 'text/secondary',\n '[data-selected] > &, [data-state=\"open\"] > &': {\n color: 'text/primary',\n },\n paddingInlineStart: '16',\n flexShrink: 0,\n _groupHover: {\n display: 'none',\n },\n },\n footer: depthOffsetStyle,\n actionGroup: {\n display: 'none',\n alignItems: 'center',\n justifyContent: 'flex-end',\n paddingInlineStart: '16',\n flexShrink: 0,\n _groupHover: {\n display: 'flex',\n },\n },\n secondaryText: {\n textStyle: 'body/sm/regular',\n color: 'text/secondary',\n },\n },\n variants: {\n variant: {\n files: {\n branchControl: {\n borderRadius: '4',\n paddingInlineEnd: '16',\n '& > svg': {\n marginBlockStart: '8',\n },\n '& > .badge': {\n marginBlockStart: '6',\n },\n },\n item: {\n borderRadius: '4',\n paddingInlineEnd: '16',\n '& > svg': {\n marginBlockStart: '8',\n },\n '& > .badge': {\n marginBlockStart: '6',\n },\n },\n footer: {\n paddingInlineEnd: '16',\n },\n branchIndicator: {\n alignItems: 'flex-start',\n marginBlockStart: '8',\n alignSelf: 'stretch',\n position: 'relative',\n _open: {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: '16',\n insetBlockEnd: 0,\n insetInlineStart: '50%',\n width: '1',\n background: 'border/regular',\n },\n },\n },\n branchText: {\n paddingBlock: '6',\n },\n itemText: {\n paddingBlock: '6',\n },\n suffixGroup: {\n height: rem(31),\n '& > span': {\n marginBlockEnd: '-1',\n },\n },\n branchIndentGuide: {\n height: '100%',\n width: '1',\n background: 'border/regular',\n position: 'absolute',\n insetBlockStart: 0,\n '--tree-depth': 'calc(var(--depth) - 1)',\n '--tree-indentation-offset': 'calc(var(--tree-indentation) * var(--tree-depth))',\n '--tree-offset': 'calc(var(--tree-padding-inline-start) + var(--tree-indentation-offset))',\n '--tree-icon-offset': 'calc(var(--tree-icon-size) * 0.5 * var(--depth))',\n insetInlineStart: 'calc(var(--tree-offset) + var(--tree-icon-offset))',\n zIndex: 1,\n },\n },\n navigation: {\n branchControl: {\n borderRadius: 0,\n paddingInlineEnd: '16',\n '&:not([data-path=\"0\"])::before': {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: 0,\n insetInlineStart: 'var(--tree-offset)',\n insetInlineEnd: 0,\n height: '1',\n background: 'border/minimal',\n },\n _selected: {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n insetBlock: 0,\n insetInlineEnd: 0,\n width: '4',\n background: 'border/selected',\n borderRadius: '0 2px 2px 0',\n },\n },\n },\n item: {\n borderRadius: 0,\n paddingInlineEnd: '16',\n '&:not([data-path=\"0\"])::before': {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: 0,\n insetInlineStart: 'var(--tree-offset)',\n insetInlineEnd: 0,\n height: '1',\n background: 'border/minimal',\n },\n '& > svg': {\n marginBlockStart: rem(9),\n },\n _selected: {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n insetBlock: 0,\n insetInlineEnd: 0,\n width: '4',\n background: 'border/selected',\n borderRadius: '0 2px 2px 0',\n },\n },\n },\n branchIndicator: {\n marginBlockStart: '8',\n transformOrigin: 'center',\n transitionDuration: 'normal',\n transitionProperty: 'transform',\n transitionTimingFunction: 'default',\n _open: {\n transform: 'rotate(90deg)',\n },\n },\n branchText: {\n paddingBlock: '8',\n gap: '4',\n _open: {\n textStyle: 'body/md/semibold',\n color: 'text/primary',\n },\n },\n itemText: {\n paddingBlock: '8',\n },\n suffixGroup: {\n height: rem(35),\n '& > span': {\n marginBlockEnd: '-1',\n },\n },\n branchIndentGuide: {\n display: 'none',\n },\n },\n },\n },\n defaultVariants: {\n variant: 'files',\n },\n});\n\nexport default treeViewSlotRecipe;\n"],"mappings":";;;;AAKA,IAAM,mBAAmB;CACvB,gBAAgB;CAChB,6BAA6B;CAC7B,sBAAsB;CACtB,iBAAiB;CACjB,oBAAoB;AACtB;AAEA,IAAM,gBAAgB;CACpB,SAAS;CACT,YAAY;CACZ,KAAK;CACL,QAAQ;CACR,YAAY;CACZ,UAAU;CACV,GAAG;CACH,kBAAkB;CAClB,gBAAgB;CAChB,QAAQ;EACN,YAAY;EACZ,SAAS,EACP,YAAY,sBACd;CACF;CACA,SAAS,EACP,YAAY,sBACd;CACA,WAAW;EACT,YAAY;EACZ,QAAQ;GACN,YAAY;GACZ,SAAS,EACP,YAAY,4BACd;EACF;EACA,SAAS,EACP,YAAY,4BACd;CACF;CAEA,WAAW,EACT,QAAQ,cACV;AACF;AAEA,IAAM,gBAAgB;CACpB,MAAM;CACN,UAAU;CACV,SAAS;CACT,eAAe;CACf,WAAW,EACT,OAAO,gBACT;AACF;AAEA,IAAM,qBAAqB,iBAAiB;CAC1C,WAAW;CACX,OAAO;EAAC,GAAG,gBAAgB,KAAK;EAAG;EAAe;EAAU;EAAe;CAAe;CAC1F,MAAM;EACJ,MAAM;GACJ,OAAO;GACP,SAAS;GACT,eAAe;EACjB;EACA,MAAM;GACJ,SAAS;GACT,eAAe;GACf,WAAW;GACX,mBAAmB;GACnB,sBAAsB;GACtB,+BAA+B;GAC/B,oBAAoB;GACpB,OAAO,EACL,SAAS,wBACX;EACF;EACA,OAAO;GACL,YAAY;GACZ,WAAW;EACb;EACA,QAAQ,EACN,UAAU,WACZ;EACA,eAAe;GACb,UAAU;GACV,UAAU;GACV,OAAO;IACL,eAAe;IACf,mBAAmB;GACrB;GACA,SAAS;IACP,eAAe;IACf,mBAAmB;GACrB;EACF;EACA,iBAAiB;GACf,SAAS;GACT,gBAAgB;GAChB,OAAO;GACP,WAAW,EACT,OAAO,gBACT;EACF;EACA,eAAe;GACb,SAAS;GACT,YAAY;GACZ,gBAAgB;EAClB;EACA,eAAe,EACb,GAAG,cACL;EACA,MAAM;GACJ,GAAG;GAGH,WAAW,EACT,OAAO,iBACT;GACA,SAAS;IACP,GAAG,cAAc;IACjB,WAAW,EACT,OAAO,eACT;GACF;GACA,WAAW;IACT,GAAG,cAAc;IACjB,WAAW,EACT,OAAO,eACT;GACF;GACA,WAAW;IACT,GAAG,cAAc;IACjB,WAAW,EACT,OAAO,gBACT;GACF;EACF;EACA,YAAY;EACZ,UAAU;EACV,mBAAmB,CAAC;EACpB,eAAe,CAAC;EAChB,cAAc,EACZ,SAAS,cACX;EACA,aAAa;GACX,SAAS;GACT,KAAK;GACL,YAAY;GACZ,gBAAgB;GAChB,OAAO;GACP,kDAAgD,EAC9C,OAAO,eACT;GACA,oBAAoB;GACpB,YAAY;GACZ,aAAa,EACX,SAAS,OACX;EACF;EACA,QAAQ;EACR,aAAa;GACX,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,oBAAoB;GACpB,YAAY;GACZ,aAAa,EACX,SAAS,OACX;EACF;EACA,eAAe;GACb,WAAW;GACX,OAAO;EACT;CACF;CACA,UAAU,EACR,SAAS;EACP,OAAO;GACL,eAAe;IACb,cAAc;IACd,kBAAkB;IAClB,WAAW,EACT,kBAAkB,IACpB;IACA,cAAc,EACZ,kBAAkB,IACpB;GACF;GACA,MAAM;IACJ,cAAc;IACd,kBAAkB;IAClB,WAAW,EACT,kBAAkB,IACpB;IACA,cAAc,EACZ,kBAAkB,IACpB;GACF;GACA,QAAQ,EACN,kBAAkB,KACpB;GACA,iBAAiB;IACf,YAAY;IACZ,kBAAkB;IAClB,WAAW;IACX,UAAU;IACV,OAAO,EACL,YAAY;KACV,SAAS;KACT,UAAU;KACV,iBAAiB;KACjB,eAAe;KACf,kBAAkB;KAClB,OAAO;KACP,YAAY;IACd,EACF;GACF;GACA,YAAY,EACV,cAAc,IAChB;GACA,UAAU,EACR,cAAc,IAChB;GACA,aAAa;IACX,QAAQ,IAAI,EAAE;IACd,YAAY,EACV,gBAAgB,KAClB;GACF;GACA,mBAAmB;IACjB,QAAQ;IACR,OAAO;IACP,YAAY;IACZ,UAAU;IACV,iBAAiB;IACjB,gBAAgB;IAChB,6BAA6B;IAC7B,iBAAiB;IACjB,sBAAsB;IACtB,kBAAkB;IAClB,QAAQ;GACV;EACF;EACA,YAAY;GACV,eAAe;IACb,cAAc;IACd,kBAAkB;IAClB,oCAAkC;KAChC,SAAS;KACT,UAAU;KACV,iBAAiB;KACjB,kBAAkB;KAClB,gBAAgB;KAChB,QAAQ;KACR,YAAY;IACd;IACA,WAAW,EACT,YAAY;KACV,SAAS;KACT,UAAU;KACV,YAAY;KACZ,gBAAgB;KAChB,OAAO;KACP,YAAY;KACZ,cAAc;IAChB,EACF;GACF;GACA,MAAM;IACJ,cAAc;IACd,kBAAkB;IAClB,oCAAkC;KAChC,SAAS;KACT,UAAU;KACV,iBAAiB;KACjB,kBAAkB;KAClB,gBAAgB;KAChB,QAAQ;KACR,YAAY;IACd;IACA,WAAW,EACT,kBAAkB,IAAI,CAAC,EACzB;IACA,WAAW,EACT,YAAY;KACV,SAAS;KACT,UAAU;KACV,YAAY;KACZ,gBAAgB;KAChB,OAAO;KACP,YAAY;KACZ,cAAc;IAChB,EACF;GACF;GACA,iBAAiB;IACf,kBAAkB;IAClB,iBAAiB;IACjB,oBAAoB;IACpB,oBAAoB;IACpB,0BAA0B;IAC1B,OAAO,EACL,WAAW,gBACb;GACF;GACA,YAAY;IACV,cAAc;IACd,KAAK;IACL,OAAO;KACL,WAAW;KACX,OAAO;IACT;GACF;GACA,UAAU,EACR,cAAc,IAChB;GACA,aAAa;IACX,QAAQ,IAAI,EAAE;IACd,YAAY,EACV,gBAAgB,KAClB;GACF;GACA,mBAAmB,EACjB,SAAS,OACX;EACF;CACF,EACF;CACA,iBAAiB,EACf,SAAS,QACX;AACF,CAAC"}
@@ -657,8 +657,8 @@ declare const slotRecipes: {
657
657
  textStyle: "body/md/semibold";
658
658
  };
659
659
  } | undefined;
660
- content?: {
661
- '--select-menu-list-max-height': `${number}rem`;
660
+ itemList?: {
661
+ maxHeight: `${number}rem`;
662
662
  } | undefined;
663
663
  itemLabel?: {
664
664
  textStyle: "body/md/regular";
@@ -670,18 +670,6 @@ declare const slotRecipes: {
670
670
  emptyState?: {
671
671
  paddingBlock: "8";
672
672
  } | undefined;
673
- errorState?: {
674
- paddingBlock: "4";
675
- } | undefined;
676
- errorLabel?: {
677
- textStyle: "body/md/regular";
678
- } | undefined;
679
- errorIcon?: {
680
- marginBlockStart: "4";
681
- } | undefined;
682
- errorTextBlock?: {
683
- paddingBlock: "2";
684
- } | undefined;
685
673
  action?: {
686
674
  minHeight: "40";
687
675
  paddingBlock: "8";
@@ -2154,7 +2142,7 @@ declare const slotRecipes: {
2154
2142
  };
2155
2143
  };
2156
2144
  }>;
2157
- select: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "label" | "checkbox" | "list" | "avatar" | "emptyState" | "root" | "item" | "itemContent" | "itemIndicator" | "trigger" | "positioner" | "indicator" | "itemGroup" | "itemGroupLabel" | "itemText" | "valueText" | "action" | "clearTrigger" | "control" | "actionContainer" | "errorLabel" | "searchInputGroup" | "searchInput" | "searchClear" | "errorState" | "itemList" | "errorIcon" | "errorTextBlock" | "itemHelperText" | "itemLoading" | "itemLoadingLabel" | "itemLabel" | "indicatorGroup" | "checkmark" | "itemBadge" | "itemIcon" | "valueIcon", {
2145
+ select: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "label" | "checkbox" | "list" | "avatar" | "emptyState" | "root" | "item" | "itemContent" | "itemIndicator" | "trigger" | "positioner" | "indicator" | "itemGroup" | "itemGroupLabel" | "itemText" | "valueText" | "action" | "clearTrigger" | "control" | "actionContainer" | "searchInputGroup" | "searchInput" | "searchClear" | "itemList" | "itemLoading" | "itemLoadingLabel" | "itemLabel" | "itemHelperText" | "indicatorGroup" | "checkmark" | "itemBadge" | "itemIcon" | "valueIcon", {
2158
2146
  hasStatusIcon: {
2159
2147
  true: {
2160
2148
  trigger: {
@@ -2195,8 +2183,8 @@ declare const slotRecipes: {
2195
2183
  textStyle: "body/lg/semibold";
2196
2184
  };
2197
2185
  };
2198
- content: {
2199
- '--select-menu-list-max-height': `${number}rem`;
2186
+ itemList: {
2187
+ maxHeight: `${number}rem`;
2200
2188
  };
2201
2189
  itemLabel: {
2202
2190
  textStyle: "body/lg/regular";
@@ -2208,12 +2196,6 @@ declare const slotRecipes: {
2208
2196
  emptyState: {
2209
2197
  paddingBlock: "12";
2210
2198
  };
2211
- errorState: {
2212
- paddingBlock: "8";
2213
- };
2214
- errorLabel: {
2215
- textStyle: "body/lg/regular";
2216
- };
2217
2199
  action: {
2218
2200
  minHeight: "48";
2219
2201
  paddingBlock: "12";
@@ -2260,8 +2242,8 @@ declare const slotRecipes: {
2260
2242
  textStyle: "body/md/semibold";
2261
2243
  };
2262
2244
  };
2263
- content: {
2264
- '--select-menu-list-max-height': `${number}rem`;
2245
+ itemList: {
2246
+ maxHeight: `${number}rem`;
2265
2247
  };
2266
2248
  itemLabel: {
2267
2249
  textStyle: "body/md/regular";
@@ -2273,18 +2255,6 @@ declare const slotRecipes: {
2273
2255
  emptyState: {
2274
2256
  paddingBlock: "8";
2275
2257
  };
2276
- errorState: {
2277
- paddingBlock: "4";
2278
- };
2279
- errorLabel: {
2280
- textStyle: "body/md/regular";
2281
- };
2282
- errorIcon: {
2283
- marginBlockStart: "4";
2284
- };
2285
- errorTextBlock: {
2286
- paddingBlock: "2";
2287
- };
2288
2258
  action: {
2289
2259
  minHeight: "40";
2290
2260
  paddingBlock: "8";
@@ -3426,118 +3396,5 @@ declare const slotRecipes: {
3426
3396
  };
3427
3397
  };
3428
3398
  }>;
3429
- uiSideNav: import('@chakra-ui/react').SlotRecipeDefinition<"link" | "content" | "body" | "footer" | "closeButton" | "root" | "item" | "itemIndicator" | "positioner" | "itemLabel" | "itemIcon" | "backdrop" | "footerSeparator" | "footerHeading" | "linkIconBlock" | "linkTextBlock" | "linkIcon" | "linkStatusDot" | "linkLabel" | "linkSecondaryText" | "workspaceRoot" | "workspaceControl" | "workspace" | "workspaceTextBlock" | "workspaceChevron" | "workspaceMenu" | "workspaceLabel" | "workspaceValue", {
3430
- layout: {
3431
- rail: {
3432
- root: {
3433
- paddingBlockEnd: "12";
3434
- transition: "width 100ms ease-out";
3435
- transitionDelay: "50ms";
3436
- width: `${number}rem`;
3437
- _motionReduce: {
3438
- transition: "none";
3439
- };
3440
- '&[data-expanded]': {
3441
- transitionDelay: "100ms";
3442
- width: `${number}rem`;
3443
- };
3444
- };
3445
- workspace: {
3446
- paddingInline: "16";
3447
- minWidth: `${number}rem`;
3448
- };
3449
- workspaceControl: {
3450
- minWidth: `${number}rem`;
3451
- };
3452
- workspaceMenu: {
3453
- width: `${number}rem`;
3454
- };
3455
- body: {
3456
- overflowX: "hidden";
3457
- overflowY: "auto";
3458
- scrollbar: "hidden";
3459
- };
3460
- item: {
3461
- gap: "24";
3462
- paddingBlock: "16";
3463
- minWidth: `${number}rem`;
3464
- };
3465
- link: {
3466
- gap: "24";
3467
- minWidth: `${number}rem`;
3468
- };
3469
- footerSeparator: {
3470
- '[data-expanded] &': {
3471
- paddingInline: "16";
3472
- };
3473
- };
3474
- footerHeading: {
3475
- minWidth: `${number}rem`;
3476
- };
3477
- };
3478
- drawer: {
3479
- root: {
3480
- overflowX: "hidden";
3481
- overflowY: "auto";
3482
- width: "full";
3483
- };
3484
- workspaceRoot: {
3485
- background: "sys/ui/sidenav/bg";
3486
- insetBlockStart: number;
3487
- position: "sticky";
3488
- zIndex: number;
3489
- };
3490
- workspace: {
3491
- paddingBlock: "16";
3492
- paddingInlineEnd: "24";
3493
- paddingInlineStart: "16";
3494
- };
3495
- item: {
3496
- gap: "12";
3497
- paddingBlock: "16";
3498
- };
3499
- link: {
3500
- gap: "12";
3501
- };
3502
- footer: {
3503
- paddingBlockEnd: "16";
3504
- paddingBlockStart: "12";
3505
- position: "relative";
3506
- };
3507
- footerHeading: {
3508
- paddingBlockStart: "12";
3509
- '&[data-section]': {
3510
- marginBlockStart: "12";
3511
- paddingBlockStart: "24";
3512
- position: "relative";
3513
- _before: {
3514
- insetBlockStart: number;
3515
- insetInline: number;
3516
- position: "absolute";
3517
- background: "border/inverse";
3518
- content: "\"\"";
3519
- height: "1";
3520
- opacity: 0.2;
3521
- };
3522
- };
3523
- };
3524
- footerSeparator: {
3525
- insetBlockStart: number;
3526
- insetInline: number;
3527
- paddingBlock: number;
3528
- paddingInline: number;
3529
- position: "absolute";
3530
- };
3531
- workspaceMenu: {
3532
- maxHeight: "var(--available-height)";
3533
- '--select-menu-list-max-height': "none";
3534
- };
3535
- body: {
3536
- flex: "1 0 auto";
3537
- paddingBlock: "8";
3538
- };
3539
- };
3540
- };
3541
- }>;
3542
3399
  };
3543
3400
  export default slotRecipes;
@@ -1,6 +1,5 @@
1
1
  import avatarSlotRecipe from "./Avatar.recipe.js";
2
2
  import numberInputSlotRecipe from "./NumberInput.recipe.js";
3
- import uiSideNavSlotRecipe from "./UISideNav.recipe.js";
4
3
  import accordionSlotRecipe from "./Accordion.recipe.js";
5
4
  import actionBarSlotRecipe from "./ActionBar.recipe.js";
6
5
  import alertSlotRecipe from "./Alert.recipe.js";
@@ -126,8 +125,7 @@ var slotRecipes = {
126
125
  toast: toastSlotRecipe,
127
126
  tooltip: tooltipSlotRecipe,
128
127
  tour: tourSlotRecipe,
129
- treeView: treeViewSlotRecipe,
130
- uiSideNav: uiSideNavSlotRecipe
128
+ treeView: treeViewSlotRecipe
131
129
  };
132
130
  //#endregion
133
131
  export { slotRecipes as default };
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../../lib/theme/slot-recipes/index.ts"],"sourcesContent":["import accordionSlotRecipe from './Accordion.recipe.ts';\nimport actionBarSlotRecipe from './ActionBar.recipe.ts';\nimport alertSlotRecipe from './Alert.recipe.ts';\nimport avatarSlotRecipe from './Avatar.recipe.ts';\nimport breadcrumbSlotRecipe from './Breadcrumb.recipe.ts';\nimport cardSlotRecipe from './Card.recipe';\nimport checkboxSlotRecipe from './Checkbox.recipe';\nimport codeSnippetSlotRecipe from './CodeSnippet.recipe.ts';\nimport collapsibleSlotRecipe from './Collapsible.recipe.ts';\nimport comboboxSlotRecipe from './Combobox.recipe.ts';\nimport dataWidgetSlotRecipe from './DataWidget.recipe.ts';\nimport datePickerSlotRecipe from './DatePicker.recipe.ts';\nimport datePickerSelectSlotRecipe from './DatePickerSelect.recipe.ts';\nimport dialogSlotRecipe from './Dialog.recipe.ts';\nimport draggableCardSlotRecipe from './DraggableCard.recipe.ts';\nimport drawerSlotRecipe from './Drawer.recipe.ts';\nimport emptyStateSlotRecipe from './EmptyState.recipe';\nimport expandableCardSlotRecipe from './ExpandableCard.recipe.ts';\nimport fieldSlotRecipe from './Field.recipe';\nimport fieldsetSlotRecipe from './Fieldset.recipe.ts';\nimport fileUploadSlotRecipe from './FileUpload.recipe.ts';\nimport groupHeadingSlotRecipe from './GroupHeading.recipe.ts';\nimport imageCropperSlotRecipe from './ImageCropper.recipe.ts';\nimport inlineLoadingSlotRecipe from './InlineLoading.recipe.ts';\nimport labeledDataSlotRecipe from './LabeledData.recipe.ts';\nimport listSlotRecipe from './List.recipe.ts';\nimport markdownSlotRecipe from './Markdown.recipe.ts';\nimport markdownCardSlotRecipe from './MarkdownCard.recipe.ts';\nimport menuSlotRecipe from './Menu.recipe.ts';\nimport multiselectSlotRecipe from './Multiselect.recipe.ts';\nimport nativeSelectSlotRecipe from './NativeSelect.recipe.ts';\nimport noteCardSlotRecipe from './NoteCard.recipe.ts';\nimport numberInputSlotRecipe from './NumberInput.recipe';\nimport overflowContentSlotRecipe from './OverflowContent.recipe.ts';\nimport pageFooterSlotRecipe from './PageFooter.recipe.ts';\nimport pageHeaderSlotRecipe from './PageHeader.recipe.ts';\nimport pageSidebarSlotRecipe from './PageSidebar.recipe.ts';\nimport paginationSlotRecipe from './Pagination.recipe.ts';\nimport paginationLoadMoreSlotRecipe from './PaginationLoadMore.recipe.ts';\nimport popoverSlotRecipe from './Popover.recipe.ts';\nimport progressSlotRecipe from './Progress.recipe.ts';\nimport qrCodeSlotRecipe from './QrCode.recipe.ts';\nimport radioGroupSlotRecipe from './RadioGroup.recipe.ts';\nimport ribbonSlotRecipe from './Ribbon.recipe.ts';\nimport sectionHeadingSlotRecipe from './SectionHeading.recipe.ts';\nimport segmentGroupSlotRecipe from './SegmentGroup.recipe.ts';\nimport { selectSlotRecipe } from './Select.recipe.ts';\nimport settingsCardSlotRecipe from './SettingsCard.recipe.ts';\nimport splitButtonSlotRecipe from './SplitButton.recipe.ts';\nimport statSlotRecipe from './Stat.recipe.ts';\nimport stepCardSlotRecipe from './StepCard.recipe.ts';\nimport stepsSlotRecipe from './Steps.recipe.ts';\nimport switchSlotRecipe from './Switch.recipe';\nimport tableSlotRecipe from './Table.recipe.ts';\nimport tableCardSlotRecipe from './TableCard.recipe.ts';\nimport tabsSlotRecipe from './Tabs.recipe';\nimport tagSlotRecipe from './Tag.recipe.ts';\nimport tagsInputSlotRecipe from './TagsInput.recipe.ts';\nimport textInputSlotRecipe from './TextInput.recipe.ts';\nimport toastSlotRecipe from './Toast.recipe';\nimport tooltipSlotRecipe from './Tooltip.recipe';\nimport tourSlotRecipe from './Tour.recipe.ts';\nimport treeViewSlotRecipe from './TreeView.recipe.ts';\nimport uiSideNavSlotRecipe from './UISideNav.recipe.ts';\n\nconst slotRecipes = {\n accordion: accordionSlotRecipe,\n actionBar: actionBarSlotRecipe,\n alert: alertSlotRecipe,\n avatar: avatarSlotRecipe,\n breadcrumb: breadcrumbSlotRecipe,\n card: cardSlotRecipe,\n checkbox: checkboxSlotRecipe,\n codeSnippet: codeSnippetSlotRecipe,\n collapsible: collapsibleSlotRecipe,\n combobox: comboboxSlotRecipe,\n dataWidget: dataWidgetSlotRecipe,\n datePicker: datePickerSlotRecipe,\n datePickerSelect: datePickerSelectSlotRecipe,\n dialog: dialogSlotRecipe,\n draggableCard: draggableCardSlotRecipe,\n drawer: drawerSlotRecipe,\n emptyState: emptyStateSlotRecipe,\n expandableCard: expandableCardSlotRecipe,\n field: fieldSlotRecipe,\n groupHeading: groupHeadingSlotRecipe,\n fieldset: fieldsetSlotRecipe,\n fileUpload: fileUploadSlotRecipe,\n imageCropper: imageCropperSlotRecipe,\n inlineLoading: inlineLoadingSlotRecipe,\n list: listSlotRecipe,\n markdown: markdownSlotRecipe,\n markdownCard: markdownCardSlotRecipe,\n menu: menuSlotRecipe,\n multiselect: multiselectSlotRecipe,\n noteCard: noteCardSlotRecipe,\n nativeSelect: nativeSelectSlotRecipe,\n numberInput: numberInputSlotRecipe,\n overflowContent: overflowContentSlotRecipe,\n pageFooter: pageFooterSlotRecipe,\n pageHeader: pageHeaderSlotRecipe,\n pageSidebar: pageSidebarSlotRecipe,\n pagination: paginationSlotRecipe,\n paginationLoadMore: paginationLoadMoreSlotRecipe,\n popover: popoverSlotRecipe,\n progress: progressSlotRecipe,\n qrCode: qrCodeSlotRecipe,\n radioGroup: radioGroupSlotRecipe,\n ribbon: ribbonSlotRecipe,\n sectionHeading: sectionHeadingSlotRecipe,\n labeledData: labeledDataSlotRecipe,\n segmentGroup: segmentGroupSlotRecipe,\n select: selectSlotRecipe,\n settingsCard: settingsCardSlotRecipe,\n splitButton: splitButtonSlotRecipe,\n stat: statSlotRecipe,\n stepsCard: stepCardSlotRecipe,\n steps: stepsSlotRecipe,\n switch: switchSlotRecipe,\n table: tableSlotRecipe,\n tableCard: tableCardSlotRecipe,\n tabs: tabsSlotRecipe,\n tag: tagSlotRecipe,\n tagsInput: tagsInputSlotRecipe,\n textInput: textInputSlotRecipe,\n toast: toastSlotRecipe,\n tooltip: tooltipSlotRecipe,\n tour: tourSlotRecipe,\n treeView: treeViewSlotRecipe,\n uiSideNav: uiSideNavSlotRecipe,\n};\n\nexport default slotRecipes;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiEA,IAAM,cAAc;CAClB,WAAW;CACX,WAAW;CACX,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,MAAM;CACN,UAAU;CACV,aAAa;CACb,aAAa;CACb,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,kBAAkB;CAClB,QAAQ;CACR,eAAe;CACf,QAAQ;CACR,YAAY;CACZ,gBAAgB;CAChB,OAAO;CACP,cAAc;CACd,UAAU;CACV,YAAY;CACZ,cAAc;CACd,eAAe;CACf,MAAM;CACN,UAAU;CACV,cAAc;CACd,MAAM;CACN,aAAa;CACb,UAAU;CACV,cAAc;CACd,aAAa;CACb,iBAAiB;CACjB,YAAY;CACZ,YAAY;CACZ,aAAa;CACb,YAAY;CACZ,oBAAoB;CACpB,SAAS;CACT,UAAU;CACV,QAAQ;CACR,YAAY;CACZ,QAAQ;CACR,gBAAgB;CAChB,aAAa;CACb,cAAc;CACd,QAAQ;CACR,cAAc;CACd,aAAa;CACb,MAAM;CACN,WAAW;CACX,OAAO;CACP,QAAQ;CACR,OAAO;CACP,WAAW;CACX,MAAM;CACN,KAAK;CACL,WAAW;CACX,WAAW;CACX,OAAO;CACP,SAAS;CACT,MAAM;CACN,UAAU;CACV,WAAW;AACb"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../../lib/theme/slot-recipes/index.ts"],"sourcesContent":["import accordionSlotRecipe from './Accordion.recipe.ts';\nimport actionBarSlotRecipe from './ActionBar.recipe.ts';\nimport alertSlotRecipe from './Alert.recipe.ts';\nimport avatarSlotRecipe from './Avatar.recipe.ts';\nimport breadcrumbSlotRecipe from './Breadcrumb.recipe.ts';\nimport cardSlotRecipe from './Card.recipe';\nimport checkboxSlotRecipe from './Checkbox.recipe';\nimport codeSnippetSlotRecipe from './CodeSnippet.recipe.ts';\nimport collapsibleSlotRecipe from './Collapsible.recipe.ts';\nimport comboboxSlotRecipe from './Combobox.recipe.ts';\nimport dataWidgetSlotRecipe from './DataWidget.recipe.ts';\nimport datePickerSlotRecipe from './DatePicker.recipe.ts';\nimport datePickerSelectSlotRecipe from './DatePickerSelect.recipe.ts';\nimport dialogSlotRecipe from './Dialog.recipe.ts';\nimport draggableCardSlotRecipe from './DraggableCard.recipe.ts';\nimport drawerSlotRecipe from './Drawer.recipe.ts';\nimport emptyStateSlotRecipe from './EmptyState.recipe';\nimport expandableCardSlotRecipe from './ExpandableCard.recipe.ts';\nimport fieldSlotRecipe from './Field.recipe';\nimport fieldsetSlotRecipe from './Fieldset.recipe.ts';\nimport fileUploadSlotRecipe from './FileUpload.recipe.ts';\nimport groupHeadingSlotRecipe from './GroupHeading.recipe.ts';\nimport imageCropperSlotRecipe from './ImageCropper.recipe.ts';\nimport inlineLoadingSlotRecipe from './InlineLoading.recipe.ts';\nimport labeledDataSlotRecipe from './LabeledData.recipe.ts';\nimport listSlotRecipe from './List.recipe.ts';\nimport markdownSlotRecipe from './Markdown.recipe.ts';\nimport markdownCardSlotRecipe from './MarkdownCard.recipe.ts';\nimport menuSlotRecipe from './Menu.recipe.ts';\nimport multiselectSlotRecipe from './Multiselect.recipe.ts';\nimport nativeSelectSlotRecipe from './NativeSelect.recipe.ts';\nimport noteCardSlotRecipe from './NoteCard.recipe.ts';\nimport numberInputSlotRecipe from './NumberInput.recipe';\nimport overflowContentSlotRecipe from './OverflowContent.recipe.ts';\nimport pageFooterSlotRecipe from './PageFooter.recipe.ts';\nimport pageHeaderSlotRecipe from './PageHeader.recipe.ts';\nimport pageSidebarSlotRecipe from './PageSidebar.recipe.ts';\nimport paginationSlotRecipe from './Pagination.recipe.ts';\nimport paginationLoadMoreSlotRecipe from './PaginationLoadMore.recipe.ts';\nimport popoverSlotRecipe from './Popover.recipe.ts';\nimport progressSlotRecipe from './Progress.recipe.ts';\nimport qrCodeSlotRecipe from './QrCode.recipe.ts';\nimport radioGroupSlotRecipe from './RadioGroup.recipe.ts';\nimport ribbonSlotRecipe from './Ribbon.recipe.ts';\nimport sectionHeadingSlotRecipe from './SectionHeading.recipe.ts';\nimport segmentGroupSlotRecipe from './SegmentGroup.recipe.ts';\nimport { selectSlotRecipe } from './Select.recipe.ts';\nimport settingsCardSlotRecipe from './SettingsCard.recipe.ts';\nimport splitButtonSlotRecipe from './SplitButton.recipe.ts';\nimport statSlotRecipe from './Stat.recipe.ts';\nimport stepCardSlotRecipe from './StepCard.recipe.ts';\nimport stepsSlotRecipe from './Steps.recipe.ts';\nimport switchSlotRecipe from './Switch.recipe';\nimport tableSlotRecipe from './Table.recipe.ts';\nimport tableCardSlotRecipe from './TableCard.recipe.ts';\nimport tabsSlotRecipe from './Tabs.recipe';\nimport tagSlotRecipe from './Tag.recipe.ts';\nimport tagsInputSlotRecipe from './TagsInput.recipe.ts';\nimport textInputSlotRecipe from './TextInput.recipe.ts';\nimport toastSlotRecipe from './Toast.recipe';\nimport tooltipSlotRecipe from './Tooltip.recipe';\nimport tourSlotRecipe from './Tour.recipe.ts';\nimport treeViewSlotRecipe from './TreeView.recipe.ts';\n\nconst slotRecipes = {\n accordion: accordionSlotRecipe,\n actionBar: actionBarSlotRecipe,\n alert: alertSlotRecipe,\n avatar: avatarSlotRecipe,\n breadcrumb: breadcrumbSlotRecipe,\n card: cardSlotRecipe,\n checkbox: checkboxSlotRecipe,\n codeSnippet: codeSnippetSlotRecipe,\n collapsible: collapsibleSlotRecipe,\n combobox: comboboxSlotRecipe,\n dataWidget: dataWidgetSlotRecipe,\n datePicker: datePickerSlotRecipe,\n datePickerSelect: datePickerSelectSlotRecipe,\n dialog: dialogSlotRecipe,\n draggableCard: draggableCardSlotRecipe,\n drawer: drawerSlotRecipe,\n emptyState: emptyStateSlotRecipe,\n expandableCard: expandableCardSlotRecipe,\n field: fieldSlotRecipe,\n groupHeading: groupHeadingSlotRecipe,\n fieldset: fieldsetSlotRecipe,\n fileUpload: fileUploadSlotRecipe,\n imageCropper: imageCropperSlotRecipe,\n inlineLoading: inlineLoadingSlotRecipe,\n list: listSlotRecipe,\n markdown: markdownSlotRecipe,\n markdownCard: markdownCardSlotRecipe,\n menu: menuSlotRecipe,\n multiselect: multiselectSlotRecipe,\n noteCard: noteCardSlotRecipe,\n nativeSelect: nativeSelectSlotRecipe,\n numberInput: numberInputSlotRecipe,\n overflowContent: overflowContentSlotRecipe,\n pageFooter: pageFooterSlotRecipe,\n pageHeader: pageHeaderSlotRecipe,\n pageSidebar: pageSidebarSlotRecipe,\n pagination: paginationSlotRecipe,\n paginationLoadMore: paginationLoadMoreSlotRecipe,\n popover: popoverSlotRecipe,\n progress: progressSlotRecipe,\n qrCode: qrCodeSlotRecipe,\n radioGroup: radioGroupSlotRecipe,\n ribbon: ribbonSlotRecipe,\n sectionHeading: sectionHeadingSlotRecipe,\n labeledData: labeledDataSlotRecipe,\n segmentGroup: segmentGroupSlotRecipe,\n select: selectSlotRecipe,\n settingsCard: settingsCardSlotRecipe,\n splitButton: splitButtonSlotRecipe,\n stat: statSlotRecipe,\n stepsCard: stepCardSlotRecipe,\n steps: stepsSlotRecipe,\n switch: switchSlotRecipe,\n table: tableSlotRecipe,\n tableCard: tableCardSlotRecipe,\n tabs: tabsSlotRecipe,\n tag: tagSlotRecipe,\n tagsInput: tagsInputSlotRecipe,\n textInput: textInputSlotRecipe,\n toast: toastSlotRecipe,\n tooltip: tooltipSlotRecipe,\n tour: tourSlotRecipe,\n treeView: treeViewSlotRecipe,\n};\n\nexport default slotRecipes;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgEA,IAAM,cAAc;CAClB,WAAW;CACX,WAAW;CACX,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,MAAM;CACN,UAAU;CACV,aAAa;CACb,aAAa;CACb,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,kBAAkB;CAClB,QAAQ;CACR,eAAe;CACf,QAAQ;CACR,YAAY;CACZ,gBAAgB;CAChB,OAAO;CACP,cAAc;CACd,UAAU;CACV,YAAY;CACZ,cAAc;CACd,eAAe;CACf,MAAM;CACN,UAAU;CACV,cAAc;CACd,MAAM;CACN,aAAa;CACb,UAAU;CACV,cAAc;CACd,aAAa;CACb,iBAAiB;CACjB,YAAY;CACZ,YAAY;CACZ,aAAa;CACb,YAAY;CACZ,oBAAoB;CACpB,SAAS;CACT,UAAU;CACV,QAAQ;CACR,YAAY;CACZ,QAAQ;CACR,gBAAgB;CAChB,aAAa;CACb,cAAc;CACd,QAAQ;CACR,cAAc;CACd,aAAa;CACb,MAAM;CACN,WAAW;CACX,OAAO;CACP,QAAQ;CACR,OAAO;CACP,WAAW;CACX,MAAM;CACN,KAAK;CACL,WAAW;CACX,WAAW;CACX,OAAO;CACP,SAAS;CACT,MAAM;CACN,UAAU;AACZ"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bitrise/bitkit-v2",
3
3
  "private": false,
4
- "version": "0.3.462-beta.2927",
4
+ "version": "0.3.462",
5
5
  "description": "Bitrise Design System Components built with Chakra UI V3",
6
6
  "keywords": [
7
7
  "react",
@@ -1,37 +0,0 @@
1
- import { BoxProps } from '@chakra-ui/react/box';
2
- import { ReactNode } from 'react';
3
- export interface BitkitUISideNavProps extends Omit<BoxProps, 'children'> {
4
- children: ReactNode;
5
- /**
6
- * Forces the desktop rail open or shut, overriding the pointer and focus behaviour. Leave it
7
- * unset for the normal rail. Set it to `true` while something the rail does not know about is
8
- * anchored to it, such as a popover opened from the footer.
9
- */
10
- expanded?: boolean;
11
- /** Mobile drawer visibility. Controlled, because the header's menu button is what opens it. */
12
- open?: boolean;
13
- onOpenChange?: (open: boolean) => void;
14
- }
15
- export { uiSideNavRailWidth } from '../../theme/slot-recipes/UISideNav.recipe';
16
- export { type BitkitUISideNavBodyProps } from './UISideNavBody';
17
- export { type BitkitUISideNavFooterProps } from './UISideNavFooter';
18
- export { type BitkitUISideNavFooterHeadingProps } from './UISideNavFooterHeading';
19
- export { type BitkitUISideNavItemProps } from './UISideNavItem';
20
- export { type BitkitUISideNavLinkAsAnchorProps, type BitkitUISideNavLinkAsButtonProps, type BitkitUISideNavLinkProps, } from './UISideNavLink';
21
- export { type BitkitUISideNavWorkspaceProps, type BitkitUISideNavWorkspaceSelectorProps, } from './UISideNavWorkspaceSelector';
22
- declare const _default: import('react').ForwardRefExoticComponent<BitkitUISideNavProps & import('react').RefAttributes<HTMLElement>> & {
23
- Body: import('react').ForwardRefExoticComponent<import('./UISideNavBody').BitkitUISideNavBodyProps & import('react').RefAttributes<HTMLDivElement>>;
24
- Footer: import('react').ForwardRefExoticComponent<import('./UISideNavFooter').BitkitUISideNavFooterProps & import('react').RefAttributes<HTMLDivElement>>;
25
- FooterHeading: import('react').ForwardRefExoticComponent<import('./UISideNavFooterHeading').BitkitUISideNavFooterHeadingProps & import('react').RefAttributes<HTMLParagraphElement>>;
26
- Item: import('react').ForwardRefExoticComponent<import('./UISideNavItem').BitkitUISideNavItemProps & import('react').RefAttributes<HTMLAnchorElement>>;
27
- Link: import('react').ForwardRefExoticComponent<import('./UISideNavLink').BitkitUISideNavLinkProps & import('react').RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
28
- WorkspaceSelector: import('react').ForwardRefExoticComponent<Omit<import('@chakra-ui/react').SelectTriggerProps, "children" | "onChange"> & {
29
- children?: import('../BitkitSelectMenu/BitkitSelectMenuAction').BitkitSelectMenuActionChild;
30
- isLoading?: boolean;
31
- label?: string;
32
- onValueChange?: (value: string) => void;
33
- value?: string;
34
- workspaces: Array<import('./UISideNavWorkspaceSelector').BitkitUISideNavWorkspaceProps>;
35
- } & Omit<import('../BitkitSelectMenu/BitkitSelectMenu').BitkitSelectMenuSearchProps, "searchPlaceholder"> & import('../BitkitSelectMenu/BitkitSelectMenu').BitkitSelectMenuScrollProps & import('../BitkitSelectMenu/BitkitSelectMenu').BitkitSelectMenuEmptyStateProps & import('../BitkitSelectMenu/BitkitSelectMenu').BitkitSelectMenuErrorStateProps & import('react').RefAttributes<HTMLButtonElement>>;
36
- };
37
- export default _default;
@@ -1,167 +0,0 @@
1
- import { withSubComponents } from "../../utilities/withSubComponents.js";
2
- import BitkitCloseButton from "../BitkitCloseButton/BitkitCloseButton.js";
3
- import useResponsive from "../../hooks/useResponsive.js";
4
- import { UISideNavContextProvider } from "./UISideNavContext.js";
5
- import UISideNavBody from "./UISideNavBody.js";
6
- import UISideNavFooter from "./UISideNavFooter.js";
7
- import UISideNavFooterHeading from "./UISideNavFooterHeading.js";
8
- import UISideNavItem from "./UISideNavItem.js";
9
- import UISideNavLink from "./UISideNavLink.js";
10
- import UISideNavWorkspaceSelector from "./UISideNavWorkspaceSelector.js";
11
- import { uiSideNavRailWidth } from "../../theme/slot-recipes/UISideNav.recipe.js";
12
- import { Box } from "@chakra-ui/react/box";
13
- import { useSlotRecipe } from "@chakra-ui/react/styled-system";
14
- import { forwardRef, useEffect, useMemo, useRef, useState } from "react";
15
- import { jsx, jsxs } from "react/jsx-runtime";
16
- import { Portal } from "@chakra-ui/react/portal";
17
- import { mergeRefs } from "@chakra-ui/react";
18
- import { Drawer } from "@chakra-ui/react/drawer";
19
- //#region lib/components/BitkitUISideNav/BitkitUISideNav.tsx
20
- /**
21
- * The platform's primary navigation. It expects a workspace selector, a body of navigation
22
- * items, and an optional footer:
23
- *
24
- * ```tsx
25
- * <BitkitUISideNav open={open} onOpenChange={setOpen}>
26
- * <BitkitUISideNav.WorkspaceSelector
27
- * workspaces={workspaces}
28
- * value={workspace}
29
- * onValueChange={setWorkspace}
30
- * />
31
- * <BitkitUISideNav.Body>
32
- * <BitkitUISideNav.Item href="/dashboard" icon={IconDashboard} selectedIcon={IconDashboardFilled} selected>
33
- * Dashboard
34
- * </BitkitUISideNav.Item>
35
- * </BitkitUISideNav.Body>
36
- * <BitkitUISideNav.Footer>…</BitkitUISideNav.Footer>
37
- * </BitkitUISideNav>
38
- * ```
39
- *
40
- * On desktop it is a 72px rail that widens to 256px under the pointer and while anything inside
41
- * it holds keyboard focus. The rows are always laid out at the full width and clipped, so the
42
- * labels appear without any text reflowing. It will not collapse while the workspace menu is
43
- * open. There is no pin: the rail is the resting state.
44
- *
45
- * Below the `tablet` breakpoint it becomes an overlay drawer instead, opened by the header rather
46
- * than by hovering. Pass `open` and `onOpenChange`; they are ignored on desktop.
47
- *
48
- * It does not position itself. The consumer decides where it sits and how tall it is, which is
49
- * what lets a page slot it under a header of any height. The expanded rail overlays the page
50
- * rather than pushing it, so give it a `position` of your own and reserve 72px beside it.
51
- *
52
- * Descendants can read the current state with `useUISideNav()`.
53
- */
54
- var BitkitUISideNav = forwardRef((props, ref) => {
55
- const { children, css, expanded: expandedProp, onBlur, onFocus, onOpenChange, onPointerEnter, onPointerLeave, open = false, ...rest } = props;
56
- const { isMobile } = useResponsive();
57
- const [pointerInside, setPointerInside] = useState(false);
58
- const [focusInside, setFocusInside] = useState(false);
59
- const [menuOpen, setMenuOpen] = useState(false);
60
- const menuContainerRef = useRef(null);
61
- const navRef = useRef(null);
62
- const setNavRef = useMemo(() => mergeRefs(navRef, ref), [ref]);
63
- const styles = useSlotRecipe({ key: "uiSideNav" })({ layout: isMobile ? "drawer" : "rail" });
64
- const expanded = isMobile || (expandedProp ?? (pointerInside || focusInside || menuOpen));
65
- const tracksPointer = !isMobile && expandedProp === void 0;
66
- const isInsideNav = (event) => event.target instanceof Node && event.currentTarget.contains(event.target);
67
- const handleFocus = (event) => {
68
- onFocus?.(event);
69
- if (!tracksPointer || !isInsideNav(event)) return;
70
- if (!event.target.matches(":focus-visible")) return;
71
- setFocusInside(true);
72
- };
73
- const handleBlur = (event) => {
74
- onBlur?.(event);
75
- if (!tracksPointer || event.currentTarget.contains(event.relatedTarget)) return;
76
- setFocusInside(false);
77
- };
78
- const handlePointerEnter = (event) => {
79
- onPointerEnter?.(event);
80
- if (tracksPointer && isInsideNav(event)) setPointerInside(true);
81
- };
82
- const handlePointerLeave = (event) => {
83
- onPointerLeave?.(event);
84
- if (tracksPointer && isInsideNav(event)) setPointerInside(false);
85
- };
86
- useEffect(() => {
87
- if (!tracksPointer || !focusInside) return void 0;
88
- const syncFocusInside = () => {
89
- if (!navRef.current?.contains(document.activeElement)) setFocusInside(false);
90
- };
91
- document.addEventListener("focusin", syncFocusInside);
92
- return () => document.removeEventListener("focusin", syncFocusInside);
93
- }, [focusInside, tracksPointer]);
94
- useEffect(() => {
95
- if (!tracksPointer || !pointerInside) return void 0;
96
- const syncPointerInside = () => {
97
- if (!navRef.current?.matches(":hover")) setPointerInside(false);
98
- };
99
- document.addEventListener("pointerover", syncPointerInside);
100
- return () => document.removeEventListener("pointerover", syncPointerInside);
101
- }, [pointerInside, tracksPointer]);
102
- const nav = /* @__PURE__ */ jsx(Box, {
103
- ref: setNavRef,
104
- "aria-label": "Platform navigation",
105
- asChild: true,
106
- "data-expanded": expanded ? "" : void 0,
107
- ...rest,
108
- css: [styles.root, css],
109
- onBlur: handleBlur,
110
- onFocus: handleFocus,
111
- onPointerEnter: handlePointerEnter,
112
- onPointerLeave: handlePointerLeave,
113
- children: /* @__PURE__ */ jsx("nav", { children })
114
- });
115
- const context = useMemo(() => ({
116
- expanded,
117
- isMobile,
118
- menuContainerRef,
119
- setMenuOpen,
120
- styles
121
- }), [
122
- expanded,
123
- isMobile,
124
- styles
125
- ]);
126
- if (!isMobile) return /* @__PURE__ */ jsx(UISideNavContextProvider, {
127
- value: context,
128
- children: nav
129
- });
130
- return /* @__PURE__ */ jsx(UISideNavContextProvider, {
131
- value: context,
132
- children: /* @__PURE__ */ jsx(Drawer.Root, {
133
- onOpenChange: (details) => onOpenChange?.(details.open),
134
- open,
135
- children: /* @__PURE__ */ jsxs(Portal, { children: [/* @__PURE__ */ jsx(Drawer.Backdrop, { css: styles.backdrop }), /* @__PURE__ */ jsx(Drawer.Positioner, {
136
- css: styles.positioner,
137
- children: /* @__PURE__ */ jsxs(Drawer.Content, {
138
- ref: menuContainerRef,
139
- "aria-label": "Navigation",
140
- css: styles.content,
141
- children: [nav, /* @__PURE__ */ jsx(Box, {
142
- css: styles.closeButton,
143
- children: /* @__PURE__ */ jsx(BitkitCloseButton, {
144
- "aria-label": "Close navigation",
145
- colorVariant: "white",
146
- onClick: () => onOpenChange?.(false),
147
- size: "md"
148
- })
149
- })]
150
- })
151
- })] })
152
- })
153
- });
154
- });
155
- BitkitUISideNav.displayName = "BitkitUISideNav";
156
- var BitkitUISideNav_default = withSubComponents(BitkitUISideNav, {
157
- Body: UISideNavBody,
158
- Footer: UISideNavFooter,
159
- FooterHeading: UISideNavFooterHeading,
160
- Item: UISideNavItem,
161
- Link: UISideNavLink,
162
- WorkspaceSelector: UISideNavWorkspaceSelector
163
- });
164
- //#endregion
165
- export { BitkitUISideNav_default as default, uiSideNavRailWidth };
166
-
167
- //# sourceMappingURL=BitkitUISideNav.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"BitkitUISideNav.js","names":[],"sources":["../../../lib/components/BitkitUISideNav/BitkitUISideNav.tsx"],"sourcesContent":["// eslint-disable-next-line no-restricted-imports\nimport { mergeRefs } from '@chakra-ui/react';\nimport { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { Drawer } from '@chakra-ui/react/drawer';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef, type ReactNode, useEffect, useMemo, useRef, useState } from 'react';\n\nimport useResponsive from '../../hooks/useResponsive';\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport BitkitCloseButton from '../BitkitCloseButton/BitkitCloseButton';\nimport UISideNavBody from './UISideNavBody';\nimport { UISideNavContextProvider } from './UISideNavContext';\nimport UISideNavFooter from './UISideNavFooter';\nimport UISideNavFooterHeading from './UISideNavFooterHeading';\nimport UISideNavItem from './UISideNavItem';\nimport UISideNavLink from './UISideNavLink';\nimport UISideNavWorkspaceSelector from './UISideNavWorkspaceSelector';\n\nexport interface BitkitUISideNavProps extends Omit<BoxProps, 'children'> {\n children: ReactNode;\n /**\n * Forces the desktop rail open or shut, overriding the pointer and focus behaviour. Leave it\n * unset for the normal rail. Set it to `true` while something the rail does not know about is\n * anchored to it, such as a popover opened from the footer.\n */\n expanded?: boolean;\n /** Mobile drawer visibility. Controlled, because the header's menu button is what opens it. */\n open?: boolean;\n onOpenChange?: (open: boolean) => void;\n}\n\n/**\n * The platform's primary navigation. It expects a workspace selector, a body of navigation\n * items, and an optional footer:\n *\n * ```tsx\n * <BitkitUISideNav open={open} onOpenChange={setOpen}>\n * <BitkitUISideNav.WorkspaceSelector\n * workspaces={workspaces}\n * value={workspace}\n * onValueChange={setWorkspace}\n * />\n * <BitkitUISideNav.Body>\n * <BitkitUISideNav.Item href=\"/dashboard\" icon={IconDashboard} selectedIcon={IconDashboardFilled} selected>\n * Dashboard\n * </BitkitUISideNav.Item>\n * </BitkitUISideNav.Body>\n * <BitkitUISideNav.Footer>…</BitkitUISideNav.Footer>\n * </BitkitUISideNav>\n * ```\n *\n * On desktop it is a 72px rail that widens to 256px under the pointer and while anything inside\n * it holds keyboard focus. The rows are always laid out at the full width and clipped, so the\n * labels appear without any text reflowing. It will not collapse while the workspace menu is\n * open. There is no pin: the rail is the resting state.\n *\n * Below the `tablet` breakpoint it becomes an overlay drawer instead, opened by the header rather\n * than by hovering. Pass `open` and `onOpenChange`; they are ignored on desktop.\n *\n * It does not position itself. The consumer decides where it sits and how tall it is, which is\n * what lets a page slot it under a header of any height. The expanded rail overlays the page\n * rather than pushing it, so give it a `position` of your own and reserve 72px beside it.\n *\n * Descendants can read the current state with `useUISideNav()`.\n */\nconst BitkitUISideNav = forwardRef<HTMLElement, BitkitUISideNavProps>((props, ref) => {\n const {\n children,\n css,\n expanded: expandedProp,\n onBlur,\n onFocus,\n onOpenChange,\n onPointerEnter,\n onPointerLeave,\n open = false,\n ...rest\n } = props;\n\n const { isMobile } = useResponsive();\n\n const [pointerInside, setPointerInside] = useState(false);\n const [focusInside, setFocusInside] = useState(false);\n const [menuOpen, setMenuOpen] = useState(false);\n const menuContainerRef = useRef<HTMLDivElement>(null);\n const navRef = useRef<HTMLElement>(null);\n const setNavRef = useMemo(() => mergeRefs(navRef, ref), [ref]);\n\n const recipe = useSlotRecipe({ key: 'uiSideNav' });\n const styles = recipe({ layout: isMobile ? 'drawer' : 'rail' });\n\n const expanded = isMobile || (expandedProp ?? (pointerInside || focusInside || menuOpen));\n const tracksPointer = !isMobile && expandedProp === undefined;\n\n // React bubbles a portalled descendant's events through the React tree rather than the DOM\n // tree, so a dialog opened from a footer row reaches these handlers while sitting under\n // `body`. Only a target that is really a DOM descendant counts as being inside the rail.\n const isInsideNav = (event: { currentTarget: Node; target: EventTarget | null }) =>\n event.target instanceof Node && event.currentTarget.contains(event.target);\n\n // The consumer's handlers run first and unconditionally: the rail listens on the same events,\n // it does not own them.\n const handleFocus: NonNullable<BitkitUISideNavProps['onFocus']> = (event) => {\n onFocus?.(event);\n if (!tracksPointer || !isInsideNav(event)) return;\n if (!event.target.matches(':focus-visible')) return;\n setFocusInside(true);\n };\n\n const handleBlur: NonNullable<BitkitUISideNavProps['onBlur']> = (event) => {\n onBlur?.(event);\n // `blur` also fires when focus moves between two rows. Only a target outside the nav counts.\n if (!tracksPointer || event.currentTarget.contains(event.relatedTarget)) return;\n setFocusInside(false);\n };\n\n const handlePointerEnter: NonNullable<BitkitUISideNavProps['onPointerEnter']> = (event) => {\n onPointerEnter?.(event);\n if (tracksPointer && isInsideNav(event)) setPointerInside(true);\n };\n\n const handlePointerLeave: NonNullable<BitkitUISideNavProps['onPointerLeave']> = (event) => {\n onPointerLeave?.(event);\n if (tracksPointer && isInsideNav(event)) setPointerInside(false);\n };\n\n // A blur does not always reach the nav. Focus can move into a portal, or the focused row can be\n // unmounted, and then the rail would stay open with nothing to close it. While focus counts as\n // inside, re-check every focus change against the document rather than trusting blur alone.\n useEffect(() => {\n if (!tracksPointer || !focusInside) return undefined;\n\n const syncFocusInside = () => {\n if (!navRef.current?.contains(document.activeElement)) setFocusInside(false);\n };\n\n document.addEventListener('focusin', syncFocusInside);\n return () => document.removeEventListener('focusin', syncFocusInside);\n }, [focusInside, tracksPointer]);\n\n // React derives pointer enter and leave from the React tree too, so moving from a row onto a\n // portalled descendant never counts as leaving and `onPointerLeave` never fires. While the\n // pointer counts as inside, read the nav's own `:hover` on every pointer target change rather\n // than waiting for a leave that may not come.\n useEffect(() => {\n if (!tracksPointer || !pointerInside) return undefined;\n\n const syncPointerInside = () => {\n if (!navRef.current?.matches(':hover')) setPointerInside(false);\n };\n\n document.addEventListener('pointerover', syncPointerInside);\n return () => document.removeEventListener('pointerover', syncPointerInside);\n }, [pointerInside, tracksPointer]);\n\n const nav = (\n <Box\n ref={setNavRef}\n aria-label=\"Platform navigation\"\n asChild\n data-expanded={expanded ? '' : undefined}\n {...rest}\n css={[styles.root, css]}\n onBlur={handleBlur}\n onFocus={handleFocus}\n onPointerEnter={handlePointerEnter}\n onPointerLeave={handlePointerLeave}\n >\n <nav>{children}</nav>\n </Box>\n );\n\n const context = useMemo(\n () => ({ expanded, isMobile, menuContainerRef, setMenuOpen, styles }),\n [expanded, isMobile, styles],\n );\n\n if (!isMobile) {\n return <UISideNavContextProvider value={context}>{nav}</UISideNavContextProvider>;\n }\n\n return (\n <UISideNavContextProvider value={context}>\n <Drawer.Root onOpenChange={(details) => onOpenChange?.(details.open)} open={open}>\n <Portal>\n <Drawer.Backdrop css={styles.backdrop} />\n <Drawer.Positioner css={styles.positioner}>\n <Drawer.Content ref={menuContainerRef} aria-label=\"Navigation\" css={styles.content}>\n {nav}\n <Box css={styles.closeButton}>\n <BitkitCloseButton\n aria-label=\"Close navigation\"\n colorVariant=\"white\"\n onClick={() => onOpenChange?.(false)}\n size=\"md\"\n />\n </Box>\n </Drawer.Content>\n </Drawer.Positioner>\n </Portal>\n </Drawer.Root>\n </UISideNavContextProvider>\n );\n});\n\nexport { uiSideNavRailWidth } from '../../theme/slot-recipes/UISideNav.recipe';\nexport { type BitkitUISideNavBodyProps } from './UISideNavBody';\nexport { type BitkitUISideNavFooterProps } from './UISideNavFooter';\nexport { type BitkitUISideNavFooterHeadingProps } from './UISideNavFooterHeading';\nexport { type BitkitUISideNavItemProps } from './UISideNavItem';\nexport {\n type BitkitUISideNavLinkAsAnchorProps,\n type BitkitUISideNavLinkAsButtonProps,\n type BitkitUISideNavLinkProps,\n} from './UISideNavLink';\nexport {\n type BitkitUISideNavWorkspaceProps,\n type BitkitUISideNavWorkspaceSelectorProps,\n} from './UISideNavWorkspaceSelector';\n\nBitkitUISideNav.displayName = 'BitkitUISideNav';\n\nexport default withSubComponents(BitkitUISideNav, {\n Body: UISideNavBody,\n Footer: UISideNavFooter,\n FooterHeading: UISideNavFooterHeading,\n Item: UISideNavItem,\n Link: UISideNavLink,\n WorkspaceSelector: UISideNavWorkspaceSelector,\n});\n"],"mappings":"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"}
@@ -1,7 +0,0 @@
1
- import { BoxProps } from '@chakra-ui/react/box';
2
- import { ReactNode } from 'react';
3
- export interface BitkitUISideNavBodyProps extends BoxProps {
4
- children: ReactNode;
5
- }
6
- declare const UISideNavBody: import('react').ForwardRefExoticComponent<BitkitUISideNavBodyProps & import('react').RefAttributes<HTMLDivElement>>;
7
- export default UISideNavBody;
@@ -1,20 +0,0 @@
1
- import { useUISideNavContext } from "./UISideNavContext.js";
2
- import { Box } from "@chakra-ui/react/box";
3
- import { forwardRef } from "react";
4
- import { jsx } from "react/jsx-runtime";
5
- //#region lib/components/BitkitUISideNav/UISideNavBody.tsx
6
- var UISideNavBody = forwardRef((props, ref) => {
7
- const { children, css, ...rest } = props;
8
- const { styles } = useUISideNavContext();
9
- return /* @__PURE__ */ jsx(Box, {
10
- ref,
11
- ...rest,
12
- css: [styles.body, css],
13
- children
14
- });
15
- });
16
- UISideNavBody.displayName = "BitkitUISideNav.Body";
17
- //#endregion
18
- export { UISideNavBody as default };
19
-
20
- //# sourceMappingURL=UISideNavBody.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"UISideNavBody.js","names":[],"sources":["../../../lib/components/BitkitUISideNav/UISideNavBody.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { useUISideNavContext } from './UISideNavContext';\n\nexport interface BitkitUISideNavBodyProps extends BoxProps {\n children: ReactNode;\n}\n\nconst UISideNavBody = forwardRef<HTMLDivElement, BitkitUISideNavBodyProps>((props, ref) => {\n const { children, css, ...rest } = props;\n\n const { styles } = useUISideNavContext();\n\n return (\n <Box ref={ref} {...rest} css={[styles.body, css]}>\n {children}\n </Box>\n );\n});\n\nUISideNavBody.displayName = 'BitkitUISideNav.Body';\n\nexport default UISideNavBody;\n"],"mappings":";;;;;AASA,IAAM,gBAAgB,YAAsD,OAAO,QAAQ;CACzF,MAAM,EAAE,UAAU,KAAK,GAAG,SAAS;CAEnC,MAAM,EAAE,WAAW,oBAAoB;CAEvC,OACE,oBAAC,KAAD;EAAU;EAAK,GAAI;EAAM,KAAK,CAAC,OAAO,MAAM,GAAG;EAC5C;CACE,CAAA;AAET,CAAC;AAED,cAAc,cAAc"}