@bitrise/bitkit-v2 0.3.290 → 0.3.292

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 (76) hide show
  1. package/dist/atoms/DatePicker/DatePicker.js +1 -1
  2. package/dist/atoms/ImageCropper/ImageCropper.js +1 -1
  3. package/dist/components/BitkitAccordion/BitkitAccordion.js.map +1 -1
  4. package/dist/components/BitkitAvatar/BitkitAvatar.js.map +1 -1
  5. package/dist/components/BitkitBadge/BitkitBadge.js.map +1 -1
  6. package/dist/components/BitkitBreadcrumb/BitkitBreadcrumb.js.map +1 -1
  7. package/dist/components/BitkitBreadcrumb/components/OverflowMenu.js.map +1 -1
  8. package/dist/components/BitkitCalendar/BitkitCalendar.js +2 -1
  9. package/dist/components/BitkitCalendar/BitkitCalendar.js.map +1 -1
  10. package/dist/components/BitkitCalendar/components/CalendarFooter.js +2 -1
  11. package/dist/components/BitkitCalendar/components/CalendarFooter.js.map +1 -1
  12. package/dist/components/BitkitCalendar/components/CalendarMonthSelect.js.map +1 -1
  13. package/dist/components/BitkitCalendar/components/CalendarNextTrigger.js.map +1 -1
  14. package/dist/components/BitkitCalendar/components/CalendarPrevTrigger.js.map +1 -1
  15. package/dist/components/BitkitCalendar/components/CalendarSelect.js.map +1 -1
  16. package/dist/components/BitkitCalendar/components/CalendarTrigger.js.map +1 -1
  17. package/dist/components/BitkitCalendar/components/CalendarYearSelect.js.map +1 -1
  18. package/dist/components/BitkitCodeSnippet/BitkitCodeSnippet.js.map +1 -1
  19. package/dist/components/BitkitCollapsible/BitkitCollapsible.js.map +1 -1
  20. package/dist/components/BitkitCombobox/BitkitCombobox.js.map +1 -1
  21. package/dist/components/BitkitDataWidget/BitkitDataWidget.js.map +1 -1
  22. package/dist/components/BitkitDialog/BitkitStepperDialog.js +2 -2
  23. package/dist/components/BitkitDialog/BitkitStepperDialog.js.map +1 -1
  24. package/dist/components/BitkitDialog/DialogBodyContext.js +2 -1
  25. package/dist/components/BitkitDialog/DialogBodyContext.js.map +1 -1
  26. package/dist/components/BitkitDraggableCard/BitkitDraggableCard.js.map +1 -1
  27. package/dist/components/BitkitExpandableCard/BitkitExpandableCard.js.map +1 -1
  28. package/dist/components/BitkitFileInput/BitkitFileInput.js.map +1 -1
  29. package/dist/components/BitkitGroupHeading/BitkitGroupHeading.js.map +1 -1
  30. package/dist/components/BitkitInlineLoading/BitkitInlineLoading.js.map +1 -1
  31. package/dist/components/BitkitLabel/BitkitLabel.js.map +1 -1
  32. package/dist/components/BitkitLabeledData/BitkitLabeledData.js.map +1 -1
  33. package/dist/components/BitkitMarkdown/BitkitMarkdown.js.map +1 -1
  34. package/dist/components/BitkitMarkdownCard/BitkitMarkdownCard.js.map +1 -1
  35. package/dist/components/BitkitMultiselect/BitkitMultiselect.js.map +1 -1
  36. package/dist/components/BitkitMultiselectMenu/BitkitMultiselectMenu.js.map +1 -1
  37. package/dist/components/BitkitNativeSelect/BitkitNativeSelect.js.map +1 -1
  38. package/dist/components/BitkitNoteCard/BitkitNoteCard.js.map +1 -1
  39. package/dist/components/BitkitOverflowContent/BitkitOverflowContent.js.map +1 -1
  40. package/dist/components/BitkitPageFooter/BitkitPageFooter.js.map +1 -1
  41. package/dist/components/BitkitPagination/BitkitPagination.js.map +1 -1
  42. package/dist/components/BitkitPaginationLoadMore/BitkitPaginationLoadMore.js.map +1 -1
  43. package/dist/components/BitkitPopover/BitkitPopover.js +2 -1
  44. package/dist/components/BitkitPopover/BitkitPopover.js.map +1 -1
  45. package/dist/components/BitkitRibbon/BitkitRibbon.js.map +1 -1
  46. package/dist/components/BitkitSectionHeading/BitkitSectionHeading.js.map +1 -1
  47. package/dist/components/BitkitSelect/BitkitSelect.js.map +1 -1
  48. package/dist/components/BitkitSelectMenu/BitkitSelectMenu.js.map +1 -1
  49. package/dist/components/BitkitSelectMenu/SelectMenuShell.js.map +1 -1
  50. package/dist/components/BitkitSelectableTag/BitkitSelectableTag.js.map +1 -1
  51. package/dist/components/BitkitSettingsCard/BitkitSettingsCard.js.map +1 -1
  52. package/dist/components/BitkitSidebar/BitkitSidebar.js.map +1 -1
  53. package/dist/components/BitkitSplitButton/BitkitSplitButton.js.map +1 -1
  54. package/dist/components/BitkitStat/BitkitStat.js.map +1 -1
  55. package/dist/components/BitkitSteps/BitkitSteps.js.map +1 -1
  56. package/dist/components/BitkitStepsCard/BitkitStepsCard.js.map +1 -1
  57. package/dist/components/BitkitSwitch/BitkitSwitch.js.map +1 -1
  58. package/dist/components/BitkitTabs/BitkitTabs.js +1 -1
  59. package/dist/components/BitkitTabs/BitkitTabs.js.map +1 -1
  60. package/dist/components/BitkitTagsInput/BitkitTagsInput.js.map +1 -1
  61. package/dist/components/BitkitTextInput/BitkitTextInput.js.map +1 -1
  62. package/dist/components/BitkitTreeView/BitkitTreeView.js.map +1 -1
  63. package/dist/theme/recipes/Badge.recipe.js +2 -1
  64. package/dist/theme/recipes/Badge.recipe.js.map +1 -1
  65. package/dist/theme/recipes/Button.recipe.js.map +1 -1
  66. package/dist/theme/slot-recipes/ExpandableCard.recipe.js.map +1 -1
  67. package/dist/theme/slot-recipes/Multiselect.recipe.js +1 -1
  68. package/dist/theme/slot-recipes/NumberInput.recipe.js +1 -1
  69. package/dist/theme/slot-recipes/StepCard.recipe.js.map +1 -1
  70. package/dist/theme/slot-recipes/TagsInput.recipe.js.map +1 -1
  71. package/dist/theme/text-styles.js +4 -3
  72. package/dist/theme/text-styles.js.map +1 -1
  73. package/dist/theme/themeUtils.js +1 -1
  74. package/dist/theme/themeUtils.js.map +1 -1
  75. package/dist/theme/tokens/sizesAndSpacing.js +4 -2
  76. package/package.json +21 -21
