@cube-dev/ui-kit 0.131.0 → 0.133.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/CHANGELOG.md +32 -0
- package/dist/_internal/hooks/use-chained-callback.js +1 -1
- package/dist/_internal/hooks/use-debounced-value.js +1 -1
- package/dist/_internal/hooks/use-deprecation-warning.js +1 -1
- package/dist/_internal/hooks/use-event.js +1 -1
- package/dist/_internal/hooks/use-is-first-render.js +1 -1
- package/dist/_internal/hooks/use-sync-ref.js +1 -1
- package/dist/_internal/hooks/use-timer/timer.js +1 -1
- package/dist/_internal/hooks/use-timer/use-timer.js +1 -1
- package/dist/_internal/hooks/use-warn.js +1 -1
- package/dist/components/Block.js +1 -1
- package/dist/components/CollectionItem.js +1 -1
- package/dist/components/GlobalStyles.js +1 -1
- package/dist/components/GridProvider.js +1 -1
- package/dist/components/HiddenInput.js +1 -1
- package/dist/components/Root.js +1 -1
- package/dist/components/actions/Action/Action.js +1 -1
- package/dist/components/actions/Banner/Banner.js +1 -1
- package/dist/components/actions/Button/Button.js +1 -1
- package/dist/components/actions/ButtonGroup/ButtonGroup.js +1 -1
- package/dist/components/actions/ButtonSplit/ButtonSplit.js +1 -1
- package/dist/components/actions/ButtonSplit/context.js +1 -1
- package/dist/components/actions/CommandMenu/CommandMenu.js +1 -1
- package/dist/components/actions/CommandMenu/styled.js +1 -1
- package/dist/components/actions/ItemAction/ItemAction.js +1 -1
- package/dist/components/actions/ItemActionContext.js +1 -1
- package/dist/components/actions/ItemButton/ItemButton.js +1 -1
- package/dist/components/actions/Link/Link.js +1 -1
- package/dist/components/actions/Menu/Menu.js +1 -1
- package/dist/components/actions/Menu/MenuItem.js +1 -1
- package/dist/components/actions/Menu/MenuSection.js +1 -1
- package/dist/components/actions/Menu/MenuTrigger.js +1 -1
- package/dist/components/actions/Menu/SubMenuTrigger.js +1 -1
- package/dist/components/actions/Menu/SubmenuTriggerContext.js +1 -1
- package/dist/components/actions/Menu/context.js +1 -1
- package/dist/components/actions/Menu/styled.js +1 -1
- package/dist/components/actions/index.js +1 -1
- package/dist/components/actions/use-action.js +1 -1
- package/dist/components/actions/use-anchored-menu.js +1 -1
- package/dist/components/actions/use-context-menu.js +1 -1
- package/dist/components/content/ActiveZone/ActiveZone.js +1 -1
- package/dist/components/content/Alert/Alert.js +1 -1
- package/dist/components/content/Alert/use-alert.js +1 -1
- package/dist/components/content/Avatar/Avatar.js +1 -1
- package/dist/components/content/Badge/Badge.js +1 -1
- package/dist/components/content/Card/Card.js +1 -1
- package/dist/components/content/Content.js +1 -1
- package/dist/components/content/CopyPasteBlock/CopyPasteBlock.js +1 -1
- package/dist/components/content/CopySnippet/CopySnippet.js +1 -1
- package/dist/components/content/Disclosure/Disclosure.js +1 -1
- package/dist/components/content/Divider.js +1 -1
- package/dist/components/content/Footer.js +1 -1
- package/dist/components/content/Header.js +1 -1
- package/dist/components/content/HotKeys/HotKeys.js +1 -1
- package/dist/components/content/Item/Item.js +1 -1
- package/dist/components/content/ItemBadge/ItemBadge.js +1 -1
- package/dist/components/content/ItemCard/ItemCard.js +1 -1
- package/dist/components/content/Layout/GridLayout.js +1 -1
- package/dist/components/content/Layout/Layout.js +1 -1
- package/dist/components/content/Layout/LayoutBlock.js +1 -1
- package/dist/components/content/Layout/LayoutCenter.js +1 -1
- package/dist/components/content/Layout/LayoutContainer.js +1 -1
- package/dist/components/content/Layout/LayoutContent.js +1 -1
- package/dist/components/content/Layout/LayoutContext.js +1 -1
- package/dist/components/content/Layout/LayoutFlex.js +1 -1
- package/dist/components/content/Layout/LayoutFooter.js +1 -1
- package/dist/components/content/Layout/LayoutGrid.js +1 -1
- package/dist/components/content/Layout/LayoutHeader.js +1 -1
- package/dist/components/content/Layout/LayoutPane.js +1 -1
- package/dist/components/content/Layout/LayoutPanel.js +1 -1
- package/dist/components/content/Layout/LayoutPanelHeader.js +1 -1
- package/dist/components/content/Layout/LayoutToolbar.js +1 -1
- package/dist/components/content/Layout/hooks/useTinyScrollbar.js +1 -1
- package/dist/components/content/Layout/index.js +1 -1
- package/dist/components/content/Layout/utils.js +1 -1
- package/dist/components/content/Paragraph.js +1 -1
- package/dist/components/content/Placeholder/Placeholder.js +1 -1
- package/dist/components/content/PrismCode/PrismCode.js +1 -1
- package/dist/components/content/PrismCode/prismSetup.js +1 -1
- package/dist/components/content/PrismDiffCode/PrismDiffCode.js +1 -1
- package/dist/components/content/Result/Result.js +1 -1
- package/dist/components/content/Skeleton/Skeleton.js +1 -1
- package/dist/components/content/Tag/Tag.js +1 -1
- package/dist/components/content/Text.js +1 -1
- package/dist/components/content/TextItem/TextItem.js +1 -1
- package/dist/components/content/Title.js +1 -1
- package/dist/components/content/Tree/Tree.js +60 -45
- package/dist/components/content/Tree/Tree.js.map +1 -1
- package/dist/components/content/Tree/TreeNode.js +90 -20
- package/dist/components/content/Tree/TreeNode.js.map +1 -1
- package/dist/components/content/Tree/index.d.ts +1 -1
- package/dist/components/content/Tree/styled.js +26 -4
- package/dist/components/content/Tree/styled.js.map +1 -1
- package/dist/components/content/Tree/tree-index.js +1 -1
- package/dist/components/content/Tree/types.d.ts +67 -1
- package/dist/components/content/Tree/use-checkbox-tree.js +1 -1
- package/dist/components/content/Tree/use-load-data.js +1 -1
- package/dist/components/content/highlightText.js +1 -1
- package/dist/components/content/use-auto-tooltip.js +1 -1
- package/dist/components/fields/Checkbox/Checkbox.js +1 -1
- package/dist/components/fields/Checkbox/CheckboxGroup.js +1 -1
- package/dist/components/fields/Checkbox/context.js +1 -1
- package/dist/components/fields/ComboBox/ComboBox.js +1 -1
- package/dist/components/fields/DatePicker/DateInput.js +1 -1
- package/dist/components/fields/DatePicker/DateInputBase.js +1 -1
- package/dist/components/fields/DatePicker/DatePicker.js +1 -1
- package/dist/components/fields/DatePicker/DatePickerButton.js +1 -1
- package/dist/components/fields/DatePicker/DatePickerElement.js +1 -1
- package/dist/components/fields/DatePicker/DatePickerInput.js +1 -1
- package/dist/components/fields/DatePicker/DatePickerSegment.js +1 -1
- package/dist/components/fields/DatePicker/DateRangePicker.js +1 -1
- package/dist/components/fields/DatePicker/DateRangeSeparatedPicker.js +1 -1
- package/dist/components/fields/DatePicker/TimeInput.js +1 -1
- package/dist/components/fields/DatePicker/intl.js +1 -1
- package/dist/components/fields/DatePicker/parseDate.js +1 -1
- package/dist/components/fields/DatePicker/props.js +1 -1
- package/dist/components/fields/DatePicker/utils.js +1 -1
- package/dist/components/fields/FileInput/FileInput.js +1 -1
- package/dist/components/fields/FilterListBox/FilterListBox.js +5 -3
- package/dist/components/fields/FilterListBox/FilterListBox.js.map +1 -1
- package/dist/components/fields/FilterPicker/FilterPicker.js +4 -2
- package/dist/components/fields/FilterPicker/FilterPicker.js.map +1 -1
- package/dist/components/fields/Input/Input.js +1 -1
- package/dist/components/fields/ListBox/DraggableListBox.js +24 -0
- package/dist/components/fields/ListBox/DraggableListBox.js.map +1 -0
- package/dist/components/fields/ListBox/ListBox.d.ts +11 -0
- package/dist/components/fields/ListBox/ListBox.js +153 -38
- package/dist/components/fields/ListBox/ListBox.js.map +1 -1
- package/dist/components/fields/NumberInput/NumberInput.js +1 -1
- package/dist/components/fields/NumberInput/StepButton.js +1 -1
- package/dist/components/fields/PasswordInput/PasswordInput.js +1 -1
- package/dist/components/fields/Picker/Picker.js +1 -1
- package/dist/components/fields/RadioGroup/Radio.js +1 -1
- package/dist/components/fields/RadioGroup/RadioGroup.js +1 -1
- package/dist/components/fields/RadioGroup/context.js +1 -1
- package/dist/components/fields/SearchInput/SearchInput.js +1 -1
- package/dist/components/fields/Select/Select.js +1 -1
- package/dist/components/fields/Slider/Gradation.js +1 -1
- package/dist/components/fields/Slider/HueSlider.js +1 -1
- package/dist/components/fields/Slider/RangeSlider.js +1 -1
- package/dist/components/fields/Slider/Slider.js +1 -1
- package/dist/components/fields/Slider/SliderBase.js +1 -1
- package/dist/components/fields/Slider/SliderThumb.js +1 -1
- package/dist/components/fields/Slider/SliderTrack.js +1 -1
- package/dist/components/fields/Slider/elements.js +1 -1
- package/dist/components/fields/Slider/index.js +1 -1
- package/dist/components/fields/Switch/Switch.js +1 -1
- package/dist/components/fields/TextArea/TextArea.js +1 -1
- package/dist/components/fields/TextInput/TextInput.js +1 -1
- package/dist/components/fields/TextInput/TextInputBase.js +1 -1
- package/dist/components/fields/TextInputMapper/TextInputMapper.js +1 -1
- package/dist/components/form/FieldWrapper/FieldWrapper.js +1 -1
- package/dist/components/form/FieldWrapper/extract-field-wrapper-props.js +1 -1
- package/dist/components/form/Form/Field.js +1 -1
- package/dist/components/form/Form/Form.js +1 -1
- package/dist/components/form/Form/ResetButton/ResetButton.js +1 -1
- package/dist/components/form/Form/SubmitButton/SubmitButton.js +1 -1
- package/dist/components/form/Form/SubmitError.js +1 -1
- package/dist/components/form/Form/index.js +1 -1
- package/dist/components/form/Form/use-field/use-field-props.js +1 -1
- package/dist/components/form/Form/use-field/use-field.js +1 -1
- package/dist/components/form/Form/use-form.js +1 -1
- package/dist/components/form/Form/validation.js +1 -1
- package/dist/components/form/Label.js +1 -1
- package/dist/components/form/wrapper.js +1 -1
- package/dist/components/helpers/DisplayTransition/DisplayTransition.js +1 -1
- package/dist/components/helpers/IconSwitch/IconSwitch.js +1 -1
- package/dist/components/layout/Flex.js +1 -1
- package/dist/components/layout/Flow.js +1 -1
- package/dist/components/layout/Grid.js +1 -1
- package/dist/components/layout/Panel.js +1 -1
- package/dist/components/layout/Prefix.js +1 -1
- package/dist/components/layout/ResizablePanel.js +1 -1
- package/dist/components/layout/Space.js +1 -1
- package/dist/components/layout/Suffix.js +1 -1
- package/dist/components/navigation/Tabs/DraggableTabList.js +11 -60
- package/dist/components/navigation/Tabs/DraggableTabList.js.map +1 -1
- package/dist/components/navigation/Tabs/EditableTitle.js +1 -1
- package/dist/components/navigation/Tabs/TabButton.js +3 -10
- package/dist/components/navigation/Tabs/TabButton.js.map +1 -1
- package/dist/components/navigation/Tabs/TabDropIndicator.js +1 -1
- package/dist/components/navigation/Tabs/TabPanel.js +1 -1
- package/dist/components/navigation/Tabs/TabPicker.js +4 -2
- package/dist/components/navigation/Tabs/TabPicker.js.map +1 -1
- package/dist/components/navigation/Tabs/Tabs.js +4 -2
- package/dist/components/navigation/Tabs/Tabs.js.map +1 -1
- package/dist/components/navigation/Tabs/TabsAction.js +1 -1
- package/dist/components/navigation/Tabs/TabsContext.js +1 -1
- package/dist/components/navigation/Tabs/styled.js +1 -1
- package/dist/components/navigation/Tabs/types.d.ts +2 -0
- package/dist/components/navigation/Tabs/types.js +1 -1
- package/dist/components/navigation/Tabs/types.js.map +1 -1
- package/dist/components/navigation/Tabs/use-tab-editing.js +1 -1
- package/dist/components/navigation/Tabs/use-tab-indicator.js +1 -1
- package/dist/components/organisms/FileTabs/FileTabs.js +1 -1
- package/dist/components/organisms/StatsCard/StatsCard.js +1 -1
- package/dist/components/other/Calendar/Calendar.js +1 -1
- package/dist/components/other/Calendar/CalendarCell.js +1 -1
- package/dist/components/other/Calendar/CalendarGrid.js +1 -1
- package/dist/components/other/Calendar/RangeCalendar.js +1 -1
- package/dist/components/other/CloudLogo/CloudLogo.js +1 -1
- package/dist/components/overlays/AlertDialog/AlertDialog.js +1 -1
- package/dist/components/overlays/AlertDialog/AlertDialogApiProvider.js +1 -1
- package/dist/components/overlays/AlertDialog/AlertDialogZone.js +1 -1
- package/dist/components/overlays/Dialog/Dialog.js +1 -1
- package/dist/components/overlays/Dialog/DialogContainer.js +1 -1
- package/dist/components/overlays/Dialog/DialogForm.js +1 -1
- package/dist/components/overlays/Dialog/DialogTrigger.js +1 -1
- package/dist/components/overlays/Dialog/context.js +1 -1
- package/dist/components/overlays/Dialog/use-dialog-container.js +1 -1
- package/dist/components/overlays/Modal/Modal.js +1 -1
- package/dist/components/overlays/Modal/OpenTransitionContext.js +1 -1
- package/dist/components/overlays/Modal/Overlay.js +1 -1
- package/dist/components/overlays/Modal/Popover.js +1 -1
- package/dist/components/overlays/Modal/Tray.js +1 -1
- package/dist/components/overlays/Modal/Underlay.js +1 -1
- package/dist/components/overlays/Notifications/Notification.js +1 -1
- package/dist/components/overlays/Notifications/NotificationAction.js +1 -1
- package/dist/components/overlays/Notifications/NotificationCard.js +1 -1
- package/dist/components/overlays/Notifications/NotificationContext.js +1 -1
- package/dist/components/overlays/Notifications/NotificationItem.js +1 -1
- package/dist/components/overlays/Notifications/OverlayContainer.js +1 -1
- package/dist/components/overlays/Notifications/OverlayProvider.js +1 -1
- package/dist/components/overlays/Notifications/PersistentNotificationsList.js +1 -1
- package/dist/components/overlays/Notifications/dismissed-storage.js +1 -1
- package/dist/components/overlays/Notifications/format-relative-time.js +1 -1
- package/dist/components/overlays/Notifications/index.js +1 -1
- package/dist/components/overlays/Notifications/use-notification-state.js +1 -1
- package/dist/components/overlays/Notifications/use-notifications.js +1 -1
- package/dist/components/overlays/Notifications/use-overlay-timers.js +1 -1
- package/dist/components/overlays/Notifications/use-persistent-notifications.js +1 -1
- package/dist/components/overlays/Notifications/use-persistent-state.js +1 -1
- package/dist/components/overlays/Notifications/use-toast-state.js +1 -1
- package/dist/components/overlays/Toast/ToastItem.js +1 -1
- package/dist/components/overlays/Toast/index.js +1 -1
- package/dist/components/overlays/Toast/useProgressToast.js +1 -1
- package/dist/components/overlays/Toast/useToast.js +1 -1
- package/dist/components/overlays/Tooltip/Tooltip.js +1 -1
- package/dist/components/overlays/Tooltip/TooltipProvider.js +1 -1
- package/dist/components/overlays/Tooltip/TooltipTrigger.js +1 -1
- package/dist/components/overlays/Tooltip/context.js +1 -1
- package/dist/components/portal/Portal.js +1 -1
- package/dist/components/portal/PortalProvider.js +1 -1
- package/dist/components/portal/usePortal.js +1 -1
- package/dist/components/shared/DraggableCollection.js +142 -0
- package/dist/components/shared/DraggableCollection.js.map +1 -0
- package/dist/components/shared/InvalidIcon.js +1 -1
- package/dist/components/shared/ValidIcon.js +1 -1
- package/dist/components/status/LoadingAnimation/LoadingAnimation.js +1 -1
- package/dist/components/status/Spin/Cube.js +1 -1
- package/dist/components/status/Spin/InternalSpinner.js +1 -1
- package/dist/components/status/Spin/Spin.js +1 -1
- package/dist/components/status/Spin/SpinsContainer.js +1 -1
- package/dist/data/item-themes.js +1 -1
- package/dist/data/themes.js +1 -1
- package/dist/icons/AdjustmentsHorizontalIcon.js +1 -1
- package/dist/icons/AdjustmentsIcon.js +1 -1
- package/dist/icons/AiIcon.js +1 -1
- package/dist/icons/AreaChartIcon.js +1 -1
- package/dist/icons/BackwardIcon.js +1 -1
- package/dist/icons/BarChartIcon.js +1 -1
- package/dist/icons/BellFilledIcon.js +1 -1
- package/dist/icons/BellIcon.js +1 -1
- package/dist/icons/BooleanIcon.js +1 -1
- package/dist/icons/CalendarEditIcon.js +1 -1
- package/dist/icons/CalendarIcon.js +1 -1
- package/dist/icons/CaretDownIcon.js +1 -1
- package/dist/icons/CaretUpIcon.js +1 -1
- package/dist/icons/ChartAreaStackedIcon.js +1 -1
- package/dist/icons/ChartAreaStackedPercentageIcon.js +1 -1
- package/dist/icons/ChartBarGroupedHorizontalIcon.js +1 -1
- package/dist/icons/ChartBarGroupedIcon.js +1 -1
- package/dist/icons/ChartBarHorizontalIcon.js +1 -1
- package/dist/icons/ChartBarLineIcon.js +1 -1
- package/dist/icons/ChartBarStackedHorizontalIcon.js +1 -1
- package/dist/icons/ChartBarStackedIcon.js +1 -1
- package/dist/icons/ChartBarStackedPercentageHorizontalIcon.js +1 -1
- package/dist/icons/ChartBarStackedPercentageIcon.js +1 -1
- package/dist/icons/ChartBoxPlot2Icon.js +1 -1
- package/dist/icons/ChartBoxPlotIcon.js +1 -1
- package/dist/icons/ChartBubbleIcon.js +1 -1
- package/dist/icons/ChartDonut2Icon.js +1 -1
- package/dist/icons/ChartFunnelIcon.js +1 -1
- package/dist/icons/ChartHeatmapIcon.js +1 -1
- package/dist/icons/ChartKPIIcon.js +1 -1
- package/dist/icons/ChartPie2Icon.js +1 -1
- package/dist/icons/ChartScatterIcon.js +1 -1
- package/dist/icons/CheckCircleFilledIcon.js +1 -1
- package/dist/icons/CheckCircleIcon.js +1 -1
- package/dist/icons/CheckIcon.js +1 -1
- package/dist/icons/CircleFilledIcon.js +1 -1
- package/dist/icons/ClearIcon.js +1 -1
- package/dist/icons/CloseCircleFilledIcon.js +1 -1
- package/dist/icons/CloseCircleIcon.js +1 -1
- package/dist/icons/CloseIcon.js +1 -1
- package/dist/icons/CodeIcon.js +1 -1
- package/dist/icons/ColumnTotalIcon.js +1 -1
- package/dist/icons/CopyIcon.js +1 -1
- package/dist/icons/CountIcon.js +1 -1
- package/dist/icons/CubeIcon.js +1 -1
- package/dist/icons/CubePauseIcon.js +1 -1
- package/dist/icons/CubePlayIcon.js +1 -1
- package/dist/icons/CurrencyDollarIcon.js +1 -1
- package/dist/icons/DangerIcon.js +1 -1
- package/dist/icons/DashboardIcon.js +1 -1
- package/dist/icons/DatabaseIcon.js +1 -1
- package/dist/icons/DecimalDecreaseIcon.js +1 -1
- package/dist/icons/DecimalIncreaseIcon.js +1 -1
- package/dist/icons/DirectionIcon.js +1 -1
- package/dist/icons/DonutIcon.js +1 -1
- package/dist/icons/DownIcon.js +1 -1
- package/dist/icons/EditIcon.js +1 -1
- package/dist/icons/ExclamationCircleFilledIcon.js +1 -1
- package/dist/icons/ExclamationCircleIcon.js +1 -1
- package/dist/icons/ExclamationIcon.js +1 -1
- package/dist/icons/EyeIcon.js +1 -1
- package/dist/icons/EyeInvisibleIcon.js +1 -1
- package/dist/icons/FilterIcon.js +1 -1
- package/dist/icons/FolderFilledIcon.js +1 -1
- package/dist/icons/FolderIcon.js +1 -1
- package/dist/icons/FolderOpenFilledIcon.js +1 -1
- package/dist/icons/FolderOpenIcon.js +1 -1
- package/dist/icons/ForwardIcon.js +1 -1
- package/dist/icons/GripVerticalIcon.d.ts +12 -0
- package/dist/icons/GripVerticalIcon.js +11 -0
- package/dist/icons/GripVerticalIcon.js.map +1 -0
- package/dist/icons/HierarchyIcon.js +1 -1
- package/dist/icons/HierarchyOpenIcon.js +1 -1
- package/dist/icons/Icon.js +1 -1
- package/dist/icons/InfoCircleIcon.js +1 -1
- package/dist/icons/InfoIcon.js +1 -1
- package/dist/icons/KeyIcon.js +1 -1
- package/dist/icons/LeftIcon.js +1 -1
- package/dist/icons/LineChartIcon.js +1 -1
- package/dist/icons/LoadingIcon.js +1 -1
- package/dist/icons/LockFilledIcon.js +1 -1
- package/dist/icons/LockIcon.js +1 -1
- package/dist/icons/MoreIcon.js +1 -1
- package/dist/icons/NotAllowedIcon.js +1 -1
- package/dist/icons/Number123Icon.js +1 -1
- package/dist/icons/NumberIcon.js +1 -1
- package/dist/icons/PauseCircleFilledIcon.js +1 -1
- package/dist/icons/PauseCircleIcon.js +1 -1
- package/dist/icons/PauseIcon.js +1 -1
- package/dist/icons/PercentageIcon.js +1 -1
- package/dist/icons/PieChartIcon.js +1 -1
- package/dist/icons/PlayCircleIcon.js +1 -1
- package/dist/icons/PlayIcon.js +1 -1
- package/dist/icons/PlusIcon.js +1 -1
- package/dist/icons/ProgressBarIcon.js +1 -1
- package/dist/icons/ReloadIcon.js +1 -1
- package/dist/icons/ReportIcon.js +1 -1
- package/dist/icons/ReturnIcon.js +1 -1
- package/dist/icons/RightIcon.js +1 -1
- package/dist/icons/RowTotalsIcon.js +1 -1
- package/dist/icons/SchemeIcon.js +1 -1
- package/dist/icons/SearchIcon.js +1 -1
- package/dist/icons/SemanticQueryIcon.js +1 -1
- package/dist/icons/SettingsIcon.js +1 -1
- package/dist/icons/ShieldFilledIcon.js +1 -1
- package/dist/icons/ShieldIcon.js +1 -1
- package/dist/icons/SlashIcon.js +1 -1
- package/dist/icons/SparklesIcon.js +1 -1
- package/dist/icons/SqlIcon.js +1 -1
- package/dist/icons/StatsIcon.js +1 -1
- package/dist/icons/StopIcon.js +1 -1
- package/dist/icons/StringIcon.js +1 -1
- package/dist/icons/SubtotalsIcon.js +1 -1
- package/dist/icons/SwitchIcon.js +1 -1
- package/dist/icons/TableIcon.js +1 -1
- package/dist/icons/ThumbsDownIcon.js +1 -1
- package/dist/icons/ThumbsUpIcon.js +1 -1
- package/dist/icons/ThunderboltCrossedIcon.js +1 -1
- package/dist/icons/ThunderboltFilledIcon.js +1 -1
- package/dist/icons/ThunderboltIcon.js +1 -1
- package/dist/icons/TimeIcon.js +1 -1
- package/dist/icons/TrashIcon.js +1 -1
- package/dist/icons/UnlockIcon.js +1 -1
- package/dist/icons/UpIcon.js +1 -1
- package/dist/icons/UserGroupIcon.js +1 -1
- package/dist/icons/UserIcon.js +1 -1
- package/dist/icons/UserLockIcon.js +1 -1
- package/dist/icons/ViewIcon.js +1 -1
- package/dist/icons/WarningFilledIcon.js +1 -1
- package/dist/icons/WarningIcon.js +1 -1
- package/dist/icons/index.d.ts +1 -0
- package/dist/icons/wrap-icon.js +1 -1
- package/dist/index.d.ts +3 -2
- package/dist/index.js +3 -2
- package/dist/index.js.map +1 -1
- package/dist/provider.js +1 -1
- package/dist/providers/TrackingProvider.js +1 -1
- package/dist/providers/navigationAdapter.default.js +1 -1
- package/dist/tokens/base.js +1 -1
- package/dist/tokens/colors.js +1 -1
- package/dist/tokens/index.js +1 -1
- package/dist/tokens/layout.js +1 -1
- package/dist/tokens/shadows.js +1 -1
- package/dist/tokens/sizes.js +1 -1
- package/dist/tokens/spacing.js +1 -1
- package/dist/tokens/typography.js +1 -1
- package/dist/utils/ResizeSensor.js +1 -1
- package/dist/utils/is-dev-env.js +1 -1
- package/dist/utils/modules.js +1 -1
- package/dist/utils/promise.js +1 -1
- package/dist/utils/raf.js +1 -1
- package/dist/utils/random.js +1 -1
- package/dist/utils/range.js +1 -1
- package/dist/utils/react/RenderCache.js +1 -1
- package/dist/utils/react/Slots.js +1 -1
- package/dist/utils/react/chain.js +1 -1
- package/dist/utils/react/forwardRefWithGenerics.js +1 -1
- package/dist/utils/react/index.js +1 -1
- package/dist/utils/react/interactions.js +1 -1
- package/dist/utils/react/isTextOnly.js +1 -1
- package/dist/utils/react/mapProps.js +1 -1
- package/dist/utils/react/mergeProps.js +1 -1
- package/dist/utils/react/nullableValue.js +1 -1
- package/dist/utils/react/resolveIcon.js +1 -1
- package/dist/utils/react/sharedStore.js +1 -1
- package/dist/utils/react/useCombinedRefs.js +1 -1
- package/dist/utils/react/useControlledFocusVisible.js +1 -1
- package/dist/utils/react/useEventBus.js +1 -1
- package/dist/utils/react/useId.js +1 -1
- package/dist/utils/react/useIsDarwin.js +1 -1
- package/dist/utils/react/useKeySymbols.js +1 -1
- package/dist/utils/react/useLayoutEffect.js +1 -1
- package/dist/utils/react/useLocalStorage.js +1 -1
- package/dist/utils/react/useMergeStyles.js +1 -1
- package/dist/utils/react/useQaProps.js +1 -1
- package/dist/utils/react/useViewportSize.js +1 -1
- package/dist/utils/react/wrapNodeIfPlain.js +1 -1
- package/dist/utils/selection.js +1 -1
- package/dist/utils/styles.js +1 -1
- package/dist/utils/tree.js +1 -1
- package/dist/utils/warnings.js +1 -1
- package/dist/version.js +2 -2
- package/docs/components/content/Tree.md +115 -32
- package/docs/components/fields/FilterPicker.md +27 -0
- package/docs/components/fields/ListBox.md +33 -0
- package/docs/components/navigation/Tabs.md +127 -51
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { TabPanelElement } from "./styled.js";
|
|
3
3
|
import { useEffect, useMemo, useRef } from "react";
|
|
4
4
|
import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
|
|
3
3
|
import { CloseIcon } from "../../../icons/CloseIcon.js";
|
|
4
4
|
import { MoreIcon } from "../../../icons/MoreIcon.js";
|
|
@@ -12,7 +12,7 @@ import { jsx } from "react/jsx-runtime";
|
|
|
12
12
|
* Used in the Tabs suffix area when tabs overflow to provide quick navigation
|
|
13
13
|
* to any tab without scrolling.
|
|
14
14
|
*/
|
|
15
|
-
function TabPicker({ tabs, selectedKey, onSelect, onDelete, size, type = "default" }) {
|
|
15
|
+
function TabPicker({ tabs, selectedKey, onSelect, onDelete, size, type = "default", isReorderable, onReorder }) {
|
|
16
16
|
const isDeletable = !!onDelete;
|
|
17
17
|
return /* @__PURE__ */ jsx(FilterPicker, {
|
|
18
18
|
selectionMode: "single",
|
|
@@ -29,6 +29,8 @@ function TabPicker({ tabs, selectedKey, onSelect, onDelete, size, type = "defaul
|
|
|
29
29
|
} : 0 },
|
|
30
30
|
triggerStyles: { border: 0 },
|
|
31
31
|
"aria-label": "Select tab",
|
|
32
|
+
isReorderable,
|
|
33
|
+
onReorder,
|
|
32
34
|
onSelectionChange: (key) => {
|
|
33
35
|
if (key != null) onSelect(String(key));
|
|
34
36
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabPicker.js","names":[],"sources":["../../../../src/components/navigation/Tabs/TabPicker.tsx"],"sourcesContent":["import { CloseIcon, MoreIcon } from '../../../icons';\nimport { ItemAction } from '../../actions/ItemAction';\nimport { FilterPicker } from '../../fields/FilterPicker/FilterPicker';\n\nimport type { ParsedTab, TabSize, TabType } from './types';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport interface TabPickerProps {\n /** Ordered list of parsed tabs to display in the picker */\n tabs: ParsedTab[];\n /** Currently selected tab key */\n selectedKey: string | null;\n /** Callback when a tab is selected from the picker */\n onSelect: (key: string) => void;\n /** Callback when a tab should be deleted. When provided, shows delete action on items. */\n onDelete?: (key: string) => void;\n /** Size of the picker trigger button */\n size?: TabSize;\n /** Type of the parent Tabs component (for border styling) */\n type?: TabType;\n}\n\n// =============================================================================\n// Component\n// =============================================================================\n\n/**\n * Tab picker component that displays a dropdown menu of all tabs.\n *\n * Used in the Tabs suffix area when tabs overflow to provide quick navigation\n * to any tab without scrolling.\n */\nexport function TabPicker({\n tabs,\n selectedKey,\n onSelect,\n onDelete,\n size,\n type = 'default',\n}: TabPickerProps) {\n const isDeletable = !!onDelete;\n\n // Map TabSize to FilterPicker size (xsmall -> small)\n const pickerSize = size === 'xsmall' ? 'small' : size;\n\n // Only show border divider for file type\n const showBorderDivider = type === 'file';\n\n return (\n <FilterPicker\n selectionMode=\"single\"\n selectedKey={selectedKey}\n renderSummary={false}\n icon={<MoreIcon />}\n rightIcon={null}\n shape=\"sharp\"\n type=\"neutral\"\n size={pickerSize}\n // Apply border to wrapper (FilterPickerWrapper) so :first-child evaluates\n // relative to Suffix container, not the internal DialogTrigger\n styles={{\n border: showBorderDivider\n ? {\n '': 0,\n '!:first-child': 'left',\n }\n : 0,\n }}\n triggerStyles={{ border: 0 }}\n aria-label=\"Select tab\"\n onSelectionChange={(key) => {\n if (key != null) {\n onSelect(String(key));\n }\n }}\n >\n {tabs.map((tab) => (\n <FilterPicker.Item\n key={tab.key}\n icon={tab.icon}\n textValue={\n typeof tab.title === 'string' ? tab.title : String(tab.key)\n }\n autoHideActions={isDeletable}\n actions={\n isDeletable ? (\n <ItemAction\n icon={<CloseIcon />}\n theme=\"danger\"\n aria-label=\"Close\"\n onPress={() => {\n onDelete(tab.key);\n }}\n />\n ) : undefined\n }\n >\n {tab.title}\n </FilterPicker.Item>\n ))}\n </FilterPicker>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"TabPicker.js","names":[],"sources":["../../../../src/components/navigation/Tabs/TabPicker.tsx"],"sourcesContent":["import { CloseIcon, MoreIcon } from '../../../icons';\nimport { ItemAction } from '../../actions/ItemAction';\nimport { FilterPicker } from '../../fields/FilterPicker/FilterPicker';\n\nimport type { ParsedTab, TabSize, TabType } from './types';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport interface TabPickerProps {\n /** Ordered list of parsed tabs to display in the picker */\n tabs: ParsedTab[];\n /** Currently selected tab key */\n selectedKey: string | null;\n /** Callback when a tab is selected from the picker */\n onSelect: (key: string) => void;\n /** Callback when a tab should be deleted. When provided, shows delete action on items. */\n onDelete?: (key: string) => void;\n /** Size of the picker trigger button */\n size?: TabSize;\n /** Type of the parent Tabs component (for border styling) */\n type?: TabType;\n /** Enable drag-and-drop reordering of items in the picker dropdown */\n isReorderable?: boolean;\n /** Callback when items are reordered via drag-and-drop */\n onReorder?: (newOrder: string[]) => void;\n}\n\n// =============================================================================\n// Component\n// =============================================================================\n\n/**\n * Tab picker component that displays a dropdown menu of all tabs.\n *\n * Used in the Tabs suffix area when tabs overflow to provide quick navigation\n * to any tab without scrolling.\n */\nexport function TabPicker({\n tabs,\n selectedKey,\n onSelect,\n onDelete,\n size,\n type = 'default',\n isReorderable,\n onReorder,\n}: TabPickerProps) {\n const isDeletable = !!onDelete;\n\n // Map TabSize to FilterPicker size (xsmall -> small)\n const pickerSize = size === 'xsmall' ? 'small' : size;\n\n // Only show border divider for file type\n const showBorderDivider = type === 'file';\n\n return (\n <FilterPicker\n selectionMode=\"single\"\n selectedKey={selectedKey}\n renderSummary={false}\n icon={<MoreIcon />}\n rightIcon={null}\n shape=\"sharp\"\n type=\"neutral\"\n size={pickerSize}\n // Apply border to wrapper (FilterPickerWrapper) so :first-child evaluates\n // relative to Suffix container, not the internal DialogTrigger\n styles={{\n border: showBorderDivider\n ? {\n '': 0,\n '!:first-child': 'left',\n }\n : 0,\n }}\n triggerStyles={{ border: 0 }}\n aria-label=\"Select tab\"\n isReorderable={isReorderable}\n onReorder={onReorder}\n onSelectionChange={(key) => {\n if (key != null) {\n onSelect(String(key));\n }\n }}\n >\n {tabs.map((tab) => (\n <FilterPicker.Item\n key={tab.key}\n icon={tab.icon}\n textValue={\n typeof tab.title === 'string' ? tab.title : String(tab.key)\n }\n autoHideActions={isDeletable}\n actions={\n isDeletable ? (\n <ItemAction\n icon={<CloseIcon />}\n theme=\"danger\"\n aria-label=\"Close\"\n onPress={() => {\n onDelete(tab.key);\n }}\n />\n ) : undefined\n }\n >\n {tab.title}\n </FilterPicker.Item>\n ))}\n </FilterPicker>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;AAuCA,SAAgB,UAAU,EACxB,MACA,aACA,UACA,UACA,MACA,OAAO,WACP,eACA,aACiB;CACjB,MAAM,cAAc,CAAC,CAAC;AAQtB,QACE,oBAAC;EACC,eAAc;EACD;EACb,eAAe;EACf,MAAM,oBAAC,aAAW;EAClB,WAAW;EACX,OAAM;EACN,MAAK;EACL,MAde,SAAS,WAAW,UAAU;EAiB7C,QAAQ,EACN,QAfoB,SAAS,SAgBzB;GACE,IAAI;GACJ,iBAAiB;GAClB,GACD,GACL;EACD,eAAe,EAAE,QAAQ,GAAG;EAC5B,cAAW;EACI;EACJ;EACX,oBAAoB,QAAQ;AAC1B,OAAI,OAAO,KACT,UAAS,OAAO,IAAI,CAAC;;YAIxB,KAAK,KAAK,QACT,oBAAC,aAAa;GAEZ,MAAM,IAAI;GACV,WACE,OAAO,IAAI,UAAU,WAAW,IAAI,QAAQ,OAAO,IAAI,IAAI;GAE7D,iBAAiB;GACjB,SACE,cACE,oBAAC;IACC,MAAM,oBAAC,cAAY;IACnB,OAAM;IACN,cAAW;IACX,eAAe;AACb,cAAS,IAAI,IAAI;;KAEnB,GACA;aAGL,IAAI;KAnBA,IAAI,IAoBS,CACpB;GACW"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { extractStyles } from "../../../utils/styles.js";
|
|
3
3
|
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
|
|
4
4
|
import { useEvent } from "../../../_internal/hooks/use-event.js";
|
|
@@ -302,8 +302,10 @@ function TabsComponent(props, ref) {
|
|
|
302
302
|
selectedKey: state.selectedKey,
|
|
303
303
|
size,
|
|
304
304
|
type,
|
|
305
|
+
isReorderable,
|
|
305
306
|
onSelect: handleTabPickerSelect,
|
|
306
|
-
onDelete
|
|
307
|
+
onDelete,
|
|
308
|
+
onReorder
|
|
307
309
|
}) : null;
|
|
308
310
|
const prefixHasActions = shouldShowTabPicker && tabPickerPosition === "prefix" || shouldShowScrollArrows && scrollArrowsPosition === "prefix";
|
|
309
311
|
const suffixHasActions = shouldShowTabPicker && tabPickerPosition === "suffix" || shouldShowScrollArrows && scrollArrowsPosition === "suffix";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.js","names":["CollectionItem","mergeProps"],"sources":["../../../../src/components/navigation/Tabs/Tabs.tsx"],"sourcesContent":["import { mergeStyles, OUTER_STYLES } from '@tenphi/tasty';\nimport {\n Children,\n ForwardedRef,\n forwardRef,\n isValidElement,\n ReactElement,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n} from 'react';\nimport { AriaTabListProps, useTabList } from 'react-aria';\nimport {\n Item as CollectionItem,\n DraggableCollectionState,\n DroppableCollectionState,\n useTabListState,\n} from 'react-stately';\n\nimport { useEvent, useWarn } from '../../../_internal/hooks';\nimport { DirectionIcon } from '../../../icons';\nimport { mergeProps, useMergeStyles } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { useTinyScrollbar } from '../../content/Layout/hooks/useTinyScrollbar';\n\nimport { DraggableTabList } from './DraggableTabList';\nimport { TabIndicatorElement, TabsElement } from './styled';\nimport { TabButton } from './TabButton';\nimport { CachedPanelRenderer, TabPanelRenderer } from './TabPanel';\nimport { TabPicker } from './TabPicker';\nimport { TabsAction } from './TabsAction';\nimport { TabsContextValue, TabsProvider } from './TabsContext';\nimport { useTabEditing } from './use-tab-editing';\nimport { useTabIndicator } from './use-tab-indicator';\n\nimport type { Key } from '@react-types/shared';\nimport type {\n CubeTabListProps,\n CubeTabPanelProps,\n CubeTabProps,\n CubeTabsProps,\n ParsedPanel,\n ParsedTab,\n} from './types';\n\n// =============================================================================\n// Helper Functions\n// =============================================================================\n\n/**\n * Generic helper to check if a child is a specific component by displayName.\n */\nfunction isComponentElement<T>(\n child: ReactNode,\n displayName: string,\n): child is ReactElement<T> {\n return (\n isValidElement(child) &&\n typeof child.type === 'function' &&\n (child.type as any).displayName === displayName\n );\n}\n\n/** Checks if a child is a Tab component. */\nconst isTabElement = (child: ReactNode): child is ReactElement<CubeTabProps> =>\n isComponentElement<CubeTabProps>(child, 'CubeTab');\n\n/** Checks if a child is a TabPanel component. */\nconst isTabPanelElement = (\n child: ReactNode,\n): child is ReactElement<CubeTabPanelProps> =>\n isComponentElement<CubeTabPanelProps>(child, 'CubeTabPanel');\n\n/** Checks if a child is a TabList component. */\nconst isTabListElement = (\n child: ReactNode,\n): child is ReactElement<CubeTabListProps> =>\n isComponentElement<CubeTabListProps>(child, 'CubeTabList');\n\n/**\n * Extracts the raw key from a React element, stripping the \".$\" prefix\n * that React adds via Children.map/toArray.\n */\nfunction getRawKey(element: ReactElement): string | null {\n if (element.key == null) return null;\n const keyStr = String(element.key);\n return keyStr.startsWith('.$') ? keyStr.slice(2) : keyStr;\n}\n\n// =============================================================================\n// Tab Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction Tab(_props: CubeTabProps): ReactElement | null {\n return null;\n}\n\nTab.displayName = 'CubeTab';\n\n// =============================================================================\n// TabPanel Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction TabPanel(_props: CubeTabPanelProps): ReactElement | null {\n return null;\n}\n\nTabPanel.displayName = 'CubeTabPanel';\n\n// =============================================================================\n// TabList Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction TabList(_props: CubeTabListProps): ReactElement | null {\n return null;\n}\n\nTabList.displayName = 'CubeTabList';\n\n// =============================================================================\n// Main Tabs Component\n// =============================================================================\n\nfunction TabsComponent(\n props: CubeTabsProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const {\n label = 'Tabs',\n defaultActiveKey,\n activeKey,\n size,\n type = 'default',\n onChange,\n onDelete,\n onTitleChange,\n autoHideActions,\n isEditable: parentIsEditable,\n menu: parentMenu,\n menuTriggerProps: parentMenuTriggerProps,\n menuProps: parentMenuProps,\n contextMenu: parentContextMenu,\n onAction: parentOnAction,\n children,\n prefix,\n suffix,\n prerender = false,\n keepMounted = false,\n qa = 'Tabs',\n renderPanel,\n panelCacheKeys,\n isReorderable = false,\n keyOrder,\n onReorder,\n showTabPicker = false,\n showScrollArrows = false,\n tabPickerPosition = 'suffix',\n scrollArrowsPosition = 'suffix',\n hideTabListScroll = false,\n tabListPadding,\n tabListStyles,\n prefixStyles,\n suffixStyles,\n ...otherProps\n } = props;\n\n // Extract outer styles\n const baseStyles = extractStyles(otherProps, OUTER_STYLES);\n\n // Build TabList padding style (memoized)\n const tabListPaddingStyles = useMemo(\n () =>\n tabListPadding ? { '$tablist-padding': `${tabListPadding}` } : undefined,\n [tabListPadding],\n );\n\n // Merge tabListPaddingStyles with tabListStyles (memoized)\n const mergedTabListStyles = useMemo(\n () => mergeStyles(tabListPaddingStyles, tabListStyles),\n [tabListPaddingStyles, tabListStyles],\n );\n\n // Merge all sub-element styles into baseStyles\n const combinedStyles = useMergeStyles(baseStyles, {\n TabList: mergedTabListStyles,\n Prefix: prefixStyles,\n Suffix: suffixStyles,\n });\n\n // DOM element refs\n const listRef = useRef<HTMLDivElement>(null);\n const scrollRef = useRef<HTMLDivElement>(null);\n\n // Track visited tabs for keepMounted functionality\n const visitedKeysRef = useRef<Set<string>>(new Set());\n\n // =========================================================================\n // Tab Title Editing Hook\n // =========================================================================\n const onTitleChangeRaf = useEvent((key: string, newTitle: string) => {\n requestAnimationFrame(() => {\n onTitleChange?.(key, newTitle);\n });\n });\n\n const {\n editingKey,\n editValue,\n setEditValue,\n startEditing,\n cancelEditing,\n submitEditing,\n } = useTabEditing({\n onChange,\n onTitleChange: onTitleChange ? onTitleChangeRaf : undefined,\n });\n\n // =========================================================================\n // Parse children to extract tabs and explicit panels\n // =========================================================================\n const { parsedTabs, explicitPanels, hasAnyContent } = useMemo(() => {\n const childArray = Children.toArray(children);\n const tabs: ParsedTab[] = [];\n const panels = new Map<string, ParsedPanel>();\n let hasExplicitList = false;\n let tabChildren: ReactNode[] = [];\n\n // Check for explicit Tabs.List / Tabs.Panel structure\n for (const child of childArray) {\n if (isTabListElement(child)) {\n hasExplicitList = true;\n tabChildren = Children.toArray(child.props.children);\n } else if (isTabPanelElement(child)) {\n const key = getRawKey(child as ReactElement);\n\n if (key != null) {\n panels.set(key, {\n key,\n content: child.props.children,\n prerender: child.props.prerender,\n keepMounted: child.props.keepMounted,\n styles: child.props.styles,\n qa: child.props.qa,\n qaVal: child.props.qaVal,\n });\n }\n }\n }\n\n // If no explicit list, use direct Tab children\n if (!hasExplicitList) {\n tabChildren = childArray;\n }\n\n // Parse Tab elements\n let hasContent = panels.size > 0;\n\n for (const child of tabChildren) {\n if (isTabElement(child)) {\n const key = getRawKey(child) ?? child.props.id;\n\n if (key != null) {\n const { id: _id, children: tabContent, ...tabProps } = child.props;\n\n tabs.push({\n ...tabProps,\n key,\n content: tabContent,\n });\n\n if (tabContent != null) {\n hasContent = true;\n }\n }\n }\n }\n\n return {\n parsedTabs: tabs,\n explicitPanels: panels,\n hasAnyContent: hasContent,\n };\n }, [children]);\n\n // Clean up visitedKeys when tabs are removed\n const currentTabKeysSet = useMemo(\n () => new Set(parsedTabs.map((t) => t.key)),\n [parsedTabs],\n );\n\n useEffect(() => {\n for (const key of visitedKeysRef.current) {\n if (!currentTabKeysSet.has(key)) {\n visitedKeysRef.current.delete(key);\n }\n }\n }, [currentTabKeysSet]);\n\n // =========================================================================\n // Order tabs according to keyOrder\n // =========================================================================\n const orderedParsedTabs = useMemo(() => {\n if (!keyOrder || keyOrder.length === 0) {\n return parsedTabs;\n }\n\n const tabMap = new Map<string, ParsedTab>();\n for (const tab of parsedTabs) {\n tabMap.set(tab.key, tab);\n }\n\n const ordered: ParsedTab[] = [];\n for (const key of keyOrder) {\n const tab = tabMap.get(String(key));\n if (tab) {\n ordered.push(tab);\n tabMap.delete(String(key));\n }\n }\n\n // Append any tabs not in keyOrder\n for (const tab of parsedTabs) {\n if (tabMap.has(tab.key)) {\n ordered.push(tab);\n }\n }\n\n return ordered;\n }, [parsedTabs, keyOrder]);\n\n // Create collection items for React Stately\n const collectionItems = useMemo(() => {\n return orderedParsedTabs.map((tab) => (\n <CollectionItem\n key={tab.key}\n textValue={typeof tab.title === 'string' ? tab.title : String(tab.key)}\n >\n {tab.title}\n </CollectionItem>\n ));\n }, [orderedParsedTabs]);\n\n // Determine disabled keys\n const disabledKeys = useMemo(() => {\n return new Set(\n parsedTabs.filter((tab) => tab.isDisabled).map((tab) => tab.key),\n );\n }, [parsedTabs]);\n\n // Handle selection change (converts React Aria's Key to string for our API)\n const handleSelectionChange = useEvent((key: Key) => {\n const keyStr = String(key);\n visitedKeysRef.current.add(keyStr);\n onChange?.(keyStr);\n });\n\n // Convert keys to strings for React Aria compatibility\n const selectedKey = activeKey != null ? String(activeKey) : undefined;\n const defaultSelectedKey =\n defaultActiveKey != null ? String(defaultActiveKey) : undefined;\n\n // Create aria props for useTabListState\n const ariaProps: AriaTabListProps<object> = useMemo(\n () => ({\n selectedKey,\n defaultSelectedKey,\n onSelectionChange: handleSelectionChange,\n disabledKeys,\n children: collectionItems,\n 'aria-label': label,\n }),\n [\n selectedKey,\n defaultSelectedKey,\n handleSelectionChange,\n disabledKeys,\n collectionItems,\n label,\n ],\n );\n\n // Create state using useTabListState\n const state = useTabListState(ariaProps);\n\n // Track initial selected key for visited tabs\n useEffect(() => {\n if (state.selectedKey != null) {\n visitedKeysRef.current.add(String(state.selectedKey));\n }\n }, [state.selectedKey]);\n\n // Get tablist props from react-aria\n const { tabListProps } = useTabList(ariaProps, state, listRef);\n\n // Handle selection from TabPicker (needs to update internal state in uncontrolled mode)\n const handleTabPickerSelect = useEvent((key: string) => {\n // Update internal state (for uncontrolled mode)\n state.setSelectedKey(key);\n // Also call the external onChange handler\n handleSelectionChange(key);\n });\n\n // =========================================================================\n // Tab Indicator (for default type)\n // =========================================================================\n // Create order token that changes when tab order changes (for indicator recalculation)\n const orderToken = useMemo(\n () => orderedParsedTabs.map((t) => t.key).join(','),\n [orderedParsedTabs],\n );\n\n const indicatorStyle = useTabIndicator(\n listRef,\n state.selectedKey,\n type === 'default' || type === 'narrow',\n orderToken,\n );\n\n // =========================================================================\n // Tiny Scrollbar (not for radio type)\n // =========================================================================\n const isTinyScrollbar = type !== 'radio';\n const { handleHStyle, hasOverflowX, isScrolling, isAtStartX, isAtEndX } =\n useTinyScrollbar(scrollRef, isTinyScrollbar);\n const showTinyScrollbar = isTinyScrollbar && !hideTabListScroll;\n\n const hasPanels = hasAnyContent || !!renderPanel;\n\n // =========================================================================\n // Tab Picker visibility\n // =========================================================================\n useWarn(showTabPicker && type === 'radio', {\n key: ['tabs-tabpicker-radio-unsupported'],\n args: [\n 'Tabs:',\n '`showTabPicker` is not supported when `type=\"radio\"`. The TabPicker will not be rendered.',\n ],\n });\n\n const shouldShowTabPicker =\n type !== 'radio' &&\n (showTabPicker === true || (showTabPicker === 'auto' && hasOverflowX));\n\n // =========================================================================\n // Scroll Arrows visibility and handlers\n // =========================================================================\n useWarn(showScrollArrows && type === 'radio', {\n key: ['tabs-scrollarrows-radio-unsupported'],\n args: [\n 'Tabs:',\n '`showScrollArrows` is not supported when `type=\"radio\"`. The scroll arrows will not be rendered.',\n ],\n });\n\n const shouldShowScrollArrows =\n type !== 'radio' &&\n (showScrollArrows === true ||\n (showScrollArrows === 'auto' && hasOverflowX));\n\n const handleScrollLeft = useEvent(() => {\n const el = scrollRef.current;\n if (el) {\n el.scrollTo({\n left: el.scrollLeft - el.clientWidth,\n behavior: 'smooth',\n });\n }\n });\n\n const handleScrollRight = useEvent(() => {\n const el = scrollRef.current;\n if (el) {\n el.scrollTo({\n left: el.scrollLeft + el.clientWidth,\n behavior: 'smooth',\n });\n }\n });\n\n // =========================================================================\n // Base Context Value (without drag/drop states)\n // =========================================================================\n const baseContextValue = useMemo(\n () => ({\n state,\n type,\n size,\n autoHideActions,\n isEditable: parentIsEditable,\n menu: parentMenu,\n menuTriggerProps: parentMenuTriggerProps,\n menuProps: parentMenuProps,\n contextMenu: parentContextMenu,\n onDelete,\n onAction: parentOnAction,\n editingKey,\n editValue,\n setEditValue,\n startEditing,\n submitEditing,\n cancelEditing,\n }),\n [\n state,\n type,\n size,\n autoHideActions,\n parentIsEditable,\n parentMenu,\n parentMenuTriggerProps,\n parentMenuProps,\n parentContextMenu,\n onDelete,\n parentOnAction,\n editingKey,\n editValue,\n setEditValue,\n startEditing,\n submitEditing,\n cancelEditing,\n ],\n );\n\n // Helper to create full context value with optional drag/drop states\n const createContextValue = (\n dragState?: DraggableCollectionState,\n dropState?: DroppableCollectionState,\n ): TabsContextValue => ({\n ...baseContextValue,\n dragState,\n dropState,\n });\n\n // =========================================================================\n // Tab List Content Renderer\n // =========================================================================\n const renderTabListContent = (\n contextValue: TabsContextValue,\n collectionProps: Record<string, unknown> = {},\n ) => (\n <div\n {...mergeProps(tabListProps, collectionProps)}\n ref={listRef}\n data-element=\"TabList\"\n >\n <TabsProvider value={contextValue}>\n {orderedParsedTabs.map((tab, index) => {\n const item = state.collection.getItem(tab.key);\n if (!item) return null;\n\n return (\n <TabButton\n key={item.key}\n item={item}\n tabData={tab}\n isLastTab={index === orderedParsedTabs.length - 1}\n />\n );\n })}\n </TabsProvider>\n {indicatorStyle && (\n <TabIndicatorElement\n style={{\n left: indicatorStyle.left,\n width: indicatorStyle.width,\n }}\n />\n )}\n </div>\n );\n\n // =========================================================================\n // Mods for styling\n // =========================================================================\n const mods = useMemo(\n () => ({\n type,\n size,\n deletable: !!onDelete,\n scrolling: showTinyScrollbar && isScrolling,\n 'fade-left': !isAtStartX,\n 'fade-right': !isAtEndX,\n 'has-panels': hasPanels,\n }),\n [\n type,\n size,\n onDelete,\n showTinyScrollbar,\n isScrolling,\n isAtStartX,\n isAtEndX,\n hasPanels,\n ],\n );\n\n // =========================================================================\n // Action Elements (TabPicker and Scroll Arrows)\n // =========================================================================\n const scrollArrowsElement = shouldShowScrollArrows ? (\n <>\n <TabsAction\n icon={<DirectionIcon to=\"left\" />}\n aria-label=\"Scroll tabs left\"\n isDisabled={isAtStartX}\n onPress={handleScrollLeft}\n />\n <TabsAction\n icon={<DirectionIcon to=\"right\" />}\n aria-label=\"Scroll tabs right\"\n isDisabled={isAtEndX}\n onPress={handleScrollRight}\n />\n </>\n ) : null;\n\n const tabPickerElement = shouldShowTabPicker ? (\n <TabPicker\n tabs={orderedParsedTabs}\n selectedKey={state.selectedKey}\n size={size}\n type={type}\n onSelect={handleTabPickerSelect}\n onDelete={onDelete}\n />\n ) : null;\n\n // Determine which actions go in prefix/suffix\n // In prefix: TabPicker first (left), then scroll arrows (right)\n // In suffix: scroll arrows first (left), then TabPicker (right)\n const prefixHasActions =\n (shouldShowTabPicker && tabPickerPosition === 'prefix') ||\n (shouldShowScrollArrows && scrollArrowsPosition === 'prefix');\n\n const suffixHasActions =\n (shouldShowTabPicker && tabPickerPosition === 'suffix') ||\n (shouldShowScrollArrows && scrollArrowsPosition === 'suffix');\n\n // Wrap with TabsProvider so prefix/suffix can access context (size, type)\n // The inner TabsProvider in renderTabListContent will override for tab buttons\n return (\n <TabsProvider value={baseContextValue}>\n <TabsElement\n ref={ref}\n qa={qa}\n mods={mods}\n styles={combinedStyles}\n style={showTinyScrollbar ? handleHStyle : undefined}\n data-size={size}\n >\n {prefix || prefixHasActions ? (\n <div data-element=\"Prefix\">\n {tabPickerPosition === 'prefix' && tabPickerElement}\n {scrollArrowsPosition === 'prefix' && scrollArrowsElement}\n {prefix}\n </div>\n ) : null}\n <div data-element=\"ScrollWrapper\">\n <div ref={scrollRef} data-element=\"Scroll\">\n {isReorderable ? (\n <DraggableTabList\n state={state}\n listRef={listRef}\n orderedKeys={orderedParsedTabs.map((t) => t.key)}\n onReorder={onReorder}\n >\n {(dragState, dropState, collectionProps) =>\n renderTabListContent(\n createContextValue(dragState, dropState),\n collectionProps,\n )\n }\n </DraggableTabList>\n ) : (\n renderTabListContent(createContextValue())\n )}\n </div>\n {showTinyScrollbar && hasOverflowX && (\n <div data-element=\"ScrollbarH\" />\n )}\n </div>\n {suffix || suffixHasActions ? (\n <div data-element=\"Suffix\">\n {scrollArrowsPosition === 'suffix' && scrollArrowsElement}\n {tabPickerPosition === 'suffix' && tabPickerElement}\n {suffix}\n </div>\n ) : null}\n </TabsElement>\n\n {/* Functional panel rendering with content caching */}\n {renderPanel && (\n <CachedPanelRenderer\n parsedTabs={parsedTabs}\n explicitPanels={explicitPanels}\n state={state}\n renderPanel={renderPanel}\n panelCacheKeys={panelCacheKeys}\n prerender={prerender}\n keepMounted={keepMounted}\n visitedKeys={visitedKeysRef.current}\n />\n )}\n\n {/* Static panel rendering (traditional children-based approach) */}\n {!renderPanel &&\n hasAnyContent &&\n parsedTabs.map((tab) => {\n const explicitPanel = explicitPanels.get(tab.key);\n const content = explicitPanel?.content ?? tab.content;\n\n if (content == null) return null;\n\n return (\n <TabPanelRenderer\n key={tab.key}\n tabKey={tab.key}\n state={state}\n content={content}\n prerender={prerender}\n keepMounted={keepMounted}\n tabPrerender={explicitPanel?.prerender ?? tab.prerender}\n tabKeepMounted={explicitPanel?.keepMounted ?? tab.keepMounted}\n visitedKeys={visitedKeysRef.current}\n panelStyles={explicitPanel?.styles}\n qa={explicitPanel?.qa}\n qaVal={explicitPanel?.qaVal}\n />\n );\n })}\n </TabsProvider>\n );\n}\n\n// =============================================================================\n// Exports\n// =============================================================================\n\nconst _Tabs = forwardRef(TabsComponent);\n\n/**\n * Tabs component for organizing content into multiple panels.\n * Built with React Aria for full accessibility support.\n *\n * **Note:** Tab keys are internally converted to strings for React Aria compatibility.\n *\n * @example\n * // Simple usage\n * <Tabs defaultActiveKey=\"tab1\">\n * <Tab key=\"tab1\" title=\"Tab 1\">Content 1</Tab>\n * <Tab key=\"tab2\" title=\"Tab 2\">Content 2</Tab>\n * </Tabs>\n *\n * @example\n * // Tabs-only (no panels)\n * <Tabs activeKey={activeTab} onChange={setActiveTab}>\n * <Tab key=\"overview\" title=\"Overview\" />\n * <Tab key=\"settings\" title=\"Settings\" />\n * </Tabs>\n *\n * @example\n * // Explicit panels\n * <Tabs defaultActiveKey=\"tab1\">\n * <Tabs.List>\n * <Tab key=\"tab1\" title=\"Tab 1\" />\n * <Tab key=\"tab2\" title=\"Tab 2\" />\n * </Tabs.List>\n * <Tabs.Panel key=\"tab1\">Content 1</Tabs.Panel>\n * <Tabs.Panel key=\"tab2\">Content 2</Tabs.Panel>\n * </Tabs>\n */\nexport const Tabs = Object.assign(_Tabs, {\n Tab,\n List: TabList,\n Panel: TabPanel,\n Action: TabsAction,\n});\n\nexport { Tab, TabList, TabPanel, TabsAction };\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tabs.js","names":["CollectionItem","mergeProps"],"sources":["../../../../src/components/navigation/Tabs/Tabs.tsx"],"sourcesContent":["import { mergeStyles, OUTER_STYLES } from '@tenphi/tasty';\nimport {\n Children,\n ForwardedRef,\n forwardRef,\n isValidElement,\n ReactElement,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n} from 'react';\nimport { AriaTabListProps, useTabList } from 'react-aria';\nimport {\n Item as CollectionItem,\n DraggableCollectionState,\n DroppableCollectionState,\n useTabListState,\n} from 'react-stately';\n\nimport { useEvent, useWarn } from '../../../_internal/hooks';\nimport { DirectionIcon } from '../../../icons';\nimport { mergeProps, useMergeStyles } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { useTinyScrollbar } from '../../content/Layout/hooks/useTinyScrollbar';\n\nimport { DraggableTabList } from './DraggableTabList';\nimport { TabIndicatorElement, TabsElement } from './styled';\nimport { TabButton } from './TabButton';\nimport { CachedPanelRenderer, TabPanelRenderer } from './TabPanel';\nimport { TabPicker } from './TabPicker';\nimport { TabsAction } from './TabsAction';\nimport { TabsContextValue, TabsProvider } from './TabsContext';\nimport { useTabEditing } from './use-tab-editing';\nimport { useTabIndicator } from './use-tab-indicator';\n\nimport type { Key } from '@react-types/shared';\nimport type {\n CubeTabListProps,\n CubeTabPanelProps,\n CubeTabProps,\n CubeTabsProps,\n ParsedPanel,\n ParsedTab,\n} from './types';\n\n// =============================================================================\n// Helper Functions\n// =============================================================================\n\n/**\n * Generic helper to check if a child is a specific component by displayName.\n */\nfunction isComponentElement<T>(\n child: ReactNode,\n displayName: string,\n): child is ReactElement<T> {\n return (\n isValidElement(child) &&\n typeof child.type === 'function' &&\n (child.type as any).displayName === displayName\n );\n}\n\n/** Checks if a child is a Tab component. */\nconst isTabElement = (child: ReactNode): child is ReactElement<CubeTabProps> =>\n isComponentElement<CubeTabProps>(child, 'CubeTab');\n\n/** Checks if a child is a TabPanel component. */\nconst isTabPanelElement = (\n child: ReactNode,\n): child is ReactElement<CubeTabPanelProps> =>\n isComponentElement<CubeTabPanelProps>(child, 'CubeTabPanel');\n\n/** Checks if a child is a TabList component. */\nconst isTabListElement = (\n child: ReactNode,\n): child is ReactElement<CubeTabListProps> =>\n isComponentElement<CubeTabListProps>(child, 'CubeTabList');\n\n/**\n * Extracts the raw key from a React element, stripping the \".$\" prefix\n * that React adds via Children.map/toArray.\n */\nfunction getRawKey(element: ReactElement): string | null {\n if (element.key == null) return null;\n const keyStr = String(element.key);\n return keyStr.startsWith('.$') ? keyStr.slice(2) : keyStr;\n}\n\n// =============================================================================\n// Tab Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction Tab(_props: CubeTabProps): ReactElement | null {\n return null;\n}\n\nTab.displayName = 'CubeTab';\n\n// =============================================================================\n// TabPanel Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction TabPanel(_props: CubeTabPanelProps): ReactElement | null {\n return null;\n}\n\nTabPanel.displayName = 'CubeTabPanel';\n\n// =============================================================================\n// TabList Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction TabList(_props: CubeTabListProps): ReactElement | null {\n return null;\n}\n\nTabList.displayName = 'CubeTabList';\n\n// =============================================================================\n// Main Tabs Component\n// =============================================================================\n\nfunction TabsComponent(\n props: CubeTabsProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const {\n label = 'Tabs',\n defaultActiveKey,\n activeKey,\n size,\n type = 'default',\n onChange,\n onDelete,\n onTitleChange,\n autoHideActions,\n isEditable: parentIsEditable,\n menu: parentMenu,\n menuTriggerProps: parentMenuTriggerProps,\n menuProps: parentMenuProps,\n contextMenu: parentContextMenu,\n onAction: parentOnAction,\n children,\n prefix,\n suffix,\n prerender = false,\n keepMounted = false,\n qa = 'Tabs',\n renderPanel,\n panelCacheKeys,\n isReorderable = false,\n keyOrder,\n onReorder,\n showTabPicker = false,\n showScrollArrows = false,\n tabPickerPosition = 'suffix',\n scrollArrowsPosition = 'suffix',\n hideTabListScroll = false,\n tabListPadding,\n tabListStyles,\n prefixStyles,\n suffixStyles,\n ...otherProps\n } = props;\n\n // Extract outer styles\n const baseStyles = extractStyles(otherProps, OUTER_STYLES);\n\n // Build TabList padding style (memoized)\n const tabListPaddingStyles = useMemo(\n () =>\n tabListPadding ? { '$tablist-padding': `${tabListPadding}` } : undefined,\n [tabListPadding],\n );\n\n // Merge tabListPaddingStyles with tabListStyles (memoized)\n const mergedTabListStyles = useMemo(\n () => mergeStyles(tabListPaddingStyles, tabListStyles),\n [tabListPaddingStyles, tabListStyles],\n );\n\n // Merge all sub-element styles into baseStyles\n const combinedStyles = useMergeStyles(baseStyles, {\n TabList: mergedTabListStyles,\n Prefix: prefixStyles,\n Suffix: suffixStyles,\n });\n\n // DOM element refs\n const listRef = useRef<HTMLDivElement>(null);\n const scrollRef = useRef<HTMLDivElement>(null);\n\n // Track visited tabs for keepMounted functionality\n const visitedKeysRef = useRef<Set<string>>(new Set());\n\n // =========================================================================\n // Tab Title Editing Hook\n // =========================================================================\n const onTitleChangeRaf = useEvent((key: string, newTitle: string) => {\n requestAnimationFrame(() => {\n onTitleChange?.(key, newTitle);\n });\n });\n\n const {\n editingKey,\n editValue,\n setEditValue,\n startEditing,\n cancelEditing,\n submitEditing,\n } = useTabEditing({\n onChange,\n onTitleChange: onTitleChange ? onTitleChangeRaf : undefined,\n });\n\n // =========================================================================\n // Parse children to extract tabs and explicit panels\n // =========================================================================\n const { parsedTabs, explicitPanels, hasAnyContent } = useMemo(() => {\n const childArray = Children.toArray(children);\n const tabs: ParsedTab[] = [];\n const panels = new Map<string, ParsedPanel>();\n let hasExplicitList = false;\n let tabChildren: ReactNode[] = [];\n\n // Check for explicit Tabs.List / Tabs.Panel structure\n for (const child of childArray) {\n if (isTabListElement(child)) {\n hasExplicitList = true;\n tabChildren = Children.toArray(child.props.children);\n } else if (isTabPanelElement(child)) {\n const key = getRawKey(child as ReactElement);\n\n if (key != null) {\n panels.set(key, {\n key,\n content: child.props.children,\n prerender: child.props.prerender,\n keepMounted: child.props.keepMounted,\n styles: child.props.styles,\n qa: child.props.qa,\n qaVal: child.props.qaVal,\n });\n }\n }\n }\n\n // If no explicit list, use direct Tab children\n if (!hasExplicitList) {\n tabChildren = childArray;\n }\n\n // Parse Tab elements\n let hasContent = panels.size > 0;\n\n for (const child of tabChildren) {\n if (isTabElement(child)) {\n const key = getRawKey(child) ?? child.props.id;\n\n if (key != null) {\n const { id: _id, children: tabContent, ...tabProps } = child.props;\n\n tabs.push({\n ...tabProps,\n key,\n content: tabContent,\n });\n\n if (tabContent != null) {\n hasContent = true;\n }\n }\n }\n }\n\n return {\n parsedTabs: tabs,\n explicitPanels: panels,\n hasAnyContent: hasContent,\n };\n }, [children]);\n\n // Clean up visitedKeys when tabs are removed\n const currentTabKeysSet = useMemo(\n () => new Set(parsedTabs.map((t) => t.key)),\n [parsedTabs],\n );\n\n useEffect(() => {\n for (const key of visitedKeysRef.current) {\n if (!currentTabKeysSet.has(key)) {\n visitedKeysRef.current.delete(key);\n }\n }\n }, [currentTabKeysSet]);\n\n // =========================================================================\n // Order tabs according to keyOrder\n // =========================================================================\n const orderedParsedTabs = useMemo(() => {\n if (!keyOrder || keyOrder.length === 0) {\n return parsedTabs;\n }\n\n const tabMap = new Map<string, ParsedTab>();\n for (const tab of parsedTabs) {\n tabMap.set(tab.key, tab);\n }\n\n const ordered: ParsedTab[] = [];\n for (const key of keyOrder) {\n const tab = tabMap.get(String(key));\n if (tab) {\n ordered.push(tab);\n tabMap.delete(String(key));\n }\n }\n\n // Append any tabs not in keyOrder\n for (const tab of parsedTabs) {\n if (tabMap.has(tab.key)) {\n ordered.push(tab);\n }\n }\n\n return ordered;\n }, [parsedTabs, keyOrder]);\n\n // Create collection items for React Stately\n const collectionItems = useMemo(() => {\n return orderedParsedTabs.map((tab) => (\n <CollectionItem\n key={tab.key}\n textValue={typeof tab.title === 'string' ? tab.title : String(tab.key)}\n >\n {tab.title}\n </CollectionItem>\n ));\n }, [orderedParsedTabs]);\n\n // Determine disabled keys\n const disabledKeys = useMemo(() => {\n return new Set(\n parsedTabs.filter((tab) => tab.isDisabled).map((tab) => tab.key),\n );\n }, [parsedTabs]);\n\n // Handle selection change (converts React Aria's Key to string for our API)\n const handleSelectionChange = useEvent((key: Key) => {\n const keyStr = String(key);\n visitedKeysRef.current.add(keyStr);\n onChange?.(keyStr);\n });\n\n // Convert keys to strings for React Aria compatibility\n const selectedKey = activeKey != null ? String(activeKey) : undefined;\n const defaultSelectedKey =\n defaultActiveKey != null ? String(defaultActiveKey) : undefined;\n\n // Create aria props for useTabListState\n const ariaProps: AriaTabListProps<object> = useMemo(\n () => ({\n selectedKey,\n defaultSelectedKey,\n onSelectionChange: handleSelectionChange,\n disabledKeys,\n children: collectionItems,\n 'aria-label': label,\n }),\n [\n selectedKey,\n defaultSelectedKey,\n handleSelectionChange,\n disabledKeys,\n collectionItems,\n label,\n ],\n );\n\n // Create state using useTabListState\n const state = useTabListState(ariaProps);\n\n // Track initial selected key for visited tabs\n useEffect(() => {\n if (state.selectedKey != null) {\n visitedKeysRef.current.add(String(state.selectedKey));\n }\n }, [state.selectedKey]);\n\n // Get tablist props from react-aria\n const { tabListProps } = useTabList(ariaProps, state, listRef);\n\n // Handle selection from TabPicker (needs to update internal state in uncontrolled mode)\n const handleTabPickerSelect = useEvent((key: string) => {\n // Update internal state (for uncontrolled mode)\n state.setSelectedKey(key);\n // Also call the external onChange handler\n handleSelectionChange(key);\n });\n\n // =========================================================================\n // Tab Indicator (for default type)\n // =========================================================================\n // Create order token that changes when tab order changes (for indicator recalculation)\n const orderToken = useMemo(\n () => orderedParsedTabs.map((t) => t.key).join(','),\n [orderedParsedTabs],\n );\n\n const indicatorStyle = useTabIndicator(\n listRef,\n state.selectedKey,\n type === 'default' || type === 'narrow',\n orderToken,\n );\n\n // =========================================================================\n // Tiny Scrollbar (not for radio type)\n // =========================================================================\n const isTinyScrollbar = type !== 'radio';\n const { handleHStyle, hasOverflowX, isScrolling, isAtStartX, isAtEndX } =\n useTinyScrollbar(scrollRef, isTinyScrollbar);\n const showTinyScrollbar = isTinyScrollbar && !hideTabListScroll;\n\n const hasPanels = hasAnyContent || !!renderPanel;\n\n // =========================================================================\n // Tab Picker visibility\n // =========================================================================\n useWarn(showTabPicker && type === 'radio', {\n key: ['tabs-tabpicker-radio-unsupported'],\n args: [\n 'Tabs:',\n '`showTabPicker` is not supported when `type=\"radio\"`. The TabPicker will not be rendered.',\n ],\n });\n\n const shouldShowTabPicker =\n type !== 'radio' &&\n (showTabPicker === true || (showTabPicker === 'auto' && hasOverflowX));\n\n // =========================================================================\n // Scroll Arrows visibility and handlers\n // =========================================================================\n useWarn(showScrollArrows && type === 'radio', {\n key: ['tabs-scrollarrows-radio-unsupported'],\n args: [\n 'Tabs:',\n '`showScrollArrows` is not supported when `type=\"radio\"`. The scroll arrows will not be rendered.',\n ],\n });\n\n const shouldShowScrollArrows =\n type !== 'radio' &&\n (showScrollArrows === true ||\n (showScrollArrows === 'auto' && hasOverflowX));\n\n const handleScrollLeft = useEvent(() => {\n const el = scrollRef.current;\n if (el) {\n el.scrollTo({\n left: el.scrollLeft - el.clientWidth,\n behavior: 'smooth',\n });\n }\n });\n\n const handleScrollRight = useEvent(() => {\n const el = scrollRef.current;\n if (el) {\n el.scrollTo({\n left: el.scrollLeft + el.clientWidth,\n behavior: 'smooth',\n });\n }\n });\n\n // =========================================================================\n // Base Context Value (without drag/drop states)\n // =========================================================================\n const baseContextValue = useMemo(\n () => ({\n state,\n type,\n size,\n autoHideActions,\n isEditable: parentIsEditable,\n menu: parentMenu,\n menuTriggerProps: parentMenuTriggerProps,\n menuProps: parentMenuProps,\n contextMenu: parentContextMenu,\n onDelete,\n onAction: parentOnAction,\n editingKey,\n editValue,\n setEditValue,\n startEditing,\n submitEditing,\n cancelEditing,\n }),\n [\n state,\n type,\n size,\n autoHideActions,\n parentIsEditable,\n parentMenu,\n parentMenuTriggerProps,\n parentMenuProps,\n parentContextMenu,\n onDelete,\n parentOnAction,\n editingKey,\n editValue,\n setEditValue,\n startEditing,\n submitEditing,\n cancelEditing,\n ],\n );\n\n // Helper to create full context value with optional drag/drop states\n const createContextValue = (\n dragState?: DraggableCollectionState,\n dropState?: DroppableCollectionState,\n ): TabsContextValue => ({\n ...baseContextValue,\n dragState,\n dropState,\n });\n\n // =========================================================================\n // Tab List Content Renderer\n // =========================================================================\n const renderTabListContent = (\n contextValue: TabsContextValue,\n collectionProps: Record<string, unknown> = {},\n ) => (\n <div\n {...mergeProps(tabListProps, collectionProps)}\n ref={listRef}\n data-element=\"TabList\"\n >\n <TabsProvider value={contextValue}>\n {orderedParsedTabs.map((tab, index) => {\n const item = state.collection.getItem(tab.key);\n if (!item) return null;\n\n return (\n <TabButton\n key={item.key}\n item={item}\n tabData={tab}\n isLastTab={index === orderedParsedTabs.length - 1}\n />\n );\n })}\n </TabsProvider>\n {indicatorStyle && (\n <TabIndicatorElement\n style={{\n left: indicatorStyle.left,\n width: indicatorStyle.width,\n }}\n />\n )}\n </div>\n );\n\n // =========================================================================\n // Mods for styling\n // =========================================================================\n const mods = useMemo(\n () => ({\n type,\n size,\n deletable: !!onDelete,\n scrolling: showTinyScrollbar && isScrolling,\n 'fade-left': !isAtStartX,\n 'fade-right': !isAtEndX,\n 'has-panels': hasPanels,\n }),\n [\n type,\n size,\n onDelete,\n showTinyScrollbar,\n isScrolling,\n isAtStartX,\n isAtEndX,\n hasPanels,\n ],\n );\n\n // =========================================================================\n // Action Elements (TabPicker and Scroll Arrows)\n // =========================================================================\n const scrollArrowsElement = shouldShowScrollArrows ? (\n <>\n <TabsAction\n icon={<DirectionIcon to=\"left\" />}\n aria-label=\"Scroll tabs left\"\n isDisabled={isAtStartX}\n onPress={handleScrollLeft}\n />\n <TabsAction\n icon={<DirectionIcon to=\"right\" />}\n aria-label=\"Scroll tabs right\"\n isDisabled={isAtEndX}\n onPress={handleScrollRight}\n />\n </>\n ) : null;\n\n const tabPickerElement = shouldShowTabPicker ? (\n <TabPicker\n tabs={orderedParsedTabs}\n selectedKey={state.selectedKey}\n size={size}\n type={type}\n isReorderable={isReorderable}\n onSelect={handleTabPickerSelect}\n onDelete={onDelete}\n onReorder={onReorder}\n />\n ) : null;\n\n // Determine which actions go in prefix/suffix\n // In prefix: TabPicker first (left), then scroll arrows (right)\n // In suffix: scroll arrows first (left), then TabPicker (right)\n const prefixHasActions =\n (shouldShowTabPicker && tabPickerPosition === 'prefix') ||\n (shouldShowScrollArrows && scrollArrowsPosition === 'prefix');\n\n const suffixHasActions =\n (shouldShowTabPicker && tabPickerPosition === 'suffix') ||\n (shouldShowScrollArrows && scrollArrowsPosition === 'suffix');\n\n // Wrap with TabsProvider so prefix/suffix can access context (size, type)\n // The inner TabsProvider in renderTabListContent will override for tab buttons\n return (\n <TabsProvider value={baseContextValue}>\n <TabsElement\n ref={ref}\n qa={qa}\n mods={mods}\n styles={combinedStyles}\n style={showTinyScrollbar ? handleHStyle : undefined}\n data-size={size}\n >\n {prefix || prefixHasActions ? (\n <div data-element=\"Prefix\">\n {tabPickerPosition === 'prefix' && tabPickerElement}\n {scrollArrowsPosition === 'prefix' && scrollArrowsElement}\n {prefix}\n </div>\n ) : null}\n <div data-element=\"ScrollWrapper\">\n <div ref={scrollRef} data-element=\"Scroll\">\n {isReorderable ? (\n <DraggableTabList\n state={state}\n listRef={listRef}\n orderedKeys={orderedParsedTabs.map((t) => t.key)}\n onReorder={onReorder}\n >\n {(dragState, dropState, collectionProps) =>\n renderTabListContent(\n createContextValue(dragState, dropState),\n collectionProps,\n )\n }\n </DraggableTabList>\n ) : (\n renderTabListContent(createContextValue())\n )}\n </div>\n {showTinyScrollbar && hasOverflowX && (\n <div data-element=\"ScrollbarH\" />\n )}\n </div>\n {suffix || suffixHasActions ? (\n <div data-element=\"Suffix\">\n {scrollArrowsPosition === 'suffix' && scrollArrowsElement}\n {tabPickerPosition === 'suffix' && tabPickerElement}\n {suffix}\n </div>\n ) : null}\n </TabsElement>\n\n {/* Functional panel rendering with content caching */}\n {renderPanel && (\n <CachedPanelRenderer\n parsedTabs={parsedTabs}\n explicitPanels={explicitPanels}\n state={state}\n renderPanel={renderPanel}\n panelCacheKeys={panelCacheKeys}\n prerender={prerender}\n keepMounted={keepMounted}\n visitedKeys={visitedKeysRef.current}\n />\n )}\n\n {/* Static panel rendering (traditional children-based approach) */}\n {!renderPanel &&\n hasAnyContent &&\n parsedTabs.map((tab) => {\n const explicitPanel = explicitPanels.get(tab.key);\n const content = explicitPanel?.content ?? tab.content;\n\n if (content == null) return null;\n\n return (\n <TabPanelRenderer\n key={tab.key}\n tabKey={tab.key}\n state={state}\n content={content}\n prerender={prerender}\n keepMounted={keepMounted}\n tabPrerender={explicitPanel?.prerender ?? tab.prerender}\n tabKeepMounted={explicitPanel?.keepMounted ?? tab.keepMounted}\n visitedKeys={visitedKeysRef.current}\n panelStyles={explicitPanel?.styles}\n qa={explicitPanel?.qa}\n qaVal={explicitPanel?.qaVal}\n />\n );\n })}\n </TabsProvider>\n );\n}\n\n// =============================================================================\n// Exports\n// =============================================================================\n\nconst _Tabs = forwardRef(TabsComponent);\n\n/**\n * Tabs component for organizing content into multiple panels.\n * Built with React Aria for full accessibility support.\n *\n * **Note:** Tab keys are internally converted to strings for React Aria compatibility.\n *\n * @example\n * // Simple usage\n * <Tabs defaultActiveKey=\"tab1\">\n * <Tab key=\"tab1\" title=\"Tab 1\">Content 1</Tab>\n * <Tab key=\"tab2\" title=\"Tab 2\">Content 2</Tab>\n * </Tabs>\n *\n * @example\n * // Tabs-only (no panels)\n * <Tabs activeKey={activeTab} onChange={setActiveTab}>\n * <Tab key=\"overview\" title=\"Overview\" />\n * <Tab key=\"settings\" title=\"Settings\" />\n * </Tabs>\n *\n * @example\n * // Explicit panels\n * <Tabs defaultActiveKey=\"tab1\">\n * <Tabs.List>\n * <Tab key=\"tab1\" title=\"Tab 1\" />\n * <Tab key=\"tab2\" title=\"Tab 2\" />\n * </Tabs.List>\n * <Tabs.Panel key=\"tab1\">Content 1</Tabs.Panel>\n * <Tabs.Panel key=\"tab2\">Content 2</Tabs.Panel>\n * </Tabs>\n */\nexport const Tabs = Object.assign(_Tabs, {\n Tab,\n List: TabList,\n Panel: TabPanel,\n Action: TabsAction,\n});\n\nexport { Tab, TabList, TabPanel, TabsAction };\n"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { _ItemButton } from "../../actions/ItemButton/ItemButton.js";
|
|
3
3
|
import { useOptionalTabsContext } from "./TabsContext.js";
|
|
4
4
|
import { tasty } from "@tenphi/tasty";
|
|
@@ -143,6 +143,8 @@ interface CubeTabsProps extends BaseProps, OuterStyleProps, PanelBehaviorProps {
|
|
|
143
143
|
panelCacheKeys?: Record<string | number, CacheKeyValue>;
|
|
144
144
|
/**
|
|
145
145
|
* Enable drag-and-drop tab reordering.
|
|
146
|
+
* When a tab picker is shown (`showTabPicker`), reordering is automatically
|
|
147
|
+
* enabled in the picker dropdown as well.
|
|
146
148
|
* @default false
|
|
147
149
|
*/
|
|
148
150
|
isReorderable?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","names":[],"sources":["../../../../src/components/navigation/Tabs/types.ts"],"sourcesContent":["import type { BaseProps, OuterStyleProps, Styles } from '@tenphi/tasty';\nimport type { ReactNode } from 'react';\nimport type { CubeItemActionProps } from '../../actions/ItemAction';\nimport type { CubeMenuProps } from '../../actions/Menu';\nimport type { CubeItemProps } from '../../content/Item';\n\n// =============================================================================\n// Core Types\n// =============================================================================\n\n/** Visual appearance type for tabs */\nexport type TabType = 'default' | 'narrow' | 'file' | 'radio';\n\n/** Position for TabPicker and scroll arrows */\nexport type TabsActionPosition = 'prefix' | 'suffix';\n\n/**\n * Tab size options.\n * Radio type only supports 'medium' | 'large' (mapped to smaller Item sizes).\n */\nexport type TabSize = 'xsmall' | 'small' | 'medium' | 'large';\n\n/**\n * Size mapping for radio type tabs.\n * API sizes mapped to Item button sizes:\n * medium (default) -> xsmall (32px total), large -> medium (40px total).\n */\nexport const RADIO_SIZE_MAP: Record<'medium' | 'large', TabSize> = {\n medium: 'xsmall',\n large: 'medium',\n};\n\n/** How the tab `menu` is exposed alongside or instead of the overflow trigger. */\nexport type TabContextMenu = boolean | 'context-only';\n\n// =============================================================================\n// Shared Props Interfaces\n// =============================================================================\n\n/** Common props for panel rendering behavior */\nexport interface PanelBehaviorProps {\n /** If true, panel is rendered but hidden when not active. */\n prerender?: boolean;\n /** If true, once visited the panel stays in DOM. */\n keepMounted?: boolean;\n}\n\n/** Common props for QA attributes */\nexport interface QAProps {\n /** QA selector attribute. */\n qa?: string;\n /** Additional QA value attribute. */\n qaVal?: string;\n}\n\n// =============================================================================\n// Tab Style Props\n// =============================================================================\n\n/** Props from CubeItemProps that don't apply to Tab */\ntype OmittedItemProps =\n | 'id' // Tab has its own id as Key type\n | 'type' // Tab has its own TabType\n | 'size' // Tab has its own TabSize\n | 'theme' // Tabs have internal theming\n | 'shape' // Tabs have internal shape logic\n | 'description' // Tabs don't have descriptions\n | 'descriptionPlacement'\n | 'descriptionProps'\n | 'hotkeys' // Tabs have their own keyboard navigation\n | 'keyboardShortcutProps'\n | 'labelProps' // Tabs use title prop instead\n | 'labelRef'\n | 'level' // Tabs don't use heading levels\n | 'highlight' // Tabs don't use highlighting\n | 'highlightCaseSensitive'\n | 'highlightStyles'\n | 'variant' // Tabs have internal variant logic\n | 'htmlType' // Tab is always a button\n | 'isSelected' // Handled internally by state\n | 'preserveActionsSpace' // Set internally in TabButton\n | 'disableActionsFocus' // Not used in Tab\n | 'actions' // Tab has its own actions definition\n | 'autoHideActions' // Tab has its own autoHideActions\n | 'insideWrapper' // Internal Item wrapper prop\n | 'showActions'; // Internal Item wrapper prop\n\n/** Common styling props for tabs - inherits style props from CubeItemProps */\nexport interface TabStyleProps extends Omit<CubeItemProps, OmittedItemProps> {\n /**\n * Tab size. Supports 'xsmall', 'small', 'medium', 'large'.\n * Radio type supports 'large' (default, 40px) and 'medium' (32px),\n * mapped to Item button sizes medium (32px) and xsmall (24px).\n */\n size?: TabSize;\n /** Visual appearance type. */\n type?: TabType;\n /** Whether to show actions only on hover. */\n autoHideActions?: boolean;\n}\n\n// =============================================================================\n// Component Props\n// =============================================================================\n\n/** Cache key type - primitives only for reliable comparison */\nexport type CacheKeyValue = string | number | boolean | null | undefined;\n\nexport interface CubeTabsProps\n extends BaseProps,\n OuterStyleProps,\n PanelBehaviorProps {\n /** Controlled active tab key. When provided, component is controlled. */\n activeKey?: string;\n /** Initial active tab key for uncontrolled mode. */\n defaultActiveKey?: string;\n /**\n * Visual appearance type for tabs.\n * - `default` - Standard tabs with selection indicator below (default)\n * - `narrow` - Same as default but with collapsed vertical padding on labels\n * - `file` - File-style tabs with border bottom highlight on selection, delimiter between tabs\n * - `radio` - Radio button style for tab selection\n * @default 'default'\n */\n type?: TabType;\n /**\n * Tab size. Supports 'xsmall', 'small', 'medium', 'large'.\n * Radio type supports 'large' (default, 40px) and 'medium' (32px),\n * mapped to Item button sizes medium (32px) and xsmall (24px).\n * @default 'medium'\n */\n size?: TabSize;\n /** Accessible label for the tab list. */\n label?: string;\n /** Content rendered before the tab list. */\n prefix?: ReactNode;\n /** Content rendered after the tab list. */\n suffix?: ReactNode;\n /** Callback when active tab changes. */\n onChange?: (key: string) => void;\n /** Callback when tab delete button is clicked. Presence enables delete buttons. */\n onDelete?: (key: string) => void;\n /** Callback when a tab title is changed. Enables title editing on tabs with isEditable. */\n onTitleChange?: (key: string, newTitle: string) => void;\n /** Whether to show tab actions only on hover. Can be overridden per-tab. */\n autoHideActions?: boolean;\n /**\n * Whether tabs are editable by default.\n * Can be overridden per-tab via Tab's isEditable prop.\n * @default false\n */\n isEditable?: boolean;\n /**\n * Default menu items for all tabs.\n * Can be overridden per-tab via Tab's menu prop.\n * Set to `null` on individual Tab to disable menu for that tab.\n */\n menu?: ReactNode;\n /**\n * Default props for the menu trigger button.\n * Can be overridden per-tab via Tab's menuTriggerProps prop.\n * @default { icon: <MoreIcon /> }\n */\n menuTriggerProps?: Partial<CubeItemActionProps>;\n /**\n * Default props passed to the Menu component.\n * Can be overridden per-tab via Tab's menuProps prop.\n */\n menuProps?: Partial<CubeMenuProps<object>>;\n /**\n * Context menu / overflow behavior for tab `menu` items.\n * - `false` (default) — overflow trigger only; no right-click menu\n * - `true` — overflow trigger and right-click menu\n * - `'context-only'` — right-click menu only; no overflow trigger. Inline close\n * (`onDelete`) shows even when `menu` is non-empty, like tabs without a menu.\n * Can be overridden per-tab via Tab's contextMenu prop.\n * @default false\n */\n contextMenu?: TabContextMenu;\n /**\n * Callback when a menu action is triggered on any tab.\n * Called with the action key and the tab key.\n * Tab-level onAction is called first, then this.\n */\n onAction?: (action: string, tabKey: string) => void;\n /** Custom tasty styles for the tab bar container. */\n styles?: Styles;\n /** QA selector attribute. */\n qa?: string;\n /** Tab components or Tabs.List with Tabs.Panel. */\n children?: ReactNode;\n /**\n * Functional content renderer for optimized lazy evaluation.\n * When provided, panel content is only evaluated for the active tab,\n * while inactive tabs use cached content.\n */\n renderPanel?: (key: string) => ReactNode;\n /**\n * Cache keys for individual panels. Enables caching for specified panels.\n */\n panelCacheKeys?: Record<string | number, CacheKeyValue>;\n /**\n * Enable drag-and-drop tab reordering.\n * @default false\n */\n isReorderable?: boolean;\n /**\n * Controlled order of tab keys.\n * When provided, tabs are displayed in this order.\n */\n keyOrder?: string[];\n /**\n * Callback when tabs are reordered via drag-and-drop.\n */\n onReorder?: (newOrder: string[]) => void;\n /**\n * Whether to show a tab picker dropdown in the suffix area.\n * - `true` - always show the tab picker\n * - `false` - never show the tab picker (default)\n * - `'auto'` - show only when tabs overflow (has horizontal scroll)\n * @default false\n */\n showTabPicker?: boolean | 'auto';\n /**\n * Whether to show scroll arrow buttons in the suffix area.\n * - `true` - always show scroll arrows\n * - `false` - never show scroll arrows (default)\n * - `'auto'` - show only when tabs overflow (has horizontal scroll)\n * @default false\n */\n showScrollArrows?: boolean | 'auto';\n /**\n * Position of the tab picker dropdown.\n * - `'prefix'` - render in the prefix slot (before tab list)\n * - `'suffix'` - render in the suffix slot (after tab list)\n * @default 'suffix'\n */\n tabPickerPosition?: TabsActionPosition;\n /**\n * Position of the scroll arrow buttons.\n * - `'prefix'` - render in the prefix slot (before tab list)\n * - `'suffix'` - render in the suffix slot (after tab list)\n * @default 'suffix'\n */\n scrollArrowsPosition?: TabsActionPosition;\n /**\n * Visually hide the custom horizontal scrollbar in the tab list\n * and skip its tracking logic. Does not affect tab picker, scroll arrows,\n * or fade indicators — only the tiny scrollbar visual.\n * @default false\n */\n hideTabListScroll?: boolean;\n /**\n * Inline padding for the tab list container.\n * Sets horizontal padding only (e.g., \"2x\" → padding: \"0 2x\").\n */\n tabListPadding?: string;\n /** Custom tasty styles for the TabList sub-element. */\n tabListStyles?: Styles;\n /** Custom tasty styles for the Prefix sub-element. */\n prefixStyles?: Styles;\n /** Custom tasty styles for the Suffix sub-element. */\n suffixStyles?: Styles;\n}\n\nexport interface CubeTabProps extends TabStyleProps, PanelBehaviorProps {\n /**\n * Unique identifier for the tab.\n * Auto-injected from the React `key` prop (converted to string).\n */\n id?: string;\n /** Content displayed in the tab button. */\n title: ReactNode;\n /** Panel content rendered when tab is active. */\n children?: ReactNode;\n /** Disables the tab (cannot be selected). */\n isDisabled?: boolean;\n /** Actions to render in the tab. Rendered before menu trigger if tab has menu. */\n actions?: ReactNode;\n /** Whether the tab title can be edited. Overrides the Tabs-level isEditable default. */\n isEditable?: boolean;\n /** Callback when this tab's title is changed. Overrides parent's onTitleChange. */\n onTitleChange?: (newTitle: string) => void;\n /**\n * Menu items to display in a dropdown menu on the tab.\n * Pass Menu.Item elements directly - they will be wrapped in a Menu internally.\n * Overrides the Tabs-level menu default. Set to `null` to disable menu.\n */\n menu?: ReactNode | null;\n /**\n * Props to customize the menu trigger button.\n * Overrides the Tabs-level menuTriggerProps default.\n */\n menuTriggerProps?: Partial<CubeItemActionProps>;\n /**\n * Props passed to the Menu component.\n * Overrides the Tabs-level menuProps default.\n */\n menuProps?: Partial<CubeMenuProps<object>>;\n /**\n * Context menu / overflow behavior. Same values as Tabs `contextMenu`.\n * Uses the same menu items as `menu` prop.\n * @default false\n */\n contextMenu?: TabContextMenu;\n /**\n * Callback when a menu action is triggered.\n * Called with the action key from Menu.Item.\n */\n onAction?: (action: string) => void;\n}\n\nexport interface CubeTabPanelProps extends PanelBehaviorProps, QAProps {\n /**\n * Panel identifier. Must match a Tab's id.\n * Auto-injected from the React `key` prop (converted to string).\n */\n id?: string;\n /** Panel content. */\n children?: ReactNode;\n /** Custom tasty styles for the panel container. */\n styles?: Styles;\n}\n\nexport interface CubeTabListProps {\n /** Tab components. */\n children?: ReactNode;\n}\n\n// =============================================================================\n// Internal Types\n// =============================================================================\n\n/**\n * Internal representation of a parsed Tab.\n * Uses `content` instead of `children` to distinguish panel content.\n */\nexport interface ParsedTab extends Omit<CubeTabProps, 'id' | 'children'> {\n /** Tab key (always a string internally for React Aria compatibility) */\n key: string;\n /** Panel content extracted from Tab's children prop */\n content: ReactNode;\n}\n\n/**\n * Internal representation of a parsed TabPanel.\n */\nexport interface ParsedPanel\n extends Omit<CubeTabPanelProps, 'id' | 'children'> {\n /** Panel key (always a string internally for React Aria compatibility) */\n key: string;\n /** Panel content extracted from TabPanel's children prop */\n content: ReactNode;\n}\n"],"mappings":";;;;;;;AA2BA,MAAa,iBAAsD;CACjE,QAAQ;CACR,OAAO;CACR"}
|
|
1
|
+
{"version":3,"file":"types.js","names":[],"sources":["../../../../src/components/navigation/Tabs/types.ts"],"sourcesContent":["import type { BaseProps, OuterStyleProps, Styles } from '@tenphi/tasty';\nimport type { ReactNode } from 'react';\nimport type { CubeItemActionProps } from '../../actions/ItemAction';\nimport type { CubeMenuProps } from '../../actions/Menu';\nimport type { CubeItemProps } from '../../content/Item';\n\n// =============================================================================\n// Core Types\n// =============================================================================\n\n/** Visual appearance type for tabs */\nexport type TabType = 'default' | 'narrow' | 'file' | 'radio';\n\n/** Position for TabPicker and scroll arrows */\nexport type TabsActionPosition = 'prefix' | 'suffix';\n\n/**\n * Tab size options.\n * Radio type only supports 'medium' | 'large' (mapped to smaller Item sizes).\n */\nexport type TabSize = 'xsmall' | 'small' | 'medium' | 'large';\n\n/**\n * Size mapping for radio type tabs.\n * API sizes mapped to Item button sizes:\n * medium (default) -> xsmall (32px total), large -> medium (40px total).\n */\nexport const RADIO_SIZE_MAP: Record<'medium' | 'large', TabSize> = {\n medium: 'xsmall',\n large: 'medium',\n};\n\n/** How the tab `menu` is exposed alongside or instead of the overflow trigger. */\nexport type TabContextMenu = boolean | 'context-only';\n\n// =============================================================================\n// Shared Props Interfaces\n// =============================================================================\n\n/** Common props for panel rendering behavior */\nexport interface PanelBehaviorProps {\n /** If true, panel is rendered but hidden when not active. */\n prerender?: boolean;\n /** If true, once visited the panel stays in DOM. */\n keepMounted?: boolean;\n}\n\n/** Common props for QA attributes */\nexport interface QAProps {\n /** QA selector attribute. */\n qa?: string;\n /** Additional QA value attribute. */\n qaVal?: string;\n}\n\n// =============================================================================\n// Tab Style Props\n// =============================================================================\n\n/** Props from CubeItemProps that don't apply to Tab */\ntype OmittedItemProps =\n | 'id' // Tab has its own id as Key type\n | 'type' // Tab has its own TabType\n | 'size' // Tab has its own TabSize\n | 'theme' // Tabs have internal theming\n | 'shape' // Tabs have internal shape logic\n | 'description' // Tabs don't have descriptions\n | 'descriptionPlacement'\n | 'descriptionProps'\n | 'hotkeys' // Tabs have their own keyboard navigation\n | 'keyboardShortcutProps'\n | 'labelProps' // Tabs use title prop instead\n | 'labelRef'\n | 'level' // Tabs don't use heading levels\n | 'highlight' // Tabs don't use highlighting\n | 'highlightCaseSensitive'\n | 'highlightStyles'\n | 'variant' // Tabs have internal variant logic\n | 'htmlType' // Tab is always a button\n | 'isSelected' // Handled internally by state\n | 'preserveActionsSpace' // Set internally in TabButton\n | 'disableActionsFocus' // Not used in Tab\n | 'actions' // Tab has its own actions definition\n | 'autoHideActions' // Tab has its own autoHideActions\n | 'insideWrapper' // Internal Item wrapper prop\n | 'showActions'; // Internal Item wrapper prop\n\n/** Common styling props for tabs - inherits style props from CubeItemProps */\nexport interface TabStyleProps extends Omit<CubeItemProps, OmittedItemProps> {\n /**\n * Tab size. Supports 'xsmall', 'small', 'medium', 'large'.\n * Radio type supports 'large' (default, 40px) and 'medium' (32px),\n * mapped to Item button sizes medium (32px) and xsmall (24px).\n */\n size?: TabSize;\n /** Visual appearance type. */\n type?: TabType;\n /** Whether to show actions only on hover. */\n autoHideActions?: boolean;\n}\n\n// =============================================================================\n// Component Props\n// =============================================================================\n\n/** Cache key type - primitives only for reliable comparison */\nexport type CacheKeyValue = string | number | boolean | null | undefined;\n\nexport interface CubeTabsProps\n extends BaseProps,\n OuterStyleProps,\n PanelBehaviorProps {\n /** Controlled active tab key. When provided, component is controlled. */\n activeKey?: string;\n /** Initial active tab key for uncontrolled mode. */\n defaultActiveKey?: string;\n /**\n * Visual appearance type for tabs.\n * - `default` - Standard tabs with selection indicator below (default)\n * - `narrow` - Same as default but with collapsed vertical padding on labels\n * - `file` - File-style tabs with border bottom highlight on selection, delimiter between tabs\n * - `radio` - Radio button style for tab selection\n * @default 'default'\n */\n type?: TabType;\n /**\n * Tab size. Supports 'xsmall', 'small', 'medium', 'large'.\n * Radio type supports 'large' (default, 40px) and 'medium' (32px),\n * mapped to Item button sizes medium (32px) and xsmall (24px).\n * @default 'medium'\n */\n size?: TabSize;\n /** Accessible label for the tab list. */\n label?: string;\n /** Content rendered before the tab list. */\n prefix?: ReactNode;\n /** Content rendered after the tab list. */\n suffix?: ReactNode;\n /** Callback when active tab changes. */\n onChange?: (key: string) => void;\n /** Callback when tab delete button is clicked. Presence enables delete buttons. */\n onDelete?: (key: string) => void;\n /** Callback when a tab title is changed. Enables title editing on tabs with isEditable. */\n onTitleChange?: (key: string, newTitle: string) => void;\n /** Whether to show tab actions only on hover. Can be overridden per-tab. */\n autoHideActions?: boolean;\n /**\n * Whether tabs are editable by default.\n * Can be overridden per-tab via Tab's isEditable prop.\n * @default false\n */\n isEditable?: boolean;\n /**\n * Default menu items for all tabs.\n * Can be overridden per-tab via Tab's menu prop.\n * Set to `null` on individual Tab to disable menu for that tab.\n */\n menu?: ReactNode;\n /**\n * Default props for the menu trigger button.\n * Can be overridden per-tab via Tab's menuTriggerProps prop.\n * @default { icon: <MoreIcon /> }\n */\n menuTriggerProps?: Partial<CubeItemActionProps>;\n /**\n * Default props passed to the Menu component.\n * Can be overridden per-tab via Tab's menuProps prop.\n */\n menuProps?: Partial<CubeMenuProps<object>>;\n /**\n * Context menu / overflow behavior for tab `menu` items.\n * - `false` (default) — overflow trigger only; no right-click menu\n * - `true` — overflow trigger and right-click menu\n * - `'context-only'` — right-click menu only; no overflow trigger. Inline close\n * (`onDelete`) shows even when `menu` is non-empty, like tabs without a menu.\n * Can be overridden per-tab via Tab's contextMenu prop.\n * @default false\n */\n contextMenu?: TabContextMenu;\n /**\n * Callback when a menu action is triggered on any tab.\n * Called with the action key and the tab key.\n * Tab-level onAction is called first, then this.\n */\n onAction?: (action: string, tabKey: string) => void;\n /** Custom tasty styles for the tab bar container. */\n styles?: Styles;\n /** QA selector attribute. */\n qa?: string;\n /** Tab components or Tabs.List with Tabs.Panel. */\n children?: ReactNode;\n /**\n * Functional content renderer for optimized lazy evaluation.\n * When provided, panel content is only evaluated for the active tab,\n * while inactive tabs use cached content.\n */\n renderPanel?: (key: string) => ReactNode;\n /**\n * Cache keys for individual panels. Enables caching for specified panels.\n */\n panelCacheKeys?: Record<string | number, CacheKeyValue>;\n /**\n * Enable drag-and-drop tab reordering.\n * When a tab picker is shown (`showTabPicker`), reordering is automatically\n * enabled in the picker dropdown as well.\n * @default false\n */\n isReorderable?: boolean;\n /**\n * Controlled order of tab keys.\n * When provided, tabs are displayed in this order.\n */\n keyOrder?: string[];\n /**\n * Callback when tabs are reordered via drag-and-drop.\n */\n onReorder?: (newOrder: string[]) => void;\n /**\n * Whether to show a tab picker dropdown in the suffix area.\n * - `true` - always show the tab picker\n * - `false` - never show the tab picker (default)\n * - `'auto'` - show only when tabs overflow (has horizontal scroll)\n * @default false\n */\n showTabPicker?: boolean | 'auto';\n /**\n * Whether to show scroll arrow buttons in the suffix area.\n * - `true` - always show scroll arrows\n * - `false` - never show scroll arrows (default)\n * - `'auto'` - show only when tabs overflow (has horizontal scroll)\n * @default false\n */\n showScrollArrows?: boolean | 'auto';\n /**\n * Position of the tab picker dropdown.\n * - `'prefix'` - render in the prefix slot (before tab list)\n * - `'suffix'` - render in the suffix slot (after tab list)\n * @default 'suffix'\n */\n tabPickerPosition?: TabsActionPosition;\n /**\n * Position of the scroll arrow buttons.\n * - `'prefix'` - render in the prefix slot (before tab list)\n * - `'suffix'` - render in the suffix slot (after tab list)\n * @default 'suffix'\n */\n scrollArrowsPosition?: TabsActionPosition;\n /**\n * Visually hide the custom horizontal scrollbar in the tab list\n * and skip its tracking logic. Does not affect tab picker, scroll arrows,\n * or fade indicators — only the tiny scrollbar visual.\n * @default false\n */\n hideTabListScroll?: boolean;\n /**\n * Inline padding for the tab list container.\n * Sets horizontal padding only (e.g., \"2x\" → padding: \"0 2x\").\n */\n tabListPadding?: string;\n /** Custom tasty styles for the TabList sub-element. */\n tabListStyles?: Styles;\n /** Custom tasty styles for the Prefix sub-element. */\n prefixStyles?: Styles;\n /** Custom tasty styles for the Suffix sub-element. */\n suffixStyles?: Styles;\n}\n\nexport interface CubeTabProps extends TabStyleProps, PanelBehaviorProps {\n /**\n * Unique identifier for the tab.\n * Auto-injected from the React `key` prop (converted to string).\n */\n id?: string;\n /** Content displayed in the tab button. */\n title: ReactNode;\n /** Panel content rendered when tab is active. */\n children?: ReactNode;\n /** Disables the tab (cannot be selected). */\n isDisabled?: boolean;\n /** Actions to render in the tab. Rendered before menu trigger if tab has menu. */\n actions?: ReactNode;\n /** Whether the tab title can be edited. Overrides the Tabs-level isEditable default. */\n isEditable?: boolean;\n /** Callback when this tab's title is changed. Overrides parent's onTitleChange. */\n onTitleChange?: (newTitle: string) => void;\n /**\n * Menu items to display in a dropdown menu on the tab.\n * Pass Menu.Item elements directly - they will be wrapped in a Menu internally.\n * Overrides the Tabs-level menu default. Set to `null` to disable menu.\n */\n menu?: ReactNode | null;\n /**\n * Props to customize the menu trigger button.\n * Overrides the Tabs-level menuTriggerProps default.\n */\n menuTriggerProps?: Partial<CubeItemActionProps>;\n /**\n * Props passed to the Menu component.\n * Overrides the Tabs-level menuProps default.\n */\n menuProps?: Partial<CubeMenuProps<object>>;\n /**\n * Context menu / overflow behavior. Same values as Tabs `contextMenu`.\n * Uses the same menu items as `menu` prop.\n * @default false\n */\n contextMenu?: TabContextMenu;\n /**\n * Callback when a menu action is triggered.\n * Called with the action key from Menu.Item.\n */\n onAction?: (action: string) => void;\n}\n\nexport interface CubeTabPanelProps extends PanelBehaviorProps, QAProps {\n /**\n * Panel identifier. Must match a Tab's id.\n * Auto-injected from the React `key` prop (converted to string).\n */\n id?: string;\n /** Panel content. */\n children?: ReactNode;\n /** Custom tasty styles for the panel container. */\n styles?: Styles;\n}\n\nexport interface CubeTabListProps {\n /** Tab components. */\n children?: ReactNode;\n}\n\n// =============================================================================\n// Internal Types\n// =============================================================================\n\n/**\n * Internal representation of a parsed Tab.\n * Uses `content` instead of `children` to distinguish panel content.\n */\nexport interface ParsedTab extends Omit<CubeTabProps, 'id' | 'children'> {\n /** Tab key (always a string internally for React Aria compatibility) */\n key: string;\n /** Panel content extracted from Tab's children prop */\n content: ReactNode;\n}\n\n/**\n * Internal representation of a parsed TabPanel.\n */\nexport interface ParsedPanel\n extends Omit<CubeTabPanelProps, 'id' | 'children'> {\n /** Panel key (always a string internally for React Aria compatibility) */\n key: string;\n /** Panel content extracted from TabPanel's children prop */\n content: ReactNode;\n}\n"],"mappings":";;;;;;;AA2BA,MAAa,iBAAsD;CACjE,QAAQ;CACR,OAAO;CACR"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
|
|
3
3
|
import { Block } from "../../Block.js";
|
|
4
4
|
import { Space } from "../../layout/Space.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { _Text } from "../../content/Text.js";
|
|
3
3
|
import { _Title } from "../../content/Title.js";
|
|
4
4
|
import { Card } from "../../content/Card/Card.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { _Title } from "../../content/Title.js";
|
|
3
3
|
import { useProviderProps } from "../../../provider.js";
|
|
4
4
|
import { Space } from "../../layout/Space.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { _Title } from "../../content/Title.js";
|
|
3
3
|
import { useProviderProps } from "../../../provider.js";
|
|
4
4
|
import { Space } from "../../layout/Space.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { chain } from "../../../utils/react/chain.js";
|
|
3
3
|
import { Paragraph } from "../../content/Paragraph.js";
|
|
4
4
|
import { _Title } from "../../content/Title.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { AlertDialogZone } from "./AlertDialogZone.js";
|
|
3
3
|
import { createContext, useContext, useMemo, useRef, useState } from "react";
|
|
4
4
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { Portal } from "../../portal/Portal.js";
|
|
3
3
|
import { DialogContainer } from "../Dialog/DialogContainer.js";
|
|
4
4
|
import { _AlertDialog } from "./AlertDialog.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { extractStyles } from "../../../utils/styles.js";
|
|
3
3
|
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
|
|
4
4
|
import { SlotProvider } from "../../../utils/react/Slots.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { _Modal } from "../Modal/Modal.js";
|
|
3
3
|
import { DialogContext } from "./context.js";
|
|
4
4
|
import { Children, isValidElement, useRef } from "react";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { _Title } from "../../content/Title.js";
|
|
3
3
|
import { ButtonGroup } from "../../actions/ButtonGroup/ButtonGroup.js";
|
|
4
4
|
import { Button } from "../../actions/index.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
|
|
3
3
|
import { _Modal } from "../Modal/Modal.js";
|
|
4
4
|
import { _Tray } from "../Modal/Tray.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps } from "../../../utils/react/mergeProps.js";
|
|
3
3
|
import { useEvent } from "../../../_internal/hooks/use-event.js";
|
|
4
4
|
import { DialogContainer } from "./DialogContainer.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
|
|
3
3
|
import { _Overlay } from "./Overlay.js";
|
|
4
4
|
import { _Underlay } from "./Underlay.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { DisplayTransition } from "../../helpers/DisplayTransition/DisplayTransition.js";
|
|
3
3
|
import { Provider, useProviderProps } from "../../../provider.js";
|
|
4
4
|
import { OpenTransitionContext } from "./OpenTransitionContext.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
|
|
3
3
|
import { _Overlay } from "./Overlay.js";
|
|
4
4
|
import { tasty } from "@tenphi/tasty";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
|
|
3
3
|
import { _Overlay } from "./Overlay.js";
|
|
4
4
|
import { _Underlay } from "./Underlay.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { useEvent } from "../../../_internal/hooks/use-event.js";
|
|
3
3
|
import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
|
|
4
4
|
import { createContext, useContext, useMemo } from "react";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { Block } from "../../Block.js";
|
|
3
3
|
import { ItemActionProvider } from "../../actions/ItemActionContext.js";
|
|
4
4
|
import { Space } from "../../layout/Space.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { useEvent } from "../../../_internal/hooks/use-event.js";
|
|
3
3
|
import { NotificationCard } from "./NotificationCard.js";
|
|
4
4
|
import { tasty } from "@tenphi/tasty";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
|
|
3
3
|
import { useEvent } from "../../../_internal/hooks/use-event.js";
|
|
4
4
|
import { DisplayTransition } from "../../helpers/DisplayTransition/DisplayTransition.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { NotificationContext, PersistentNotificationsContext, ToastContext, useNotificationContext, useToastContext } from "./NotificationContext.js";
|
|
3
3
|
import { OverlayContainer } from "./OverlayContainer.js";
|
|
4
4
|
import { useNotificationState } from "./use-notification-state.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
import { useEvent } from "../../../_internal/hooks/use-event.js";
|
|
3
3
|
import { _Text } from "../../content/Text.js";
|
|
4
4
|
import { NotificationActionInterceptorContext } from "./NotificationAction.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.133.0 | Cube Dev Team */
|
|
2
2
|
//#region src/components/overlays/Notifications/dismissed-storage.ts
|
|
3
3
|
const STORAGE_KEY = "cube-ui-dismissed-notifications";
|
|
4
4
|
const TTL_MS = 864e5;
|