@@ -1 +1 @@
1
- {"version":3,"file":"BitkitSelect.js","names":[],"sources":["../../../lib/components/BitkitSelect/BitkitSelect.tsx"],"sourcesContent":["import { createListCollection } from '@chakra-ui/react/collection';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { Select, type SelectRootProps, type SelectTriggerProps, useSelectContext } from '@chakra-ui/react/select';\nimport { Text } from '@chakra-ui/react/text';\nimport { forwardRef, useContext } from 'react';\n\nimport { IconErrorCircleFilled, IconWarningYellow } from '../../icons';\nimport AssetSelectChevron from '../../utilities/AssetSelectChevron.tsx';\nimport BitkitPortalContext from '../../utilities/BitkitPortalContext';\nimport { withSubComponents } from '../../utilities/withSubComponents.ts';\nimport BitkitField, { type BitkitFieldProps } from '../BitkitField/BitkitField.tsx';\nimport BitkitSelectMenu, {\n type BitkitSelectMenuEmptyStateProps,\n type BitkitSelectMenuItemProps,\n type BitkitSelectMenuSearchProps,\n} from '../BitkitSelectMenu/BitkitSelectMenu.tsx';\nimport BitkitSelectMenuAction, {\n type BitkitSelectMenuActionChild,\n} from '../BitkitSelectMenu/BitkitSelectMenuAction.tsx';\n\nexport type BitkitSelectTriggerProps = SelectTriggerProps;\n\nexport type BitkitSelectProps = Omit<BitkitFieldProps, 'children' | 'state'> & {\n children?: BitkitSelectMenuActionChild;\n defaultValue?: string;\n isLoading?: boolean;\n items: Array<BitkitSelectMenuItemProps>;\n onValueChange?: (newVal: string) => void;\n placeholder?: string;\n disablePortal?: boolean;\n selectProps?: Omit<SelectRootProps, 'collection' | 'defaultValue' | 'onValueChange' | 'value'>;\n size?: 'md' | 'lg';\n state?: 'disabled' | 'error' | 'readOnly' | 'warning';\n triggerProps?: BitkitSelectTriggerProps;\n value?: string;\n} & BitkitSelectMenuSearchProps &\n BitkitSelectMenuEmptyStateProps;\n\ntype SelectValueProps = {\n placeholder?: string;\n size: BitkitSelectProps['size'];\n state?: BitkitSelectProps['state'];\n};\n\nconst SelectValue = ({ placeholder, state, size }: SelectValueProps) => {\n const select = useSelectContext();\n const items = select.selectedItems as Array<BitkitSelectMenuItemProps>;\n\n const Icon = items[0]?.icon;\n const label = items[0]?.label;\n\n const iconSize = size === 'md' ? '16' : '24';\n\n return items[0] ? (\n <Select.ValueText placeholder={placeholder ?? (state === 'readOnly' ? '(not selected)' : 'Select an option')}>\n {Icon && <Icon size={iconSize} flexShrink={0} />}\n <Text as=\"span\" overflow=\"hidden\" textOverflow=\"ellipsis\" whiteSpace=\"nowrap\" minWidth={0}>\n {label}\n </Text>\n </Select.ValueText>\n ) : (\n <Select.ValueText placeholder={placeholder ?? (state === 'readOnly' ? '(not selected)' : 'Select an option')} />\n );\n};\n\nconst BitkitSelect = forwardRef<HTMLDivElement, BitkitSelectProps>((props: BitkitSelectProps, ref) => {\n const {\n children,\n defaultValue,\n emptyHelperText,\n emptyLabel,\n isLoading,\n items,\n onSearchChange,\n onValueChange,\n placeholder,\n disablePortal,\n searchValue,\n selectProps,\n size,\n state,\n triggerProps,\n value,\n ...fieldProps\n } = props;\n\n const collection = createListCollection({\n items,\n groupBy: (item) => item.group || '',\n isItemDisabled: (item) => !!item.disabled,\n });\n\n const { disablePortal: disablePortalFromContext } = useContext(BitkitPortalContext);\n const isInvalid = state === 'error' || !!fieldProps.errorText;\n\n return (\n <BitkitField ref={ref} state={state} {...fieldProps}>\n <Select.Root\n collection={collection}\n size={size}\n {...selectProps}\n defaultValue={defaultValue ? [defaultValue] : undefined}\n disabled={state === 'disabled'}\n hasStatusIcon={state === 'error' || state === 'warning'}\n invalid={isInvalid}\n onValueChange={(newVal) => onValueChange?.(newVal.value[0])}\n readOnly={state === 'readOnly'}\n // Bypass Zag's isScrollable(contentEl) gate — our Content is overflow:hidden flex\n // column, so the real scroll container is itemList. See BitkitMultiselect for why.\n scrollToIndexFn={({ getElement }) => getElement()?.scrollIntoView({ block: 'nearest' })}\n // Stay controlled whenever `value` is provided — including `''` (\"nothing selected\"). A\n // truthiness check (`value ? … : undefined`) passes `undefined` for `''`, which flips\n // Select.Root to uncontrolled: it then ignores `value`, so resets don't take and\n // onValueChange stops firing when the same option is re-selected.\n value={value === undefined ? undefined : value ? [value] : []}\n >\n <Select.HiddenSelect />\n <Select.Control className=\"group\">\n <Select.Trigger {...triggerProps}>\n <SelectValue placeholder={placeholder} size={size} state={state} />\n </Select.Trigger>\n <Select.IndicatorGroup>\n {state === 'error' && (\n <Select.Indicator>\n <IconErrorCircleFilled size={size === 'lg' ? '24' : '16'} color=\"icon/negative\" />\n </Select.Indicator>\n )}\n {state === 'warning' && (\n <Select.Indicator>\n <IconWarningYellow size={size === 'lg' ? '24' : '16'} />\n </Select.Indicator>\n )}\n <Select.Indicator asChild>\n <AssetSelectChevron />\n </Select.Indicator>\n </Select.IndicatorGroup>\n </Select.Control>\n <Portal disabled={disablePortal || disablePortalFromContext}>\n <Select.Positioner>\n <BitkitSelectMenu\n collection={collection}\n emptyHelperText={emptyHelperText}\n emptyLabel={emptyLabel}\n isLoading={isLoading}\n onSearchChange={onSearchChange}\n searchValue={searchValue}\n size={size}\n >\n {children}\n </BitkitSelectMenu>\n </Select.Positioner>\n </Portal>\n </Select.Root>\n </BitkitField>\n );\n});\n\nBitkitSelect.displayName = 'BitkitSelect';\n\nexport default withSubComponents(BitkitSelect, { Action: BitkitSelectMenuAction });\n"],"mappings":";;;;;;;;;;;;;;;AA4CA,IAAM,eAAe,EAAE,aAAa,OAAO,WAA6B;CAEtE,MAAM,QADS,iBACD,EAAO;CAErB,MAAM,OAAO,MAAM,IAAI;CACvB,MAAM,QAAQ,MAAM,IAAI;CAExB,MAAM,WAAW,SAAS,OAAO,OAAO;CAExC,OAAO,MAAM,KACX,qBAAC,OAAO,WAAR;EAAkB,aAAa,gBAAgB,UAAU,aAAa,mBAAmB;YAAzF,CACG,QAAQ,oBAAC,MAAD;GAAM,MAAM;GAAU,YAAY;EAAI,CAAA,GAC/C,oBAAC,MAAD;GAAM,IAAG;GAAO,UAAS;GAAS,cAAa;GAAW,YAAW;GAAS,UAAU;aACrF;EACG,CAAA,CACU;MAElB,oBAAC,OAAO,WAAR,EAAkB,aAAa,gBAAgB,UAAU,aAAa,mBAAmB,oBAAsB,CAAA;AAEnH;AAEA,IAAM,eAAe,YAA+C,OAA0B,QAAQ;CACpG,MAAM,EACJ,UACA,cACA,iBACA,YACA,WACA,OACA,gBACA,eACA,aACA,eACA,aACA,aACA,MACA,OACA,cACA,OACA,GAAG,eACD;CAEJ,MAAM,aAAa,qBAAqB;EACtC;EACA,UAAU,SAAS,KAAK,SAAS;EACjC,iBAAiB,SAAS,CAAC,CAAC,KAAK;CACnC,CAAC;CAED,MAAM,EAAE,eAAe,6BAA6B,WAAW,mBAAmB;CAClF,MAAM,YAAY,UAAU,WAAW,CAAC,CAAC,WAAW;CAEpD,OACE,oBAAC,aAAD;EAAkB;EAAY;EAAO,GAAI;YACvC,qBAAC,OAAO,MAAR;GACc;GACN;GACN,GAAI;GACJ,cAAc,eAAe,CAAC,YAAY,IAAI,KAAA;GAC9C,UAAU,UAAU;GACpB,eAAe,UAAU,WAAW,UAAU;GAC9C,SAAS;GACT,gBAAgB,WAAW,gBAAgB,OAAO,MAAM,EAAE;GAC1D,UAAU,UAAU;GAGpB,kBAAkB,EAAE,iBAAiB,WAAW,GAAG,eAAe,EAAE,OAAO,UAAU,CAAC;GAKtF,OAAO,UAAU,KAAA,IAAY,KAAA,IAAY,QAAQ,CAAC,KAAK,IAAI,CAAC;aAjB9D;IAmBE,oBAAC,OAAO,cAAR,CAAsB,CAAA;IACtB,qBAAC,OAAO,SAAR;KAAgB,WAAU;eAA1B,CACE,oBAAC,OAAO,SAAR;MAAgB,GAAI;gBAClB,oBAAC,aAAD;OAA0B;OAAmB;OAAa;MAAQ,CAAA;KACpD,CAAA,GAChB,qBAAC,OAAO,gBAAR,EAAA,UAAA;MACG,UAAU,WACT,oBAAC,OAAO,WAAR,EAAA,UACE,oBAAC,uBAAD;OAAuB,MAAM,SAAS,OAAO,OAAO;OAAM,OAAM;MAAiB,CAAA,EACjE,CAAA;MAEnB,UAAU,aACT,oBAAC,OAAO,WAAR,EAAA,UACE,oBAAC,mBAAD,EAAmB,MAAM,SAAS,OAAO,OAAO,KAAO,CAAA,EACvC,CAAA;MAEpB,oBAAC,OAAO,WAAR;OAAkB,SAAA;iBAChB,oBAAC,oBAAD,CAAqB,CAAA;MACL,CAAA;KACG,EAAA,CAAA,CACT;;IAChB,oBAAC,QAAD;KAAQ,UAAU,iBAAiB;eACjC,oBAAC,OAAO,YAAR,EAAA,UACE,oBAAC,kBAAD;MACc;MACK;MACL;MACD;MACK;MACH;MACP;MAEL;KACe,CAAA,EACD,CAAA;IACb,CAAA;GACG;;CACF,CAAA;AAEjB,CAAC;AAED,aAAa,cAAc;AAE3B,IAAA,uBAAe,kBAAkB,cAAc,EAAE,QAAQ,uBAAuB,CAAC"}
1
+ {"version":3,"file":"BitkitSelect.js","names":[],"sources":["../../../lib/components/BitkitSelect/BitkitSelect.tsx"],"sourcesContent":["import { createListCollection } from '@chakra-ui/react/collection';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { Select, type SelectRootProps, type SelectTriggerProps, useSelectContext } from '@chakra-ui/react/select';\nimport { Text } from '@chakra-ui/react/text';\nimport { forwardRef, useContext } from 'react';\n\nimport { IconErrorCircleFilled, IconWarningYellow } from '../../icons';\nimport AssetSelectChevron from '../../utilities/AssetSelectChevron.tsx';\nimport BitkitPortalContext from '../../utilities/BitkitPortalContext';\nimport { withSubComponents } from '../../utilities/withSubComponents.ts';\nimport BitkitField, { type BitkitFieldProps } from '../BitkitField/BitkitField.tsx';\nimport BitkitSelectMenu, {\n type BitkitSelectMenuEmptyStateProps,\n type BitkitSelectMenuItemProps,\n type BitkitSelectMenuSearchProps,\n} from '../BitkitSelectMenu/BitkitSelectMenu.tsx';\nimport BitkitSelectMenuAction, {\n type BitkitSelectMenuActionChild,\n} from '../BitkitSelectMenu/BitkitSelectMenuAction.tsx';\n\nexport type BitkitSelectTriggerProps = SelectTriggerProps;\n\nexport type BitkitSelectProps = Omit<BitkitFieldProps, 'children' | 'state'> & {\n children?: BitkitSelectMenuActionChild;\n defaultValue?: string;\n isLoading?: boolean;\n items: Array<BitkitSelectMenuItemProps>;\n onValueChange?: (newVal: string) => void;\n placeholder?: string;\n disablePortal?: boolean;\n selectProps?: Omit<SelectRootProps, 'collection' | 'defaultValue' | 'onValueChange' | 'value'>;\n size?: 'md' | 'lg';\n state?: 'disabled' | 'error' | 'readOnly' | 'warning';\n triggerProps?: BitkitSelectTriggerProps;\n value?: string;\n} & BitkitSelectMenuSearchProps &\n BitkitSelectMenuEmptyStateProps;\n\ntype SelectValueProps = {\n placeholder?: string;\n size: BitkitSelectProps['size'];\n state?: BitkitSelectProps['state'];\n};\n\nconst SelectValue = ({ placeholder, state, size }: SelectValueProps) => {\n const select = useSelectContext();\n const items = select.selectedItems as Array<BitkitSelectMenuItemProps>;\n\n const Icon = items[0]?.icon;\n const label = items[0]?.label;\n\n const iconSize = size === 'md' ? '16' : '24';\n\n return items[0] ? (\n <Select.ValueText placeholder={placeholder ?? (state === 'readOnly' ? '(not selected)' : 'Select an option')}>\n {Icon && <Icon size={iconSize} flexShrink={0} />}\n <Text as=\"span\" overflow=\"hidden\" textOverflow=\"ellipsis\" whiteSpace=\"nowrap\" minWidth={0}>\n {label}\n </Text>\n </Select.ValueText>\n ) : (\n <Select.ValueText placeholder={placeholder ?? (state === 'readOnly' ? '(not selected)' : 'Select an option')} />\n );\n};\n\nconst BitkitSelect = forwardRef<HTMLDivElement, BitkitSelectProps>((props: BitkitSelectProps, ref) => {\n const {\n children,\n defaultValue,\n emptyHelperText,\n emptyLabel,\n isLoading,\n items,\n onSearchChange,\n onValueChange,\n placeholder,\n disablePortal,\n searchValue,\n selectProps,\n size,\n state,\n triggerProps,\n value,\n ...fieldProps\n } = props;\n\n const collection = createListCollection({\n items,\n groupBy: (item) => item.group || '',\n isItemDisabled: (item) => !!item.disabled,\n });\n\n const { disablePortal: disablePortalFromContext } = useContext(BitkitPortalContext);\n const isInvalid = state === 'error' || !!fieldProps.errorText;\n\n return (\n <BitkitField ref={ref} state={state} {...fieldProps}>\n <Select.Root\n collection={collection}\n size={size}\n {...selectProps}\n defaultValue={defaultValue ? [defaultValue] : undefined}\n disabled={state === 'disabled'}\n hasStatusIcon={state === 'error' || state === 'warning'}\n invalid={isInvalid}\n onValueChange={(newVal) => onValueChange?.(newVal.value[0])}\n readOnly={state === 'readOnly'}\n // Bypass Zag's isScrollable(contentEl) gate — our Content is overflow:hidden flex\n // column, so the real scroll container is itemList. See BitkitMultiselect for why.\n scrollToIndexFn={({ getElement }) => getElement()?.scrollIntoView({ block: 'nearest' })}\n // Stay controlled whenever `value` is provided — including `''` (\"nothing selected\"). A\n // truthiness check (`value ? … : undefined`) passes `undefined` for `''`, which flips\n // Select.Root to uncontrolled: it then ignores `value`, so resets don't take and\n // onValueChange stops firing when the same option is re-selected.\n value={value === undefined ? undefined : value ? [value] : []}\n >\n <Select.HiddenSelect />\n <Select.Control className=\"group\">\n <Select.Trigger {...triggerProps}>\n <SelectValue placeholder={placeholder} size={size} state={state} />\n </Select.Trigger>\n <Select.IndicatorGroup>\n {state === 'error' && (\n <Select.Indicator>\n <IconErrorCircleFilled size={size === 'lg' ? '24' : '16'} color=\"icon/negative\" />\n </Select.Indicator>\n )}\n {state === 'warning' && (\n <Select.Indicator>\n <IconWarningYellow size={size === 'lg' ? '24' : '16'} />\n </Select.Indicator>\n )}\n <Select.Indicator asChild>\n <AssetSelectChevron />\n </Select.Indicator>\n </Select.IndicatorGroup>\n </Select.Control>\n <Portal disabled={disablePortal || disablePortalFromContext}>\n <Select.Positioner>\n <BitkitSelectMenu\n collection={collection}\n emptyHelperText={emptyHelperText}\n emptyLabel={emptyLabel}\n isLoading={isLoading}\n onSearchChange={onSearchChange}\n searchValue={searchValue}\n size={size}\n >\n {children}\n </BitkitSelectMenu>\n </Select.Positioner>\n </Portal>\n </Select.Root>\n </BitkitField>\n );\n});\n\nBitkitSelect.displayName = 'BitkitSelect';\n\nexport default withSubComponents(BitkitSelect, { Action: BitkitSelectMenuAction });\n"],"mappings":";;;;;;;;;;;;;;;AA4CA,IAAM,eAAe,EAAE,aAAa,OAAO,WAA6B;CAEtE,MAAM,QADS,iBACD,CAAA,CAAO;CAErB,MAAM,OAAO,MAAM,EAAE,EAAE;CACvB,MAAM,QAAQ,MAAM,EAAE,EAAE;CAExB,MAAM,WAAW,SAAS,OAAO,OAAO;CAExC,OAAO,MAAM,KACX,qBAAC,OAAO,WAAR;EAAkB,aAAa,gBAAgB,UAAU,aAAa,mBAAmB;YAAzF,CACG,QAAQ,oBAAC,MAAD;GAAM,MAAM;GAAU,YAAY;EAAI,CAAA,GAC/C,oBAAC,MAAD;GAAM,IAAG;GAAO,UAAS;GAAS,cAAa;GAAW,YAAW;GAAS,UAAU;aACrF;EACG,CAAA,CACU;MAElB,oBAAC,OAAO,WAAR,EAAkB,aAAa,gBAAgB,UAAU,aAAa,mBAAmB,oBAAsB,CAAA;AAEnH;AAEA,IAAM,eAAe,YAA+C,OAA0B,QAAQ;CACpG,MAAM,EACJ,UACA,cACA,iBACA,YACA,WACA,OACA,gBACA,eACA,aACA,eACA,aACA,aACA,MACA,OACA,cACA,OACA,GAAG,eACD;CAEJ,MAAM,aAAa,qBAAqB;EACtC;EACA,UAAU,SAAS,KAAK,SAAS;EACjC,iBAAiB,SAAS,CAAC,CAAC,KAAK;CACnC,CAAC;CAED,MAAM,EAAE,eAAe,6BAA6B,WAAW,mBAAmB;CAClF,MAAM,YAAY,UAAU,WAAW,CAAC,CAAC,WAAW;CAEpD,OACE,oBAAC,aAAD;EAAkB;EAAY;EAAO,GAAI;YACvC,qBAAC,OAAO,MAAR;GACc;GACN;GACN,GAAI;GACJ,cAAc,eAAe,CAAC,YAAY,IAAI,KAAA;GAC9C,UAAU,UAAU;GACpB,eAAe,UAAU,WAAW,UAAU;GAC9C,SAAS;GACT,gBAAgB,WAAW,gBAAgB,OAAO,MAAM,EAAE;GAC1D,UAAU,UAAU;GAGpB,kBAAkB,EAAE,iBAAiB,WAAW,CAAC,EAAE,eAAe,EAAE,OAAO,UAAU,CAAC;GAKtF,OAAO,UAAU,KAAA,IAAY,KAAA,IAAY,QAAQ,CAAC,KAAK,IAAI,CAAC;aAjB9D;IAmBE,oBAAC,OAAO,cAAR,CAAsB,CAAA;IACtB,qBAAC,OAAO,SAAR;KAAgB,WAAU;eAA1B,CACE,oBAAC,OAAO,SAAR;MAAgB,GAAI;gBAClB,oBAAC,aAAD;OAA0B;OAAmB;OAAa;MAAQ,CAAA;KACpD,CAAA,GAChB,qBAAC,OAAO,gBAAR,EAAA,UAAA;MACG,UAAU,WACT,oBAAC,OAAO,WAAR,EAAA,UACE,oBAAC,uBAAD;OAAuB,MAAM,SAAS,OAAO,OAAO;OAAM,OAAM;MAAiB,CAAA,EACjE,CAAA;MAEnB,UAAU,aACT,oBAAC,OAAO,WAAR,EAAA,UACE,oBAAC,mBAAD,EAAmB,MAAM,SAAS,OAAO,OAAO,KAAO,CAAA,EACvC,CAAA;MAEpB,oBAAC,OAAO,WAAR;OAAkB,SAAA;iBAChB,oBAAC,oBAAD,CAAqB,CAAA;MACL,CAAA;KACG,EAAA,CAAA,CACT;;IAChB,oBAAC,QAAD;KAAQ,UAAU,iBAAiB;eACjC,oBAAC,OAAO,YAAR,EAAA,UACE,oBAAC,kBAAD;MACc;MACK;MACL;MACD;MACK;MACH;MACP;MAEL;KACe,CAAA,EACD,CAAA;IACb,CAAA;GACG;;CACF,CAAA;AAEjB,CAAC;AAED,aAAa,cAAc;AAE3B,IAAA,uBAAe,kBAAkB,cAAc,EAAE,QAAQ,uBAAuB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"BitkitSelectMenu.js","names":[],"sources":["../../../lib/components/BitkitSelectMenu/BitkitSelectMenu.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { type ListCollection } from '@chakra-ui/react/collection';\nimport { Combobox } from '@chakra-ui/react/combobox';\nimport { Select, type SelectContentProps } from '@chakra-ui/react/select';\nimport { Spinner } from '@chakra-ui/react/spinner';\nimport { type SystemStyleObject, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent, IconCheck } from '../../icons';\nimport BitkitAvatar from '../BitkitAvatar/BitkitAvatar';\nimport { type BitkitSelectMenuActionChild } from './BitkitSelectMenuAction';\nimport { SelectMenuShell } from './SelectMenuShell';\n\nexport { type BitkitSelectMenuActionProps } from './BitkitSelectMenuAction';\n\nexport type BitkitSelectMenuSearchProps = {\n /** When provided, a search input is rendered above the menu items. `searchValue` is required alongside. */\n onSearchChange?: (searchText: string) => void;\n searchValue?: string;\n};\n\nexport type BitkitSelectMenuItemProps = {\n value: string;\n label: string;\n group?: string;\n icon?: BitkitIconComponent;\n avatar?: string;\n helperText?: ReactNode;\n disabled?: boolean;\n loading?: boolean;\n};\n\nexport type BitkitSelectMenuEmptyStateProps = {\n emptyLabel?: string;\n emptyHelperText?: string;\n};\n\nexport type BitkitSelectMenuProps = {\n children?: BitkitSelectMenuActionChild;\n collection: ListCollection<BitkitSelectMenuItemProps>;\n /** Forwarded to the underlying Select/Combobox.Content. Kept for internal callers\n * (e.g. BitkitCalendar's in-grid selects that need to tweak max-height / width). The\n * public components (BitkitSelect, BitkitCombobox) do not expose this escape hatch. */\n contentProps?: SelectContentProps;\n isLoading?: boolean;\n size?: 'md' | 'lg';\n variant?: 'select' | 'combobox';\n} & BitkitSelectMenuSearchProps &\n BitkitSelectMenuEmptyStateProps;\n\nconst BitkitSelectMenu = forwardRef<HTMLDivElement, BitkitSelectMenuProps>((props, ref) => {\n const { children, collection, variant = 'select', size, ...shellProps } = props;\n const NS = variant === 'combobox' ? Combobox : Select;\n const recipe = useSlotRecipe({ key: 'select' });\n const styles = recipe({ size });\n const iconSize = size === 'md' ? '16' : '24';\n\n return (\n <SelectMenuShell\n NS={NS}\n collection={collection}\n contentRef={ref}\n iconSize={iconSize}\n renderItem={(item) => <SelectMenuItem key={item.value} NS={NS} item={item} iconSize={iconSize} styles={styles} />}\n size={size}\n styles={styles}\n {...shellProps}\n >\n {children}\n </SelectMenuShell>\n );\n});\n\nBitkitSelectMenu.displayName = 'BitkitSelectMenu';\n\ntype SelectMenuItemRenderProps = {\n NS: typeof Select | typeof Combobox;\n item: BitkitSelectMenuItemProps;\n iconSize: '16' | '24';\n styles: Record<string, SystemStyleObject>;\n};\n\nconst SelectMenuItem = ({ NS, item, iconSize, styles }: SelectMenuItemRenderProps) => {\n const Icon = item.icon;\n\n if (item.loading) {\n // Rendered as a plain Box, not NS.Item — Zag's state machine won't track it as\n // an option, so keyboard nav skips it and it can't be selected.\n return (\n <Box css={styles.item}>\n <Spinner variant=\"purple\" css={styles.itemLoading} />\n <Text css={styles.itemLoadingLabel}>Loading...</Text>\n </Box>\n );\n }\n\n return (\n <NS.Item css={styles.item} item={item}>\n {item.avatar && (\n <Box data-slot=\"avatar\" css={{ '[data-disabled] &': { opacity: 0.5 } }}>\n <BitkitAvatar variant=\"image\" src={item.avatar} name={item.label} size={iconSize === '24' ? '32' : '24'} />\n </Box>\n )}\n <Box css={styles.itemContent}>\n <Box display=\"flex\" alignItems=\"center\" gap=\"8\">\n {Icon && !item.avatar && <Icon color=\"icon/primary\" size={iconSize} />}\n <Text css={styles.itemLabel}>{item.label}</Text>\n </Box>\n {item.helperText && <Text css={styles.itemHelperText}>{item.helperText}</Text>}\n </Box>\n <NS.ItemIndicator asChild>\n <IconCheck size={iconSize} css={styles.itemIndicator} />\n </NS.ItemIndicator>\n </NS.Item>\n );\n};\n\nexport default BitkitSelectMenu;\n"],"mappings":";;;;;;;;;;;;AAmDA,IAAM,mBAAmB,YAAmD,OAAO,QAAQ;CACzF,MAAM,EAAE,UAAU,YAAY,UAAU,UAAU,MAAM,GAAG,eAAe;CAC1E,MAAM,KAAK,YAAY,aAAa,WAAW;CAE/C,MAAM,SADS,cAAc,EAAE,KAAK,SAAS,CAC9B,EAAO,EAAE,KAAK,CAAC;CAC9B,MAAM,WAAW,SAAS,OAAO,OAAO;CAExC,OACE,oBAAC,iBAAD;EACM;EACQ;EACZ,YAAY;EACF;EACV,aAAa,SAAS,oBAAC,gBAAD;GAAqC;GAAU;GAAgB;GAAkB;EAAS,GAArE,KAAK,KAAgE;EAC1G;EACE;EACR,GAAI;EAEH;CACc,CAAA;AAErB,CAAC;AAED,iBAAiB,cAAc;AAS/B,IAAM,kBAAkB,EAAE,IAAI,MAAM,UAAU,aAAwC;CACpF,MAAM,OAAO,KAAK;CAElB,IAAI,KAAK,SAGP,OACE,qBAAC,KAAD;EAAK,KAAK,OAAO;YAAjB,CACE,oBAAC,SAAD;GAAS,SAAQ;GAAS,KAAK,OAAO;EAAc,CAAA,GACpD,oBAAC,MAAD;GAAM,KAAK,OAAO;aAAkB;EAAgB,CAAA,CACjD;;CAIT,OACE,qBAAC,GAAG,MAAJ;EAAS,KAAK,OAAO;EAAY;YAAjC;GACG,KAAK,UACJ,oBAAC,KAAD;IAAK,aAAU;IAAS,KAAK,EAAE,qBAAqB,EAAE,SAAS,GAAI,EAAE;cACnE,oBAAC,cAAD;KAAc,SAAQ;KAAQ,KAAK,KAAK;KAAQ,MAAM,KAAK;KAAO,MAAM,aAAa,OAAO,OAAO;IAAO,CAAA;GACvG,CAAA;GAEP,qBAAC,KAAD;IAAK,KAAK,OAAO;cAAjB,CACE,qBAAC,KAAD;KAAK,SAAQ;KAAO,YAAW;KAAS,KAAI;eAA5C,CACG,QAAQ,CAAC,KAAK,UAAU,oBAAC,MAAD;MAAM,OAAM;MAAe,MAAM;KAAW,CAAA,GACrE,oBAAC,MAAD;MAAM,KAAK,OAAO;gBAAY,KAAK;KAAY,CAAA,CAC5C;QACJ,KAAK,cAAc,oBAAC,MAAD;KAAM,KAAK,OAAO;eAAiB,KAAK;IAAiB,CAAA,CAC1E;;GACL,oBAAC,GAAG,eAAJ;IAAkB,SAAA;cAChB,oBAAC,WAAD;KAAW,MAAM;KAAU,KAAK,OAAO;IAAgB,CAAA;GACvC,CAAA;EACX;;AAEb"}
1
+ {"version":3,"file":"BitkitSelectMenu.js","names":[],"sources":["../../../lib/components/BitkitSelectMenu/BitkitSelectMenu.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { type ListCollection } from '@chakra-ui/react/collection';\nimport { Combobox } from '@chakra-ui/react/combobox';\nimport { Select, type SelectContentProps } from '@chakra-ui/react/select';\nimport { Spinner } from '@chakra-ui/react/spinner';\nimport { type SystemStyleObject, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent, IconCheck } from '../../icons';\nimport BitkitAvatar from '../BitkitAvatar/BitkitAvatar';\nimport { type BitkitSelectMenuActionChild } from './BitkitSelectMenuAction';\nimport { SelectMenuShell } from './SelectMenuShell';\n\nexport { type BitkitSelectMenuActionProps } from './BitkitSelectMenuAction';\n\nexport type BitkitSelectMenuSearchProps = {\n /** When provided, a search input is rendered above the menu items. `searchValue` is required alongside. */\n onSearchChange?: (searchText: string) => void;\n searchValue?: string;\n};\n\nexport type BitkitSelectMenuItemProps = {\n value: string;\n label: string;\n group?: string;\n icon?: BitkitIconComponent;\n avatar?: string;\n helperText?: ReactNode;\n disabled?: boolean;\n loading?: boolean;\n};\n\nexport type BitkitSelectMenuEmptyStateProps = {\n emptyLabel?: string;\n emptyHelperText?: string;\n};\n\nexport type BitkitSelectMenuProps = {\n children?: BitkitSelectMenuActionChild;\n collection: ListCollection<BitkitSelectMenuItemProps>;\n /** Forwarded to the underlying Select/Combobox.Content. Kept for internal callers\n * (e.g. BitkitCalendar's in-grid selects that need to tweak max-height / width). The\n * public components (BitkitSelect, BitkitCombobox) do not expose this escape hatch. */\n contentProps?: SelectContentProps;\n isLoading?: boolean;\n size?: 'md' | 'lg';\n variant?: 'select' | 'combobox';\n} & BitkitSelectMenuSearchProps &\n BitkitSelectMenuEmptyStateProps;\n\nconst BitkitSelectMenu = forwardRef<HTMLDivElement, BitkitSelectMenuProps>((props, ref) => {\n const { children, collection, variant = 'select', size, ...shellProps } = props;\n const NS = variant === 'combobox' ? Combobox : Select;\n const recipe = useSlotRecipe({ key: 'select' });\n const styles = recipe({ size });\n const iconSize = size === 'md' ? '16' : '24';\n\n return (\n <SelectMenuShell\n NS={NS}\n collection={collection}\n contentRef={ref}\n iconSize={iconSize}\n renderItem={(item) => <SelectMenuItem key={item.value} NS={NS} item={item} iconSize={iconSize} styles={styles} />}\n size={size}\n styles={styles}\n {...shellProps}\n >\n {children}\n </SelectMenuShell>\n );\n});\n\nBitkitSelectMenu.displayName = 'BitkitSelectMenu';\n\ntype SelectMenuItemRenderProps = {\n NS: typeof Select | typeof Combobox;\n item: BitkitSelectMenuItemProps;\n iconSize: '16' | '24';\n styles: Record<string, SystemStyleObject>;\n};\n\nconst SelectMenuItem = ({ NS, item, iconSize, styles }: SelectMenuItemRenderProps) => {\n const Icon = item.icon;\n\n if (item.loading) {\n // Rendered as a plain Box, not NS.Item — Zag's state machine won't track it as\n // an option, so keyboard nav skips it and it can't be selected.\n return (\n <Box css={styles.item}>\n <Spinner variant=\"purple\" css={styles.itemLoading} />\n <Text css={styles.itemLoadingLabel}>Loading...</Text>\n </Box>\n );\n }\n\n return (\n <NS.Item css={styles.item} item={item}>\n {item.avatar && (\n <Box data-slot=\"avatar\" css={{ '[data-disabled] &': { opacity: 0.5 } }}>\n <BitkitAvatar variant=\"image\" src={item.avatar} name={item.label} size={iconSize === '24' ? '32' : '24'} />\n </Box>\n )}\n <Box css={styles.itemContent}>\n <Box display=\"flex\" alignItems=\"center\" gap=\"8\">\n {Icon && !item.avatar && <Icon color=\"icon/primary\" size={iconSize} />}\n <Text css={styles.itemLabel}>{item.label}</Text>\n </Box>\n {item.helperText && <Text css={styles.itemHelperText}>{item.helperText}</Text>}\n </Box>\n <NS.ItemIndicator asChild>\n <IconCheck size={iconSize} css={styles.itemIndicator} />\n </NS.ItemIndicator>\n </NS.Item>\n );\n};\n\nexport default BitkitSelectMenu;\n"],"mappings":";;;;;;;;;;;;AAmDA,IAAM,mBAAmB,YAAmD,OAAO,QAAQ;CACzF,MAAM,EAAE,UAAU,YAAY,UAAU,UAAU,MAAM,GAAG,eAAe;CAC1E,MAAM,KAAK,YAAY,aAAa,WAAW;CAE/C,MAAM,SADS,cAAc,EAAE,KAAK,SAAS,CAC9B,CAAA,CAAO,EAAE,KAAK,CAAC;CAC9B,MAAM,WAAW,SAAS,OAAO,OAAO;CAExC,OACE,oBAAC,iBAAD;EACM;EACQ;EACZ,YAAY;EACF;EACV,aAAa,SAAS,oBAAC,gBAAD;GAAqC;GAAU;GAAgB;GAAkB;EAAS,GAArE,KAAK,KAAgE;EAC1G;EACE;EACR,GAAI;EAEH;CACc,CAAA;AAErB,CAAC;AAED,iBAAiB,cAAc;AAS/B,IAAM,kBAAkB,EAAE,IAAI,MAAM,UAAU,aAAwC;CACpF,MAAM,OAAO,KAAK;CAElB,IAAI,KAAK,SAGP,OACE,qBAAC,KAAD;EAAK,KAAK,OAAO;YAAjB,CACE,oBAAC,SAAD;GAAS,SAAQ;GAAS,KAAK,OAAO;EAAc,CAAA,GACpD,oBAAC,MAAD;GAAM,KAAK,OAAO;aAAkB;EAAgB,CAAA,CACjD;;CAIT,OACE,qBAAC,GAAG,MAAJ;EAAS,KAAK,OAAO;EAAY;YAAjC;GACG,KAAK,UACJ,oBAAC,KAAD;IAAK,aAAU;IAAS,KAAK,EAAE,qBAAqB,EAAE,SAAS,GAAI,EAAE;cACnE,oBAAC,cAAD;KAAc,SAAQ;KAAQ,KAAK,KAAK;KAAQ,MAAM,KAAK;KAAO,MAAM,aAAa,OAAO,OAAO;IAAO,CAAA;GACvG,CAAA;GAEP,qBAAC,KAAD;IAAK,KAAK,OAAO;cAAjB,CACE,qBAAC,KAAD;KAAK,SAAQ;KAAO,YAAW;KAAS,KAAI;eAA5C,CACG,QAAQ,CAAC,KAAK,UAAU,oBAAC,MAAD;MAAM,OAAM;MAAe,MAAM;KAAW,CAAA,GACrE,oBAAC,MAAD;MAAM,KAAK,OAAO;gBAAY,KAAK;KAAY,CAAA,CAC5C;QACJ,KAAK,cAAc,oBAAC,MAAD;KAAM,KAAK,OAAO;eAAiB,KAAK;IAAiB,CAAA,CAC1E;;GACL,oBAAC,GAAG,eAAJ;IAAkB,SAAA;cAChB,oBAAC,WAAD;KAAW,MAAM;KAAU,KAAK,OAAO;IAAgB,CAAA;GACvC,CAAA;EACX;;AAEb"}
@@ -1 +1 @@
1
- {"version":3,"file":"SelectMenuShell.js","names":[],"sources":["../../../lib/components/BitkitSelectMenu/SelectMenuShell.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { type ListCollection } from '@chakra-ui/react/collection';\nimport { type Combobox } from '@chakra-ui/react/combobox';\nimport { type Select, type SelectContentProps } from '@chakra-ui/react/select';\nimport { Spinner } from '@chakra-ui/react/spinner';\nimport { chakra, type SystemStyleObject } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { type ChangeEvent, isValidElement, type ReactNode, type Ref } from 'react';\n\nimport { IconCross, IconMagnifier } from '../../icons';\nimport BitkitGroupHeading from '../BitkitGroupHeading/BitkitGroupHeading';\nimport { type BitkitSelectMenuEmptyStateProps, type BitkitSelectMenuSearchProps } from './BitkitSelectMenu';\nimport { type BitkitSelectMenuActionChild, SelectMenuShellContextProvider } from './BitkitSelectMenuAction';\n\n/**\n * Internal shared shell for BitkitSelectMenu and BitkitMultiselectMenu.\n * Handles Content wrapper, search, loading, empty state, groups, and the action slot —\n * the caller only provides per-item rendering via renderItem and any sub-components\n * (e.g. <BitkitSelectMenu.Action />) via children.\n */\nexport type SelectMenuShellProps<T extends { value: string; group?: string }> = {\n NS: typeof Select | typeof Combobox;\n children?: BitkitSelectMenuActionChild;\n collection: ListCollection<T>;\n contentProps?: SelectContentProps;\n contentRef?: Ref<HTMLDivElement>;\n iconSize: '16' | '24';\n isLoading?: boolean;\n renderItem: (item: T) => ReactNode;\n size?: 'md' | 'lg';\n styles: Record<string, SystemStyleObject>;\n} & BitkitSelectMenuSearchProps &\n BitkitSelectMenuEmptyStateProps;\n\nexport const SelectMenuShell = <T extends { value: string; group?: string }>({\n NS,\n children,\n collection,\n contentProps,\n contentRef,\n emptyHelperText,\n emptyLabel = 'No matching options',\n iconSize,\n isLoading = false,\n onSearchChange,\n renderItem,\n searchValue,\n size,\n styles,\n}: SelectMenuShellProps<T>) => {\n const isEmpty = collection.size === 0;\n const hasAction = isValidElement(children);\n\n return (\n <SelectMenuShellContextProvider value={{ iconSize, styles }}>\n <NS.Content css={styles.content} ref={contentRef} {...contentProps}>\n {/*\n Without a search input, Zag's getInitialFocus (see @zag-js/dom-query) picks the first\n tabbable descendant as the menu's initial focus target — which would be the action\n slot, visually confusing. A hidden [data-autofocus] span wins over tabbables in\n getInitialFocus's querySelector, so we focus an invisible element instead and Zag's\n aria-activedescendant drives the highlight like a normal Select would.\n */}\n {!onSearchChange && hasAction && <span data-autofocus=\"\" tabIndex={-1} aria-hidden=\"true\" />}\n {onSearchChange && (\n <SelectMenuSearch\n iconSize={iconSize}\n styles={styles}\n value={searchValue ?? ''}\n onSearchChange={onSearchChange}\n />\n )}\n <Box css={styles.itemList}>\n {isLoading && (\n <Box display=\"flex\" alignItems=\"center\" gap=\"12\" justifyContent=\"left\" css={styles.item}>\n <Spinner variant=\"purple\" />\n <Text color=\"text/secondary\" textStyle={size === 'md' ? 'body/md/regular' : 'body/lg/regular'}>\n Loading...\n </Text>\n </Box>\n )}\n {!isLoading && isEmpty && (\n <Box css={styles.emptyState}>\n <Text css={styles.itemLabel}>{emptyLabel}</Text>\n {emptyHelperText && <Text css={styles.itemHelperText}>{emptyHelperText}</Text>}\n </Box>\n )}\n {!isLoading &&\n !isEmpty &&\n collection.group().map(([type, group]) => (\n <NS.ItemGroup key={type}>\n {type && (\n <NS.ItemGroupLabel asChild>\n <BitkitGroupHeading label={type} paddingBlock=\"12\" paddingInline=\"16\" />\n </NS.ItemGroupLabel>\n )}\n {group.map(renderItem)}\n </NS.ItemGroup>\n ))}\n </Box>\n {children}\n </NS.Content>\n </SelectMenuShellContextProvider>\n );\n};\n\ntype SelectMenuSearchProps = {\n iconSize: '16' | '24';\n onSearchChange: (searchText: string) => void;\n styles: Record<string, SystemStyleObject>;\n value: string;\n};\n\nconst SelectMenuSearch = ({ iconSize, onSearchChange, styles, value }: SelectMenuSearchProps) => (\n <Box css={styles.searchInputGroup}>\n <IconMagnifier size={iconSize} color=\"icon/tertiary\" />\n <chakra.input\n aria-label=\"Search\"\n css={styles.searchInput}\n placeholder=\"Search...\"\n value={value}\n onChange={(event: ChangeEvent<HTMLInputElement>) => onSearchChange(event.target.value)}\n onKeyDown={(event) => {\n // Zag's Select.Content keyDown listener fires ITEM.CLICK + preventDefault on Space\n // regardless of which descendant is focused. That would eat the space before the\n // input can type it. Enter is left alone so \"type-then-Enter-to-select\" still works.\n if (event.key === ' ') event.stopPropagation();\n }}\n />\n {value && (\n <chakra.button\n type=\"button\"\n css={styles.searchClear}\n aria-label=\"Clear search\"\n onClick={() => onSearchChange('')}\n >\n <IconCross size={iconSize} />\n </chakra.button>\n )}\n </Box>\n);\n"],"mappings":";;;;;;;;;;;AAkCA,IAAa,mBAAgE,EAC3E,IACA,UACA,YACA,cACA,YACA,iBACA,aAAa,uBACb,UACA,YAAY,OACZ,gBACA,YACA,aACA,MACA,aAC6B;CAC7B,MAAM,UAAU,WAAW,SAAS;CACpC,MAAM,YAAY,eAAe,QAAQ;CAEzC,OACE,oBAAC,gCAAD;EAAgC,OAAO;GAAE;GAAU;EAAO;YACxD,qBAAC,GAAG,SAAJ;GAAY,KAAK,OAAO;GAAS,KAAK;GAAY,GAAI;aAAtD;IAQG,CAAC,kBAAkB,aAAa,oBAAC,QAAD;KAAM,kBAAe;KAAG,UAAU;KAAI,eAAY;IAAQ,CAAA;IAC1F,kBACC,oBAAC,kBAAD;KACY;KACF;KACR,OAAO,eAAe;KACN;IACjB,CAAA;IAEH,qBAAC,KAAD;KAAK,KAAK,OAAO;eAAjB;MACG,aACC,qBAAC,KAAD;OAAK,SAAQ;OAAO,YAAW;OAAS,KAAI;OAAK,gBAAe;OAAO,KAAK,OAAO;iBAAnF,CACE,oBAAC,SAAD,EAAS,SAAQ,SAAU,CAAA,GAC3B,oBAAC,MAAD;QAAM,OAAM;QAAiB,WAAW,SAAS,OAAO,oBAAoB;kBAAmB;OAEzF,CAAA,CACH;;MAEN,CAAC,aAAa,WACb,qBAAC,KAAD;OAAK,KAAK,OAAO;iBAAjB,CACE,oBAAC,MAAD;QAAM,KAAK,OAAO;kBAAY;OAAiB,CAAA,GAC9C,mBAAmB,oBAAC,MAAD;QAAM,KAAK,OAAO;kBAAiB;OAAsB,CAAA,CAC1E;;MAEN,CAAC,aACA,CAAC,WACD,WAAW,MAAM,EAAE,KAAK,CAAC,MAAM,WAC7B,qBAAC,GAAG,WAAJ,EAAA,UAAA,CACG,QACC,oBAAC,GAAG,gBAAJ;OAAmB,SAAA;iBACjB,oBAAC,oBAAD;QAAoB,OAAO;QAAM,cAAa;QAAK,eAAc;OAAM,CAAA;MACtD,CAAA,GAEpB,MAAM,IAAI,UAAU,CACT,EAAA,GAPK,IAOL,CACf;KACA;;IACJ;GACS;;CACkB,CAAA;AAEpC;AASA,IAAM,oBAAoB,EAAE,UAAU,gBAAgB,QAAQ,YAC5D,qBAAC,KAAD;CAAK,KAAK,OAAO;WAAjB;EACE,oBAAC,eAAD;GAAe,MAAM;GAAU,OAAM;EAAiB,CAAA;EACtD,oBAAC,OAAO,OAAR;GACE,cAAW;GACX,KAAK,OAAO;GACZ,aAAY;GACL;GACP,WAAW,UAAyC,eAAe,MAAM,OAAO,KAAK;GACrF,YAAY,UAAU;IAIpB,IAAI,MAAM,QAAQ,KAAK,MAAM,gBAAgB;GAC/C;EACD,CAAA;EACA,SACC,oBAAC,OAAO,QAAR;GACE,MAAK;GACL,KAAK,OAAO;GACZ,cAAW;GACX,eAAe,eAAe,EAAE;aAEhC,oBAAC,WAAD,EAAW,MAAM,SAAW,CAAA;EACf,CAAA;CAEd"}
1
+ {"version":3,"file":"SelectMenuShell.js","names":[],"sources":["../../../lib/components/BitkitSelectMenu/SelectMenuShell.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { type ListCollection } from '@chakra-ui/react/collection';\nimport { type Combobox } from '@chakra-ui/react/combobox';\nimport { type Select, type SelectContentProps } from '@chakra-ui/react/select';\nimport { Spinner } from '@chakra-ui/react/spinner';\nimport { chakra, type SystemStyleObject } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { type ChangeEvent, isValidElement, type ReactNode, type Ref } from 'react';\n\nimport { IconCross, IconMagnifier } from '../../icons';\nimport BitkitGroupHeading from '../BitkitGroupHeading/BitkitGroupHeading';\nimport { type BitkitSelectMenuEmptyStateProps, type BitkitSelectMenuSearchProps } from './BitkitSelectMenu';\nimport { type BitkitSelectMenuActionChild, SelectMenuShellContextProvider } from './BitkitSelectMenuAction';\n\n/**\n * Internal shared shell for BitkitSelectMenu and BitkitMultiselectMenu.\n * Handles Content wrapper, search, loading, empty state, groups, and the action slot —\n * the caller only provides per-item rendering via renderItem and any sub-components\n * (e.g. <BitkitSelectMenu.Action />) via children.\n */\nexport type SelectMenuShellProps<T extends { value: string; group?: string }> = {\n NS: typeof Select | typeof Combobox;\n children?: BitkitSelectMenuActionChild;\n collection: ListCollection<T>;\n contentProps?: SelectContentProps;\n contentRef?: Ref<HTMLDivElement>;\n iconSize: '16' | '24';\n isLoading?: boolean;\n renderItem: (item: T) => ReactNode;\n size?: 'md' | 'lg';\n styles: Record<string, SystemStyleObject>;\n} & BitkitSelectMenuSearchProps &\n BitkitSelectMenuEmptyStateProps;\n\nexport const SelectMenuShell = <T extends { value: string; group?: string }>({\n NS,\n children,\n collection,\n contentProps,\n contentRef,\n emptyHelperText,\n emptyLabel = 'No matching options',\n iconSize,\n isLoading = false,\n onSearchChange,\n renderItem,\n searchValue,\n size,\n styles,\n}: SelectMenuShellProps<T>) => {\n const isEmpty = collection.size === 0;\n const hasAction = isValidElement(children);\n\n return (\n <SelectMenuShellContextProvider value={{ iconSize, styles }}>\n <NS.Content css={styles.content} ref={contentRef} {...contentProps}>\n {/*\n Without a search input, Zag's getInitialFocus (see @zag-js/dom-query) picks the first\n tabbable descendant as the menu's initial focus target — which would be the action\n slot, visually confusing. A hidden [data-autofocus] span wins over tabbables in\n getInitialFocus's querySelector, so we focus an invisible element instead and Zag's\n aria-activedescendant drives the highlight like a normal Select would.\n */}\n {!onSearchChange && hasAction && <span data-autofocus=\"\" tabIndex={-1} aria-hidden=\"true\" />}\n {onSearchChange && (\n <SelectMenuSearch\n iconSize={iconSize}\n styles={styles}\n value={searchValue ?? ''}\n onSearchChange={onSearchChange}\n />\n )}\n <Box css={styles.itemList}>\n {isLoading && (\n <Box display=\"flex\" alignItems=\"center\" gap=\"12\" justifyContent=\"left\" css={styles.item}>\n <Spinner variant=\"purple\" />\n <Text color=\"text/secondary\" textStyle={size === 'md' ? 'body/md/regular' : 'body/lg/regular'}>\n Loading...\n </Text>\n </Box>\n )}\n {!isLoading && isEmpty && (\n <Box css={styles.emptyState}>\n <Text css={styles.itemLabel}>{emptyLabel}</Text>\n {emptyHelperText && <Text css={styles.itemHelperText}>{emptyHelperText}</Text>}\n </Box>\n )}\n {!isLoading &&\n !isEmpty &&\n collection.group().map(([type, group]) => (\n <NS.ItemGroup key={type}>\n {type && (\n <NS.ItemGroupLabel asChild>\n <BitkitGroupHeading label={type} paddingBlock=\"12\" paddingInline=\"16\" />\n </NS.ItemGroupLabel>\n )}\n {group.map(renderItem)}\n </NS.ItemGroup>\n ))}\n </Box>\n {children}\n </NS.Content>\n </SelectMenuShellContextProvider>\n );\n};\n\ntype SelectMenuSearchProps = {\n iconSize: '16' | '24';\n onSearchChange: (searchText: string) => void;\n styles: Record<string, SystemStyleObject>;\n value: string;\n};\n\nconst SelectMenuSearch = ({ iconSize, onSearchChange, styles, value }: SelectMenuSearchProps) => (\n <Box css={styles.searchInputGroup}>\n <IconMagnifier size={iconSize} color=\"icon/tertiary\" />\n <chakra.input\n aria-label=\"Search\"\n css={styles.searchInput}\n placeholder=\"Search...\"\n value={value}\n onChange={(event: ChangeEvent<HTMLInputElement>) => onSearchChange(event.target.value)}\n onKeyDown={(event) => {\n // Zag's Select.Content keyDown listener fires ITEM.CLICK + preventDefault on Space\n // regardless of which descendant is focused. That would eat the space before the\n // input can type it. Enter is left alone so \"type-then-Enter-to-select\" still works.\n if (event.key === ' ') event.stopPropagation();\n }}\n />\n {value && (\n <chakra.button\n type=\"button\"\n css={styles.searchClear}\n aria-label=\"Clear search\"\n onClick={() => onSearchChange('')}\n >\n <IconCross size={iconSize} />\n </chakra.button>\n )}\n </Box>\n);\n"],"mappings":";;;;;;;;;;;AAkCA,IAAa,mBAAgE,EAC3E,IACA,UACA,YACA,cACA,YACA,iBACA,aAAa,uBACb,UACA,YAAY,OACZ,gBACA,YACA,aACA,MACA,aAC6B;CAC7B,MAAM,UAAU,WAAW,SAAS;CACpC,MAAM,YAAY,eAAe,QAAQ;CAEzC,OACE,oBAAC,gCAAD;EAAgC,OAAO;GAAE;GAAU;EAAO;YACxD,qBAAC,GAAG,SAAJ;GAAY,KAAK,OAAO;GAAS,KAAK;GAAY,GAAI;aAAtD;IAQG,CAAC,kBAAkB,aAAa,oBAAC,QAAD;KAAM,kBAAe;KAAG,UAAU;KAAI,eAAY;IAAQ,CAAA;IAC1F,kBACC,oBAAC,kBAAD;KACY;KACF;KACR,OAAO,eAAe;KACN;IACjB,CAAA;IAEH,qBAAC,KAAD;KAAK,KAAK,OAAO;eAAjB;MACG,aACC,qBAAC,KAAD;OAAK,SAAQ;OAAO,YAAW;OAAS,KAAI;OAAK,gBAAe;OAAO,KAAK,OAAO;iBAAnF,CACE,oBAAC,SAAD,EAAS,SAAQ,SAAU,CAAA,GAC3B,oBAAC,MAAD;QAAM,OAAM;QAAiB,WAAW,SAAS,OAAO,oBAAoB;kBAAmB;OAEzF,CAAA,CACH;;MAEN,CAAC,aAAa,WACb,qBAAC,KAAD;OAAK,KAAK,OAAO;iBAAjB,CACE,oBAAC,MAAD;QAAM,KAAK,OAAO;kBAAY;OAAiB,CAAA,GAC9C,mBAAmB,oBAAC,MAAD;QAAM,KAAK,OAAO;kBAAiB;OAAsB,CAAA,CAC1E;;MAEN,CAAC,aACA,CAAC,WACD,WAAW,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,WAC7B,qBAAC,GAAG,WAAJ,EAAA,UAAA,CACG,QACC,oBAAC,GAAG,gBAAJ;OAAmB,SAAA;iBACjB,oBAAC,oBAAD;QAAoB,OAAO;QAAM,cAAa;QAAK,eAAc;OAAM,CAAA;MACtD,CAAA,GAEpB,MAAM,IAAI,UAAU,CACT,EAAA,GAPK,IAOL,CACf;KACA;;IACJ;GACS;;CACkB,CAAA;AAEpC;AASA,IAAM,oBAAoB,EAAE,UAAU,gBAAgB,QAAQ,YAC5D,qBAAC,KAAD;CAAK,KAAK,OAAO;WAAjB;EACE,oBAAC,eAAD;GAAe,MAAM;GAAU,OAAM;EAAiB,CAAA;EACtD,oBAAC,OAAO,OAAR;GACE,cAAW;GACX,KAAK,OAAO;GACZ,aAAY;GACL;GACP,WAAW,UAAyC,eAAe,MAAM,OAAO,KAAK;GACrF,YAAY,UAAU;IAIpB,IAAI,MAAM,QAAQ,KAAK,MAAM,gBAAgB;GAC/C;EACD,CAAA;EACA,SACC,oBAAC,OAAO,QAAR;GACE,MAAK;GACL,KAAK,OAAO;GACZ,cAAW;GACX,eAAe,eAAe,EAAE;aAEhC,oBAAC,WAAD,EAAW,MAAM,SAAW,CAAA;EACf,CAAA;CAEd"}
@@ -1 +1 @@
1
- {"version":3,"file":"BitkitSelectableTag.js","names":[],"sources":["../../../lib/components/BitkitSelectableTag/BitkitSelectableTag.tsx"],"sourcesContent":["import { Checkbox, type CheckboxCheckedChangeDetails, type CheckboxGroupProps } from '@chakra-ui/react/checkbox';\nimport { useRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport { withSubComponents } from '../../utilities/withSubComponents';\n\n// --- Root (Group) ---\n\nexport interface BitkitSelectableTagProps extends Omit<CheckboxGroupProps, 'disabled'> {\n state?: 'disabled';\n}\n\nconst BitkitSelectableTag = forwardRef<HTMLDivElement, BitkitSelectableTagProps>((props, ref) => {\n const { children, state, ...rest } = props;\n const disabled = state === 'disabled';\n\n return (\n <Checkbox.Group ref={ref} disabled={disabled} gap=\"8\" flexDirection=\"row\" flexWrap=\"wrap\" {...rest}>\n {children}\n </Checkbox.Group>\n );\n});\n\nBitkitSelectableTag.displayName = 'BitkitSelectableTag';\n\n// --- Item ---\n\nexport interface BitkitSelectableTagItemProps {\n children: string;\n defaultChecked?: boolean;\n disabled?: boolean;\n icon?: BitkitIconComponent;\n onCheckedChange?: (details: CheckboxCheckedChangeDetails) => void;\n value: string;\n}\n\nconst BitkitSelectableTagItem = forwardRef<HTMLInputElement, BitkitSelectableTagItemProps>((props, ref) => {\n const { children, defaultChecked, disabled, icon: Icon, onCheckedChange, value } = props;\n const style = useRecipe({ key: 'selectableTag' })();\n\n return (\n <Checkbox.Root\n css={style}\n defaultChecked={defaultChecked}\n disabled={disabled}\n onCheckedChange={onCheckedChange}\n unstyled\n value={value}\n >\n <Checkbox.HiddenInput ref={ref} />\n {!!Icon && <Icon size=\"16\" />}\n {children}\n </Checkbox.Root>\n );\n});\n\nBitkitSelectableTagItem.displayName = 'BitkitSelectableTagItem';\n\nexport default withSubComponents(BitkitSelectableTag, {\n Item: BitkitSelectableTagItem,\n});\n"],"mappings":";;;;;;AAaA,IAAM,sBAAsB,YAAsD,OAAO,QAAQ;CAC/F,MAAM,EAAE,UAAU,OAAO,GAAG,SAAS;CACrC,MAAM,WAAW,UAAU;CAE3B,OACE,oBAAC,SAAS,OAAV;EAAqB;EAAe;EAAU,KAAI;EAAI,eAAc;EAAM,UAAS;EAAO,GAAI;EAC3F;CACa,CAAA;AAEpB,CAAC;AAED,oBAAoB,cAAc;AAalC,IAAM,0BAA0B,YAA4D,OAAO,QAAQ;CACzG,MAAM,EAAE,UAAU,gBAAgB,UAAU,MAAM,MAAM,iBAAiB,UAAU;CACnF,MAAM,QAAQ,UAAU,EAAE,KAAK,gBAAgB,CAAC,EAAE;CAElD,OACE,qBAAC,SAAS,MAAV;EACE,KAAK;EACW;EACN;EACO;EACjB,UAAA;EACO;YANT;GAQE,oBAAC,SAAS,aAAV,EAA2B,IAAM,CAAA;GAChC,CAAC,CAAC,QAAQ,oBAAC,MAAD,EAAM,MAAK,KAAM,CAAA;GAC3B;EACY;;AAEnB,CAAC;AAED,wBAAwB,cAAc;AAEtC,IAAA,8BAAe,kBAAkB,qBAAqB,EACpD,MAAM,wBACR,CAAC"}
1
+ {"version":3,"file":"BitkitSelectableTag.js","names":[],"sources":["../../../lib/components/BitkitSelectableTag/BitkitSelectableTag.tsx"],"sourcesContent":["import { Checkbox, type CheckboxCheckedChangeDetails, type CheckboxGroupProps } from '@chakra-ui/react/checkbox';\nimport { useRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport { withSubComponents } from '../../utilities/withSubComponents';\n\n// --- Root (Group) ---\n\nexport interface BitkitSelectableTagProps extends Omit<CheckboxGroupProps, 'disabled'> {\n state?: 'disabled';\n}\n\nconst BitkitSelectableTag = forwardRef<HTMLDivElement, BitkitSelectableTagProps>((props, ref) => {\n const { children, state, ...rest } = props;\n const disabled = state === 'disabled';\n\n return (\n <Checkbox.Group ref={ref} disabled={disabled} gap=\"8\" flexDirection=\"row\" flexWrap=\"wrap\" {...rest}>\n {children}\n </Checkbox.Group>\n );\n});\n\nBitkitSelectableTag.displayName = 'BitkitSelectableTag';\n\n// --- Item ---\n\nexport interface BitkitSelectableTagItemProps {\n children: string;\n defaultChecked?: boolean;\n disabled?: boolean;\n icon?: BitkitIconComponent;\n onCheckedChange?: (details: CheckboxCheckedChangeDetails) => void;\n value: string;\n}\n\nconst BitkitSelectableTagItem = forwardRef<HTMLInputElement, BitkitSelectableTagItemProps>((props, ref) => {\n const { children, defaultChecked, disabled, icon: Icon, onCheckedChange, value } = props;\n const style = useRecipe({ key: 'selectableTag' })();\n\n return (\n <Checkbox.Root\n css={style}\n defaultChecked={defaultChecked}\n disabled={disabled}\n onCheckedChange={onCheckedChange}\n unstyled\n value={value}\n >\n <Checkbox.HiddenInput ref={ref} />\n {!!Icon && <Icon size=\"16\" />}\n {children}\n </Checkbox.Root>\n );\n});\n\nBitkitSelectableTagItem.displayName = 'BitkitSelectableTagItem';\n\nexport default withSubComponents(BitkitSelectableTag, {\n Item: BitkitSelectableTagItem,\n});\n"],"mappings":";;;;;;AAaA,IAAM,sBAAsB,YAAsD,OAAO,QAAQ;CAC/F,MAAM,EAAE,UAAU,OAAO,GAAG,SAAS;CACrC,MAAM,WAAW,UAAU;CAE3B,OACE,oBAAC,SAAS,OAAV;EAAqB;EAAe;EAAU,KAAI;EAAI,eAAc;EAAM,UAAS;EAAO,GAAI;EAC3F;CACa,CAAA;AAEpB,CAAC;AAED,oBAAoB,cAAc;AAalC,IAAM,0BAA0B,YAA4D,OAAO,QAAQ;CACzG,MAAM,EAAE,UAAU,gBAAgB,UAAU,MAAM,MAAM,iBAAiB,UAAU;CACnF,MAAM,QAAQ,UAAU,EAAE,KAAK,gBAAgB,CAAC,CAAC,CAAC;CAElD,OACE,qBAAC,SAAS,MAAV;EACE,KAAK;EACW;EACN;EACO;EACjB,UAAA;EACO;YANT;GAQE,oBAAC,SAAS,aAAV,EAA2B,IAAM,CAAA;GAChC,CAAC,CAAC,QAAQ,oBAAC,MAAD,EAAM,MAAK,KAAM,CAAA;GAC3B;EACY;;AAEnB,CAAC;AAED,wBAAwB,cAAc;AAEtC,IAAA,8BAAe,kBAAkB,qBAAqB,EACpD,MAAM,wBACR,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"BitkitSettingsCard.js","names":[],"sources":["../../../lib/components/BitkitSettingsCard/BitkitSettingsCard.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { Card, type CardBodyProps, type CardFooterProps, type CardRootProps } from '@chakra-ui/react/card';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport { withSubComponents } from '../../utilities/withSubComponents';\n\nconst useSettingsCardStyles = () => {\n const recipe = useSlotRecipe({ key: 'settingsCard' });\n return recipe();\n};\n\n// --- Root ---\n\nexport interface BitkitSettingsCardProps extends Omit<CardRootProps, 'children'> {\n children: ReactNode;\n}\n\nconst BitkitSettingsCard = forwardRef<HTMLDivElement, BitkitSettingsCardProps>((props, ref) => {\n const { children, ...rest } = props;\n const styles = useSettingsCardStyles();\n\n return (\n <Card.Root ref={ref} elevation={false} paddingSize=\"md\" css={styles.root} {...rest}>\n {children}\n </Card.Root>\n );\n});\n\nBitkitSettingsCard.displayName = 'BitkitSettingsCard';\n\n// --- Content ---\n\nexport interface BitkitSettingsCardContentProps extends Omit<CardBodyProps, 'children'> {\n actions?: ReactNode;\n children: ReactNode;\n}\n\nconst Content = forwardRef<HTMLDivElement, BitkitSettingsCardContentProps>((props, ref) => {\n const { actions, children, ...rest } = props;\n const styles = useSettingsCardStyles();\n\n return (\n <Card.Body ref={ref} css={styles.content} {...rest}>\n <Box css={styles.contentBody}>{children}</Box>\n {actions && <Box css={styles.contentActions}>{actions}</Box>}\n </Card.Body>\n );\n});\n\nContent.displayName = 'BitkitSettingsCard.Content';\n\n// --- Status ---\n\nexport interface BitkitSettingsCardStatusProps extends Omit<BoxProps, 'children' | 'colorPalette'> {\n description?: string;\n helperText?: ReactNode;\n icon: BitkitIconComponent;\n iconColor?: string;\n statusText: string;\n}\n\nconst Status = forwardRef<HTMLDivElement, BitkitSettingsCardStatusProps>((props, ref) => {\n const { description, helperText, icon: Icon, iconColor, statusText, ...rest } = props;\n const styles = useSettingsCardStyles();\n\n return (\n <Box ref={ref} role=\"status\" {...rest}>\n <Box css={styles.statusRow}>\n <Icon color={iconColor} css={styles.statusIcon} size=\"16\" />\n <Box>\n <Text as=\"strong\" css={styles.statusText}>\n {statusText}\n </Text>\n {description && (\n <Text as=\"p\" css={styles.statusDescription}>\n {description}\n </Text>\n )}\n </Box>\n </Box>\n {helperText && <Text css={styles.statusHelperText}>{helperText}</Text>}\n </Box>\n );\n});\n\nStatus.displayName = 'BitkitSettingsCard.Status';\n\n// --- Footer ---\n\nconst Footer = forwardRef<HTMLDivElement, CardFooterProps>((props, ref) => {\n const styles = useSettingsCardStyles();\n return <Card.Footer ref={ref} css={styles.footer} {...props} />;\n});\n\nFooter.displayName = 'BitkitSettingsCard.Footer';\n\n// --- Compound export ---\n\nexport default withSubComponents(BitkitSettingsCard, {\n Content,\n Footer,\n Status,\n});\n"],"mappings":";;;;;;;;AASA,IAAM,8BAA8B;CAElC,OADe,cAAc,EAAE,KAAK,eAAe,CAC5C,EAAO;AAChB;AAQA,IAAM,qBAAqB,YAAqD,OAAO,QAAQ;CAC7F,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,sBAAsB;CAErC,OACE,oBAAC,KAAK,MAAN;EAAgB;EAAK,WAAW;EAAO,aAAY;EAAK,KAAK,OAAO;EAAM,GAAI;EAC3E;CACQ,CAAA;AAEf,CAAC;AAED,mBAAmB,cAAc;AASjC,IAAM,UAAU,YAA4D,OAAO,QAAQ;CACzF,MAAM,EAAE,SAAS,UAAU,GAAG,SAAS;CACvC,MAAM,SAAS,sBAAsB;CAErC,OACE,qBAAC,KAAK,MAAN;EAAgB;EAAK,KAAK,OAAO;EAAS,GAAI;YAA9C,CACE,oBAAC,KAAD;GAAK,KAAK,OAAO;GAAc;EAAc,CAAA,GAC5C,WAAW,oBAAC,KAAD;GAAK,KAAK,OAAO;aAAiB;EAAa,CAAA,CAClD;;AAEf,CAAC;AAED,QAAQ,cAAc;AAYtB,IAAM,SAAS,YAA2D,OAAO,QAAQ;CACvF,MAAM,EAAE,aAAa,YAAY,MAAM,MAAM,WAAW,YAAY,GAAG,SAAS;CAChF,MAAM,SAAS,sBAAsB;CAErC,OACE,qBAAC,KAAD;EAAU;EAAK,MAAK;EAAS,GAAI;YAAjC,CACE,qBAAC,KAAD;GAAK,KAAK,OAAO;aAAjB,CACE,oBAAC,MAAD;IAAM,OAAO;IAAW,KAAK,OAAO;IAAY,MAAK;GAAM,CAAA,GAC3D,qBAAC,KAAD,EAAA,UAAA,CACE,oBAAC,MAAD;IAAM,IAAG;IAAS,KAAK,OAAO;cAC3B;GACG,CAAA,GACL,eACC,oBAAC,MAAD;IAAM,IAAG;IAAI,KAAK,OAAO;cACtB;GACG,CAAA,CAEL,EAAA,CAAA,CACF;MACJ,cAAc,oBAAC,MAAD;GAAM,KAAK,OAAO;aAAmB;EAAiB,CAAA,CAClE;;AAET,CAAC;AAED,OAAO,cAAc;AAIrB,IAAM,SAAS,YAA6C,OAAO,QAAQ;CACzE,MAAM,SAAS,sBAAsB;CACrC,OAAO,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;CAAQ,CAAA;AAChE,CAAC;AAED,OAAO,cAAc;AAIrB,IAAA,6BAAe,kBAAkB,oBAAoB;CACnD;CACA;CACA;AACF,CAAC"}
1
+ {"version":3,"file":"BitkitSettingsCard.js","names":[],"sources":["../../../lib/components/BitkitSettingsCard/BitkitSettingsCard.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { Card, type CardBodyProps, type CardFooterProps, type CardRootProps } from '@chakra-ui/react/card';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport { withSubComponents } from '../../utilities/withSubComponents';\n\nconst useSettingsCardStyles = () => {\n const recipe = useSlotRecipe({ key: 'settingsCard' });\n return recipe();\n};\n\n// --- Root ---\n\nexport interface BitkitSettingsCardProps extends Omit<CardRootProps, 'children'> {\n children: ReactNode;\n}\n\nconst BitkitSettingsCard = forwardRef<HTMLDivElement, BitkitSettingsCardProps>((props, ref) => {\n const { children, ...rest } = props;\n const styles = useSettingsCardStyles();\n\n return (\n <Card.Root ref={ref} elevation={false} paddingSize=\"md\" css={styles.root} {...rest}>\n {children}\n </Card.Root>\n );\n});\n\nBitkitSettingsCard.displayName = 'BitkitSettingsCard';\n\n// --- Content ---\n\nexport interface BitkitSettingsCardContentProps extends Omit<CardBodyProps, 'children'> {\n actions?: ReactNode;\n children: ReactNode;\n}\n\nconst Content = forwardRef<HTMLDivElement, BitkitSettingsCardContentProps>((props, ref) => {\n const { actions, children, ...rest } = props;\n const styles = useSettingsCardStyles();\n\n return (\n <Card.Body ref={ref} css={styles.content} {...rest}>\n <Box css={styles.contentBody}>{children}</Box>\n {actions && <Box css={styles.contentActions}>{actions}</Box>}\n </Card.Body>\n );\n});\n\nContent.displayName = 'BitkitSettingsCard.Content';\n\n// --- Status ---\n\nexport interface BitkitSettingsCardStatusProps extends Omit<BoxProps, 'children' | 'colorPalette'> {\n description?: string;\n helperText?: ReactNode;\n icon: BitkitIconComponent;\n iconColor?: string;\n statusText: string;\n}\n\nconst Status = forwardRef<HTMLDivElement, BitkitSettingsCardStatusProps>((props, ref) => {\n const { description, helperText, icon: Icon, iconColor, statusText, ...rest } = props;\n const styles = useSettingsCardStyles();\n\n return (\n <Box ref={ref} role=\"status\" {...rest}>\n <Box css={styles.statusRow}>\n <Icon color={iconColor} css={styles.statusIcon} size=\"16\" />\n <Box>\n <Text as=\"strong\" css={styles.statusText}>\n {statusText}\n </Text>\n {description && (\n <Text as=\"p\" css={styles.statusDescription}>\n {description}\n </Text>\n )}\n </Box>\n </Box>\n {helperText && <Text css={styles.statusHelperText}>{helperText}</Text>}\n </Box>\n );\n});\n\nStatus.displayName = 'BitkitSettingsCard.Status';\n\n// --- Footer ---\n\nconst Footer = forwardRef<HTMLDivElement, CardFooterProps>((props, ref) => {\n const styles = useSettingsCardStyles();\n return <Card.Footer ref={ref} css={styles.footer} {...props} />;\n});\n\nFooter.displayName = 'BitkitSettingsCard.Footer';\n\n// --- Compound export ---\n\nexport default withSubComponents(BitkitSettingsCard, {\n Content,\n Footer,\n Status,\n});\n"],"mappings":";;;;;;;;AASA,IAAM,8BAA8B;CAElC,OADe,cAAc,EAAE,KAAK,eAAe,CAC5C,CAAA,CAAO;AAChB;AAQA,IAAM,qBAAqB,YAAqD,OAAO,QAAQ;CAC7F,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,sBAAsB;CAErC,OACE,oBAAC,KAAK,MAAN;EAAgB;EAAK,WAAW;EAAO,aAAY;EAAK,KAAK,OAAO;EAAM,GAAI;EAC3E;CACQ,CAAA;AAEf,CAAC;AAED,mBAAmB,cAAc;AASjC,IAAM,UAAU,YAA4D,OAAO,QAAQ;CACzF,MAAM,EAAE,SAAS,UAAU,GAAG,SAAS;CACvC,MAAM,SAAS,sBAAsB;CAErC,OACE,qBAAC,KAAK,MAAN;EAAgB;EAAK,KAAK,OAAO;EAAS,GAAI;YAA9C,CACE,oBAAC,KAAD;GAAK,KAAK,OAAO;GAAc;EAAc,CAAA,GAC5C,WAAW,oBAAC,KAAD;GAAK,KAAK,OAAO;aAAiB;EAAa,CAAA,CAClD;;AAEf,CAAC;AAED,QAAQ,cAAc;AAYtB,IAAM,SAAS,YAA2D,OAAO,QAAQ;CACvF,MAAM,EAAE,aAAa,YAAY,MAAM,MAAM,WAAW,YAAY,GAAG,SAAS;CAChF,MAAM,SAAS,sBAAsB;CAErC,OACE,qBAAC,KAAD;EAAU;EAAK,MAAK;EAAS,GAAI;YAAjC,CACE,qBAAC,KAAD;GAAK,KAAK,OAAO;aAAjB,CACE,oBAAC,MAAD;IAAM,OAAO;IAAW,KAAK,OAAO;IAAY,MAAK;GAAM,CAAA,GAC3D,qBAAC,KAAD,EAAA,UAAA,CACE,oBAAC,MAAD;IAAM,IAAG;IAAS,KAAK,OAAO;cAC3B;GACG,CAAA,GACL,eACC,oBAAC,MAAD;IAAM,IAAG;IAAI,KAAK,OAAO;cACtB;GACG,CAAA,CAEL,EAAA,CAAA,CACF;MACJ,cAAc,oBAAC,MAAD;GAAM,KAAK,OAAO;aAAmB;EAAiB,CAAA,CAClE;;AAET,CAAC;AAED,OAAO,cAAc;AAIrB,IAAM,SAAS,YAA6C,OAAO,QAAQ;CACzE,MAAM,SAAS,sBAAsB;CACrC,OAAO,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;CAAQ,CAAA;AAChE,CAAC;AAED,OAAO,cAAc;AAIrB,IAAA,6BAAe,kBAAkB,oBAAoB;CACnD;CACA;CACA;AACF,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"BitkitSidebar.js","names":[],"sources":["../../../lib/components/BitkitSidebar/BitkitSidebar.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { Separator } from '@chakra-ui/react/separator';\nimport { chakra, type HTMLChakraProps, useRecipe, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport IconChevronLeft from '../../icons/IconChevronLeft';\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport BitkitGroupHeading, { type BitkitGroupHeadingProps } from '../BitkitGroupHeading/BitkitGroupHeading';\nimport BitkitLabelTooltip from '../BitkitLabelTooltip/BitkitLabelTooltip';\n\n// ----- BitkitSidebar (Root) -----\n\nexport interface BitkitSidebarProps extends BoxProps {\n children: ReactNode;\n}\n\nconst BitkitSidebar = forwardRef<HTMLElement, BitkitSidebarProps>((props, ref) => {\n const { children, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n\n return (\n <Box ref={ref} asChild css={styles.root} {...rest}>\n <nav>{children}</nav>\n </Box>\n );\n});\n\nBitkitSidebar.displayName = 'BitkitSidebar';\n\n// ----- BitkitSidebar.Item -----\n\ninterface BitkitSidebarItemCommonProps {\n badge?: ReactNode;\n children: ReactNode;\n icon?: BitkitIconComponent;\n selected?: boolean;\n suffixIcon?: BitkitIconComponent;\n}\n\ninterface BitkitSidebarItemLinkProps extends Omit<HTMLChakraProps<'a'>, 'children'>, BitkitSidebarItemCommonProps {\n href: string;\n}\n\ninterface BitkitSidebarItemButtonProps\n extends Omit<HTMLChakraProps<'button'>, 'children'>, BitkitSidebarItemCommonProps {\n href?: never;\n}\n\nexport type BitkitSidebarItemProps = BitkitSidebarItemButtonProps | BitkitSidebarItemLinkProps;\n\nconst BitkitSidebarItem = forwardRef<HTMLButtonElement & HTMLAnchorElement, BitkitSidebarItemProps>((props, ref) => {\n const { badge, children, icon: Icon, selected, suffixIcon: SuffixIcon, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe({ selected });\n\n const itemContent = (\n <>\n {Icon && <Icon css={styles.itemIcon} size=\"24\" />}\n <chakra.span css={styles.itemLabel}>{children}</chakra.span>\n {badge}\n {SuffixIcon && <SuffixIcon css={styles.suffixIcon} size=\"24\" />}\n <chakra.div css={styles.selectionMarker} />\n </>\n );\n\n if (rest.href !== undefined) {\n const { className, ...linkRest } = rest;\n return (\n <chakra.a\n ref={ref}\n {...linkRest}\n aria-current={selected ? 'page' : undefined}\n className={className ? `group ${className}` : 'group'}\n css={styles.item}\n >\n {itemContent}\n </chakra.a>\n );\n }\n\n const { className, href: _, ...buttonRest } = rest;\n return (\n <chakra.button\n ref={ref}\n {...buttonRest}\n aria-pressed={selected}\n className={className ? `group ${className}` : 'group'}\n css={styles.item}\n type=\"button\"\n >\n {itemContent}\n </chakra.button>\n );\n});\n\nBitkitSidebarItem.displayName = 'BitkitSidebarItem';\n\n// ----- BitkitSidebar.Title -----\n\nexport interface BitkitSidebarTitleProps extends BoxProps {\n backHref?: string;\n backLabel?: string;\n children: ReactNode;\n onBackClick?: () => void;\n}\n\nconst BitkitSidebarTitle = forwardRef<HTMLDivElement, BitkitSidebarTitleProps>((props, ref) => {\n const { backHref, backLabel = 'Back', children, onBackClick, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n const controlButtonRecipe = useRecipe({ key: 'controlButton' });\n\n const hasBack = !!backHref || !!onBackClick;\n\n const BackElement = onBackClick ? chakra.button : chakra.a;\n\n return (\n <Box ref={ref} css={hasBack ? styles.titleWithBack : styles.title} {...rest}>\n {hasBack && (\n <BitkitLabelTooltip text={backLabel}>\n <BackElement\n aria-label={backLabel}\n css={controlButtonRecipe({ size: 'sm' })}\n {...(onBackClick ? { onClick: onBackClick, type: 'button' as const } : { href: backHref })}\n >\n <IconChevronLeft size=\"24\" />\n </BackElement>\n </BitkitLabelTooltip>\n )}\n {children}\n </Box>\n );\n});\n\nBitkitSidebarTitle.displayName = 'BitkitSidebarTitle';\n\n// ----- BitkitSidebar.Footer -----\n\nexport interface BitkitSidebarFooterProps extends BoxProps {\n children: ReactNode;\n}\n\nconst BitkitSidebarFooter = forwardRef<HTMLDivElement, BitkitSidebarFooterProps>((props, ref) => {\n const { children, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n\n return (\n <Box ref={ref} css={styles.footer} {...rest}>\n {children}\n </Box>\n );\n});\n\nBitkitSidebarFooter.displayName = 'BitkitSidebarFooter';\n\n// ----- BitkitSidebar.Project -----\n\nexport interface BitkitSidebarProjectProps extends BoxProps {\n label: string;\n value: string;\n}\n\nconst BitkitSidebarProject = forwardRef<HTMLDivElement, BitkitSidebarProjectProps>((props, ref) => {\n const { label, value, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n\n return (\n <Box ref={ref} css={styles.project} {...rest}>\n <chakra.span css={styles.projectLabel}>{label}</chakra.span>\n <chakra.span css={styles.projectValue}>{value}</chakra.span>\n </Box>\n );\n});\n\nBitkitSidebarProject.displayName = 'BitkitSidebarProject';\n\n// ----- BitkitSidebar.GroupHeading -----\n\nexport type BitkitSidebarGroupHeadingProps = BitkitGroupHeadingProps;\n\nconst BitkitSidebarGroupHeading = forwardRef<HTMLDivElement, BitkitSidebarGroupHeadingProps>((props, ref) => {\n return <BitkitGroupHeading ref={ref} paddingBlockEnd=\"12\" paddingBlockStart=\"24\" paddingInline=\"32\" {...props} />;\n});\n\nBitkitSidebarGroupHeading.displayName = 'BitkitSidebarGroupHeading';\n\n// ----- BitkitSidebar.Divider -----\n\nconst BitkitSidebarDivider = forwardRef<HTMLDivElement>((_, ref) => {\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n\n return <Separator ref={ref} css={styles.divider} />;\n});\n\nBitkitSidebarDivider.displayName = 'BitkitSidebarDivider';\n\nexport default withSubComponents(BitkitSidebar, {\n Divider: BitkitSidebarDivider,\n Footer: BitkitSidebarFooter,\n GroupHeading: BitkitSidebarGroupHeading,\n Item: BitkitSidebarItem,\n Project: BitkitSidebarProject,\n Title: BitkitSidebarTitle,\n});\n"],"mappings":"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"}
1
+ {"version":3,"file":"BitkitSidebar.js","names":[],"sources":["../../../lib/components/BitkitSidebar/BitkitSidebar.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { Separator } from '@chakra-ui/react/separator';\nimport { chakra, type HTMLChakraProps, useRecipe, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport IconChevronLeft from '../../icons/IconChevronLeft';\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport BitkitGroupHeading, { type BitkitGroupHeadingProps } from '../BitkitGroupHeading/BitkitGroupHeading';\nimport BitkitLabelTooltip from '../BitkitLabelTooltip/BitkitLabelTooltip';\n\n// ----- BitkitSidebar (Root) -----\n\nexport interface BitkitSidebarProps extends BoxProps {\n children: ReactNode;\n}\n\nconst BitkitSidebar = forwardRef<HTMLElement, BitkitSidebarProps>((props, ref) => {\n const { children, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n\n return (\n <Box ref={ref} asChild css={styles.root} {...rest}>\n <nav>{children}</nav>\n </Box>\n );\n});\n\nBitkitSidebar.displayName = 'BitkitSidebar';\n\n// ----- BitkitSidebar.Item -----\n\ninterface BitkitSidebarItemCommonProps {\n badge?: ReactNode;\n children: ReactNode;\n icon?: BitkitIconComponent;\n selected?: boolean;\n suffixIcon?: BitkitIconComponent;\n}\n\ninterface BitkitSidebarItemLinkProps extends Omit<HTMLChakraProps<'a'>, 'children'>, BitkitSidebarItemCommonProps {\n href: string;\n}\n\ninterface BitkitSidebarItemButtonProps\n extends Omit<HTMLChakraProps<'button'>, 'children'>, BitkitSidebarItemCommonProps {\n href?: never;\n}\n\nexport type BitkitSidebarItemProps = BitkitSidebarItemButtonProps | BitkitSidebarItemLinkProps;\n\nconst BitkitSidebarItem = forwardRef<HTMLButtonElement & HTMLAnchorElement, BitkitSidebarItemProps>((props, ref) => {\n const { badge, children, icon: Icon, selected, suffixIcon: SuffixIcon, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe({ selected });\n\n const itemContent = (\n <>\n {Icon && <Icon css={styles.itemIcon} size=\"24\" />}\n <chakra.span css={styles.itemLabel}>{children}</chakra.span>\n {badge}\n {SuffixIcon && <SuffixIcon css={styles.suffixIcon} size=\"24\" />}\n <chakra.div css={styles.selectionMarker} />\n </>\n );\n\n if (rest.href !== undefined) {\n const { className, ...linkRest } = rest;\n return (\n <chakra.a\n ref={ref}\n {...linkRest}\n aria-current={selected ? 'page' : undefined}\n className={className ? `group ${className}` : 'group'}\n css={styles.item}\n >\n {itemContent}\n </chakra.a>\n );\n }\n\n const { className, href: _, ...buttonRest } = rest;\n return (\n <chakra.button\n ref={ref}\n {...buttonRest}\n aria-pressed={selected}\n className={className ? `group ${className}` : 'group'}\n css={styles.item}\n type=\"button\"\n >\n {itemContent}\n </chakra.button>\n );\n});\n\nBitkitSidebarItem.displayName = 'BitkitSidebarItem';\n\n// ----- BitkitSidebar.Title -----\n\nexport interface BitkitSidebarTitleProps extends BoxProps {\n backHref?: string;\n backLabel?: string;\n children: ReactNode;\n onBackClick?: () => void;\n}\n\nconst BitkitSidebarTitle = forwardRef<HTMLDivElement, BitkitSidebarTitleProps>((props, ref) => {\n const { backHref, backLabel = 'Back', children, onBackClick, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n const controlButtonRecipe = useRecipe({ key: 'controlButton' });\n\n const hasBack = !!backHref || !!onBackClick;\n\n const BackElement = onBackClick ? chakra.button : chakra.a;\n\n return (\n <Box ref={ref} css={hasBack ? styles.titleWithBack : styles.title} {...rest}>\n {hasBack && (\n <BitkitLabelTooltip text={backLabel}>\n <BackElement\n aria-label={backLabel}\n css={controlButtonRecipe({ size: 'sm' })}\n {...(onBackClick ? { onClick: onBackClick, type: 'button' as const } : { href: backHref })}\n >\n <IconChevronLeft size=\"24\" />\n </BackElement>\n </BitkitLabelTooltip>\n )}\n {children}\n </Box>\n );\n});\n\nBitkitSidebarTitle.displayName = 'BitkitSidebarTitle';\n\n// ----- BitkitSidebar.Footer -----\n\nexport interface BitkitSidebarFooterProps extends BoxProps {\n children: ReactNode;\n}\n\nconst BitkitSidebarFooter = forwardRef<HTMLDivElement, BitkitSidebarFooterProps>((props, ref) => {\n const { children, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n\n return (\n <Box ref={ref} css={styles.footer} {...rest}>\n {children}\n </Box>\n );\n});\n\nBitkitSidebarFooter.displayName = 'BitkitSidebarFooter';\n\n// ----- BitkitSidebar.Project -----\n\nexport interface BitkitSidebarProjectProps extends BoxProps {\n label: string;\n value: string;\n}\n\nconst BitkitSidebarProject = forwardRef<HTMLDivElement, BitkitSidebarProjectProps>((props, ref) => {\n const { label, value, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n\n return (\n <Box ref={ref} css={styles.project} {...rest}>\n <chakra.span css={styles.projectLabel}>{label}</chakra.span>\n <chakra.span css={styles.projectValue}>{value}</chakra.span>\n </Box>\n );\n});\n\nBitkitSidebarProject.displayName = 'BitkitSidebarProject';\n\n// ----- BitkitSidebar.GroupHeading -----\n\nexport type BitkitSidebarGroupHeadingProps = BitkitGroupHeadingProps;\n\nconst BitkitSidebarGroupHeading = forwardRef<HTMLDivElement, BitkitSidebarGroupHeadingProps>((props, ref) => {\n return <BitkitGroupHeading ref={ref} paddingBlockEnd=\"12\" paddingBlockStart=\"24\" paddingInline=\"32\" {...props} />;\n});\n\nBitkitSidebarGroupHeading.displayName = 'BitkitSidebarGroupHeading';\n\n// ----- BitkitSidebar.Divider -----\n\nconst BitkitSidebarDivider = forwardRef<HTMLDivElement>((_, ref) => {\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n\n return <Separator ref={ref} css={styles.divider} />;\n});\n\nBitkitSidebarDivider.displayName = 'BitkitSidebarDivider';\n\nexport default withSubComponents(BitkitSidebar, {\n Divider: BitkitSidebarDivider,\n Footer: BitkitSidebarFooter,\n GroupHeading: BitkitSidebarGroupHeading,\n Item: BitkitSidebarItem,\n Project: BitkitSidebarProject,\n Title: BitkitSidebarTitle,\n});\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"BitkitSplitButton.js","names":[],"sources":["../../../lib/components/BitkitSplitButton/BitkitSplitButton.tsx"],"sourcesContent":["// eslint-disable-next-line no-restricted-imports\nimport { createContext } from '@chakra-ui/react';\nimport { Group, type GroupProps } from '@chakra-ui/react/group';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { type SystemStyleObject, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Children, forwardRef, isValidElement, type PropsWithChildren, type ReactElement, type ReactNode } from 'react';\n\nimport { IconChevronDown } from '../../icons';\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport BitkitActionMenu from '../BitkitActionMenu/BitkitActionMenu';\nimport BitkitButton, {\n type BitkitButtonAsAnchorProps,\n type BitkitButtonAsButtonProps,\n} from '../BitkitButton/BitkitButton';\nimport BitkitIconButton from '../BitkitIconButton/BitkitIconButton';\n\ntype Size = 'lg' | 'md' | 'sm';\ntype Variant = 'primary' | 'secondary';\ntype State = 'disabled' | 'loading' | 'skeleton';\n\nconst isValidActionItem = (child: ReactNode): child is ReactElement => {\n return isValidElement(child) && child.type === BitkitSplitButtonAction;\n};\n\nconst isValidMenuItem = (child: ReactNode): child is ReactElement => {\n return (\n isValidElement(child) &&\n (child.type === BitkitActionMenu.Group ||\n child.type === BitkitActionMenu.Item ||\n child.type === BitkitActionMenu.Separator)\n );\n};\n\n// --- Context ---\ninterface SplitButtonContext {\n size: Size;\n variant: Variant;\n state: State | undefined;\n styles: Record<string, SystemStyleObject>;\n}\n\nconst [SplitButtonProvider, useSplitButtonContext] = createContext<SplitButtonContext>({\n name: 'SplitButtonContext',\n hookName: 'useSplitButtonContext',\n providerName: '<BitkitSplitButton />',\n});\n\n// --- Action ---\n// Split-button action can be a button (default) or anchor (when href is set). asChild is intentionally\n// not part of the API — routing-library elements don't fit cleanly into the Group attached layout.\n// The forwarded ref is HTMLElement so it covers both <button> and <a>.\ntype BitkitSplitButtonActionProps = Omit<\n BitkitButtonAsButtonProps | BitkitButtonAsAnchorProps,\n 'size' | 'variant' | 'state'\n>;\n\nconst BitkitSplitButtonAction = forwardRef<HTMLElement, BitkitSplitButtonActionProps>((props, ref) => {\n const { size, state, styles, variant } = useSplitButtonContext();\n\n if (props.href !== undefined) {\n // Anchor branch: BitkitButton's anchor variant doesn't allow state=\"loading\". Coerce to \"disabled\"\n // so a SplitButton-wide loading state still surfaces visually on a link-mode action.\n return (\n <BitkitButton\n {...(props as BitkitButtonAsAnchorProps)}\n css={styles.action}\n ref={ref}\n size={size}\n state={state === 'loading' ? 'disabled' : state}\n variant={variant}\n />\n );\n }\n\n return (\n <BitkitButton\n {...(props as BitkitButtonAsButtonProps)}\n css={styles.action}\n ref={ref}\n size={size}\n state={state}\n variant={variant}\n />\n );\n});\n\nBitkitSplitButtonAction.displayName = 'BitkitSplitButtonAction';\n\n// --- Root ---\nexport type BitkitSplitButtonProps = PropsWithChildren<\n Omit<GroupProps, 'attached' | 'children' | 'display'> & {\n size?: Size;\n variant?: Variant;\n state?: State;\n }\n>;\n\nconst BitkitSplitButton = forwardRef<HTMLDivElement, BitkitSplitButtonProps>((props, ref) => {\n const { children, size = 'lg', state, variant = 'primary', ...rest } = props;\n\n const childArray = Children.toArray(children);\n const actionChild = childArray.find(isValidActionItem);\n const menuItems = childArray.filter(isValidMenuItem);\n\n const menuSize = size === 'lg' ? 'lg' : 'md';\n const recipe = useSlotRecipe({ key: 'splitButton' });\n const styles = recipe({ variant });\n\n return (\n <SplitButtonProvider value={{ size, state, styles, variant }}>\n <Skeleton asChild loading={state === 'skeleton'}>\n <Group ref={ref} {...rest} attached display=\"inline-flex\">\n {actionChild}\n <BitkitActionMenu.Root\n size={menuSize}\n trigger={\n <BitkitIconButton\n css={styles.trigger}\n icon={IconChevronDown}\n label=\"Toggle menu\"\n size={size}\n state={state === 'loading' ? 'disabled' : state}\n variant={variant}\n />\n }\n positioning={{ placement: 'bottom-end' }}\n >\n {menuItems}\n </BitkitActionMenu.Root>\n </Group>\n </Skeleton>\n </SplitButtonProvider>\n );\n});\nBitkitSplitButton.displayName = 'BitkitSplitButton';\n\nexport default withSubComponents(BitkitSplitButton, {\n Action: BitkitSplitButtonAction,\n Group: BitkitActionMenu.Group,\n Item: BitkitActionMenu.Item,\n Separator: BitkitActionMenu.Separator,\n});\n"],"mappings":";;;;;;;;;;;;AAoBA,IAAM,qBAAqB,UAA4C;CACrE,OAAO,eAAe,KAAK,KAAK,MAAM,SAAS;AACjD;AAEA,IAAM,mBAAmB,UAA4C;CACnE,OACE,eAAe,KAAK,MACnB,MAAM,SAAS,iBAAiB,SAC/B,MAAM,SAAS,iBAAiB,QAChC,MAAM,SAAS,iBAAiB;AAEtC;AAUA,IAAM,CAAC,qBAAqB,yBAAyB,gBAAkC;CACrF,MAAM;CACN,UAAU;CACV,cAAc;AAChB,CAAC;AAWD,IAAM,0BAA0B,YAAuD,OAAO,QAAQ;CACpG,MAAM,EAAE,MAAM,OAAO,QAAQ,YAAY,sBAAsB;CAE/D,IAAI,MAAM,SAAS,KAAA,GAGjB,OACE,oBAAC,cAAD;EACE,GAAK;EACL,KAAK,OAAO;EACP;EACC;EACN,OAAO,UAAU,YAAY,aAAa;EACjC;CACV,CAAA;CAIL,OACE,oBAAC,cAAD;EACE,GAAK;EACL,KAAK,OAAO;EACP;EACC;EACC;EACE;CACV,CAAA;AAEL,CAAC;AAED,wBAAwB,cAAc;AAWtC,IAAM,oBAAoB,YAAoD,OAAO,QAAQ;CAC3F,MAAM,EAAE,UAAU,OAAO,MAAM,OAAO,UAAU,WAAW,GAAG,SAAS;CAEvE,MAAM,aAAa,SAAS,QAAQ,QAAQ;CAC5C,MAAM,cAAc,WAAW,KAAK,iBAAiB;CACrD,MAAM,YAAY,WAAW,OAAO,eAAe;CAEnD,MAAM,WAAW,SAAS,OAAO,OAAO;CAExC,MAAM,SADS,cAAc,EAAE,KAAK,cAAc,CACnC,EAAO,EAAE,QAAQ,CAAC;CAEjC,OACE,oBAAC,qBAAD;EAAqB,OAAO;GAAE;GAAM;GAAO;GAAQ;EAAQ;YACzD,oBAAC,UAAD;GAAU,SAAA;GAAQ,SAAS,UAAU;aACnC,qBAAC,OAAD;IAAY;IAAK,GAAI;IAAM,UAAA;IAAS,SAAQ;cAA5C,CACG,aACD,oBAAC,iBAAiB,MAAlB;KACE,MAAM;KACN,SACE,oBAAC,kBAAD;MACE,KAAK,OAAO;MACZ,MAAM;MACN,OAAM;MACA;MACN,OAAO,UAAU,YAAY,aAAa;MACjC;KACV,CAAA;KAEH,aAAa,EAAE,WAAW,aAAa;eAEtC;IACoB,CAAA,CAClB;;EACC,CAAA;CACS,CAAA;AAEzB,CAAC;AACD,kBAAkB,cAAc;AAEhC,IAAA,4BAAe,kBAAkB,mBAAmB;CAClD,QAAQ;CACR,OAAO,iBAAiB;CACxB,MAAM,iBAAiB;CACvB,WAAW,iBAAiB;AAC9B,CAAC"}
1
+ {"version":3,"file":"BitkitSplitButton.js","names":[],"sources":["../../../lib/components/BitkitSplitButton/BitkitSplitButton.tsx"],"sourcesContent":["// eslint-disable-next-line no-restricted-imports\nimport { createContext } from '@chakra-ui/react';\nimport { Group, type GroupProps } from '@chakra-ui/react/group';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { type SystemStyleObject, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Children, forwardRef, isValidElement, type PropsWithChildren, type ReactElement, type ReactNode } from 'react';\n\nimport { IconChevronDown } from '../../icons';\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport BitkitActionMenu from '../BitkitActionMenu/BitkitActionMenu';\nimport BitkitButton, {\n type BitkitButtonAsAnchorProps,\n type BitkitButtonAsButtonProps,\n} from '../BitkitButton/BitkitButton';\nimport BitkitIconButton from '../BitkitIconButton/BitkitIconButton';\n\ntype Size = 'lg' | 'md' | 'sm';\ntype Variant = 'primary' | 'secondary';\ntype State = 'disabled' | 'loading' | 'skeleton';\n\nconst isValidActionItem = (child: ReactNode): child is ReactElement => {\n return isValidElement(child) && child.type === BitkitSplitButtonAction;\n};\n\nconst isValidMenuItem = (child: ReactNode): child is ReactElement => {\n return (\n isValidElement(child) &&\n (child.type === BitkitActionMenu.Group ||\n child.type === BitkitActionMenu.Item ||\n child.type === BitkitActionMenu.Separator)\n );\n};\n\n// --- Context ---\ninterface SplitButtonContext {\n size: Size;\n variant: Variant;\n state: State | undefined;\n styles: Record<string, SystemStyleObject>;\n}\n\nconst [SplitButtonProvider, useSplitButtonContext] = createContext<SplitButtonContext>({\n name: 'SplitButtonContext',\n hookName: 'useSplitButtonContext',\n providerName: '<BitkitSplitButton />',\n});\n\n// --- Action ---\n// Split-button action can be a button (default) or anchor (when href is set). asChild is intentionally\n// not part of the API — routing-library elements don't fit cleanly into the Group attached layout.\n// The forwarded ref is HTMLElement so it covers both <button> and <a>.\ntype BitkitSplitButtonActionProps = Omit<\n BitkitButtonAsButtonProps | BitkitButtonAsAnchorProps,\n 'size' | 'variant' | 'state'\n>;\n\nconst BitkitSplitButtonAction = forwardRef<HTMLElement, BitkitSplitButtonActionProps>((props, ref) => {\n const { size, state, styles, variant } = useSplitButtonContext();\n\n if (props.href !== undefined) {\n // Anchor branch: BitkitButton's anchor variant doesn't allow state=\"loading\". Coerce to \"disabled\"\n // so a SplitButton-wide loading state still surfaces visually on a link-mode action.\n return (\n <BitkitButton\n {...(props as BitkitButtonAsAnchorProps)}\n css={styles.action}\n ref={ref}\n size={size}\n state={state === 'loading' ? 'disabled' : state}\n variant={variant}\n />\n );\n }\n\n return (\n <BitkitButton\n {...(props as BitkitButtonAsButtonProps)}\n css={styles.action}\n ref={ref}\n size={size}\n state={state}\n variant={variant}\n />\n );\n});\n\nBitkitSplitButtonAction.displayName = 'BitkitSplitButtonAction';\n\n// --- Root ---\nexport type BitkitSplitButtonProps = PropsWithChildren<\n Omit<GroupProps, 'attached' | 'children' | 'display'> & {\n size?: Size;\n variant?: Variant;\n state?: State;\n }\n>;\n\nconst BitkitSplitButton = forwardRef<HTMLDivElement, BitkitSplitButtonProps>((props, ref) => {\n const { children, size = 'lg', state, variant = 'primary', ...rest } = props;\n\n const childArray = Children.toArray(children);\n const actionChild = childArray.find(isValidActionItem);\n const menuItems = childArray.filter(isValidMenuItem);\n\n const menuSize = size === 'lg' ? 'lg' : 'md';\n const recipe = useSlotRecipe({ key: 'splitButton' });\n const styles = recipe({ variant });\n\n return (\n <SplitButtonProvider value={{ size, state, styles, variant }}>\n <Skeleton asChild loading={state === 'skeleton'}>\n <Group ref={ref} {...rest} attached display=\"inline-flex\">\n {actionChild}\n <BitkitActionMenu.Root\n size={menuSize}\n trigger={\n <BitkitIconButton\n css={styles.trigger}\n icon={IconChevronDown}\n label=\"Toggle menu\"\n size={size}\n state={state === 'loading' ? 'disabled' : state}\n variant={variant}\n />\n }\n positioning={{ placement: 'bottom-end' }}\n >\n {menuItems}\n </BitkitActionMenu.Root>\n </Group>\n </Skeleton>\n </SplitButtonProvider>\n );\n});\nBitkitSplitButton.displayName = 'BitkitSplitButton';\n\nexport default withSubComponents(BitkitSplitButton, {\n Action: BitkitSplitButtonAction,\n Group: BitkitActionMenu.Group,\n Item: BitkitActionMenu.Item,\n Separator: BitkitActionMenu.Separator,\n});\n"],"mappings":";;;;;;;;;;;;AAoBA,IAAM,qBAAqB,UAA4C;CACrE,OAAO,eAAe,KAAK,KAAK,MAAM,SAAS;AACjD;AAEA,IAAM,mBAAmB,UAA4C;CACnE,OACE,eAAe,KAAK,MACnB,MAAM,SAAS,iBAAiB,SAC/B,MAAM,SAAS,iBAAiB,QAChC,MAAM,SAAS,iBAAiB;AAEtC;AAUA,IAAM,CAAC,qBAAqB,yBAAyB,gBAAkC;CACrF,MAAM;CACN,UAAU;CACV,cAAc;AAChB,CAAC;AAWD,IAAM,0BAA0B,YAAuD,OAAO,QAAQ;CACpG,MAAM,EAAE,MAAM,OAAO,QAAQ,YAAY,sBAAsB;CAE/D,IAAI,MAAM,SAAS,KAAA,GAGjB,OACE,oBAAC,cAAD;EACE,GAAK;EACL,KAAK,OAAO;EACP;EACC;EACN,OAAO,UAAU,YAAY,aAAa;EACjC;CACV,CAAA;CAIL,OACE,oBAAC,cAAD;EACE,GAAK;EACL,KAAK,OAAO;EACP;EACC;EACC;EACE;CACV,CAAA;AAEL,CAAC;AAED,wBAAwB,cAAc;AAWtC,IAAM,oBAAoB,YAAoD,OAAO,QAAQ;CAC3F,MAAM,EAAE,UAAU,OAAO,MAAM,OAAO,UAAU,WAAW,GAAG,SAAS;CAEvE,MAAM,aAAa,SAAS,QAAQ,QAAQ;CAC5C,MAAM,cAAc,WAAW,KAAK,iBAAiB;CACrD,MAAM,YAAY,WAAW,OAAO,eAAe;CAEnD,MAAM,WAAW,SAAS,OAAO,OAAO;CAExC,MAAM,SADS,cAAc,EAAE,KAAK,cAAc,CACnC,CAAA,CAAO,EAAE,QAAQ,CAAC;CAEjC,OACE,oBAAC,qBAAD;EAAqB,OAAO;GAAE;GAAM;GAAO;GAAQ;EAAQ;YACzD,oBAAC,UAAD;GAAU,SAAA;GAAQ,SAAS,UAAU;aACnC,qBAAC,OAAD;IAAY;IAAK,GAAI;IAAM,UAAA;IAAS,SAAQ;cAA5C,CACG,aACD,oBAAC,iBAAiB,MAAlB;KACE,MAAM;KACN,SACE,oBAAC,kBAAD;MACE,KAAK,OAAO;MACZ,MAAM;MACN,OAAM;MACA;MACN,OAAO,UAAU,YAAY,aAAa;MACjC;KACV,CAAA;KAEH,aAAa,EAAE,WAAW,aAAa;eAEtC;IACoB,CAAA,CAClB;;EACC,CAAA;CACS,CAAA;AAEzB,CAAC;AACD,kBAAkB,cAAc;AAEhC,IAAA,4BAAe,kBAAkB,mBAAmB;CAClD,QAAQ;CACR,OAAO,iBAAiB;CACxB,MAAM,iBAAiB;CACvB,WAAW,iBAAiB;AAC9B,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"BitkitStat.js","names":[],"sources":["../../../lib/components/BitkitStat/BitkitStat.tsx"],"sourcesContent":["import { type BoxProps } from '@chakra-ui/react/box';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef } from 'react';\n\nimport { IconArrowDown, IconArrowUp, IconInfoCircle } from '../../icons';\nimport BitkitTooltip from '../BitkitTooltip/BitkitTooltip';\n\n// --- Types ---\n\nexport type TrendColor = 'positive' | 'negative' | 'neutral';\nexport type TrendDirection = 'up' | 'down';\nexport type TrendTextPlacement = 'below' | 'inline';\n\nconst TREND_COLORS = {\n positive: { text: 'text/positive', icon: 'icon/positive' },\n negative: { text: 'text/negative', icon: 'icon/negative' },\n neutral: { text: 'text/secondary', icon: 'icon/tertiary' },\n} as const;\n\nconst TREND_ICONS = { up: IconArrowUp, down: IconArrowDown } as const;\nconst DEFAULT_COLORS: Record<TrendDirection, TrendColor> = { up: 'positive', down: 'negative' };\n\nconst resolveTrend = (trendColor?: TrendColor, trendDirection?: TrendDirection) => {\n const color = trendColor ?? (trendDirection ? DEFAULT_COLORS[trendDirection] : undefined);\n const colors = color ? TREND_COLORS[color] : undefined;\n return {\n textColor: colors?.text ?? 'text/secondary',\n iconColor: colors?.icon ?? 'icon/tertiary',\n Icon: trendDirection ? TREND_ICONS[trendDirection] : undefined,\n };\n};\n\nconst BELOW_ICON_SIZES = { lg: '16', '2xl': '24', '3xl': '24' } as const;\nconst INLINE_TREND_STYLES = {\n lg: { paddingBlockStart: '2' },\n '2xl': { paddingBlockStart: '6' },\n '3xl': { paddingBlockEnd: '4' },\n} as const;\nconst SKELETON_VALUE_HEIGHTS = { lg: '24', '2xl': '36px', '3xl': '40' } as const;\n\nexport interface BitkitStatProps extends Omit<BoxProps, 'colorPalette'> {\n label: string;\n size?: 'lg' | '2xl' | '3xl';\n state?: 'default' | 'skeleton';\n subtext?: string;\n tooltip?: string;\n trendColor?: TrendColor;\n trendDirection?: TrendDirection;\n trendText?: string;\n trendTextPlacement?: TrendTextPlacement;\n value?: string;\n variant?: 'default' | 'compact';\n}\n\n// --- Component ---\n\nconst BitkitStat = forwardRef<HTMLElement, BitkitStatProps>((props, ref) => {\n const {\n label,\n size = 'lg',\n state = 'default',\n subtext,\n tooltip,\n trendColor,\n trendDirection,\n trendText,\n trendTextPlacement = 'below',\n value,\n variant = 'default',\n ...rest\n } = props;\n\n const styles = useSlotRecipe({ key: 'stat' })({ size, variant });\n const trend = resolveTrend(trendColor, trendDirection);\n const { Icon: TrendIcon } = trend;\n const isCompact = variant === 'compact';\n\n // --- Compact ---\n if (isCompact) {\n if (state === 'skeleton') {\n return (\n <chakra.div css={styles.root} ref={ref} {...(rest as Record<string, unknown>)}>\n <Skeleton height=\"20\" width=\"64\" />\n <Skeleton height=\"16\" width=\"48\" />\n </chakra.div>\n );\n }\n\n return (\n <chakra.div css={styles.root} ref={ref} {...(rest as Record<string, unknown>)}>\n <chakra.span css={styles.value}>\n {!!TrendIcon && <TrendIcon size=\"16\" color={trend.iconColor} />}\n {value}\n </chakra.span>\n {!!trendText && (\n <chakra.span css={styles.helpText} color={trend.textColor}>\n {trendText}\n </chakra.span>\n )}\n </chakra.div>\n );\n }\n\n // --- Default ---\n\n const labelContent = (\n <chakra.dt css={styles.label}>\n {label}\n {!!tooltip && (\n <BitkitTooltip text={tooltip}>\n <IconInfoCircle size=\"16\" color=\"icon/tertiary\" />\n </BitkitTooltip>\n )}\n </chakra.dt>\n );\n\n if (state === 'skeleton') {\n return (\n <chakra.dl css={styles.root} ref={ref} {...(rest as Record<string, unknown>)}>\n {labelContent}\n <Skeleton height={SKELETON_VALUE_HEIGHTS[size]} width=\"128\" />\n <Skeleton height=\"20\" width=\"128\" />\n </chakra.dl>\n );\n }\n\n const isInline = trendTextPlacement === 'inline';\n const showHelpText = (!isInline && !!trendText) || !!subtext;\n\n return (\n <chakra.dl css={styles.root} ref={ref} {...(rest as Record<string, unknown>)}>\n {labelContent}\n\n <chakra.dd css={styles.value} alignItems={isInline && size === '3xl' ? 'flex-end' : undefined}>\n {value}\n {isInline ? (\n <chakra.span display=\"inline-flex\" gap=\"4\" alignItems=\"center\" css={INLINE_TREND_STYLES[size]}>\n {!!TrendIcon && <TrendIcon size=\"16\" color={trend.iconColor} />}\n {!!trendText && (\n <chakra.span color={trend.textColor} textStyle=\"body/md/regular\">\n {trendText}\n </chakra.span>\n )}\n </chakra.span>\n ) : (\n !!TrendIcon && <TrendIcon size={BELOW_ICON_SIZES[size]} color={trend.iconColor} />\n )}\n </chakra.dd>\n\n {showHelpText && (\n <chakra.dd css={styles.helpText}>\n {!isInline && !!trendText && <chakra.span color={trend.textColor}>{trendText}</chakra.span>}\n {!!subtext && <chakra.span color=\"text/tertiary\">{subtext}</chakra.span>}\n </chakra.dd>\n )}\n </chakra.dl>\n );\n});\n\nBitkitStat.displayName = 'BitkitStat';\n\nexport default BitkitStat;\n"],"mappings":"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"}
1
+ {"version":3,"file":"BitkitStat.js","names":[],"sources":["../../../lib/components/BitkitStat/BitkitStat.tsx"],"sourcesContent":["import { type BoxProps } from '@chakra-ui/react/box';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef } from 'react';\n\nimport { IconArrowDown, IconArrowUp, IconInfoCircle } from '../../icons';\nimport BitkitTooltip from '../BitkitTooltip/BitkitTooltip';\n\n// --- Types ---\n\nexport type TrendColor = 'positive' | 'negative' | 'neutral';\nexport type TrendDirection = 'up' | 'down';\nexport type TrendTextPlacement = 'below' | 'inline';\n\nconst TREND_COLORS = {\n positive: { text: 'text/positive', icon: 'icon/positive' },\n negative: { text: 'text/negative', icon: 'icon/negative' },\n neutral: { text: 'text/secondary', icon: 'icon/tertiary' },\n} as const;\n\nconst TREND_ICONS = { up: IconArrowUp, down: IconArrowDown } as const;\nconst DEFAULT_COLORS: Record<TrendDirection, TrendColor> = { up: 'positive', down: 'negative' };\n\nconst resolveTrend = (trendColor?: TrendColor, trendDirection?: TrendDirection) => {\n const color = trendColor ?? (trendDirection ? DEFAULT_COLORS[trendDirection] : undefined);\n const colors = color ? TREND_COLORS[color] : undefined;\n return {\n textColor: colors?.text ?? 'text/secondary',\n iconColor: colors?.icon ?? 'icon/tertiary',\n Icon: trendDirection ? TREND_ICONS[trendDirection] : undefined,\n };\n};\n\nconst BELOW_ICON_SIZES = { lg: '16', '2xl': '24', '3xl': '24' } as const;\nconst INLINE_TREND_STYLES = {\n lg: { paddingBlockStart: '2' },\n '2xl': { paddingBlockStart: '6' },\n '3xl': { paddingBlockEnd: '4' },\n} as const;\nconst SKELETON_VALUE_HEIGHTS = { lg: '24', '2xl': '36px', '3xl': '40' } as const;\n\nexport interface BitkitStatProps extends Omit<BoxProps, 'colorPalette'> {\n label: string;\n size?: 'lg' | '2xl' | '3xl';\n state?: 'default' | 'skeleton';\n subtext?: string;\n tooltip?: string;\n trendColor?: TrendColor;\n trendDirection?: TrendDirection;\n trendText?: string;\n trendTextPlacement?: TrendTextPlacement;\n value?: string;\n variant?: 'default' | 'compact';\n}\n\n// --- Component ---\n\nconst BitkitStat = forwardRef<HTMLElement, BitkitStatProps>((props, ref) => {\n const {\n label,\n size = 'lg',\n state = 'default',\n subtext,\n tooltip,\n trendColor,\n trendDirection,\n trendText,\n trendTextPlacement = 'below',\n value,\n variant = 'default',\n ...rest\n } = props;\n\n const styles = useSlotRecipe({ key: 'stat' })({ size, variant });\n const trend = resolveTrend(trendColor, trendDirection);\n const { Icon: TrendIcon } = trend;\n const isCompact = variant === 'compact';\n\n // --- Compact ---\n if (isCompact) {\n if (state === 'skeleton') {\n return (\n <chakra.div css={styles.root} ref={ref} {...(rest as Record<string, unknown>)}>\n <Skeleton height=\"20\" width=\"64\" />\n <Skeleton height=\"16\" width=\"48\" />\n </chakra.div>\n );\n }\n\n return (\n <chakra.div css={styles.root} ref={ref} {...(rest as Record<string, unknown>)}>\n <chakra.span css={styles.value}>\n {!!TrendIcon && <TrendIcon size=\"16\" color={trend.iconColor} />}\n {value}\n </chakra.span>\n {!!trendText && (\n <chakra.span css={styles.helpText} color={trend.textColor}>\n {trendText}\n </chakra.span>\n )}\n </chakra.div>\n );\n }\n\n // --- Default ---\n\n const labelContent = (\n <chakra.dt css={styles.label}>\n {label}\n {!!tooltip && (\n <BitkitTooltip text={tooltip}>\n <IconInfoCircle size=\"16\" color=\"icon/tertiary\" />\n </BitkitTooltip>\n )}\n </chakra.dt>\n );\n\n if (state === 'skeleton') {\n return (\n <chakra.dl css={styles.root} ref={ref} {...(rest as Record<string, unknown>)}>\n {labelContent}\n <Skeleton height={SKELETON_VALUE_HEIGHTS[size]} width=\"128\" />\n <Skeleton height=\"20\" width=\"128\" />\n </chakra.dl>\n );\n }\n\n const isInline = trendTextPlacement === 'inline';\n const showHelpText = (!isInline && !!trendText) || !!subtext;\n\n return (\n <chakra.dl css={styles.root} ref={ref} {...(rest as Record<string, unknown>)}>\n {labelContent}\n\n <chakra.dd css={styles.value} alignItems={isInline && size === '3xl' ? 'flex-end' : undefined}>\n {value}\n {isInline ? (\n <chakra.span display=\"inline-flex\" gap=\"4\" alignItems=\"center\" css={INLINE_TREND_STYLES[size]}>\n {!!TrendIcon && <TrendIcon size=\"16\" color={trend.iconColor} />}\n {!!trendText && (\n <chakra.span color={trend.textColor} textStyle=\"body/md/regular\">\n {trendText}\n </chakra.span>\n )}\n </chakra.span>\n ) : (\n !!TrendIcon && <TrendIcon size={BELOW_ICON_SIZES[size]} color={trend.iconColor} />\n )}\n </chakra.dd>\n\n {showHelpText && (\n <chakra.dd css={styles.helpText}>\n {!isInline && !!trendText && <chakra.span color={trend.textColor}>{trendText}</chakra.span>}\n {!!subtext && <chakra.span color=\"text/tertiary\">{subtext}</chakra.span>}\n </chakra.dd>\n )}\n </chakra.dl>\n );\n});\n\nBitkitStat.displayName = 'BitkitStat';\n\nexport default BitkitStat;\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"BitkitSteps.js","names":[],"sources":["../../../lib/components/BitkitSteps/BitkitSteps.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Link } from '@chakra-ui/react/link';\nimport { Steps, type StepsRootProps, useStepsContext, useStepsStyles } from '@chakra-ui/react/steps';\nimport { Children, cloneElement, forwardRef, isValidElement, type ReactElement, type ReactNode } from 'react';\n\nimport IconCheck from '../../icons/IconCheck';\nimport IconSkip from '../../icons/IconSkip';\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport { useStepCardContext } from '../BitkitStepsCard/StepCardContext';\n\nexport type BitkitStepsItemState = 'disabled' | 'invalid' | 'skippable';\n\ntype EffectiveStatus = 'completed' | 'disabled' | 'inProgress' | 'invalid' | 'notStarted' | 'skippable' | 'skipped';\n\nconst getEffectiveStatus = (\n itemState: BitkitStepsItemState | undefined,\n index: number,\n step: number,\n): EffectiveStatus => {\n if (itemState === 'disabled') return 'disabled';\n if (itemState === 'invalid') return 'invalid';\n if (itemState === 'skippable') return index < step ? 'skipped' : 'skippable';\n if (index < step) return 'completed';\n if (index === step) return 'inProgress';\n return 'notStarted';\n};\n\nconst renderIndicatorContent = (index: number, status: EffectiveStatus) => {\n if (status === 'completed') return <IconCheck size=\"16\" />;\n if (status === 'skippable' || status === 'skipped') return <IconSkip size=\"16\" />;\n if (status === 'invalid') return '!';\n return index + 1;\n};\n\nconst renderLabel = (label: string, action: BitkitStepsItemProps['action']) => {\n if (!action) return label;\n\n // Links don't look like links at rest — only the underline + purple color on hover reveals\n // them. Intentional: this is a power-user affordance on the step title. The base Link recipe\n // already adds the underline on hover; we only need to swap the color.\n if (action.href) {\n return (\n <Link\n _hover={{ color: 'text/link' }}\n href={action.href}\n onClick={action.onClick}\n rel={action.isExternal ? 'noopener noreferrer' : undefined}\n target={action.isExternal ? '_blank' : undefined}\n >\n {label}\n </Link>\n );\n }\n\n return (\n <Link _hover={{ color: 'text/link' }} as=\"button\" onClick={action.onClick} type=\"button\">\n {label}\n </Link>\n );\n};\n\nexport interface BitkitStepsProps extends Omit<\n StepsRootProps,\n 'children' | 'count' | 'linear' | 'orientation' | 'step'\n> {\n children: ReactNode;\n orientation?: 'horizontal' | 'vertical';\n step?: number;\n}\n\nconst BitkitSteps = forwardRef<HTMLDivElement, BitkitStepsProps>((props, ref) => {\n const { children, orientation = 'horizontal', step: stepProp, ...rest } = props;\n const stepCardCtx = useStepCardContext();\n const step = stepProp ?? stepCardCtx?.step ?? 0;\n const count = Children.count(children);\n\n return (\n <Steps.Root ref={ref} {...rest} count={count} linear={false} orientation={orientation} step={step}>\n <Steps.List>\n {Children.map(children, (child, index) => {\n if (isValidElement(child)) {\n return cloneElement(child as ReactElement<BitkitStepsItemInternalProps>, {\n _index: index,\n _orientation: orientation,\n });\n }\n return child;\n })}\n </Steps.List>\n </Steps.Root>\n );\n});\n\nBitkitSteps.displayName = 'BitkitSteps';\n\nexport interface BitkitStepsItemProps {\n action?: {\n href?: string;\n isExternal?: boolean;\n onClick?: () => void;\n };\n helperText?: ReactNode;\n label: string;\n state?: BitkitStepsItemState;\n}\n\ninterface BitkitStepsItemInternalProps extends BitkitStepsItemProps {\n _index?: number;\n _orientation?: 'horizontal' | 'vertical';\n}\n\nconst BitkitStepsItem = forwardRef<HTMLDivElement, BitkitStepsItemProps>((props, ref) => {\n const {\n _index = 0,\n _orientation = 'horizontal',\n action,\n helperText,\n label,\n state,\n } = props as BitkitStepsItemInternalProps;\n\n const styles = useStepsStyles();\n const stepsCtx = useStepsContext();\n const status = getEffectiveStatus(state, _index, stepsCtx.value);\n const resolvedAction = status === 'completed' ? action : undefined;\n const statusAttr = { 'data-step-status': status };\n\n return (\n <Steps.Item {...statusAttr} index={_index} ref={ref}>\n <Steps.Indicator {...statusAttr}>{renderIndicatorContent(_index, status)}</Steps.Indicator>\n <Box css={styles.trigger}>\n <Steps.Title {...statusAttr}>{renderLabel(label, resolvedAction)}</Steps.Title>\n {_orientation === 'vertical' && helperText && (\n <Steps.Description {...statusAttr}>{helperText}</Steps.Description>\n )}\n </Box>\n <Steps.Separator />\n </Steps.Item>\n );\n});\n\nBitkitStepsItem.displayName = 'BitkitStepsItem';\n\nexport default withSubComponents(BitkitSteps, { Item: BitkitStepsItem });\n"],"mappings":";;;;;;;;;;AAcA,IAAM,sBACJ,WACA,OACA,SACoB;CACpB,IAAI,cAAc,YAAY,OAAO;CACrC,IAAI,cAAc,WAAW,OAAO;CACpC,IAAI,cAAc,aAAa,OAAO,QAAQ,OAAO,YAAY;CACjE,IAAI,QAAQ,MAAM,OAAO;CACzB,IAAI,UAAU,MAAM,OAAO;CAC3B,OAAO;AACT;AAEA,IAAM,0BAA0B,OAAe,WAA4B;CACzE,IAAI,WAAW,aAAa,OAAO,oBAAC,WAAD,EAAW,MAAK,KAAM,CAAA;CACzD,IAAI,WAAW,eAAe,WAAW,WAAW,OAAO,oBAAC,UAAD,EAAU,MAAK,KAAM,CAAA;CAChF,IAAI,WAAW,WAAW,OAAO;CACjC,OAAO,QAAQ;AACjB;AAEA,IAAM,eAAe,OAAe,WAA2C;CAC7E,IAAI,CAAC,QAAQ,OAAO;CAKpB,IAAI,OAAO,MACT,OACE,oBAAC,MAAD;EACE,QAAQ,EAAE,OAAO,YAAY;EAC7B,MAAM,OAAO;EACb,SAAS,OAAO;EAChB,KAAK,OAAO,aAAa,wBAAwB,KAAA;EACjD,QAAQ,OAAO,aAAa,WAAW,KAAA;YAEtC;CACG,CAAA;CAIV,OACE,oBAAC,MAAD;EAAM,QAAQ,EAAE,OAAO,YAAY;EAAG,IAAG;EAAS,SAAS,OAAO;EAAS,MAAK;YAC7E;CACG,CAAA;AAEV;AAWA,IAAM,cAAc,YAA8C,OAAO,QAAQ;CAC/E,MAAM,EAAE,UAAU,cAAc,cAAc,MAAM,UAAU,GAAG,SAAS;CAC1E,MAAM,cAAc,mBAAmB;CACvC,MAAM,OAAO,YAAY,aAAa,QAAQ;CAC9C,MAAM,QAAQ,SAAS,MAAM,QAAQ;CAErC,OACE,oBAAC,MAAM,MAAP;EAAiB;EAAK,GAAI;EAAa;EAAO,QAAQ;EAAoB;EAAmB;YAC3F,oBAAC,MAAM,MAAP,EAAA,UACG,SAAS,IAAI,WAAW,OAAO,UAAU;GACxC,IAAI,eAAe,KAAK,GACtB,OAAO,aAAa,OAAqD;IACvE,QAAQ;IACR,cAAc;GAChB,CAAC;GAEH,OAAO;EACT,CAAC,EACS,CAAA;CACF,CAAA;AAEhB,CAAC;AAED,YAAY,cAAc;AAkB1B,IAAM,kBAAkB,YAAkD,OAAO,QAAQ;CACvF,MAAM,EACJ,SAAS,GACT,eAAe,cACf,QACA,YACA,OACA,UACE;CAEJ,MAAM,SAAS,eAAe;CAE9B,MAAM,SAAS,mBAAmB,OAAO,QADxB,gBACgC,EAAS,KAAK;CAC/D,MAAM,iBAAiB,WAAW,cAAc,SAAS,KAAA;CACzD,MAAM,aAAa,EAAE,oBAAoB,OAAO;CAEhD,OACE,qBAAC,MAAM,MAAP;EAAY,GAAI;EAAY,OAAO;EAAa;YAAhD;GACE,oBAAC,MAAM,WAAP;IAAiB,GAAI;cAAa,uBAAuB,QAAQ,MAAM;GAAmB,CAAA;GAC1F,qBAAC,KAAD;IAAK,KAAK,OAAO;cAAjB,CACE,oBAAC,MAAM,OAAP;KAAa,GAAI;eAAa,YAAY,OAAO,cAAc;IAAe,CAAA,GAC7E,iBAAiB,cAAc,cAC9B,oBAAC,MAAM,aAAP;KAAmB,GAAI;eAAa;IAA8B,CAAA,CAEjE;;GACL,oBAAC,MAAM,WAAP,CAAkB,CAAA;EACR;;AAEhB,CAAC;AAED,gBAAgB,cAAc;AAE9B,IAAA,sBAAe,kBAAkB,aAAa,EAAE,MAAM,gBAAgB,CAAC"}
1
+ {"version":3,"file":"BitkitSteps.js","names":[],"sources":["../../../lib/components/BitkitSteps/BitkitSteps.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Link } from '@chakra-ui/react/link';\nimport { Steps, type StepsRootProps, useStepsContext, useStepsStyles } from '@chakra-ui/react/steps';\nimport { Children, cloneElement, forwardRef, isValidElement, type ReactElement, type ReactNode } from 'react';\n\nimport IconCheck from '../../icons/IconCheck';\nimport IconSkip from '../../icons/IconSkip';\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport { useStepCardContext } from '../BitkitStepsCard/StepCardContext';\n\nexport type BitkitStepsItemState = 'disabled' | 'invalid' | 'skippable';\n\ntype EffectiveStatus = 'completed' | 'disabled' | 'inProgress' | 'invalid' | 'notStarted' | 'skippable' | 'skipped';\n\nconst getEffectiveStatus = (\n itemState: BitkitStepsItemState | undefined,\n index: number,\n step: number,\n): EffectiveStatus => {\n if (itemState === 'disabled') return 'disabled';\n if (itemState === 'invalid') return 'invalid';\n if (itemState === 'skippable') return index < step ? 'skipped' : 'skippable';\n if (index < step) return 'completed';\n if (index === step) return 'inProgress';\n return 'notStarted';\n};\n\nconst renderIndicatorContent = (index: number, status: EffectiveStatus) => {\n if (status === 'completed') return <IconCheck size=\"16\" />;\n if (status === 'skippable' || status === 'skipped') return <IconSkip size=\"16\" />;\n if (status === 'invalid') return '!';\n return index + 1;\n};\n\nconst renderLabel = (label: string, action: BitkitStepsItemProps['action']) => {\n if (!action) return label;\n\n // Links don't look like links at rest — only the underline + purple color on hover reveals\n // them. Intentional: this is a power-user affordance on the step title. The base Link recipe\n // already adds the underline on hover; we only need to swap the color.\n if (action.href) {\n return (\n <Link\n _hover={{ color: 'text/link' }}\n href={action.href}\n onClick={action.onClick}\n rel={action.isExternal ? 'noopener noreferrer' : undefined}\n target={action.isExternal ? '_blank' : undefined}\n >\n {label}\n </Link>\n );\n }\n\n return (\n <Link _hover={{ color: 'text/link' }} as=\"button\" onClick={action.onClick} type=\"button\">\n {label}\n </Link>\n );\n};\n\nexport interface BitkitStepsProps extends Omit<\n StepsRootProps,\n 'children' | 'count' | 'linear' | 'orientation' | 'step'\n> {\n children: ReactNode;\n orientation?: 'horizontal' | 'vertical';\n step?: number;\n}\n\nconst BitkitSteps = forwardRef<HTMLDivElement, BitkitStepsProps>((props, ref) => {\n const { children, orientation = 'horizontal', step: stepProp, ...rest } = props;\n const stepCardCtx = useStepCardContext();\n const step = stepProp ?? stepCardCtx?.step ?? 0;\n const count = Children.count(children);\n\n return (\n <Steps.Root ref={ref} {...rest} count={count} linear={false} orientation={orientation} step={step}>\n <Steps.List>\n {Children.map(children, (child, index) => {\n if (isValidElement(child)) {\n return cloneElement(child as ReactElement<BitkitStepsItemInternalProps>, {\n _index: index,\n _orientation: orientation,\n });\n }\n return child;\n })}\n </Steps.List>\n </Steps.Root>\n );\n});\n\nBitkitSteps.displayName = 'BitkitSteps';\n\nexport interface BitkitStepsItemProps {\n action?: {\n href?: string;\n isExternal?: boolean;\n onClick?: () => void;\n };\n helperText?: ReactNode;\n label: string;\n state?: BitkitStepsItemState;\n}\n\ninterface BitkitStepsItemInternalProps extends BitkitStepsItemProps {\n _index?: number;\n _orientation?: 'horizontal' | 'vertical';\n}\n\nconst BitkitStepsItem = forwardRef<HTMLDivElement, BitkitStepsItemProps>((props, ref) => {\n const {\n _index = 0,\n _orientation = 'horizontal',\n action,\n helperText,\n label,\n state,\n } = props as BitkitStepsItemInternalProps;\n\n const styles = useStepsStyles();\n const stepsCtx = useStepsContext();\n const status = getEffectiveStatus(state, _index, stepsCtx.value);\n const resolvedAction = status === 'completed' ? action : undefined;\n const statusAttr = { 'data-step-status': status };\n\n return (\n <Steps.Item {...statusAttr} index={_index} ref={ref}>\n <Steps.Indicator {...statusAttr}>{renderIndicatorContent(_index, status)}</Steps.Indicator>\n <Box css={styles.trigger}>\n <Steps.Title {...statusAttr}>{renderLabel(label, resolvedAction)}</Steps.Title>\n {_orientation === 'vertical' && helperText && (\n <Steps.Description {...statusAttr}>{helperText}</Steps.Description>\n )}\n </Box>\n <Steps.Separator />\n </Steps.Item>\n );\n});\n\nBitkitStepsItem.displayName = 'BitkitStepsItem';\n\nexport default withSubComponents(BitkitSteps, { Item: BitkitStepsItem });\n"],"mappings":";;;;;;;;;;AAcA,IAAM,sBACJ,WACA,OACA,SACoB;CACpB,IAAI,cAAc,YAAY,OAAO;CACrC,IAAI,cAAc,WAAW,OAAO;CACpC,IAAI,cAAc,aAAa,OAAO,QAAQ,OAAO,YAAY;CACjE,IAAI,QAAQ,MAAM,OAAO;CACzB,IAAI,UAAU,MAAM,OAAO;CAC3B,OAAO;AACT;AAEA,IAAM,0BAA0B,OAAe,WAA4B;CACzE,IAAI,WAAW,aAAa,OAAO,oBAAC,WAAD,EAAW,MAAK,KAAM,CAAA;CACzD,IAAI,WAAW,eAAe,WAAW,WAAW,OAAO,oBAAC,UAAD,EAAU,MAAK,KAAM,CAAA;CAChF,IAAI,WAAW,WAAW,OAAO;CACjC,OAAO,QAAQ;AACjB;AAEA,IAAM,eAAe,OAAe,WAA2C;CAC7E,IAAI,CAAC,QAAQ,OAAO;CAKpB,IAAI,OAAO,MACT,OACE,oBAAC,MAAD;EACE,QAAQ,EAAE,OAAO,YAAY;EAC7B,MAAM,OAAO;EACb,SAAS,OAAO;EAChB,KAAK,OAAO,aAAa,wBAAwB,KAAA;EACjD,QAAQ,OAAO,aAAa,WAAW,KAAA;YAEtC;CACG,CAAA;CAIV,OACE,oBAAC,MAAD;EAAM,QAAQ,EAAE,OAAO,YAAY;EAAG,IAAG;EAAS,SAAS,OAAO;EAAS,MAAK;YAC7E;CACG,CAAA;AAEV;AAWA,IAAM,cAAc,YAA8C,OAAO,QAAQ;CAC/E,MAAM,EAAE,UAAU,cAAc,cAAc,MAAM,UAAU,GAAG,SAAS;CAC1E,MAAM,cAAc,mBAAmB;CACvC,MAAM,OAAO,YAAY,aAAa,QAAQ;CAC9C,MAAM,QAAQ,SAAS,MAAM,QAAQ;CAErC,OACE,oBAAC,MAAM,MAAP;EAAiB;EAAK,GAAI;EAAa;EAAO,QAAQ;EAAoB;EAAmB;YAC3F,oBAAC,MAAM,MAAP,EAAA,UACG,SAAS,IAAI,WAAW,OAAO,UAAU;GACxC,IAAI,eAAe,KAAK,GACtB,OAAO,aAAa,OAAqD;IACvE,QAAQ;IACR,cAAc;GAChB,CAAC;GAEH,OAAO;EACT,CAAC,EACS,CAAA;CACF,CAAA;AAEhB,CAAC;AAED,YAAY,cAAc;AAkB1B,IAAM,kBAAkB,YAAkD,OAAO,QAAQ;CACvF,MAAM,EACJ,SAAS,GACT,eAAe,cACf,QACA,YACA,OACA,UACE;CAEJ,MAAM,SAAS,eAAe;CAE9B,MAAM,SAAS,mBAAmB,OAAO,QADxB,gBACgC,CAAA,CAAS,KAAK;CAC/D,MAAM,iBAAiB,WAAW,cAAc,SAAS,KAAA;CACzD,MAAM,aAAa,EAAE,oBAAoB,OAAO;CAEhD,OACE,qBAAC,MAAM,MAAP;EAAY,GAAI;EAAY,OAAO;EAAa;YAAhD;GACE,oBAAC,MAAM,WAAP;IAAiB,GAAI;cAAa,uBAAuB,QAAQ,MAAM;GAAmB,CAAA;GAC1F,qBAAC,KAAD;IAAK,KAAK,OAAO;cAAjB,CACE,oBAAC,MAAM,OAAP;KAAa,GAAI;eAAa,YAAY,OAAO,cAAc;IAAe,CAAA,GAC7E,iBAAiB,cAAc,cAC9B,oBAAC,MAAM,aAAP;KAAmB,GAAI;eAAa;IAA8B,CAAA,CAEjE;;GACL,oBAAC,MAAM,WAAP,CAAkB,CAAA;EACR;;AAEhB,CAAC;AAED,gBAAgB,cAAc;AAE9B,IAAA,sBAAe,kBAAkB,aAAa,EAAE,MAAM,gBAAgB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"BitkitStepsCard.js","names":[],"sources":["../../../lib/components/BitkitStepsCard/BitkitStepsCard.tsx"],"sourcesContent":["import {\n Card,\n type CardBodyProps,\n type CardFooterProps,\n type CardHeaderProps,\n type CardRootProps,\n} from '@chakra-ui/react/card';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Children, cloneElement, forwardRef, isValidElement, type ReactElement, type ReactNode } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport { StepCardProvider, useStepCardContext } from './StepCardContext';\n\nconst useStepsCardStyles = () => {\n const recipe = useSlotRecipe({ key: 'stepsCard' });\n return recipe();\n};\n\nexport interface BitkitStepsCardProps extends Omit<CardRootProps, 'children' | 'title'> {\n children: ReactNode;\n step: number;\n}\n\nconst BitkitStepsCard = forwardRef<HTMLDivElement, BitkitStepsCardProps>((props, ref) => {\n const { children, step, ...rest } = props;\n const styles = useStepsCardStyles();\n\n return (\n <StepCardProvider value={{ step }}>\n <Card.Root ref={ref} css={styles.root} unstyled {...rest}>\n {children}\n </Card.Root>\n </StepCardProvider>\n );\n});\n\nBitkitStepsCard.displayName = 'BitkitStepsCard';\n\nexport interface BitkitStepsCardHeaderProps extends Omit<CardHeaderProps, 'children'> {\n children: ReactNode;\n}\n\nconst BitkitStepsCardHeader = forwardRef<HTMLDivElement, BitkitStepsCardHeaderProps>((props, ref) => {\n const { children, ...rest } = props;\n const styles = useStepsCardStyles();\n\n return (\n <Card.Header ref={ref} css={styles.header} {...rest}>\n {children}\n </Card.Header>\n );\n});\n\nBitkitStepsCardHeader.displayName = 'BitkitStepsCardHeader';\n\nexport interface BitkitStepsCardBodyProps extends Omit<CardBodyProps, 'children'> {\n children: ReactNode;\n}\n\nconst BitkitStepsCardBody = forwardRef<HTMLDivElement, BitkitStepsCardBodyProps>((props, ref) => {\n const { children, ...rest } = props;\n const styles = useStepsCardStyles();\n\n return (\n <Card.Body ref={ref} css={styles.body} {...rest}>\n {Children.map(children, (child, index) => {\n if (isValidElement(child)) {\n return cloneElement(child as ReactElement<{ _index?: number }>, { _index: index });\n }\n return child;\n })}\n </Card.Body>\n );\n});\n\nBitkitStepsCardBody.displayName = 'BitkitStepsCardBody';\n\nexport interface BitkitStepsCardStepProps {\n children?: ReactNode;\n description?: string;\n title: string;\n}\n\ninterface BitkitStepsCardStepInternalProps extends BitkitStepsCardStepProps {\n _index?: number;\n}\n\nconst BitkitStepsCardStep = (props: BitkitStepsCardStepProps) => {\n const { _index = 0, children, description, title } = props as BitkitStepsCardStepInternalProps;\n const { step } = useStepCardContext() ?? { step: 0 };\n const styles = useStepsCardStyles();\n\n if (_index !== step) return null;\n\n return (\n <>\n <chakra.div css={styles.titleGroup}>\n <Card.Title css={styles.title}>{title}</Card.Title>\n {description && <Card.Description css={styles.description}>{description}</Card.Description>}\n </chakra.div>\n {children}\n </>\n );\n};\n\nBitkitStepsCardStep.displayName = 'BitkitStepsCardStep';\n\nexport interface BitkitStepsCardFooterProps extends Omit<CardFooterProps, 'children'> {\n children: ReactNode;\n}\n\nconst BitkitStepsCardFooter = forwardRef<HTMLDivElement, BitkitStepsCardFooterProps>((props, ref) => {\n const { children, ...rest } = props;\n const styles = useStepsCardStyles();\n\n return (\n <Card.Footer ref={ref} css={styles.footer} {...rest}>\n {children}\n </Card.Footer>\n );\n});\n\nBitkitStepsCardFooter.displayName = 'BitkitStepsCardFooter';\n\nexport default withSubComponents(BitkitStepsCard, {\n Body: BitkitStepsCardBody,\n Footer: BitkitStepsCardFooter,\n Header: BitkitStepsCardHeader,\n Step: BitkitStepsCardStep,\n});\n"],"mappings":";;;;;;;AAaA,IAAM,2BAA2B;CAE/B,OADe,cAAc,EAAE,KAAK,YAAY,CACzC,EAAO;AAChB;AAOA,IAAM,kBAAkB,YAAkD,OAAO,QAAQ;CACvF,MAAM,EAAE,UAAU,MAAM,GAAG,SAAS;CACpC,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,kBAAD;EAAkB,OAAO,EAAE,KAAK;YAC9B,oBAAC,KAAK,MAAN;GAAgB;GAAK,KAAK,OAAO;GAAM,UAAA;GAAS,GAAI;GACjD;EACQ,CAAA;CACK,CAAA;AAEtB,CAAC;AAED,gBAAgB,cAAc;AAM9B,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;EAC5C;CACU,CAAA;AAEjB,CAAC;AAED,sBAAsB,cAAc;AAMpC,IAAM,sBAAsB,YAAsD,OAAO,QAAQ;CAC/F,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,MAAN;EAAgB;EAAK,KAAK,OAAO;EAAM,GAAI;YACxC,SAAS,IAAI,WAAW,OAAO,UAAU;GACxC,IAAI,eAAe,KAAK,GACtB,OAAO,aAAa,OAA4C,EAAE,QAAQ,MAAM,CAAC;GAEnF,OAAO;EACT,CAAC;CACQ,CAAA;AAEf,CAAC;AAED,oBAAoB,cAAc;AAYlC,IAAM,uBAAuB,UAAoC;CAC/D,MAAM,EAAE,SAAS,GAAG,UAAU,aAAa,UAAU;CACrD,MAAM,EAAE,SAAS,mBAAmB,KAAK,EAAE,MAAM,EAAE;CACnD,MAAM,SAAS,mBAAmB;CAElC,IAAI,WAAW,MAAM,OAAO;CAE5B,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,qBAAC,OAAO,KAAR;EAAY,KAAK,OAAO;YAAxB,CACE,oBAAC,KAAK,OAAN;GAAY,KAAK,OAAO;aAAQ;EAAkB,CAAA,GACjD,eAAe,oBAAC,KAAK,aAAN;GAAkB,KAAK,OAAO;aAAc;EAA8B,CAAA,CAChF;KACX,QACD,EAAA,CAAA;AAEN;AAEA,oBAAoB,cAAc;AAMlC,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;EAC5C;CACU,CAAA;AAEjB,CAAC;AAED,sBAAsB,cAAc;AAEpC,IAAA,0BAAe,kBAAkB,iBAAiB;CAChD,MAAM;CACN,QAAQ;CACR,QAAQ;CACR,MAAM;AACR,CAAC"}
1
+ {"version":3,"file":"BitkitStepsCard.js","names":[],"sources":["../../../lib/components/BitkitStepsCard/BitkitStepsCard.tsx"],"sourcesContent":["import {\n Card,\n type CardBodyProps,\n type CardFooterProps,\n type CardHeaderProps,\n type CardRootProps,\n} from '@chakra-ui/react/card';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Children, cloneElement, forwardRef, isValidElement, type ReactElement, type ReactNode } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport { StepCardProvider, useStepCardContext } from './StepCardContext';\n\nconst useStepsCardStyles = () => {\n const recipe = useSlotRecipe({ key: 'stepsCard' });\n return recipe();\n};\n\nexport interface BitkitStepsCardProps extends Omit<CardRootProps, 'children' | 'title'> {\n children: ReactNode;\n step: number;\n}\n\nconst BitkitStepsCard = forwardRef<HTMLDivElement, BitkitStepsCardProps>((props, ref) => {\n const { children, step, ...rest } = props;\n const styles = useStepsCardStyles();\n\n return (\n <StepCardProvider value={{ step }}>\n <Card.Root ref={ref} css={styles.root} unstyled {...rest}>\n {children}\n </Card.Root>\n </StepCardProvider>\n );\n});\n\nBitkitStepsCard.displayName = 'BitkitStepsCard';\n\nexport interface BitkitStepsCardHeaderProps extends Omit<CardHeaderProps, 'children'> {\n children: ReactNode;\n}\n\nconst BitkitStepsCardHeader = forwardRef<HTMLDivElement, BitkitStepsCardHeaderProps>((props, ref) => {\n const { children, ...rest } = props;\n const styles = useStepsCardStyles();\n\n return (\n <Card.Header ref={ref} css={styles.header} {...rest}>\n {children}\n </Card.Header>\n );\n});\n\nBitkitStepsCardHeader.displayName = 'BitkitStepsCardHeader';\n\nexport interface BitkitStepsCardBodyProps extends Omit<CardBodyProps, 'children'> {\n children: ReactNode;\n}\n\nconst BitkitStepsCardBody = forwardRef<HTMLDivElement, BitkitStepsCardBodyProps>((props, ref) => {\n const { children, ...rest } = props;\n const styles = useStepsCardStyles();\n\n return (\n <Card.Body ref={ref} css={styles.body} {...rest}>\n {Children.map(children, (child, index) => {\n if (isValidElement(child)) {\n return cloneElement(child as ReactElement<{ _index?: number }>, { _index: index });\n }\n return child;\n })}\n </Card.Body>\n );\n});\n\nBitkitStepsCardBody.displayName = 'BitkitStepsCardBody';\n\nexport interface BitkitStepsCardStepProps {\n children?: ReactNode;\n description?: string;\n title: string;\n}\n\ninterface BitkitStepsCardStepInternalProps extends BitkitStepsCardStepProps {\n _index?: number;\n}\n\nconst BitkitStepsCardStep = (props: BitkitStepsCardStepProps) => {\n const { _index = 0, children, description, title } = props as BitkitStepsCardStepInternalProps;\n const { step } = useStepCardContext() ?? { step: 0 };\n const styles = useStepsCardStyles();\n\n if (_index !== step) return null;\n\n return (\n <>\n <chakra.div css={styles.titleGroup}>\n <Card.Title css={styles.title}>{title}</Card.Title>\n {description && <Card.Description css={styles.description}>{description}</Card.Description>}\n </chakra.div>\n {children}\n </>\n );\n};\n\nBitkitStepsCardStep.displayName = 'BitkitStepsCardStep';\n\nexport interface BitkitStepsCardFooterProps extends Omit<CardFooterProps, 'children'> {\n children: ReactNode;\n}\n\nconst BitkitStepsCardFooter = forwardRef<HTMLDivElement, BitkitStepsCardFooterProps>((props, ref) => {\n const { children, ...rest } = props;\n const styles = useStepsCardStyles();\n\n return (\n <Card.Footer ref={ref} css={styles.footer} {...rest}>\n {children}\n </Card.Footer>\n );\n});\n\nBitkitStepsCardFooter.displayName = 'BitkitStepsCardFooter';\n\nexport default withSubComponents(BitkitStepsCard, {\n Body: BitkitStepsCardBody,\n Footer: BitkitStepsCardFooter,\n Header: BitkitStepsCardHeader,\n Step: BitkitStepsCardStep,\n});\n"],"mappings":";;;;;;;AAaA,IAAM,2BAA2B;CAE/B,OADe,cAAc,EAAE,KAAK,YAAY,CACzC,CAAA,CAAO;AAChB;AAOA,IAAM,kBAAkB,YAAkD,OAAO,QAAQ;CACvF,MAAM,EAAE,UAAU,MAAM,GAAG,SAAS;CACpC,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,kBAAD;EAAkB,OAAO,EAAE,KAAK;YAC9B,oBAAC,KAAK,MAAN;GAAgB;GAAK,KAAK,OAAO;GAAM,UAAA;GAAS,GAAI;GACjD;EACQ,CAAA;CACK,CAAA;AAEtB,CAAC;AAED,gBAAgB,cAAc;AAM9B,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;EAC5C;CACU,CAAA;AAEjB,CAAC;AAED,sBAAsB,cAAc;AAMpC,IAAM,sBAAsB,YAAsD,OAAO,QAAQ;CAC/F,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,MAAN;EAAgB;EAAK,KAAK,OAAO;EAAM,GAAI;YACxC,SAAS,IAAI,WAAW,OAAO,UAAU;GACxC,IAAI,eAAe,KAAK,GACtB,OAAO,aAAa,OAA4C,EAAE,QAAQ,MAAM,CAAC;GAEnF,OAAO;EACT,CAAC;CACQ,CAAA;AAEf,CAAC;AAED,oBAAoB,cAAc;AAYlC,IAAM,uBAAuB,UAAoC;CAC/D,MAAM,EAAE,SAAS,GAAG,UAAU,aAAa,UAAU;CACrD,MAAM,EAAE,SAAS,mBAAmB,KAAK,EAAE,MAAM,EAAE;CACnD,MAAM,SAAS,mBAAmB;CAElC,IAAI,WAAW,MAAM,OAAO;CAE5B,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,qBAAC,OAAO,KAAR;EAAY,KAAK,OAAO;YAAxB,CACE,oBAAC,KAAK,OAAN;GAAY,KAAK,OAAO;aAAQ;EAAkB,CAAA,GACjD,eAAe,oBAAC,KAAK,aAAN;GAAkB,KAAK,OAAO;aAAc;EAA8B,CAAA,CAChF;KACX,QACD,EAAA,CAAA;AAEN;AAEA,oBAAoB,cAAc;AAMlC,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;EAC5C;CACU,CAAA;AAEjB,CAAC;AAED,sBAAsB,cAAc;AAEpC,IAAA,0BAAe,kBAAkB,iBAAiB;CAChD,MAAM;CACN,QAAQ;CACR,QAAQ;CACR,MAAM;AACR,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"BitkitSwitch.js","names":[],"sources":["../../../lib/components/BitkitSwitch/BitkitSwitch.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Switch } from '@chakra-ui/react/switch';\nimport { forwardRef } from 'react';\n\nimport { IconCheck, IconCross } from '../../icons';\nimport type { BitkitSwitchDefaultProps, BitkitSwitchDynamicTextProps, BitkitSwitchProps } from './BitkitSwitch.types';\nimport BitkitSwitchHelperText from './components/BitkitSwitchHelperText';\nimport BitkitSwitchLabel from './components/BitkitSwitchLabel';\nimport BitkitSwitchReadOnly from './components/BitkitSwitchReadOnly';\nimport BitkitSwitchValueText from './components/BitkitSwitchValueText';\n\nconst BitkitSwitchDefault = forwardRef<HTMLInputElement, Omit<BitkitSwitchDefaultProps, 'variant'>>((props, ref) => {\n const { label, size = 'lg', state = 'default', ...rest } = props;\n\n return (\n <Switch.Root\n size={size}\n readOnly={state === 'readOnly'}\n disabled={state === 'disabled' || state === 'skeleton'}\n {...rest}\n >\n <Switch.HiddenInput ref={ref} />\n <BitkitSwitchReadOnly state={state}>\n <Skeleton loading={state === 'skeleton'} borderRadius=\"12\" height={size === 'md' ? '16' : '24'}>\n <Switch.Control>\n <Switch.Thumb />\n <Switch.Indicator fallback={<IconCross size={size === 'md' ? '16' : '24'} />}>\n <IconCheck size={size === 'md' ? '16' : '24'} />\n </Switch.Indicator>\n </Switch.Control>\n </Skeleton>\n </BitkitSwitchReadOnly>\n {label && <Switch.Label>{label}</Switch.Label>}\n </Switch.Root>\n );\n});\n\nBitkitSwitchDefault.displayName = 'BitkitSwitchDefault';\n\nconst BitkitSwitchDynamicText = forwardRef<HTMLInputElement, Omit<BitkitSwitchDynamicTextProps, 'variant'>>(\n (props, ref) => {\n const { label, optional, tooltip, helperText, valueText, size = 'lg', state = 'default', ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'switch' });\n const styles = recipe({ size });\n\n return (\n <Switch.Root\n gap=\"4\"\n size={size}\n required={!optional}\n flexDirection=\"column\"\n alignItems=\"flex-start\"\n readOnly={state === 'readOnly'}\n disabled={state === 'disabled' || state === 'disabledInput' || state === 'skeleton'}\n {...rest}\n >\n <Switch.HiddenInput ref={ref} />\n <BitkitSwitchLabel label={label} state={state} tooltip={tooltip} optional={optional} />\n <Box css={styles.root}>\n <BitkitSwitchReadOnly state={state}>\n <Skeleton loading={state === 'skeleton'} borderRadius=\"12\" height={size === 'md' ? '16' : '24'}>\n <Switch.Control>\n <Switch.Thumb />\n <Switch.Indicator fallback={<IconCross size={size === 'md' ? '16' : '24'} />}>\n <IconCheck size={size === 'md' ? '16' : '24'} />\n </Switch.Indicator>\n </Switch.Control>\n </Skeleton>\n </BitkitSwitchReadOnly>\n <BitkitSwitchValueText size={size} state={state} valueText={valueText} />\n </Box>\n <BitkitSwitchHelperText state={state} helperText={helperText} />\n </Switch.Root>\n );\n },\n);\n\nBitkitSwitchDynamicText.displayName = 'BitkitSwitchDynamicText';\n\nconst BitkitSwitch = forwardRef<HTMLInputElement, BitkitSwitchProps>((props, ref) => {\n if (props.variant === 'dynamic-text') {\n const { variant: _variant, ...rest } = props;\n return <BitkitSwitchDynamicText ref={ref} {...rest} />;\n }\n\n // Default variant. At runtime (e.g. a shared Storybook meta) sibling-variant props may still\n // flow in, so strip them explicitly before forwarding to avoid leaking to the DOM.\n const {\n variant: _variant,\n helperText: _helperText,\n optional: _optional,\n tooltip: _tooltip,\n valueText: _valueText,\n ...rest\n } = props as unknown as BitkitSwitchDynamicTextProps;\n return <BitkitSwitchDefault ref={ref} {...(rest as Omit<BitkitSwitchDefaultProps, 'variant'>)} />;\n});\n\nBitkitSwitch.displayName = 'BitkitSwitch';\n\nexport default BitkitSwitch;\n"],"mappings":";;;;;;;;;;;;;AAaA,IAAM,sBAAsB,YAAyE,OAAO,QAAQ;CAClH,MAAM,EAAE,OAAO,OAAO,MAAM,QAAQ,WAAW,GAAG,SAAS;CAE3D,OACE,qBAAC,OAAO,MAAR;EACQ;EACN,UAAU,UAAU;EACpB,UAAU,UAAU,cAAc,UAAU;EAC5C,GAAI;YAJN;GAME,oBAAC,OAAO,aAAR,EAAyB,IAAM,CAAA;GAC/B,oBAAC,sBAAD;IAA6B;cAC3B,oBAAC,UAAD;KAAU,SAAS,UAAU;KAAY,cAAa;KAAK,QAAQ,SAAS,OAAO,OAAO;eACxF,qBAAC,OAAO,SAAR,EAAA,UAAA,CACE,oBAAC,OAAO,OAAR,CAAe,CAAA,GACf,oBAAC,OAAO,WAAR;MAAkB,UAAU,oBAAC,WAAD,EAAW,MAAM,SAAS,OAAO,OAAO,KAAO,CAAA;gBACzE,oBAAC,WAAD,EAAW,MAAM,SAAS,OAAO,OAAO,KAAO,CAAA;KAC/B,CAAA,CACJ,EAAA,CAAA;IACR,CAAA;GACU,CAAA;GACrB,SAAS,oBAAC,OAAO,OAAR,EAAA,UAAe,MAAoB,CAAA;EAClC;;AAEjB,CAAC;AAED,oBAAoB,cAAc;AAElC,IAAM,0BAA0B,YAC7B,OAAO,QAAQ;CACd,MAAM,EAAE,OAAO,UAAU,SAAS,YAAY,WAAW,OAAO,MAAM,QAAQ,WAAW,GAAG,SAAS;CAGrG,MAAM,SADS,cAAc,EAAE,KAAK,SAAS,CAC9B,EAAO,EAAE,KAAK,CAAC;CAE9B,OACE,qBAAC,OAAO,MAAR;EACE,KAAI;EACE;EACN,UAAU,CAAC;EACX,eAAc;EACd,YAAW;EACX,UAAU,UAAU;EACpB,UAAU,UAAU,cAAc,UAAU,mBAAmB,UAAU;EACzE,GAAI;YARN;GAUE,oBAAC,OAAO,aAAR,EAAyB,IAAM,CAAA;GAC/B,oBAAC,mBAAD;IAA0B;IAAc;IAAgB;IAAmB;GAAW,CAAA;GACtF,qBAAC,KAAD;IAAK,KAAK,OAAO;cAAjB,CACE,oBAAC,sBAAD;KAA6B;eAC3B,oBAAC,UAAD;MAAU,SAAS,UAAU;MAAY,cAAa;MAAK,QAAQ,SAAS,OAAO,OAAO;gBACxF,qBAAC,OAAO,SAAR,EAAA,UAAA,CACE,oBAAC,OAAO,OAAR,CAAe,CAAA,GACf,oBAAC,OAAO,WAAR;OAAkB,UAAU,oBAAC,WAAD,EAAW,MAAM,SAAS,OAAO,OAAO,KAAO,CAAA;iBACzE,oBAAC,WAAD,EAAW,MAAM,SAAS,OAAO,OAAO,KAAO,CAAA;MAC/B,CAAA,CACJ,EAAA,CAAA;KACR,CAAA;IACU,CAAA,GACtB,oBAAC,uBAAD;KAA6B;KAAa;KAAkB;IAAY,CAAA,CACrE;;GACL,oBAAC,wBAAD;IAA+B;IAAmB;GAAa,CAAA;EACpD;;AAEjB,CACF;AAEA,wBAAwB,cAAc;AAEtC,IAAM,eAAe,YAAiD,OAAO,QAAQ;CACnF,IAAI,MAAM,YAAY,gBAAgB;EACpC,MAAM,EAAE,SAAS,UAAU,GAAG,SAAS;EACvC,OAAO,oBAAC,yBAAD;GAA8B;GAAK,GAAI;EAAO,CAAA;CACvD;CAIA,MAAM,EACJ,SAAS,UACT,YAAY,aACZ,UAAU,WACV,SAAS,UACT,WAAW,YACX,GAAG,SACD;CACJ,OAAO,oBAAC,qBAAD;EAA0B;EAAK,GAAK;CAAqD,CAAA;AAClG,CAAC;AAED,aAAa,cAAc"}
1
+ {"version":3,"file":"BitkitSwitch.js","names":[],"sources":["../../../lib/components/BitkitSwitch/BitkitSwitch.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Switch } from '@chakra-ui/react/switch';\nimport { forwardRef } from 'react';\n\nimport { IconCheck, IconCross } from '../../icons';\nimport type { BitkitSwitchDefaultProps, BitkitSwitchDynamicTextProps, BitkitSwitchProps } from './BitkitSwitch.types';\nimport BitkitSwitchHelperText from './components/BitkitSwitchHelperText';\nimport BitkitSwitchLabel from './components/BitkitSwitchLabel';\nimport BitkitSwitchReadOnly from './components/BitkitSwitchReadOnly';\nimport BitkitSwitchValueText from './components/BitkitSwitchValueText';\n\nconst BitkitSwitchDefault = forwardRef<HTMLInputElement, Omit<BitkitSwitchDefaultProps, 'variant'>>((props, ref) => {\n const { label, size = 'lg', state = 'default', ...rest } = props;\n\n return (\n <Switch.Root\n size={size}\n readOnly={state === 'readOnly'}\n disabled={state === 'disabled' || state === 'skeleton'}\n {...rest}\n >\n <Switch.HiddenInput ref={ref} />\n <BitkitSwitchReadOnly state={state}>\n <Skeleton loading={state === 'skeleton'} borderRadius=\"12\" height={size === 'md' ? '16' : '24'}>\n <Switch.Control>\n <Switch.Thumb />\n <Switch.Indicator fallback={<IconCross size={size === 'md' ? '16' : '24'} />}>\n <IconCheck size={size === 'md' ? '16' : '24'} />\n </Switch.Indicator>\n </Switch.Control>\n </Skeleton>\n </BitkitSwitchReadOnly>\n {label && <Switch.Label>{label}</Switch.Label>}\n </Switch.Root>\n );\n});\n\nBitkitSwitchDefault.displayName = 'BitkitSwitchDefault';\n\nconst BitkitSwitchDynamicText = forwardRef<HTMLInputElement, Omit<BitkitSwitchDynamicTextProps, 'variant'>>(\n (props, ref) => {\n const { label, optional, tooltip, helperText, valueText, size = 'lg', state = 'default', ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'switch' });\n const styles = recipe({ size });\n\n return (\n <Switch.Root\n gap=\"4\"\n size={size}\n required={!optional}\n flexDirection=\"column\"\n alignItems=\"flex-start\"\n readOnly={state === 'readOnly'}\n disabled={state === 'disabled' || state === 'disabledInput' || state === 'skeleton'}\n {...rest}\n >\n <Switch.HiddenInput ref={ref} />\n <BitkitSwitchLabel label={label} state={state} tooltip={tooltip} optional={optional} />\n <Box css={styles.root}>\n <BitkitSwitchReadOnly state={state}>\n <Skeleton loading={state === 'skeleton'} borderRadius=\"12\" height={size === 'md' ? '16' : '24'}>\n <Switch.Control>\n <Switch.Thumb />\n <Switch.Indicator fallback={<IconCross size={size === 'md' ? '16' : '24'} />}>\n <IconCheck size={size === 'md' ? '16' : '24'} />\n </Switch.Indicator>\n </Switch.Control>\n </Skeleton>\n </BitkitSwitchReadOnly>\n <BitkitSwitchValueText size={size} state={state} valueText={valueText} />\n </Box>\n <BitkitSwitchHelperText state={state} helperText={helperText} />\n </Switch.Root>\n );\n },\n);\n\nBitkitSwitchDynamicText.displayName = 'BitkitSwitchDynamicText';\n\nconst BitkitSwitch = forwardRef<HTMLInputElement, BitkitSwitchProps>((props, ref) => {\n if (props.variant === 'dynamic-text') {\n const { variant: _variant, ...rest } = props;\n return <BitkitSwitchDynamicText ref={ref} {...rest} />;\n }\n\n // Default variant. At runtime (e.g. a shared Storybook meta) sibling-variant props may still\n // flow in, so strip them explicitly before forwarding to avoid leaking to the DOM.\n const {\n variant: _variant,\n helperText: _helperText,\n optional: _optional,\n tooltip: _tooltip,\n valueText: _valueText,\n ...rest\n } = props as unknown as BitkitSwitchDynamicTextProps;\n return <BitkitSwitchDefault ref={ref} {...(rest as Omit<BitkitSwitchDefaultProps, 'variant'>)} />;\n});\n\nBitkitSwitch.displayName = 'BitkitSwitch';\n\nexport default BitkitSwitch;\n"],"mappings":";;;;;;;;;;;;;AAaA,IAAM,sBAAsB,YAAyE,OAAO,QAAQ;CAClH,MAAM,EAAE,OAAO,OAAO,MAAM,QAAQ,WAAW,GAAG,SAAS;CAE3D,OACE,qBAAC,OAAO,MAAR;EACQ;EACN,UAAU,UAAU;EACpB,UAAU,UAAU,cAAc,UAAU;EAC5C,GAAI;YAJN;GAME,oBAAC,OAAO,aAAR,EAAyB,IAAM,CAAA;GAC/B,oBAAC,sBAAD;IAA6B;cAC3B,oBAAC,UAAD;KAAU,SAAS,UAAU;KAAY,cAAa;KAAK,QAAQ,SAAS,OAAO,OAAO;eACxF,qBAAC,OAAO,SAAR,EAAA,UAAA,CACE,oBAAC,OAAO,OAAR,CAAe,CAAA,GACf,oBAAC,OAAO,WAAR;MAAkB,UAAU,oBAAC,WAAD,EAAW,MAAM,SAAS,OAAO,OAAO,KAAO,CAAA;gBACzE,oBAAC,WAAD,EAAW,MAAM,SAAS,OAAO,OAAO,KAAO,CAAA;KAC/B,CAAA,CACJ,EAAA,CAAA;IACR,CAAA;GACU,CAAA;GACrB,SAAS,oBAAC,OAAO,OAAR,EAAA,UAAe,MAAoB,CAAA;EAClC;;AAEjB,CAAC;AAED,oBAAoB,cAAc;AAElC,IAAM,0BAA0B,YAC7B,OAAO,QAAQ;CACd,MAAM,EAAE,OAAO,UAAU,SAAS,YAAY,WAAW,OAAO,MAAM,QAAQ,WAAW,GAAG,SAAS;CAGrG,MAAM,SADS,cAAc,EAAE,KAAK,SAAS,CAC9B,CAAA,CAAO,EAAE,KAAK,CAAC;CAE9B,OACE,qBAAC,OAAO,MAAR;EACE,KAAI;EACE;EACN,UAAU,CAAC;EACX,eAAc;EACd,YAAW;EACX,UAAU,UAAU;EACpB,UAAU,UAAU,cAAc,UAAU,mBAAmB,UAAU;EACzE,GAAI;YARN;GAUE,oBAAC,OAAO,aAAR,EAAyB,IAAM,CAAA;GAC/B,oBAAC,mBAAD;IAA0B;IAAc;IAAgB;IAAmB;GAAW,CAAA;GACtF,qBAAC,KAAD;IAAK,KAAK,OAAO;cAAjB,CACE,oBAAC,sBAAD;KAA6B;eAC3B,oBAAC,UAAD;MAAU,SAAS,UAAU;MAAY,cAAa;MAAK,QAAQ,SAAS,OAAO,OAAO;gBACxF,qBAAC,OAAO,SAAR,EAAA,UAAA,CACE,oBAAC,OAAO,OAAR,CAAe,CAAA,GACf,oBAAC,OAAO,WAAR;OAAkB,UAAU,oBAAC,WAAD,EAAW,MAAM,SAAS,OAAO,OAAO,KAAO,CAAA;iBACzE,oBAAC,WAAD,EAAW,MAAM,SAAS,OAAO,OAAO,KAAO,CAAA;MAC/B,CAAA,CACJ,EAAA,CAAA;KACR,CAAA;IACU,CAAA,GACtB,oBAAC,uBAAD;KAA6B;KAAa;KAAkB;IAAY,CAAA,CACrE;;GACL,oBAAC,wBAAD;IAA+B;IAAmB;GAAa,CAAA;EACpD;;AAEjB,CACF;AAEA,wBAAwB,cAAc;AAEtC,IAAM,eAAe,YAAiD,OAAO,QAAQ;CACnF,IAAI,MAAM,YAAY,gBAAgB;EACpC,MAAM,EAAE,SAAS,UAAU,GAAG,SAAS;EACvC,OAAO,oBAAC,yBAAD;GAA8B;GAAK,GAAI;EAAO,CAAA;CACvD;CAIA,MAAM,EACJ,SAAS,UACT,YAAY,aACZ,UAAU,WACV,SAAS,UACT,WAAW,YACX,GAAG,SACD;CACJ,OAAO,oBAAC,qBAAD;EAA0B;EAAK,GAAK;CAAqD,CAAA;AAClG,CAAC;AAED,aAAa,cAAc"}
@@ -313,6 +313,6 @@ BitkitTabs.Content.displayName = "BitkitTabs.Content";
313
313
  BitkitTabs.ContentGroup.displayName = "BitkitTabs.ContentGroup";
314
314
  BitkitTabs.Root.displayName = "BitkitTabs.Root";
315
315
  //#endregion
316
- export { BitkitTabs as default };
316
+ export { RootPropsProvider, BitkitTabs as default, useRootPropsContext };
317
317
 
318
318
  //# sourceMappingURL=BitkitTabs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"BitkitTabs.js","names":[],"sources":["../../../lib/components/BitkitTabs/BitkitTabs.tsx"],"sourcesContent":["// eslint-disable-next-line no-restricted-imports\nimport { createContext, mergeRefs, useSafeLayoutEffect } from '@chakra-ui/react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Menu } from '@chakra-ui/react/menu';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { chakra, useRecipe } from '@chakra-ui/react/styled-system';\nimport { Tabs, useTabsContext, useTabsStyles } from '@chakra-ui/react/tabs';\nimport { Text } from '@chakra-ui/react/text';\nimport {\n Children,\n cloneElement,\n forwardRef,\n Fragment,\n isValidElement,\n type KeyboardEvent,\n type MouseEvent,\n type ReactElement,\n type ReactNode,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport { type BitkitIconComponent, IconCross, IconPlus } from '../../icons';\nimport BitkitControlButton, { type BitkitControlButtonProps } from '../BitkitControlButton/BitkitControlButton';\n\n/**\n * Root props. `onValueChange` is re-declared with a concrete `{ value }` arg so the callback\n * parameter is inferred at the call site: the base `Tabs.RootProps` intersection breaks\n * contextual typing, which otherwise leaves consumers' `({ value }) => …` flagged as an\n * implicit `any` under `noImplicitAny`.\n */\nexport type BitkitTabsRootProps = Omit<Tabs.RootProps, 'onValueChange'> & {\n onValueChange?: (details: { value: string }) => void;\n};\n\nexport const [RootPropsProvider, useRootPropsContext] = createContext<BitkitTabsRootProps>({\n name: 'RootPropsContext',\n hookName: 'useRootPropsContext',\n providerName: '<RootProps />',\n});\n\nconst Root = forwardRef<HTMLDivElement, BitkitTabsRootProps>((props, ref) => {\n return (\n <RootPropsProvider value={props}>\n <Tabs.Root ref={ref} {...props} />\n </RootPropsProvider>\n );\n});\n\n/** Status-dot colors for the `canvas` variant. */\nexport type BitkitTabsStatusColor = 'neutral' | 'purple' | 'red' | 'yellow';\n\nconst STATUS_COLOR_TOKEN: Record<BitkitTabsStatusColor, string> = {\n neutral: 'color/neutral/muted',\n purple: 'interactive/bold',\n red: 'color/red/base',\n yellow: 'color/yellow/bold',\n};\n\ntype TriggerProps = Tabs.TriggerProps & {\n badge?: ReactNode;\n children?: string;\n icon?: BitkitIconComponent;\n /** `canvas` variant only — when provided, a close button reveals on hover and calls this handler when clicked. */\n onClose?: () => void;\n secondaryText?: ReactNode;\n /** `canvas` variant only — shows a status indicator dot. When hovered (and `onClose` is set), the close button replaces it. */\n statusColor?: BitkitTabsStatusColor;\n};\n\nRoot.displayName = 'BitkitTabs.Root';\n\nconst Trigger = forwardRef<HTMLButtonElement, TriggerProps>((props, ref) => {\n const { badge, children, className, icon: Icon, onClose, onKeyDown, secondaryText, statusColor, ...rest } = props;\n // Mirror the recipe's defaultVariant so an unset `variant` renders the line layout (not the\n // contained one) — otherwise an undefined variant would fall through to the contained branch.\n const { variant = 'line' } = useRootPropsContext();\n const closeButtonRecipe = useRecipe({ key: 'closeButton' });\n\n // Close button and status dot are exclusive to the canvas variant.\n const isCanvas = variant === 'canvas';\n const closable = isCanvas && !!onClose && !rest.disabled;\n const hasStatus = isCanvas && !!statusColor && !rest.disabled;\n const showTrailing = closable || hasStatus;\n const mergedClassName = showTrailing ? (className ? `group ${className}` : 'group') : className;\n // The close button is always visible when there is no status dot; when the dot is shown it is\n // revealed on hover/focus instead (replacing the dot).\n const revealCloseOnInteraction = closable && hasStatus;\n const revealOnInteraction = { opacity: 1, pointerEvents: 'auto' } as const;\n\n const handleCloseClick = (event: MouseEvent<HTMLSpanElement>) => {\n event.stopPropagation();\n event.preventDefault();\n onClose?.();\n };\n\n // The close control is not in the tab order; keyboard users close the focused tab with Delete/Backspace.\n const handleTriggerKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (closable && (event.key === 'Delete' || event.key === 'Backspace')) {\n event.preventDefault();\n // Move focus to a sibling tab before removal so keyboard navigation can continue.\n const trigger = event.currentTarget;\n // Skip overflowed (`hidden`) tabs — they aren't focusable.\n const triggers = [\n ...(trigger.closest('[role=\"tablist\"]')?.querySelectorAll<HTMLElement>('[role=\"tab\"]:not([hidden])') ?? []),\n ];\n const index = triggers.indexOf(trigger);\n (triggers[index + 1] ?? triggers[index - 1])?.focus();\n onClose?.();\n }\n onKeyDown?.(event);\n };\n\n const trailing = showTrailing ? (\n <chakra.span\n position=\"relative\"\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n boxSize=\"24\"\n flexShrink={0}\n >\n {hasStatus && statusColor && (\n <chakra.span\n position=\"absolute\"\n inset={0}\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n pointerEvents=\"none\"\n transition=\"opacity 0.1s\"\n _groupHover={closable ? { opacity: 0 } : undefined}\n _groupFocusWithin={closable ? { opacity: 0 } : undefined}\n >\n <chakra.span boxSize=\"8\" borderRadius=\"full\" backgroundColor={STATUS_COLOR_TOKEN[statusColor]} />\n </chakra.span>\n )}\n {closable && (\n <chakra.span\n aria-hidden\n tabIndex={-1}\n onClick={handleCloseClick}\n css={closeButtonRecipe({ size: 'xs' })}\n position=\"absolute\"\n inset={0}\n color=\"icon/primary\"\n opacity={revealCloseOnInteraction ? 0 : 1}\n pointerEvents={revealCloseOnInteraction ? 'none' : 'auto'}\n transition=\"opacity 0.1s\"\n _groupHover={revealCloseOnInteraction ? revealOnInteraction : undefined}\n _groupFocusWithin={revealCloseOnInteraction ? revealOnInteraction : undefined}\n >\n <IconCross size=\"16\" />\n </chakra.span>\n )}\n </chakra.span>\n ) : null;\n\n return (\n <Tabs.Trigger\n ref={ref}\n {...rest}\n className={mergedClassName}\n gap={isCanvas ? '4' : showTrailing ? '12' : undefined}\n onKeyDown={handleTriggerKeyDown}\n paddingInlineEnd={isCanvas ? (showTrailing ? '8' : undefined) : showTrailing ? '12' : undefined}\n paddingInlineStart={isCanvas && Icon ? '8' : undefined}\n >\n {isCanvas ? (\n <>\n <Box display=\"flex\" alignItems=\"center\" gap=\"8\">\n {Icon && <Icon size=\"16\" />}\n {children}\n </Box>\n {trailing}\n </>\n ) : variant === 'line' ? (\n <>\n <Box display=\"flex\" alignItems=\"center\" gap=\"8\">\n {Icon && <Icon size=\"24\" />}\n {children}\n {badge}\n </Box>\n {trailing}\n </>\n ) : (\n <>\n <Box display=\"flex\" gap=\"16\">\n {children}\n {Icon && <Icon size=\"24\" />}\n </Box>\n {!!secondaryText && (\n <Text as=\"span\" textStyle=\"body/md/regular\" color={rest.disabled ? 'text/on-disabled' : 'text/secondary'}>\n {secondaryText}\n </Text>\n )}\n {trailing}\n </>\n )}\n </Tabs.Trigger>\n );\n});\n\nTrigger.displayName = 'BitkitTabs.Trigger';\n\ntype TabItem = ReactElement<TriggerProps>;\n\n// Flattens children to a list of elements, unwrapping fragments so a Trigger grouped inside a\n// fragment (e.g. conditional rendering) isn't silently dropped.\nconst flattenChildren = (nodes: ReactNode): ReactElement[] =>\n Children.toArray(nodes).flatMap((child) => {\n if (!isValidElement(child)) return [];\n if (child.type === Fragment) return flattenChildren((child.props as { children?: ReactNode }).children);\n return [child];\n });\n\n// Returns the set of visible tab indices for the overflow, always keeping the selected tab\n// visible: if it would overflow, it takes the last visible slot.\nconst getVisibleIndices = (total: number, count: number, selectedIndex: number) => {\n const visible = new Set<number>();\n for (let i = 0; i < count; i += 1) visible.add(i);\n if (selectedIndex >= 0 && selectedIndex < total && !visible.has(selectedIndex)) {\n visible.delete(count - 1);\n visible.add(selectedIndex);\n }\n return visible;\n};\n\nexport type BitkitTabsAddButtonProps = Omit<\n Extract<BitkitControlButtonProps, { href?: undefined }>,\n 'icon' | 'label' | 'size'\n> & {\n /** Accessible label / tooltip for the add button. */\n label?: string;\n};\n\n// \"+\" button to add a tab. Place it as a child of `List`; it always renders at the end of the row\n// (after the overflow menu). A compact `xxs` control button (16px icon, 4px padding) per the design.\nconst AddButton = forwardRef<HTMLButtonElement, BitkitTabsAddButtonProps>((props, ref) => {\n const { label = 'Add tab', ...rest } = props;\n return <BitkitControlButton ref={ref} icon={IconPlus} label={label} size=\"xxs\" {...rest} />;\n});\n\nAddButton.displayName = 'BitkitTabs.AddButton';\n\n// Overflow-aware List (all variants): measures the tabs and collapses the overflowing ones into a\n// \"N more…\" menu. The more-button look comes from the variant's `moreTrigger` recipe slot.\nconst List = forwardRef<HTMLDivElement, Tabs.ListProps>((props, ref) => {\n // Semantic/labelling attributes belong on the actual tablist, not the visual wrapper.\n const { children, id, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby, ...rest } = props;\n const { variant = 'line' } = useRootPropsContext();\n const api = useTabsContext();\n const styles = useTabsStyles();\n\n // Split children: tab triggers participate in overflow; the optional add button always renders last.\n const allChildren = flattenChildren(children);\n const addButton = allChildren.find((child) => child.type === AddButton) ?? null;\n // Only Trigger elements are measured/overflowed; anything else (fragments, stray nodes) is ignored.\n const items = allChildren.filter((child) => child.type === Trigger) as TabItem[];\n // Re-measure whenever the tab set OR any width-affecting input changes — the variant, each tab's\n // value/label, icon/status/close/disabled state, and badge/secondaryText content (best-effort\n // string form, so width-changing text like \"3 errors\" → \"12 errors\" invalidates the cache).\n const measureKey =\n variant +\n items\n .map((item) => {\n const p = item.props;\n return [\n p.value,\n String(p.children),\n p.icon ? 'i' : '',\n p.badge ? String(p.badge) : '',\n p.secondaryText ? String(p.secondaryText) : '',\n p.statusColor ?? '',\n p.onClose ? 'c' : '',\n p.disabled ? 'd' : '',\n ].join(':');\n })\n .join('|');\n const selectedIndex = items.findIndex((item) => item.props.value === api.value);\n // Conservative width reservations: the more button (wider for the lg/semibold variants) and the\n // always-visible add button.\n const moreReserve = variant === 'canvas' ? 100 : 140;\n const addReserve = addButton ? 48 : 0;\n\n const listRef = useRef<HTMLDivElement | null>(null);\n const widthsRef = useRef<number[]>([]);\n // Horizontal padding of the list, cached during the measure pass so the resize hot path doesn't\n // call getComputedStyle on every tick.\n const paddingRef = useRef(0);\n // `measuredKey` is state (not a ref) so finishing the measure pass always re-renders and flips\n // `measuring` off — even when recompute keeps the same visibleCount (which would skip a re-render).\n const [measuredKey, setMeasuredKey] = useState<string | null>(null);\n const [visibleCount, setVisibleCount] = useState(items.length);\n\n const setListRef = useMemo(() => mergeRefs(listRef, ref), [ref]);\n\n const recompute = useCallback(() => {\n const el = listRef.current;\n const widths = widthsRef.current;\n if (!el || !widths.length) return;\n const available = el.clientWidth - paddingRef.current - addReserve;\n const totalWidth = widths.reduce((sum, w) => sum + w, 0);\n if (totalWidth <= available) {\n setVisibleCount(widths.length);\n return;\n }\n let used = moreReserve;\n let count = 0;\n for (let i = 0; i < widths.length; i += 1) {\n if (used + widths[i] > available) break;\n used += widths[i];\n count += 1;\n }\n setVisibleCount(Math.max(count, 1));\n }, [addReserve, moreReserve]);\n\n // Measure once per width-affecting change (all tabs are rendered visible during this pass).\n // Isomorphic layout effect: avoids the SSR \"useLayoutEffect does nothing on the server\" warning.\n const measuring = measuredKey !== measureKey;\n useSafeLayoutEffect(() => {\n const el = listRef.current;\n if (!el) return;\n if (measuredKey !== measureKey) {\n const tabEls = el.querySelectorAll<HTMLElement>('[data-tab-trigger]');\n widthsRef.current = Array.from(tabEls, (node) => node.offsetWidth);\n const cs = getComputedStyle(el);\n paddingRef.current = parseFloat(cs.paddingLeft) + parseFloat(cs.paddingRight);\n setMeasuredKey(measureKey);\n }\n recompute();\n }, [measureKey, measuredKey, recompute]);\n\n useEffect(() => {\n const el = listRef.current;\n if (!el || typeof ResizeObserver === 'undefined') return;\n // Coalesce resize bursts into one recompute per frame to avoid a read/write layout storm.\n let raf = 0;\n const observer = new ResizeObserver(() => {\n cancelAnimationFrame(raf);\n raf = requestAnimationFrame(recompute);\n });\n observer.observe(el);\n return () => {\n cancelAnimationFrame(raf);\n observer.disconnect();\n };\n }, [recompute]);\n\n const showAll = measuring || visibleCount >= items.length;\n const visible = showAll ? null : getVisibleIndices(items.length, visibleCount, selectedIndex);\n const hiddenItems = visible ? items.filter((_, i) => !visible.has(i)) : [];\n\n return (\n // The visual row carries the list styling (background, baseline border, leading padding) and is\n // measured for overflow. The tablist itself only wraps the tabs (`display: contents` keeps the\n // flex layout intact), so the more/add controls stay outside `role=\"tablist\"` per the ARIA spec.\n <Box ref={setListRef} css={styles.list} {...rest}>\n <Tabs.List display=\"contents\" id={id} aria-label={ariaLabel} aria-labelledby={ariaLabelledby}>\n {items.map((item, i) =>\n cloneElement(item, {\n key: item.props.value,\n 'data-tab-trigger': '',\n hidden: visible ? !visible.has(i) : undefined,\n } as Partial<TriggerProps>),\n )}\n </Tabs.List>\n {hiddenItems.length > 0 && (\n <Menu.Root size=\"md\" positioning={{ gutter: 0, shift: -4 }}>\n <Menu.Trigger asChild>\n <chakra.button type=\"button\" css={styles.moreTrigger}>\n {hiddenItems.length} more…\n </chakra.button>\n </Menu.Trigger>\n <Portal>\n <Menu.Positioner>\n <Menu.Content>\n {hiddenItems.map((item) => (\n <Menu.Item\n key={item.props.value}\n value={item.props.value}\n disabled={item.props.disabled}\n onSelect={() => api.setValue(item.props.value)}\n alignItems=\"center\"\n >\n <Text flex=\"1\" color={item.props.disabled ? 'text/on-disabled' : 'inherit'}>\n {item.props.children}\n </Text>\n {variant === 'canvas' && item.props.statusColor && (\n <chakra.span\n boxSize=\"8\"\n borderRadius=\"full\"\n flexShrink={0}\n backgroundColor={STATUS_COLOR_TOKEN[item.props.statusColor]}\n />\n )}\n </Menu.Item>\n ))}\n </Menu.Content>\n </Menu.Positioner>\n </Portal>\n </Menu.Root>\n )}\n {addButton && (\n <Box display=\"flex\" alignItems=\"center\" flexShrink={0} paddingInline=\"8\">\n {addButton}\n </Box>\n )}\n </Box>\n );\n});\n\nList.displayName = 'BitkitTabs.List';\n\nconst BitkitTabs: Omit<typeof Tabs, 'Root' | 'Trigger' | 'List'> & {\n AddButton: typeof AddButton;\n List: typeof List;\n Root: typeof Root;\n Trigger: typeof Trigger;\n} = {\n ...Tabs,\n AddButton,\n List,\n Root,\n Trigger,\n};\n\nBitkitTabs.Content.displayName = 'BitkitTabs.Content';\nBitkitTabs.ContentGroup.displayName = 'BitkitTabs.ContentGroup';\nBitkitTabs.Root.displayName = 'BitkitTabs.Root';\n\nexport default BitkitTabs;\n"],"mappings":"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"}
1
+ {"version":3,"file":"BitkitTabs.js","names":[],"sources":["../../../lib/components/BitkitTabs/BitkitTabs.tsx"],"sourcesContent":["// eslint-disable-next-line no-restricted-imports\nimport { createContext, mergeRefs, useSafeLayoutEffect } from '@chakra-ui/react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Menu } from '@chakra-ui/react/menu';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { chakra, useRecipe } from '@chakra-ui/react/styled-system';\nimport { Tabs, useTabsContext, useTabsStyles } from '@chakra-ui/react/tabs';\nimport { Text } from '@chakra-ui/react/text';\nimport {\n Children,\n cloneElement,\n forwardRef,\n Fragment,\n isValidElement,\n type KeyboardEvent,\n type MouseEvent,\n type ReactElement,\n type ReactNode,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport { type BitkitIconComponent, IconCross, IconPlus } from '../../icons';\nimport BitkitControlButton, { type BitkitControlButtonProps } from '../BitkitControlButton/BitkitControlButton';\n\n/**\n * Root props. `onValueChange` is re-declared with a concrete `{ value }` arg so the callback\n * parameter is inferred at the call site: the base `Tabs.RootProps` intersection breaks\n * contextual typing, which otherwise leaves consumers' `({ value }) => …` flagged as an\n * implicit `any` under `noImplicitAny`.\n */\nexport type BitkitTabsRootProps = Omit<Tabs.RootProps, 'onValueChange'> & {\n onValueChange?: (details: { value: string }) => void;\n};\n\nexport const [RootPropsProvider, useRootPropsContext] = createContext<BitkitTabsRootProps>({\n name: 'RootPropsContext',\n hookName: 'useRootPropsContext',\n providerName: '<RootProps />',\n});\n\nconst Root = forwardRef<HTMLDivElement, BitkitTabsRootProps>((props, ref) => {\n return (\n <RootPropsProvider value={props}>\n <Tabs.Root ref={ref} {...props} />\n </RootPropsProvider>\n );\n});\n\n/** Status-dot colors for the `canvas` variant. */\nexport type BitkitTabsStatusColor = 'neutral' | 'purple' | 'red' | 'yellow';\n\nconst STATUS_COLOR_TOKEN: Record<BitkitTabsStatusColor, string> = {\n neutral: 'color/neutral/muted',\n purple: 'interactive/bold',\n red: 'color/red/base',\n yellow: 'color/yellow/bold',\n};\n\ntype TriggerProps = Tabs.TriggerProps & {\n badge?: ReactNode;\n children?: string;\n icon?: BitkitIconComponent;\n /** `canvas` variant only — when provided, a close button reveals on hover and calls this handler when clicked. */\n onClose?: () => void;\n secondaryText?: ReactNode;\n /** `canvas` variant only — shows a status indicator dot. When hovered (and `onClose` is set), the close button replaces it. */\n statusColor?: BitkitTabsStatusColor;\n};\n\nRoot.displayName = 'BitkitTabs.Root';\n\nconst Trigger = forwardRef<HTMLButtonElement, TriggerProps>((props, ref) => {\n const { badge, children, className, icon: Icon, onClose, onKeyDown, secondaryText, statusColor, ...rest } = props;\n // Mirror the recipe's defaultVariant so an unset `variant` renders the line layout (not the\n // contained one) — otherwise an undefined variant would fall through to the contained branch.\n const { variant = 'line' } = useRootPropsContext();\n const closeButtonRecipe = useRecipe({ key: 'closeButton' });\n\n // Close button and status dot are exclusive to the canvas variant.\n const isCanvas = variant === 'canvas';\n const closable = isCanvas && !!onClose && !rest.disabled;\n const hasStatus = isCanvas && !!statusColor && !rest.disabled;\n const showTrailing = closable || hasStatus;\n const mergedClassName = showTrailing ? (className ? `group ${className}` : 'group') : className;\n // The close button is always visible when there is no status dot; when the dot is shown it is\n // revealed on hover/focus instead (replacing the dot).\n const revealCloseOnInteraction = closable && hasStatus;\n const revealOnInteraction = { opacity: 1, pointerEvents: 'auto' } as const;\n\n const handleCloseClick = (event: MouseEvent<HTMLSpanElement>) => {\n event.stopPropagation();\n event.preventDefault();\n onClose?.();\n };\n\n // The close control is not in the tab order; keyboard users close the focused tab with Delete/Backspace.\n const handleTriggerKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (closable && (event.key === 'Delete' || event.key === 'Backspace')) {\n event.preventDefault();\n // Move focus to a sibling tab before removal so keyboard navigation can continue.\n const trigger = event.currentTarget;\n // Skip overflowed (`hidden`) tabs — they aren't focusable.\n const triggers = [\n ...(trigger.closest('[role=\"tablist\"]')?.querySelectorAll<HTMLElement>('[role=\"tab\"]:not([hidden])') ?? []),\n ];\n const index = triggers.indexOf(trigger);\n (triggers[index + 1] ?? triggers[index - 1])?.focus();\n onClose?.();\n }\n onKeyDown?.(event);\n };\n\n const trailing = showTrailing ? (\n <chakra.span\n position=\"relative\"\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n boxSize=\"24\"\n flexShrink={0}\n >\n {hasStatus && statusColor && (\n <chakra.span\n position=\"absolute\"\n inset={0}\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n pointerEvents=\"none\"\n transition=\"opacity 0.1s\"\n _groupHover={closable ? { opacity: 0 } : undefined}\n _groupFocusWithin={closable ? { opacity: 0 } : undefined}\n >\n <chakra.span boxSize=\"8\" borderRadius=\"full\" backgroundColor={STATUS_COLOR_TOKEN[statusColor]} />\n </chakra.span>\n )}\n {closable && (\n <chakra.span\n aria-hidden\n tabIndex={-1}\n onClick={handleCloseClick}\n css={closeButtonRecipe({ size: 'xs' })}\n position=\"absolute\"\n inset={0}\n color=\"icon/primary\"\n opacity={revealCloseOnInteraction ? 0 : 1}\n pointerEvents={revealCloseOnInteraction ? 'none' : 'auto'}\n transition=\"opacity 0.1s\"\n _groupHover={revealCloseOnInteraction ? revealOnInteraction : undefined}\n _groupFocusWithin={revealCloseOnInteraction ? revealOnInteraction : undefined}\n >\n <IconCross size=\"16\" />\n </chakra.span>\n )}\n </chakra.span>\n ) : null;\n\n return (\n <Tabs.Trigger\n ref={ref}\n {...rest}\n className={mergedClassName}\n gap={isCanvas ? '4' : showTrailing ? '12' : undefined}\n onKeyDown={handleTriggerKeyDown}\n paddingInlineEnd={isCanvas ? (showTrailing ? '8' : undefined) : showTrailing ? '12' : undefined}\n paddingInlineStart={isCanvas && Icon ? '8' : undefined}\n >\n {isCanvas ? (\n <>\n <Box display=\"flex\" alignItems=\"center\" gap=\"8\">\n {Icon && <Icon size=\"16\" />}\n {children}\n </Box>\n {trailing}\n </>\n ) : variant === 'line' ? (\n <>\n <Box display=\"flex\" alignItems=\"center\" gap=\"8\">\n {Icon && <Icon size=\"24\" />}\n {children}\n {badge}\n </Box>\n {trailing}\n </>\n ) : (\n <>\n <Box display=\"flex\" gap=\"16\">\n {children}\n {Icon && <Icon size=\"24\" />}\n </Box>\n {!!secondaryText && (\n <Text as=\"span\" textStyle=\"body/md/regular\" color={rest.disabled ? 'text/on-disabled' : 'text/secondary'}>\n {secondaryText}\n </Text>\n )}\n {trailing}\n </>\n )}\n </Tabs.Trigger>\n );\n});\n\nTrigger.displayName = 'BitkitTabs.Trigger';\n\ntype TabItem = ReactElement<TriggerProps>;\n\n// Flattens children to a list of elements, unwrapping fragments so a Trigger grouped inside a\n// fragment (e.g. conditional rendering) isn't silently dropped.\nconst flattenChildren = (nodes: ReactNode): ReactElement[] =>\n Children.toArray(nodes).flatMap((child) => {\n if (!isValidElement(child)) return [];\n if (child.type === Fragment) return flattenChildren((child.props as { children?: ReactNode }).children);\n return [child];\n });\n\n// Returns the set of visible tab indices for the overflow, always keeping the selected tab\n// visible: if it would overflow, it takes the last visible slot.\nconst getVisibleIndices = (total: number, count: number, selectedIndex: number) => {\n const visible = new Set<number>();\n for (let i = 0; i < count; i += 1) visible.add(i);\n if (selectedIndex >= 0 && selectedIndex < total && !visible.has(selectedIndex)) {\n visible.delete(count - 1);\n visible.add(selectedIndex);\n }\n return visible;\n};\n\nexport type BitkitTabsAddButtonProps = Omit<\n Extract<BitkitControlButtonProps, { href?: undefined }>,\n 'icon' | 'label' | 'size'\n> & {\n /** Accessible label / tooltip for the add button. */\n label?: string;\n};\n\n// \"+\" button to add a tab. Place it as a child of `List`; it always renders at the end of the row\n// (after the overflow menu). A compact `xxs` control button (16px icon, 4px padding) per the design.\nconst AddButton = forwardRef<HTMLButtonElement, BitkitTabsAddButtonProps>((props, ref) => {\n const { label = 'Add tab', ...rest } = props;\n return <BitkitControlButton ref={ref} icon={IconPlus} label={label} size=\"xxs\" {...rest} />;\n});\n\nAddButton.displayName = 'BitkitTabs.AddButton';\n\n// Overflow-aware List (all variants): measures the tabs and collapses the overflowing ones into a\n// \"N more…\" menu. The more-button look comes from the variant's `moreTrigger` recipe slot.\nconst List = forwardRef<HTMLDivElement, Tabs.ListProps>((props, ref) => {\n // Semantic/labelling attributes belong on the actual tablist, not the visual wrapper.\n const { children, id, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby, ...rest } = props;\n const { variant = 'line' } = useRootPropsContext();\n const api = useTabsContext();\n const styles = useTabsStyles();\n\n // Split children: tab triggers participate in overflow; the optional add button always renders last.\n const allChildren = flattenChildren(children);\n const addButton = allChildren.find((child) => child.type === AddButton) ?? null;\n // Only Trigger elements are measured/overflowed; anything else (fragments, stray nodes) is ignored.\n const items = allChildren.filter((child) => child.type === Trigger) as TabItem[];\n // Re-measure whenever the tab set OR any width-affecting input changes — the variant, each tab's\n // value/label, icon/status/close/disabled state, and badge/secondaryText content (best-effort\n // string form, so width-changing text like \"3 errors\" → \"12 errors\" invalidates the cache).\n const measureKey =\n variant +\n items\n .map((item) => {\n const p = item.props;\n return [\n p.value,\n String(p.children),\n p.icon ? 'i' : '',\n p.badge ? String(p.badge) : '',\n p.secondaryText ? String(p.secondaryText) : '',\n p.statusColor ?? '',\n p.onClose ? 'c' : '',\n p.disabled ? 'd' : '',\n ].join(':');\n })\n .join('|');\n const selectedIndex = items.findIndex((item) => item.props.value === api.value);\n // Conservative width reservations: the more button (wider for the lg/semibold variants) and the\n // always-visible add button.\n const moreReserve = variant === 'canvas' ? 100 : 140;\n const addReserve = addButton ? 48 : 0;\n\n const listRef = useRef<HTMLDivElement | null>(null);\n const widthsRef = useRef<number[]>([]);\n // Horizontal padding of the list, cached during the measure pass so the resize hot path doesn't\n // call getComputedStyle on every tick.\n const paddingRef = useRef(0);\n // `measuredKey` is state (not a ref) so finishing the measure pass always re-renders and flips\n // `measuring` off — even when recompute keeps the same visibleCount (which would skip a re-render).\n const [measuredKey, setMeasuredKey] = useState<string | null>(null);\n const [visibleCount, setVisibleCount] = useState(items.length);\n\n const setListRef = useMemo(() => mergeRefs(listRef, ref), [ref]);\n\n const recompute = useCallback(() => {\n const el = listRef.current;\n const widths = widthsRef.current;\n if (!el || !widths.length) return;\n const available = el.clientWidth - paddingRef.current - addReserve;\n const totalWidth = widths.reduce((sum, w) => sum + w, 0);\n if (totalWidth <= available) {\n setVisibleCount(widths.length);\n return;\n }\n let used = moreReserve;\n let count = 0;\n for (let i = 0; i < widths.length; i += 1) {\n if (used + widths[i] > available) break;\n used += widths[i];\n count += 1;\n }\n setVisibleCount(Math.max(count, 1));\n }, [addReserve, moreReserve]);\n\n // Measure once per width-affecting change (all tabs are rendered visible during this pass).\n // Isomorphic layout effect: avoids the SSR \"useLayoutEffect does nothing on the server\" warning.\n const measuring = measuredKey !== measureKey;\n useSafeLayoutEffect(() => {\n const el = listRef.current;\n if (!el) return;\n if (measuredKey !== measureKey) {\n const tabEls = el.querySelectorAll<HTMLElement>('[data-tab-trigger]');\n widthsRef.current = Array.from(tabEls, (node) => node.offsetWidth);\n const cs = getComputedStyle(el);\n paddingRef.current = parseFloat(cs.paddingLeft) + parseFloat(cs.paddingRight);\n setMeasuredKey(measureKey);\n }\n recompute();\n }, [measureKey, measuredKey, recompute]);\n\n useEffect(() => {\n const el = listRef.current;\n if (!el || typeof ResizeObserver === 'undefined') return;\n // Coalesce resize bursts into one recompute per frame to avoid a read/write layout storm.\n let raf = 0;\n const observer = new ResizeObserver(() => {\n cancelAnimationFrame(raf);\n raf = requestAnimationFrame(recompute);\n });\n observer.observe(el);\n return () => {\n cancelAnimationFrame(raf);\n observer.disconnect();\n };\n }, [recompute]);\n\n const showAll = measuring || visibleCount >= items.length;\n const visible = showAll ? null : getVisibleIndices(items.length, visibleCount, selectedIndex);\n const hiddenItems = visible ? items.filter((_, i) => !visible.has(i)) : [];\n\n return (\n // The visual row carries the list styling (background, baseline border, leading padding) and is\n // measured for overflow. The tablist itself only wraps the tabs (`display: contents` keeps the\n // flex layout intact), so the more/add controls stay outside `role=\"tablist\"` per the ARIA spec.\n <Box ref={setListRef} css={styles.list} {...rest}>\n <Tabs.List display=\"contents\" id={id} aria-label={ariaLabel} aria-labelledby={ariaLabelledby}>\n {items.map((item, i) =>\n cloneElement(item, {\n key: item.props.value,\n 'data-tab-trigger': '',\n hidden: visible ? !visible.has(i) : undefined,\n } as Partial<TriggerProps>),\n )}\n </Tabs.List>\n {hiddenItems.length > 0 && (\n <Menu.Root size=\"md\" positioning={{ gutter: 0, shift: -4 }}>\n <Menu.Trigger asChild>\n <chakra.button type=\"button\" css={styles.moreTrigger}>\n {hiddenItems.length} more…\n </chakra.button>\n </Menu.Trigger>\n <Portal>\n <Menu.Positioner>\n <Menu.Content>\n {hiddenItems.map((item) => (\n <Menu.Item\n key={item.props.value}\n value={item.props.value}\n disabled={item.props.disabled}\n onSelect={() => api.setValue(item.props.value)}\n alignItems=\"center\"\n >\n <Text flex=\"1\" color={item.props.disabled ? 'text/on-disabled' : 'inherit'}>\n {item.props.children}\n </Text>\n {variant === 'canvas' && item.props.statusColor && (\n <chakra.span\n boxSize=\"8\"\n borderRadius=\"full\"\n flexShrink={0}\n backgroundColor={STATUS_COLOR_TOKEN[item.props.statusColor]}\n />\n )}\n </Menu.Item>\n ))}\n </Menu.Content>\n </Menu.Positioner>\n </Portal>\n </Menu.Root>\n )}\n {addButton && (\n <Box display=\"flex\" alignItems=\"center\" flexShrink={0} paddingInline=\"8\">\n {addButton}\n </Box>\n )}\n </Box>\n );\n});\n\nList.displayName = 'BitkitTabs.List';\n\nconst BitkitTabs: Omit<typeof Tabs, 'Root' | 'Trigger' | 'List'> & {\n AddButton: typeof AddButton;\n List: typeof List;\n Root: typeof Root;\n Trigger: typeof Trigger;\n} = {\n ...Tabs,\n AddButton,\n List,\n Root,\n Trigger,\n};\n\nBitkitTabs.Content.displayName = 'BitkitTabs.Content';\nBitkitTabs.ContentGroup.displayName = 'BitkitTabs.ContentGroup';\nBitkitTabs.Root.displayName = 'BitkitTabs.Root';\n\nexport default BitkitTabs;\n"],"mappings":"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"}