@cube-dev/ui-kit 0.165.0 → 0.167.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/README.md +4 -7
- package/dist/CHANGELOG.md +48 -0
- package/dist/README.md +4 -7
- 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 +4 -4
- package/dist/components/GlobalStyles.js.map +1 -1
- package/dist/components/GridProvider.js +1 -1
- package/dist/components/HiddenInput.js +1 -1
- package/dist/components/Root.js +1 -2
- package/dist/components/Root.js.map +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.d.ts +1 -0
- 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.d.ts +7 -3
- package/dist/components/actions/use-anchored-menu.js +17 -12
- package/dist/components/actions/use-anchored-menu.js.map +1 -1
- package/dist/components/actions/use-context-menu.d.ts +6 -3
- package/dist/components/actions/use-context-menu.js +25 -13
- package/dist/components/actions/use-context-menu.js.map +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/InfoBadge/InfoBadge.js +1 -1
- package/dist/components/content/InlineInput/InlineInput.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 +1 -1
- package/dist/components/content/Tree/TreeNode.js +1 -1
- package/dist/components/content/Tree/styled.js +1 -1
- package/dist/components/content/Tree/tree-index.js +1 -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/data/DataTable/DataTable.js +1 -1
- package/dist/components/data/ItemTable/ItemTable.js +1 -1
- package/dist/components/data/ItemTable/ItemTableBulkBar.js +1 -1
- package/dist/components/data/ItemTable/ItemTableDragPreview.js +1 -1
- package/dist/components/data/ItemTable/ItemTableFooter.js +1 -1
- package/dist/components/data/ItemTable/ItemTableToolbar.js +1 -1
- package/dist/components/data/TableBase/ColumnResizer.js +1 -1
- package/dist/components/data/TableBase/RowCollection.js +1 -1
- package/dist/components/data/TableBase/TableHeaderCell.js +1 -1
- package/dist/components/data/TableBase/TableRow.js +1 -1
- package/dist/components/data/TableBase/TableView.js +1 -1
- package/dist/components/data/TableBase/column-menu.js +1 -1
- package/dist/components/data/TableBase/column-tint.js +1 -1
- package/dist/components/data/TableBase/row-menu.js +1 -1
- package/dist/components/data/TableBase/styled.d.ts +2 -1
- package/dist/components/data/TableBase/styled.js +1 -1
- package/dist/components/data/TableBase/table-tree.js +1 -1
- package/dist/components/data/TableBase/types.js +1 -1
- package/dist/components/data/TableBase/use-cell-selection.d.ts +1 -0
- package/dist/components/data/TableBase/use-cell-selection.js +0 -0
- package/dist/components/data/TableBase/use-column-order.js +1 -1
- package/dist/components/data/TableBase/use-container-width.js +1 -1
- package/dist/components/data/TableBase/use-row-move-animation.js +1 -1
- package/dist/components/data/TableBase/use-scrollability.js +1 -1
- package/dist/components/data/TableBase/use-table-columns.js +1 -1
- package/dist/components/data/TableBase/use-table-search.js +1 -1
- package/dist/components/data/TableBase/use-table-selection.js +1 -1
- package/dist/components/data/TableBase/use-table-sort.js +1 -1
- package/dist/components/data/TableBase/use-table-sorts.js +1 -1
- package/dist/components/data/TableBase/use-table-storage.js +1 -1
- package/dist/components/data/TableBase/use-table-tree-state.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/ColorInput/ColorInput.js +1 -1
- package/dist/components/fields/ColorPicker/ColorPicker.js +1 -1
- package/dist/components/fields/ColorSwatch/ColorSwatch.js +1 -1
- package/dist/components/fields/ColorSwatchGroup/ColorSwatchGroup.js +1 -1
- package/dist/components/fields/ComboBox/ComboBox.js +1 -1
- package/dist/components/fields/CommandTextArea/CommandTextArea.js +1 -1
- package/dist/components/fields/CommandTextArea/caretPosition.js +1 -1
- package/dist/components/fields/CommandTextArea/useCaretAnchor.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/MonthPicker.js +1 -1
- package/dist/components/fields/DatePicker/PeriodPicker.js +1 -1
- package/dist/components/fields/DatePicker/QuarterPicker.js +1 -1
- package/dist/components/fields/DatePicker/TimeInput.js +1 -1
- package/dist/components/fields/DatePicker/WeekPicker.js +1 -1
- package/dist/components/fields/DatePicker/YearPicker.js +1 -1
- package/dist/components/fields/DatePicker/parseDate.js +1 -1
- package/dist/components/fields/DatePicker/period.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 +1 -1
- package/dist/components/fields/FilterPicker/FilterPicker.js +1 -1
- package/dist/components/fields/Input/Input.js +1 -1
- package/dist/components/fields/ListBox/DraggableListBox.js +1 -1
- package/dist/components/fields/ListBox/ListBox.js +1 -1
- package/dist/components/fields/ListBoxPopover/ListBoxPopover.js +1 -1
- package/dist/components/fields/ListBoxPopover/index.d.ts +1 -0
- package/dist/components/fields/ListBoxPopover/listNavigation.js +1 -1
- package/dist/components/fields/ListBoxPopover/useCompositeFocus.d.ts +2 -0
- package/dist/components/fields/ListBoxPopover/useCompositeFocus.js +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/SearchComboBox/SearchComboBox.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/TextInput/useAutoSizeTextArea.js +1 -1
- package/dist/components/fields/TextInputMapper/TextInputMapper.js +1 -1
- package/dist/components/fields/color/ColorPanel.js +1 -1
- package/dist/components/fields/color/channels.js +1 -1
- package/dist/components/fields/color/color.js +1 -1
- package/dist/components/fields/color/context.js +1 -1
- package/dist/components/form/FieldWrapper/FieldWrapper.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/validation/ValidationIndicator.js +1 -1
- package/dist/components/form/validation/resolve-validation-props.js +1 -1
- package/dist/components/form/validation/use-validation-props.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/Board/Board.d.ts +33 -7
- package/dist/components/layout/Board/Board.js +29 -11
- package/dist/components/layout/Board/Board.js.map +1 -1
- package/dist/components/layout/Board/BoardProvider.js +1 -1
- package/dist/components/layout/Board/BoardResponsive.d.ts +6 -3
- package/dist/components/layout/Board/BoardResponsive.js +3 -3
- package/dist/components/layout/Board/BoardResponsive.js.map +1 -1
- package/dist/components/layout/Board/Widget.d.ts +38 -1
- package/dist/components/layout/Board/Widget.js +6 -2
- package/dist/components/layout/Board/Widget.js.map +1 -1
- package/dist/components/layout/Board/WidgetHost.js +69 -18
- package/dist/components/layout/Board/WidgetHost.js.map +1 -1
- package/dist/components/layout/Board/board-context.js +1 -1
- package/dist/components/layout/Board/board-context.js.map +1 -1
- package/dist/components/layout/Board/board-store.js +2 -2
- package/dist/components/layout/Board/board-store.js.map +1 -1
- package/dist/components/layout/Board/grid-core/calculate.js +1 -1
- package/dist/components/layout/Board/grid-core/collision-modes.js +1 -1
- package/dist/components/layout/Board/grid-core/collision.js +1 -1
- package/dist/components/layout/Board/grid-core/compactors.js +1 -1
- package/dist/components/layout/Board/grid-core/constraints.js +1 -1
- package/dist/components/layout/Board/grid-core/group-move.js +1 -1
- package/dist/components/layout/Board/grid-core/layout.js +1 -1
- package/dist/components/layout/Board/grid-core/placement.d.ts +58 -0
- package/dist/components/layout/Board/grid-core/placement.js +153 -0
- package/dist/components/layout/Board/grid-core/placement.js.map +1 -0
- package/dist/components/layout/Board/grid-core/sort.js +1 -1
- package/dist/components/layout/Board/index.d.ts +3 -1
- package/dist/components/layout/Board/index.js +2 -1
- package/dist/components/layout/Board/index.js.map +1 -1
- package/dist/components/layout/Board/responsive-utils.js +1 -1
- package/dist/components/layout/Board/use-board-layout.d.ts +26 -0
- package/dist/components/layout/Board/use-board-layout.js +4 -4
- package/dist/components/layout/Board/use-board-layout.js.map +1 -1
- package/dist/components/layout/Board/use-board-registry.js +5 -56
- package/dist/components/layout/Board/use-board-registry.js.map +1 -1
- package/dist/components/layout/Board/use-board-select-modifier-key.js +1 -1
- package/dist/components/layout/Board/use-board-selection.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/Pagination/Pagination.js +1 -1
- package/dist/components/navigation/Pagination/use-pagination.js +1 -1
- package/dist/components/navigation/Tabs/DraggableTabList.js +1 -1
- package/dist/components/navigation/Tabs/TabButton.js +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 +1 -1
- package/dist/components/navigation/Tabs/Tabs.js +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/popover-placement.js +1 -1
- package/dist/components/navigation/Tabs/styled.js +1 -1
- package/dist/components/navigation/Tabs/types.js +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/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/CalendarHeader.js +1 -1
- package/dist/components/other/Calendar/CalendarPanel.js +1 -1
- package/dist/components/other/Calendar/PeriodCalendar.js +1 -1
- package/dist/components/other/Calendar/PeriodGrid.js +1 -1
- package/dist/components/other/Calendar/RangeCalendar.js +1 -1
- package/dist/components/other/Calendar/styled.js +1 -1
- package/dist/components/other/CubeLogo/CubeLogo.js +1 -1
- package/dist/components/other/NoDataIcon/NoDataIcon.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.d.ts +2 -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.d.ts +1 -0
- 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/Modal/types.d.ts +1 -0
- 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.d.ts +2 -0
- 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 +2 -1
- package/dist/components/overlays/Tooltip/Tooltip.js.map +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.d.ts +2 -0
- package/dist/components/portal/PortalProvider.js +1 -1
- package/dist/components/portal/index.d.ts +1 -0
- package/dist/components/portal/usePortal.js +1 -1
- package/dist/components/shared/DraggableCollection.js +1 -1
- 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/eslint-plugin/defaults.generated.js +25 -1
- package/dist/eslint-plugin/defaults.generated.js.map +1 -1
- package/dist/eslint-plugin/index.js +1 -1
- package/dist/eslint-plugin/rules/no-redundant-default-prop.js +1 -1
- package/dist/i18n/I18nProvider.js +1 -1
- package/dist/i18n/createFormatter.js +1 -1
- package/dist/i18n/index.js +1 -1
- package/dist/i18n/instance.js +1 -1
- package/dist/i18n/locales/de-DE/uikit.js +1 -1
- package/dist/i18n/locales/en-US/uikit.js +1 -1
- package/dist/i18n/locales/es-ES/uikit.js +1 -1
- package/dist/i18n/locales/es-MX/uikit.js +1 -1
- package/dist/i18n/locales/fr-FR/uikit.js +1 -1
- package/dist/i18n/locales/it-IT/uikit.js +1 -1
- package/dist/i18n/locales/ja-JP/uikit.js +1 -1
- package/dist/i18n/locales/nb-NO/uikit.js +1 -1
- package/dist/i18n/locales/pt-BR/uikit.js +1 -1
- package/dist/i18n/locales/pt-PT/uikit.js +1 -1
- package/dist/i18n/locales/sv-SE/uikit.js +1 -1
- package/dist/i18n/locales/vi-VN/uikit.js +1 -1
- package/dist/i18n/locales.js +1 -1
- package/dist/i18n/useFormatter.js +1 -1
- package/dist/i18n/useI18n.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/ArrowNarrowDownIcon.js +1 -1
- package/dist/icons/ArrowNarrowUpIcon.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.js +1 -1
- 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/PipetteIcon.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/wrap-icon.js +1 -1
- package/dist/index.d.ts +7 -3
- package/dist/index.js +5 -3
- package/dist/index.js.map +1 -1
- package/dist/probe/canonicalize.js +1 -1
- package/dist/probe/css.js +1 -1
- package/dist/probe/index.js +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/all-tokens.d.ts +10 -0
- package/dist/tokens/{index.js → all-tokens.js} +7 -25
- package/dist/tokens/all-tokens.js.map +1 -0
- package/dist/tokens/base.js +2 -1
- package/dist/tokens/base.js.map +1 -1
- package/dist/tokens/color-seed.js +1 -1
- package/dist/tokens/color-theme.js +1 -1
- package/dist/tokens/colors.js +1 -1
- package/dist/tokens/index.d.ts +3 -10
- package/dist/tokens/layout.js +1 -1
- package/dist/tokens/lazy-styles.js +1 -1
- package/dist/tokens/palette-config.js +1 -1
- package/dist/tokens/palette.js +1 -1
- package/dist/tokens/resolve.d.ts +113 -0
- package/dist/tokens/resolve.js +403 -0
- package/dist/tokens/resolve.js.map +1 -0
- 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/disabledProps.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/useBufferedValue.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.d.ts +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/usePopoverSync.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 +3 -3
- package/docs/Colors.md +16 -40
- package/docs/ComplexLayout.md +8 -0
- package/docs/CreateComponent.md +15 -8
- package/docs/Introduction.md +15 -36
- package/docs/RenderCache.md +8 -6
- package/docs/Theming.md +164 -497
- package/docs/Usage.md +129 -138
- package/docs/Utilities.md +2 -2
- package/docs/components/CollectionItem.md +1 -0
- package/docs/components/actions/Banner.md +1 -0
- package/docs/components/actions/Button.md +8 -36
- package/docs/components/actions/ButtonSplit.md +2 -0
- package/docs/components/actions/CommandMenu.md +8 -8
- package/docs/components/actions/ItemButton.md +6 -20
- package/docs/components/actions/Link.md +10 -5
- package/docs/components/actions/Menu.md +24 -11
- package/docs/components/actions/MenuTrigger.md +3 -12
- package/docs/components/actions/use-anchored-menu.md +5 -5
- package/docs/components/actions/use-context-menu.md +11 -7
- package/docs/components/content/Badge.md +3 -0
- package/docs/components/content/HotKeys.md +21 -14
- package/docs/components/content/InlineInput.md +14 -14
- package/docs/components/content/Item.md +25 -17
- package/docs/components/content/ItemCard.md +1 -0
- package/docs/components/content/Layout.md +12 -1
- package/docs/components/content/PrismCode.md +13 -18
- package/docs/components/content/Tag.md +1 -1
- package/docs/components/content/TextItem.md +5 -3
- package/docs/components/content/Tree.md +69 -154
- package/docs/components/data/DataTable.md +56 -168
- package/docs/components/data/ItemTable.md +182 -485
- package/docs/components/fields/Checkbox.md +2 -0
- package/docs/components/fields/ColorInput.md +38 -79
- package/docs/components/fields/ColorPicker.md +17 -39
- package/docs/components/fields/ColorSwatch.md +11 -30
- package/docs/components/fields/ColorSwatchGroup.md +18 -42
- package/docs/components/fields/ComboBox.md +13 -1
- package/docs/components/fields/CommandTextArea.md +10 -37
- package/docs/components/fields/DatePicker.md +3 -0
- package/docs/components/fields/FileInput.md +3 -0
- package/docs/components/fields/FilterListBox.md +34 -14
- package/docs/components/fields/FilterPicker.md +33 -16
- package/docs/components/fields/HueSlider.md +5 -5
- package/docs/components/fields/ListBox.md +35 -9
- package/docs/components/fields/NumberInput.md +3 -0
- package/docs/components/fields/PasswordInput.md +3 -0
- package/docs/components/fields/PeriodPicker.md +7 -17
- package/docs/components/fields/Picker.md +54 -29
- package/docs/components/fields/RadioGroup.md +13 -5
- package/docs/components/fields/SearchComboBox.md +3 -0
- package/docs/components/fields/SearchInput.md +4 -2
- package/docs/components/fields/Select.md +23 -13
- package/docs/components/fields/Switch.md +3 -0
- package/docs/components/fields/TextInput.md +3 -0
- package/docs/components/fields/TextInputMapper.md +1 -2
- package/docs/components/form/Field.md +5 -2
- package/docs/components/form/Form.md +5 -0
- package/docs/components/form/FormInstance.md +1 -1
- package/docs/components/helpers/DisplayTransition.md +10 -6
- package/docs/components/helpers/IconSwitch.md +1 -0
- package/docs/components/layout/Board.md +89 -193
- package/docs/components/navigation/Pagination.md +36 -75
- package/docs/components/navigation/Tabs.md +3 -15
- package/docs/components/other/Calendar.md +22 -39
- package/docs/components/other/CubeLogo.md +1 -1
- package/docs/components/overlays/Dialog.md +3 -0
- package/docs/components/overlays/DialogContainer.md +2 -0
- package/docs/components/overlays/DialogForm.md +6 -2
- package/docs/components/overlays/DialogTrigger.md +4 -2
- package/docs/components/overlays/Notifications.md +7 -0
- package/docs/components/overlays/Toast.md +12 -8
- package/docs/components/overlays/Tooltip.md +16 -0
- package/docs/components/overlays/UseDialogContainer.md +16 -10
- package/docs/components/status/LoadingAnimation.md +3 -9
- package/docs/tasty/configuration.md +195 -15
- package/docs/tasty/dsl.md +40 -5
- package/docs/tasty/injector.md +11 -0
- package/docs/tasty/methodology.md +1 -1
- package/docs/tasty/pipeline.md +1 -4
- package/docs/tasty/react-api.md +1 -1
- package/docs/tasty/styles.md +8 -1
- package/package.json +4 -4
- package/dist/tokens/index.js.map +0 -1
package/README.md
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
# Cube UI Kit
|
|
2
2
|
|
|
3
|
-
[](https://www.npmjs.com/package/@cube-dev/ui-kit)
|
|
4
|
-
[](https://github.com/cube-js/cube-ui-kit/blob/main/LICENSE)
|
|
3
|
+
[](https://www.npmjs.com/package/@cube-dev/ui-kit) [](https://github.com/cube-js/cube-ui-kit/blob/main/LICENSE)
|
|
5
4
|
|
|
6
5
|
An open-source React component library that powers [Cube Cloud](https://cubecloud.dev) and other [Cube Dev](https://cube.dev) products. While built for Cube's own interfaces, it is a general-purpose kit you can use freely in any application where it fits your needs.
|
|
7
6
|
|
|
@@ -52,8 +51,7 @@ function App() {
|
|
|
52
51
|
}
|
|
53
52
|
```
|
|
54
53
|
|
|
55
|
-
To ship your own brand color, tune the palette seeds — every token, in every
|
|
56
|
-
scheme, re-resolves from them:
|
|
54
|
+
To ship your own brand color, tune the palette seeds — every token, in every scheme, re-resolves from them:
|
|
57
55
|
|
|
58
56
|
```tsx
|
|
59
57
|
<Root palette={{ hue: 210, saturation: 72, themes: { danger: { hue: 12 } } }}>
|
|
@@ -61,8 +59,7 @@ scheme, re-resolves from them:
|
|
|
61
59
|
</Root>
|
|
62
60
|
```
|
|
63
61
|
|
|
64
|
-
`setPaletteConfig()` does the same thing imperatively, from anywhere. It replaces
|
|
65
|
-
rather than accumulates, like `useState` — pass an updater to change one field:
|
|
62
|
+
`setPaletteConfig()` does the same thing imperatively, from anywhere. It replaces rather than accumulates, like `useState` — pass an updater to change one field:
|
|
66
63
|
|
|
67
64
|
```ts
|
|
68
65
|
setPaletteConfig((config) => ({ ...config, hue: 235 }));
|
|
@@ -71,7 +68,7 @@ setPaletteConfig((config) => ({ ...config, hue: 235 }));
|
|
|
71
68
|
## Components
|
|
72
69
|
|
|
73
70
|
| Category | Components |
|
|
74
|
-
|
|
71
|
+
| --- | --- |
|
|
75
72
|
| **Layout** | Flex, Grid, Space, Flow, Panel, ResizablePanel, Prefix, Suffix |
|
|
76
73
|
| **Actions** | Button, Button.Group, Button.Split, Link, Menu, CommandMenu |
|
|
77
74
|
| **Content** | Text, Title, Paragraph, Card, Badge, Tag, Avatar, Alert, Skeleton, Placeholder, Disclosure, Divider, CopySnippet, PrismCode |
|
package/dist/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,53 @@
|
|
|
1
1
|
# @cube-dev/ui-kit
|
|
2
2
|
|
|
3
|
+
## 0.167.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#1350](https://github.com/cube-js/cube-ui-kit/pull/1350) [`ee97f365`](https://github.com/cube-js/cube-ui-kit/commit/ee97f3651bca7c1fd9bcf8201eb2a236a885b6f2) Thanks [@tenphi](https://github.com/tenphi)! - `Board`: corner-anchored widget chrome, app-defined widget modifiers, a reason on `onLayoutChange`, and a real `dragCancel` default.
|
|
8
|
+
|
|
9
|
+
- **`dragCancel` now defaults to `BOARD_SELECTION_CANCEL`** instead of no cancel at all. A control inside a widget has to keep its own press whether or not the board happens to support selection — previously that only worked on a _selectable_ board, where `selectionCancel` incidentally doubled as the drag guard, so every other board had to hand-write a selector or a pointer-down on a child's button would drag the widget instead. Pass your own selector to narrow or widen it, or `''` for the old behaviour.
|
|
10
|
+
- **`cornerChrome`** (with **`cornerChromePlacement`**, default `'ne'`) puts a control on a widget's corner, centred on it. It renders in the same layer as the corner resize grips, which is the layer that escapes the widget's own `overflow: hidden` — chrome hung off the corner from inside a widget is cropped in half by that clip, or by an ancestor's scroll container when the widget sits in the first row. Being outside the widget host, it is also outside the drag gesture, so pressing it can never start a drag and it needs no `dragCancel` entry.
|
|
11
|
+
- **`mods`** on `Board.Widget` (and board-wide via `widgetProps`) merges app-defined modifiers into the ones the board sets, so a `styles` map can match on app state (`mods={{ editing: true }}` with `styles={{ shadow: { editing: '…' } }}`) instead of the app swapping whole style objects per state. Board's own modifiers are applied last, so a custom one can never shadow `selected`, `drag` and the rest, which the board's styling and its accessibility wiring both depend on.
|
|
12
|
+
- **`onLayoutChange` now reports why the layout changed** — `'drag'`, `'resize'`, `'transfer'`, or `'normalize'` for the commits no gesture caused (a reflow for a changed column count, an `isAutoHeight` widget growing). An app that persisted every commit had no way to tell a user's edit from the board fitting itself to a constraint that moved, so it wrote the reflow back as an edit and marked a document dirty nobody touched. The argument is additive: existing one-parameter handlers keep working.
|
|
13
|
+
|
|
14
|
+
The docs also now explain that widget style maps are **merged**: a map with no `''` entry extends the defaults, while one that sets `''` replaces them and needs `'@inherit'` to keep any. Reaching for `'': false` to switch a single state off is the easy mistake — it silently takes `selected`, `pre-selected` and the drag lift with it.
|
|
15
|
+
|
|
16
|
+
- [#1351](https://github.com/cube-js/cube-ui-kit/pull/1351) [`2caf1072`](https://github.com/cube-js/cube-ui-kit/commit/2caf1072c29e90098ff387d42329ecf3bed6fdce) Thanks [@tenphi](https://github.com/tenphi)! - New: `resolveTokenValue()`, `resolveTokenValues()` and `resolvePresetValues()`, plus the `useTokenValue()` / `useTokenValues()` / `usePresetValues()` hooks — a supported way to ask the kit for a design token's _resolved_ value, for consumers rendering into a surface our stylesheets do not reach: a third-party iframe (Stripe Elements), a CodeMirror or Monaco theme, a chart spec. Those take colors, lengths and font descriptors as values, and `var(--purple-color)` means nothing to them.
|
|
17
|
+
|
|
18
|
+
Reading tokens off `getComputedStyle()` by hand fails silently. `Root` declares the token block on `<body>`, so `<html>`, a detached node, and a tree that has not mounted `Root` yet are all outside it — and a token read from outside does not come back empty, it comes back as tasty's registered `@property` default. Some of those are obvious duds (`rgba(0, 0, 0, 0)`, `0px`), but many are ordinary-looking values that are merely wrong: `--gap` reads `4px` rather than the kit's `8px`, `--transition` reads `80ms`, `--radius` reads `6px`. So the helpers do not inspect the value. They read `$tokens-applied`, a new marker the token block declares alongside the tokens, and use it to answer the only question that settles the matter — are the kit's tokens in effect on this element? Off that surface every read returns `null` (or an explicit `fallback`) and warns once in development; on it, the computed value is the truth, so a token that genuinely is `transparent` or `0px` — `#clear`, `#scrollbar-outline`, `$h2-letter-spacing` — comes through intact. The hooks re-resolve when the palette is re-seeded or the scheme / contrast tier flips, and match the server's markup while hydrating.
|
|
19
|
+
|
|
20
|
+
All six take `{ element, fallback }` — pass `element` to resolve against a local override (a subtree with its own `tokens` prop, or one under a differing `data-schema`) instead of the document.
|
|
21
|
+
|
|
22
|
+
- [#1345](https://github.com/cube-js/cube-ui-kit/pull/1345) [`8fdee382`](https://github.com/cube-js/cube-ui-kit/commit/8fdee38230d0aee519df7db8c6edd5a6951910b7) Thanks [@tenphi](https://github.com/tenphi)! - Update Tasty to 3.3.1 (from 3.1.0). Three things come with it.
|
|
23
|
+
|
|
24
|
+
**Color tokens no longer emit companion channel variables, and `colorSpace` is deprecated.** A `#name` token used to declare `--name-color` plus a decomposed companion — `--name-color-rgb` here, since the kit configured `colorSpace: 'rgb'` — and only the companion is gone: `--name-color` is emitted exactly as authored. Opacity has used CSS relative color syntax since 3.1.0, so nothing inside Tasty needed the channels any more. **If your own CSS reads a companion — `rgb(var(--primary-color-rgb) / .2)` and the like — it silently stops resolving.** Rewrite it against the token itself: `oklch(from var(--primary-color) l c h / .2)`, which works on any color, including the ones no build-time conversion could evaluate. `configure({ colorSpace })` now warns in development and does nothing; the kit no longer sets it. One more consequence worth planning for: a token is emitted in the space it was authored in, so `getComputedStyle(el).backgroundColor` now returns `oklch(…)` / `oklab(…)` where it used to return `rgb(…)`. The color is the same, but any test or code that parses those strings by hand has to stop assuming sRGB syntax.
|
|
25
|
+
|
|
26
|
+
**The inherited color is now readable as a color, through `$current-color`.** `#current` keeps emitting the `currentcolor` keyword, so it still resolves against the element that reads it — which is what lets a ramp express its disabled state once, in `color`, and have everything painted from `#current` below it fade along. Beside that, every `color` style now publishes `--current-color`, registered with `initial-value: currentcolor`, for the cases the keyword cannot serve: hand-authored CSS, or anywhere the inherited color is needed as a _color_. Read it as `$current-color`. A value that already reads the color it inherits — `#current`, a `#current` fade — is deliberately not published into it, since resolving it again one level down would fade it twice.
|
|
27
|
+
|
|
28
|
+
**Opt-in batched style injection** (from 3.2.0): `configure({ batchInjection: true })` plus a `<TastyBatchProvider>` queue a commit's stylesheet writes into one FIFO and apply them together, so the document is style-invalidated once per flush instead of once per component — which matters in a tree that measures layout during render (popovers, autosizing inputs, virtualized lists). The provider flushes in `useInsertionEffect`, before any layout effect, so a queued write can never be observed by a measurement. `flushStyles()`, `hasPendingStyleWrites()` and `resetStyleBatch()` come with it, and all of it is re-exported from `@cube-dev/ui-kit`. Batching stays off unless an app turns it on.
|
|
29
|
+
|
|
30
|
+
### Patch Changes
|
|
31
|
+
|
|
32
|
+
- [#1345](https://github.com/cube-js/cube-ui-kit/pull/1345) [`8fdee382`](https://github.com/cube-js/cube-ui-kit/commit/8fdee38230d0aee519df7db8c6edd5a6951910b7) Thanks [@tenphi](https://github.com/tenphi)! - `no-redundant-default-prop` now knows three defaults it used to miss: `ItemTable`'s `size` and `summary`, and `Pagination`'s `summary`. The registry it checks against is parsed line by line out of `*.docs.mdx`, so a documented default whose `(default: …)` annotation had been hard-wrapped onto the next line was invisible to the parser. Unwrapping the documentation surfaced them, and the generator proved each value against the component it belongs to.
|
|
33
|
+
|
|
34
|
+
- [#1352](https://github.com/cube-js/cube-ui-kit/pull/1352) [`40261f63`](https://github.com/cube-js/cube-ui-kit/commit/40261f631ff684c624f78f4132ab63338da211c7) Thanks [@tenphi](https://github.com/tenphi)! - `useContextMenu` and `useAnchoredMenu` now re-read `defaultMenuProps` on every render instead of snapshotting them when the menu opens. A menu whose content lives in those defaults — the row context menu in `Tree` and the tab context menu in `Tabs` both do — stayed frozen while open, so items appearing, disappearing or flipping `isDisabled` were invisible until it was closed and reopened. Runtime props passed to `open()`/`update()` still take precedence and are unaffected.
|
|
35
|
+
|
|
36
|
+
## 0.166.0
|
|
37
|
+
|
|
38
|
+
### Minor Changes
|
|
39
|
+
|
|
40
|
+
- [#1348](https://github.com/cube-js/cube-ui-kit/pull/1348) [`e0ccb9b0`](https://github.com/cube-js/cube-ui-kit/commit/e0ccb9b022269e45a9c35ebd97c66c7dd7e3c416) Thanks [@tenphi](https://github.com/tenphi)! - `Board`: a fixed `cols × rows` matrix, two exported placement helpers, and a hover-ring opt-out.
|
|
41
|
+
|
|
42
|
+
- **`rows`** renders exactly that many rows whatever the content needs — a matrix rather than a grid that hugs its widgets — and implies a `maxRows` of the same value, so `gridBounds` keeps every drag and resize inside it without a per-widget `maxH`.
|
|
43
|
+
- **`rowHeight="stretch"`** divides the board's own measured height into those rows. Together the two express "a grid of a declared size that fills the box it is given": the board takes its parent's height and each cell an equal share, so resizing the container resizes the cells instead of adding or removing them. It engages only with `rows` set and a parent that has a height of its own; otherwise the board keeps its ordinary content-hugging behaviour at the default row height. Previously an app wanting this had to measure the box itself, divide by the row count, and feed the result back in as `rowHeight` — which meant rendering nothing until the first measurement landed.
|
|
44
|
+
- **`placeInFreeSlot(others, item, cols, maxRows?)`** and **`distributeEvenly(layout, { cols, rows })`** are now exported. The first is the rule the board already applies when a dragged widget cannot stay where it was dropped; exporting it means a widget an app adds programmatically lands where a drag would have put it, instead of wherever the app's own re-implementation of the scan decided. The second tiles items evenly across both axes while keeping the row structure the layout already has, and is the one operation that deliberately grows items — which is why it is a call the app makes rather than a mode the board is in.
|
|
45
|
+
- **`hoverRing`** (on `Board.Widget`, or for the whole board via `widgetProps`) turns off the resting ring a widget shows on hover. It is the affordance that says a widget can be picked up, and on scenery — a chromeless layout container, a spacer — it advertises an interaction the widget does not really offer. Turning it off used to mean overriding `styles.shadow`, which replaces the whole modifier map, so the `selected` ring and the drag lift had to be re-authored by hand just to drop the hover state.
|
|
46
|
+
|
|
47
|
+
### Patch Changes
|
|
48
|
+
|
|
49
|
+
- [#1346](https://github.com/cube-js/cube-ui-kit/pull/1346) [`3e5e3fee`](https://github.com/cube-js/cube-ui-kit/commit/3e5e3fee2e02a47519a22db35ecad2cf3c74988b) Thanks [@tenphi](https://github.com/tenphi)! - Tooltip: force wrapping of unbreakable content (URLs, tokens, identifiers) so it no longer overflows the tooltip.
|
|
50
|
+
|
|
3
51
|
## 0.165.0
|
|
4
52
|
|
|
5
53
|
### Minor Changes
|
package/dist/README.md
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
# Cube UI Kit
|
|
2
2
|
|
|
3
|
-
[](https://www.npmjs.com/package/@cube-dev/ui-kit)
|
|
4
|
-
[](https://github.com/cube-js/cube-ui-kit/blob/main/LICENSE)
|
|
3
|
+
[](https://www.npmjs.com/package/@cube-dev/ui-kit) [](https://github.com/cube-js/cube-ui-kit/blob/main/LICENSE)
|
|
5
4
|
|
|
6
5
|
An open-source React component library that powers [Cube Cloud](https://cubecloud.dev) and other [Cube Dev](https://cube.dev) products. While built for Cube's own interfaces, it is a general-purpose kit you can use freely in any application where it fits your needs.
|
|
7
6
|
|
|
@@ -52,8 +51,7 @@ function App() {
|
|
|
52
51
|
}
|
|
53
52
|
```
|
|
54
53
|
|
|
55
|
-
To ship your own brand color, tune the palette seeds — every token, in every
|
|
56
|
-
scheme, re-resolves from them:
|
|
54
|
+
To ship your own brand color, tune the palette seeds — every token, in every scheme, re-resolves from them:
|
|
57
55
|
|
|
58
56
|
```tsx
|
|
59
57
|
<Root palette={{ hue: 210, saturation: 72, themes: { danger: { hue: 12 } } }}>
|
|
@@ -61,8 +59,7 @@ scheme, re-resolves from them:
|
|
|
61
59
|
</Root>
|
|
62
60
|
```
|
|
63
61
|
|
|
64
|
-
`setPaletteConfig()` does the same thing imperatively, from anywhere. It replaces
|
|
65
|
-
rather than accumulates, like `useState` — pass an updater to change one field:
|
|
62
|
+
`setPaletteConfig()` does the same thing imperatively, from anywhere. It replaces rather than accumulates, like `useState` — pass an updater to change one field:
|
|
66
63
|
|
|
67
64
|
```ts
|
|
68
65
|
setPaletteConfig((config) => ({ ...config, hue: 235 }));
|
|
@@ -71,7 +68,7 @@ setPaletteConfig((config) => ({ ...config, hue: 235 }));
|
|
|
71
68
|
## Components
|
|
72
69
|
|
|
73
70
|
| Category | Components |
|
|
74
|
-
|
|
71
|
+
| --- | --- |
|
|
75
72
|
| **Layout** | Flex, Grid, Space, Flow, Panel, ResizablePanel, Prefix, Suffix |
|
|
76
73
|
| **Actions** | Button, Button.Group, Button.Split, Link, Menu, CommandMenu |
|
|
77
74
|
| **Content** | Text, Title, Paragraph, Card, Badge, Tag, Avatar, Alert, Skeleton, Placeholder, Disclosure, Divider, CopySnippet, PrismCode |
|
package/dist/components/Block.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { extractStyles } from "../utils/styles.js";
|
|
3
3
|
import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";
|
|
4
4
|
import { forwardRef } from "react";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { ItemAction } from "./actions/ItemAction/ItemAction.js";
|
|
3
3
|
import { ItemBadge } from "./content/ItemBadge/ItemBadge.js";
|
|
4
4
|
import { Item } from "react-stately";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { usePaletteVersion } from "../tokens/palette-config.js";
|
|
3
|
-
import { getTokens } from "../tokens/
|
|
3
|
+
import { getTokens } from "../tokens/all-tokens.js";
|
|
4
4
|
import { useGlobalStyles, useRawCSS } from "@tenphi/tasty";
|
|
5
5
|
import { useMemo } from "react";
|
|
6
6
|
|
|
@@ -115,13 +115,13 @@ const STATIC_CSS = `
|
|
|
115
115
|
pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
|
|
116
116
|
code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
|
|
117
117
|
text-shadow: none;
|
|
118
|
-
background:
|
|
118
|
+
background: oklch(from var(--primary-color) l c h / .2);
|
|
119
119
|
}
|
|
120
120
|
|
|
121
121
|
pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
|
|
122
122
|
code[class*="language-"]::selection, code[class*="language-"] ::selection {
|
|
123
123
|
text-shadow: none;
|
|
124
|
-
background:
|
|
124
|
+
background: oklch(from var(--primary-color) l c h / .2);
|
|
125
125
|
}
|
|
126
126
|
|
|
127
127
|
@media print {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GlobalStyles.js","names":[],"sources":["../../src/components/GlobalStyles.tsx"],"sourcesContent":["import { useGlobalStyles, useRawCSS } from '@tenphi/tasty';\nimport { useMemo } from 'react';\n\nimport { getTokens } from '../tokens';\nimport { usePaletteVersion } from '../tokens/palette-config';\n\nimport type { Styles } from '@tenphi/tasty';\n\ninterface GlobalStylesProps {\n bodyStyles?: { [key: string]: string };\n fonts?: boolean;\n fontDisplay?: 'auto' | 'block' | 'swap' | 'fallback' | 'optional';\n publicUrl?: string;\n font?: string;\n monospaceFont?: string;\n /** @deprecated Tokens are now always applied via useGlobalStyles */\n applyLegacyTokens?: boolean;\n}\n\n/**\n * Body styles applied via useGlobalStyles.\n *\n * `fill` and `color` use scheme-aware Glaze tokens so the whole page flips\n * automatically when `<html data-schema=\"dark\">` (or `prefers-color-scheme: dark`)\n * is active — see `src/tokens/palette.ts` and `src/components/Root.tsx`.\n */\nconst BODY_STYLES: Styles = {\n overscrollBehaviorY: 'none',\n fill: '#surface',\n fontFamily: 'var(--font-sans)',\n '-webkit-font-smoothing': 'antialiased',\n '-moz-osx-font-smoothing': 'grayscale',\n margin: 0,\n padding: 0,\n color: '#surface-text-soft',\n preset: 't3',\n letterSpacing: '0.02em',\n};\n\n// Static CSS that doesn't depend on props\nconst STATIC_CSS = `\n @font-face {\n font-family: text-security-disc;\n src: url(data:font/woff2;base64,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) format('woff2');\n }\n\n kbd {\n font-family: var(--c2-font-family);\n font-weight: var(--c2-font-weight);\n font-size: var(--c2-font-size);\n border: var(--border-width) solid var(--dark-04-color);\n background-color: var(--surface-color);\n color: var(--dark-color);\n border-radius: var(--radius);\n padding: 0 var(--outline-width);\n }\n\n :not([data-qa$=\"Icon\"]) > .tabler-icon {\n font-size: var(--icon-size);\n width: 1em;\n height: 1em;\n min-width: 1em;\n min-height: 1em;\n max-height: 1em;\n stroke-width: var(--stroke-width);\n }\n\n .cube-animation-spin {\n animation: cube-animation-spin 1s linear infinite;\n }\n\n @keyframes cube-animation-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n\n b, strong {\n font-weight: var(--bold-font-weight, 700);\n }\n\n [type=reset], [type=submit], button, html [type=button] {\n -webkit-appearance: none;\n }\n\n code {\n font-family: var(--font-mono);\n }\n\n /*\n * Prism syntax highlighting.\n *\n * All token colors come from the scheme-aware Glaze \\`code-*\\` palette\n * (defined in src/tokens/palette.ts). Each \\`code-*\\` token has \\`mode: 'auto'\\`\n * with a numeric contrast floor of 4.5 against \\`#surface\\` so every token\n * reads at WCAG AA in light AND dark schemes (AAA in high-contrast).\n * Diff insertion / deletion re-use the adaptive \\`success-*\\` and \\`danger-*\\`\n * ramps for both the line bg and the token color.\n */\n code[class*=\"language-\"],\n pre[class*=\"language-\"] {\n color: var(--surface-text-color);\n background: none;\n font-family: var(--s3-font-family, var(--font-mono));\n text-align: left;\n font-weight: var(--s3-font-weight, 400);\n font-size: var(--s3-font-size, 14px);\n line-height: var(--s3-line-height, 20px);\n white-space: pre;\n word-spacing: normal;\n word-break: normal;\n word-wrap: normal;\n border-radius: 6px;\n border: none;\n\n -moz-tab-size: 4;\n -o-tab-size: 4;\n tab-size: 4;\n\n -webkit-hyphens: none;\n -moz-hyphens: none;\n -ms-hyphens: none;\n hyphens: none;\n }\n\n pre[class*=\"language-\"]::-moz-selection, pre[class*=\"language-\"] ::-moz-selection,\n code[class*=\"language-\"]::-moz-selection, code[class*=\"language-\"] ::-moz-selection {\n text-shadow: none;\n background: rgb(var(--primary-color-rgb) / .2);\n }\n\n pre[class*=\"language-\"]::selection, pre[class*=\"language-\"] ::selection,\n code[class*=\"language-\"]::selection, code[class*=\"language-\"] ::selection {\n text-shadow: none;\n background: rgb(var(--primary-color-rgb) / .2);\n }\n\n @media print {\n code[class*=\"language-\"],\n pre[class*=\"language-\"] {\n text-shadow: none;\n }\n }\n\n /* Code blocks */\n pre[class*=\"language-\"] {\n overflow: auto;\n }\n\n :not(pre) > code[class*=\"language-\"],\n pre[class*=\"language-\"] {\n background: transparent;\n }\n\n /* Inline code */\n :not(pre) > code[class*=\"language-\"] {\n border-radius: .3em;\n white-space: normal;\n }\n\n /* Diff (re-uses success/danger ramps; both bg and text adapt to scheme) */\n .token.inserted-sign {\n background-color: var(--success-bg-color);\n color: var(--success-text-color);\n }\n\n .token.inserted {\n color: var(--success-text-color);\n }\n\n .token.deleted-sign {\n background-color: var(--danger-bg-color);\n color: var(--danger-text-color);\n }\n\n .token.deleted {\n color: var(--danger-text-color);\n }\n\n /* Comments — subdued gray-ish, AA floor */\n .token.comment,\n .token.prolog,\n .token.doctype,\n .token.cdata {\n color: var(--code-comment-color);\n }\n\n /* Operators / punctuation — subdued purple, AA floor */\n .token.operator,\n .token.punctuation {\n color: var(--code-punctuation-color);\n }\n\n .namespace {\n opacity: .7;\n }\n\n /* Keywords / language constructs — violet */\n .token.boolean,\n .token.constant,\n .token.keyword,\n .token.atrule {\n color: var(--code-keyword-color);\n font-weight: 500;\n }\n\n /* Numbers / numeric entities — orange */\n .token.entity,\n .token.number {\n color: var(--code-number-color);\n }\n\n /* Strings / character literals / URLs — green */\n .token.string,\n .token.char,\n .token.attr-value,\n .token.url,\n .language-css .token.string,\n .style .token.string {\n color: var(--code-string-color);\n }\n\n /* Names: functions, class names, regex, variables — pink/coral */\n .token.function,\n .token.class-name,\n .token.regex,\n .token.important,\n .token.variable {\n color: var(--code-function-color);\n }\n\n /* HTML/XML tag names — same hue as keywords (see Colors / CodeSyntax) */\n .token.tag {\n color: var(--code-keyword-color);\n }\n\n /* Attributes / properties / selectors / built-ins — cyan */\n .token.attr-name,\n .token.property,\n .token.symbol,\n .token.key,\n .token.builtin,\n .token.selector {\n color: var(--code-attribute-color);\n }\n\n /*\n * prism-react-renderer flattens nested markup tokens and prefixes parent\n * types onto each leaf (e.g. \\`token tag attr-value\\`). Re-assert leaf\n * colors so the bare \\`.token.tag\\` rule does not wash the whole tag.\n */\n .token.tag.attr-name {\n color: var(--code-attribute-color);\n }\n\n .token.tag.attr-value {\n color: var(--code-string-color);\n }\n\n .token.tag.punctuation {\n color: var(--code-punctuation-color);\n }\n\n .token.important,\n .token.bold {\n font-weight: bold;\n }\n\n .token.italic {\n font-style: italic;\n }\n\n .token.entity {\n cursor: help;\n }\n`;\n\nexport function GlobalStyles(props: GlobalStylesProps) {\n const { bodyStyles, font, monospaceFont } = props;\n\n // Re-resolve the tokens whenever the palette is re-seeded at runtime (see\n // `src/tokens/palette-config.ts`). Nothing else has to re-render: every color\n // in the kit compiles to `var(--<name>-color)`, so replacing this one rule\n // recolors the whole UI.\n const paletteVersion = usePaletteVersion();\n\n // Merge token styles with body styles. getTokens() resolves glaze colors\n // against the current palette config, memoized against its version.\n const bodyTokenStyles = useMemo((): Styles => {\n const styles: Styles = { ...getTokens() };\n\n // Add base body styles\n Object.assign(styles, BODY_STYLES);\n\n // Override with custom body styles if provided\n // Keys are passed through as-is (tasty handles both camelCase and kebab-case)\n if (bodyStyles) {\n Object.assign(styles, bodyStyles);\n }\n\n return styles;\n }, [bodyStyles, paletteVersion]);\n\n // Apply tokens and body styles via useGlobalStyles.\n //\n // Replacement does not depend on the `id`: tasty keys its injection slot on\n // `id ?? selector`, so `'body'` on its own already disposes the previous block\n // before writing the new one — which is what removes stale `@hc` rules when the\n // palette is re-seeded, rather than shadowing them. The `id` buys two other\n // things. It gives the token block its own slot, so a host app calling\n // `useGlobalStyles('body', …)` for its own body styles cannot evict ours (and\n // vice versa) — they would otherwise share the `'body'` slot and dispose each\n // other on every change. And under SSR it makes the collector key stable and\n // last-write-wins, instead of content-hashed and first-write-wins.\n useGlobalStyles('body', bodyTokenStyles, { id: 'cube-ui-kit-tokens' });\n\n // Apply static CSS and font definitions via useRawCSS\n useRawCSS(() => {\n const fontValue = font ? `${font}, ` : '';\n const monospaceFontValue = monospaceFont ? `${monospaceFont}, ` : '';\n\n return `\n html {\n overscroll-behavior-y: none;\n --font-sans: ${fontValue}system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, \"Apple Color Emoji\", \"Segoe UI Emoji\", sans-serif;\n --font-mono: ${monospaceFontValue}ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n }\n${STATIC_CSS}`;\n }, [font, monospaceFont]);\n\n return null;\n}\n"],"mappings":";;;;;;;;;;;;;;AA0BA,MAAM,cAAsB;CAC1B,qBAAqB;CACrB,MAAM;CACN,YAAY;CACZ,0BAA0B;CAC1B,2BAA2B;CAC3B,QAAQ;CACR,SAAS;CACT,OAAO;CACP,QAAQ;CACR,eAAe;CAChB;AAGD,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgPnB,SAAgB,aAAa,OAA0B;CACrD,MAAM,EAAE,YAAY,MAAM,kBAAkB;AAoC5C,iBAAgB,QA1BQ,cAAsB;EAC5C,MAAM,SAAiB,EAAE,GAAG,WAAW,EAAE;AAGzC,SAAO,OAAO,QAAQ,YAAY;AAIlC,MAAI,WACF,QAAO,OAAO,QAAQ,WAAW;AAGnC,SAAO;IACN,CAAC,YAjBmB,mBAAmB,CAiBX,CAAC,EAaS,EAAE,IAAI,sBAAsB,CAAC;AAGtE,iBAAgB;AAId,SAAO;;;mBAHW,OAAO,GAAG,KAAK,MAAM,GAMd;mBALE,gBAAgB,GAAG,cAAc,MAAM,GAMhC;;EAEpC;IACG,CAAC,MAAM,cAAc,CAAC;AAEzB,QAAO"}
|
|
1
|
+
{"version":3,"file":"GlobalStyles.js","names":[],"sources":["../../src/components/GlobalStyles.tsx"],"sourcesContent":["import { useGlobalStyles, useRawCSS } from '@tenphi/tasty';\nimport { useMemo } from 'react';\n\nimport { getTokens } from '../tokens';\nimport { usePaletteVersion } from '../tokens/palette-config';\n\nimport type { Styles } from '@tenphi/tasty';\n\ninterface GlobalStylesProps {\n bodyStyles?: { [key: string]: string };\n fonts?: boolean;\n fontDisplay?: 'auto' | 'block' | 'swap' | 'fallback' | 'optional';\n publicUrl?: string;\n font?: string;\n monospaceFont?: string;\n /** @deprecated Tokens are now always applied via useGlobalStyles */\n applyLegacyTokens?: boolean;\n}\n\n/**\n * Body styles applied via useGlobalStyles.\n *\n * `fill` and `color` use scheme-aware Glaze tokens so the whole page flips\n * automatically when `<html data-schema=\"dark\">` (or `prefers-color-scheme: dark`)\n * is active — see `src/tokens/palette.ts` and `src/components/Root.tsx`.\n */\nconst BODY_STYLES: Styles = {\n overscrollBehaviorY: 'none',\n fill: '#surface',\n fontFamily: 'var(--font-sans)',\n '-webkit-font-smoothing': 'antialiased',\n '-moz-osx-font-smoothing': 'grayscale',\n margin: 0,\n padding: 0,\n color: '#surface-text-soft',\n preset: 't3',\n letterSpacing: '0.02em',\n};\n\n// Static CSS that doesn't depend on props\nconst STATIC_CSS = `\n @font-face {\n font-family: text-security-disc;\n src: url(data:font/woff2;base64,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) format('woff2');\n }\n\n kbd {\n font-family: var(--c2-font-family);\n font-weight: var(--c2-font-weight);\n font-size: var(--c2-font-size);\n border: var(--border-width) solid var(--dark-04-color);\n background-color: var(--surface-color);\n color: var(--dark-color);\n border-radius: var(--radius);\n padding: 0 var(--outline-width);\n }\n\n :not([data-qa$=\"Icon\"]) > .tabler-icon {\n font-size: var(--icon-size);\n width: 1em;\n height: 1em;\n min-width: 1em;\n min-height: 1em;\n max-height: 1em;\n stroke-width: var(--stroke-width);\n }\n\n .cube-animation-spin {\n animation: cube-animation-spin 1s linear infinite;\n }\n\n @keyframes cube-animation-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n\n b, strong {\n font-weight: var(--bold-font-weight, 700);\n }\n\n [type=reset], [type=submit], button, html [type=button] {\n -webkit-appearance: none;\n }\n\n code {\n font-family: var(--font-mono);\n }\n\n /*\n * Prism syntax highlighting.\n *\n * All token colors come from the scheme-aware Glaze \\`code-*\\` palette\n * (defined in src/tokens/palette.ts). Each \\`code-*\\` token has \\`mode: 'auto'\\`\n * with a numeric contrast floor of 4.5 against \\`#surface\\` so every token\n * reads at WCAG AA in light AND dark schemes (AAA in high-contrast).\n * Diff insertion / deletion re-use the adaptive \\`success-*\\` and \\`danger-*\\`\n * ramps for both the line bg and the token color.\n */\n code[class*=\"language-\"],\n pre[class*=\"language-\"] {\n color: var(--surface-text-color);\n background: none;\n font-family: var(--s3-font-family, var(--font-mono));\n text-align: left;\n font-weight: var(--s3-font-weight, 400);\n font-size: var(--s3-font-size, 14px);\n line-height: var(--s3-line-height, 20px);\n white-space: pre;\n word-spacing: normal;\n word-break: normal;\n word-wrap: normal;\n border-radius: 6px;\n border: none;\n\n -moz-tab-size: 4;\n -o-tab-size: 4;\n tab-size: 4;\n\n -webkit-hyphens: none;\n -moz-hyphens: none;\n -ms-hyphens: none;\n hyphens: none;\n }\n\n pre[class*=\"language-\"]::-moz-selection, pre[class*=\"language-\"] ::-moz-selection,\n code[class*=\"language-\"]::-moz-selection, code[class*=\"language-\"] ::-moz-selection {\n text-shadow: none;\n background: oklch(from var(--primary-color) l c h / .2);\n }\n\n pre[class*=\"language-\"]::selection, pre[class*=\"language-\"] ::selection,\n code[class*=\"language-\"]::selection, code[class*=\"language-\"] ::selection {\n text-shadow: none;\n background: oklch(from var(--primary-color) l c h / .2);\n }\n\n @media print {\n code[class*=\"language-\"],\n pre[class*=\"language-\"] {\n text-shadow: none;\n }\n }\n\n /* Code blocks */\n pre[class*=\"language-\"] {\n overflow: auto;\n }\n\n :not(pre) > code[class*=\"language-\"],\n pre[class*=\"language-\"] {\n background: transparent;\n }\n\n /* Inline code */\n :not(pre) > code[class*=\"language-\"] {\n border-radius: .3em;\n white-space: normal;\n }\n\n /* Diff (re-uses success/danger ramps; both bg and text adapt to scheme) */\n .token.inserted-sign {\n background-color: var(--success-bg-color);\n color: var(--success-text-color);\n }\n\n .token.inserted {\n color: var(--success-text-color);\n }\n\n .token.deleted-sign {\n background-color: var(--danger-bg-color);\n color: var(--danger-text-color);\n }\n\n .token.deleted {\n color: var(--danger-text-color);\n }\n\n /* Comments — subdued gray-ish, AA floor */\n .token.comment,\n .token.prolog,\n .token.doctype,\n .token.cdata {\n color: var(--code-comment-color);\n }\n\n /* Operators / punctuation — subdued purple, AA floor */\n .token.operator,\n .token.punctuation {\n color: var(--code-punctuation-color);\n }\n\n .namespace {\n opacity: .7;\n }\n\n /* Keywords / language constructs — violet */\n .token.boolean,\n .token.constant,\n .token.keyword,\n .token.atrule {\n color: var(--code-keyword-color);\n font-weight: 500;\n }\n\n /* Numbers / numeric entities — orange */\n .token.entity,\n .token.number {\n color: var(--code-number-color);\n }\n\n /* Strings / character literals / URLs — green */\n .token.string,\n .token.char,\n .token.attr-value,\n .token.url,\n .language-css .token.string,\n .style .token.string {\n color: var(--code-string-color);\n }\n\n /* Names: functions, class names, regex, variables — pink/coral */\n .token.function,\n .token.class-name,\n .token.regex,\n .token.important,\n .token.variable {\n color: var(--code-function-color);\n }\n\n /* HTML/XML tag names — same hue as keywords (see Colors / CodeSyntax) */\n .token.tag {\n color: var(--code-keyword-color);\n }\n\n /* Attributes / properties / selectors / built-ins — cyan */\n .token.attr-name,\n .token.property,\n .token.symbol,\n .token.key,\n .token.builtin,\n .token.selector {\n color: var(--code-attribute-color);\n }\n\n /*\n * prism-react-renderer flattens nested markup tokens and prefixes parent\n * types onto each leaf (e.g. \\`token tag attr-value\\`). Re-assert leaf\n * colors so the bare \\`.token.tag\\` rule does not wash the whole tag.\n */\n .token.tag.attr-name {\n color: var(--code-attribute-color);\n }\n\n .token.tag.attr-value {\n color: var(--code-string-color);\n }\n\n .token.tag.punctuation {\n color: var(--code-punctuation-color);\n }\n\n .token.important,\n .token.bold {\n font-weight: bold;\n }\n\n .token.italic {\n font-style: italic;\n }\n\n .token.entity {\n cursor: help;\n }\n`;\n\nexport function GlobalStyles(props: GlobalStylesProps) {\n const { bodyStyles, font, monospaceFont } = props;\n\n // Re-resolve the tokens whenever the palette is re-seeded at runtime (see\n // `src/tokens/palette-config.ts`). Nothing else has to re-render: every color\n // in the kit compiles to `var(--<name>-color)`, so replacing this one rule\n // recolors the whole UI.\n const paletteVersion = usePaletteVersion();\n\n // Merge token styles with body styles. getTokens() resolves glaze colors\n // against the current palette config, memoized against its version.\n const bodyTokenStyles = useMemo((): Styles => {\n const styles: Styles = { ...getTokens() };\n\n // Add base body styles\n Object.assign(styles, BODY_STYLES);\n\n // Override with custom body styles if provided\n // Keys are passed through as-is (tasty handles both camelCase and kebab-case)\n if (bodyStyles) {\n Object.assign(styles, bodyStyles);\n }\n\n return styles;\n }, [bodyStyles, paletteVersion]);\n\n // Apply tokens and body styles via useGlobalStyles.\n //\n // Replacement does not depend on the `id`: tasty keys its injection slot on\n // `id ?? selector`, so `'body'` on its own already disposes the previous block\n // before writing the new one — which is what removes stale `@hc` rules when the\n // palette is re-seeded, rather than shadowing them. The `id` buys two other\n // things. It gives the token block its own slot, so a host app calling\n // `useGlobalStyles('body', …)` for its own body styles cannot evict ours (and\n // vice versa) — they would otherwise share the `'body'` slot and dispose each\n // other on every change. And under SSR it makes the collector key stable and\n // last-write-wins, instead of content-hashed and first-write-wins.\n useGlobalStyles('body', bodyTokenStyles, { id: 'cube-ui-kit-tokens' });\n\n // Apply static CSS and font definitions via useRawCSS\n useRawCSS(() => {\n const fontValue = font ? `${font}, ` : '';\n const monospaceFontValue = monospaceFont ? `${monospaceFont}, ` : '';\n\n return `\n html {\n overscroll-behavior-y: none;\n --font-sans: ${fontValue}system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, \"Apple Color Emoji\", \"Segoe UI Emoji\", sans-serif;\n --font-mono: ${monospaceFontValue}ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n }\n${STATIC_CSS}`;\n }, [font, monospaceFont]);\n\n return null;\n}\n"],"mappings":";;;;;;;;;;;;;;AA0BA,MAAM,cAAsB;CAC1B,qBAAqB;CACrB,MAAM;CACN,YAAY;CACZ,0BAA0B;CAC1B,2BAA2B;CAC3B,QAAQ;CACR,SAAS;CACT,OAAO;CACP,QAAQ;CACR,eAAe;CAChB;AAGD,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgPnB,SAAgB,aAAa,OAA0B;CACrD,MAAM,EAAE,YAAY,MAAM,kBAAkB;AAoC5C,iBAAgB,QA1BQ,cAAsB;EAC5C,MAAM,SAAiB,EAAE,GAAG,WAAW,EAAE;AAGzC,SAAO,OAAO,QAAQ,YAAY;AAIlC,MAAI,WACF,QAAO,OAAO,QAAQ,WAAW;AAGnC,SAAO;IACN,CAAC,YAjBmB,mBAAmB,CAiBX,CAAC,EAaS,EAAE,IAAI,sBAAsB,CAAC;AAGtE,iBAAgB;AAId,SAAO;;;mBAHW,OAAO,GAAG,KAAK,MAAM,GAMd;mBALE,gBAAgB,GAAG,cAAc,MAAM,GAMhC;;EAEpC;IACG,CAAC,MAAM,cAAc,CAAC;AAEzB,QAAO"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { useCombinedRefs } from "../utils/react/useCombinedRefs.js";
|
|
3
3
|
import { filterBaseProps, tasty } from "@tenphi/tasty";
|
|
4
4
|
import { forwardRef, useCallback, useEffect, useState } from "react";
|
package/dist/components/Root.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { extractStyles } from "../utils/styles.js";
|
|
3
3
|
import { EventBusProvider } from "../utils/react/useEventBus.js";
|
|
4
4
|
import { PortalProvider } from "./portal/PortalProvider.js";
|
|
@@ -21,7 +21,6 @@ setGlobalPredefinedStates({
|
|
|
21
21
|
"@hc": "@root(contrast=high) | (!@root(contrast) & @media(prefers-contrast: more))"
|
|
22
22
|
});
|
|
23
23
|
configure({
|
|
24
|
-
colorSpace: "rgb",
|
|
25
24
|
units: {
|
|
26
25
|
x: "var(--gap)",
|
|
27
26
|
r: "var(--radius)",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Root.js","names":["I18nProvider"],"sources":["../../src/components/Root.tsx"],"sourcesContent":["import {\n BASE_STYLES,\n BaseProps,\n BLOCK_STYLES,\n configure,\n filterBaseProps,\n setGlobalPredefinedStates,\n tasty,\n} from '@tenphi/tasty';\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport { ModalProvider } from 'react-aria';\n\nimport { I18nProvider } from '../i18n';\nimport { Provider } from '../provider';\nimport { NavigationAdapter } from '../providers/navigation.types';\nimport { TrackingProps, TrackingProvider } from '../providers/TrackingProvider';\nimport { PaletteConfig, setPaletteConfig } from '../tokens/palette-config';\nimport { EventBusProvider } from '../utils/react/useEventBus';\nimport { extractStyles } from '../utils/styles';\nimport { TASTY_VERSION, VERSION } from '../version';\n\nimport { GlobalStyles } from './GlobalStyles';\nimport { AlertDialogApiProvider } from './overlays/AlertDialog';\nimport { OverlayProvider } from './overlays/Notifications/OverlayProvider';\nimport { PortalProvider } from './portal';\n\nimport type { i18n as I18nInstance } from 'i18next';\n\n// Color-scheme aliases for the Glaze-generated palette (see `src/tokens/palette.ts`).\n// Attribute opt-in wins over system preference:\n// <html data-schema=\"dark\"> → forces dark scheme\n// <html data-contrast=\"high\"> → forces high-contrast scheme\n// Otherwise falls back to the user's `prefers-color-scheme` / `prefers-contrast`.\nsetGlobalPredefinedStates({\n '@dark':\n '@root(schema=dark) | (!@root(schema) & @media(prefers-color-scheme: dark))',\n '@hc':\n '@root(contrast=high) | (!@root(contrast) & @media(prefers-contrast: more))',\n});\n\nconfigure({\n
|
|
1
|
+
{"version":3,"file":"Root.js","names":["I18nProvider"],"sources":["../../src/components/Root.tsx"],"sourcesContent":["import {\n BASE_STYLES,\n BaseProps,\n BLOCK_STYLES,\n configure,\n filterBaseProps,\n setGlobalPredefinedStates,\n tasty,\n} from '@tenphi/tasty';\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport { ModalProvider } from 'react-aria';\n\nimport { I18nProvider } from '../i18n';\nimport { Provider } from '../provider';\nimport { NavigationAdapter } from '../providers/navigation.types';\nimport { TrackingProps, TrackingProvider } from '../providers/TrackingProvider';\nimport { PaletteConfig, setPaletteConfig } from '../tokens/palette-config';\nimport { EventBusProvider } from '../utils/react/useEventBus';\nimport { extractStyles } from '../utils/styles';\nimport { TASTY_VERSION, VERSION } from '../version';\n\nimport { GlobalStyles } from './GlobalStyles';\nimport { AlertDialogApiProvider } from './overlays/AlertDialog';\nimport { OverlayProvider } from './overlays/Notifications/OverlayProvider';\nimport { PortalProvider } from './portal';\n\nimport type { i18n as I18nInstance } from 'i18next';\n\n// Color-scheme aliases for the Glaze-generated palette (see `src/tokens/palette.ts`).\n// Attribute opt-in wins over system preference:\n// <html data-schema=\"dark\"> → forces dark scheme\n// <html data-contrast=\"high\"> → forces high-contrast scheme\n// Otherwise falls back to the user's `prefers-color-scheme` / `prefers-contrast`.\nsetGlobalPredefinedStates({\n '@dark':\n '@root(schema=dark) | (!@root(schema) & @media(prefers-color-scheme: dark))',\n '@hc':\n '@root(contrast=high) | (!@root(contrast) & @media(prefers-contrast: more))',\n});\n\nconfigure({\n units: {\n x: 'var(--gap)',\n r: 'var(--radius)',\n cr: 'var(--card-radius)',\n bw: 'var(--border-width)',\n ow: 'var(--outline-width)',\n },\n recipes: {\n reset: {\n margin: 0,\n padding: 0,\n border: 0,\n outline: 0,\n boxSizing: 'border-box',\n },\n button: {\n appearance: 'none',\n touchAction: 'manipulation',\n textDecoration: 'none',\n '-webkit-tap-highlight-color': 'transparent',\n fill: '#clear',\n color: 'inherit',\n cursor: {\n '': 'default',\n ':is(a)': 'pointer',\n ':is(button)': '$pointer',\n disabled: 'not-allowed',\n },\n },\n input: {\n appearance: 'none',\n wordSpacing: 'initial',\n color: 'inherit',\n fill: '#clear',\n },\n 'input-autofill': {\n '@autofill': ':-webkit-autofill | :autofill',\n appearance: {\n '@autofill': 'none',\n },\n '-webkit-text-fill-color': {\n '': 'currentColor',\n '@autofill': '#primary-text',\n },\n caretColor: {\n '@autofill': '#primary-text',\n },\n shadow: {\n '@autofill': '0 0 0 9999rem #surface inset',\n },\n preset: {\n '@autofill': 'inherit',\n },\n '-webkit-opacity': {\n '': false,\n '[disabled]': '1',\n },\n },\n 'input-placeholder': {\n '-webkit-text-fill-color': '#placeholder',\n color: '#placeholder',\n },\n 'input-search-cancel-button': {\n hide: true,\n appearance: 'none',\n },\n },\n});\n\nconst RootElement = tasty({\n id: 'cube-ui-kit-root',\n styles: {\n display: 'contents',\n color: '#dark-02',\n preset: 't3',\n },\n});\n\nconst STYLES = [...BASE_STYLES, ...BLOCK_STYLES];\n\nexport interface CubeRootProps extends BaseProps {\n tokens?: { [key: string]: string };\n /**\n * Tune the generated color palette. Every zone — `accent`, `base` and each status\n * theme — takes the same seed: a color, or `{ hue, saturation }`. Plus the global\n * `surfaceMode`, `pastel` and `contrastLevel`. Omitted fields take their default, so\n * this prop describes the whole palette and dropping a field from it drops the\n * customization.\n *\n * Removing the prop entirely is the one thing that does *not* reset the\n * palette, so `<Root>` with no `palette` cannot clobber a host's imperative\n * `setPaletteConfig()` call. Pass `{}` to ask for the default.\n *\n * The palette is global process state, so this is a declarative wrapper over\n * `setPaletteConfig()`; both drive the same store, and the last write wins.\n * See `Getting Started/Theming` in Storybook.\n */\n palette?: PaletteConfig;\n bodyStyles?: { [key: string]: string };\n fontDisplay?: 'auto' | 'block' | 'swap' | 'fallback' | 'optional';\n fonts?: boolean;\n publicUrl?: string;\n navigation?: NavigationAdapter;\n font?: string;\n monospaceFont?: string;\n /** @deprecated Tokens are now always applied via GlobalStyles */\n applyLegacyTokens?: boolean;\n tracking?: TrackingProps;\n cursorStrategy?: 'web' | 'native';\n /**\n * i18next instance for this tree. During SSR, pass a request-local instance\n * created with `createUIKitI18n(locale)`.\n */\n i18n?: I18nInstance;\n /** Override the React Aria formatting locale. */\n locale?: string;\n}\n\nexport function Root(allProps: CubeRootProps) {\n let {\n children,\n /** Raw css styles for body element */\n bodyStyles,\n fontDisplay = 'swap',\n fonts,\n publicUrl,\n navigation,\n font,\n monospaceFont,\n applyLegacyTokens: _applyLegacyTokens, // deprecated, ignored\n tracking,\n cursorStrategy = 'web',\n style,\n tokens,\n palette,\n i18n,\n locale,\n ...props\n } = allProps;\n\n // Applied during render, not in an effect, so the first paint already uses the\n // tuned palette instead of flashing the default. `setPaletteConfig` is a no-op\n // when the resolved config is unchanged, so an inline object literal and\n // StrictMode's double render both cost nothing. `GlobalStyles` is rendered\n // below in the same pass and reads the new version directly.\n useMemo(() => {\n if (palette) setPaletteConfig(palette);\n }, [palette]);\n\n const ref = useRef(null);\n\n const [rootRef, setRootRef] = useState();\n\n useEffect(() => {\n if (!rootRef) {\n // @ts-ignore\n setRootRef(ref?.current);\n }\n }, []);\n\n const styles = extractStyles(props, STYLES);\n\n return (\n <I18nProvider i18n={i18n} locale={locale}>\n <Provider navigation={navigation} root={rootRef}>\n <TrackingProvider event={tracking?.event}>\n <RootElement\n ref={ref}\n data-uikit={VERSION}\n data-tasty={TASTY_VERSION}\n data-font-display={fontDisplay}\n {...filterBaseProps(props, { eventProps: true })}\n styles={styles}\n style={{\n '--pointer': cursorStrategy === 'web' ? 'pointer' : 'default',\n ...style,\n }}\n tokens={tokens}\n >\n <GlobalStyles\n bodyStyles={bodyStyles}\n publicUrl={publicUrl}\n fonts={fonts}\n font={font}\n monospaceFont={monospaceFont}\n fontDisplay={fontDisplay}\n />\n <ModalProvider>\n <PortalProvider value={ref}>\n <EventBusProvider>\n <OverlayProvider>\n <AlertDialogApiProvider>{children}</AlertDialogApiProvider>\n </OverlayProvider>\n </EventBusProvider>\n </PortalProvider>\n </ModalProvider>\n </RootElement>\n </TrackingProvider>\n </Provider>\n </I18nProvider>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAiCA,0BAA0B;CACxB,SACE;CACF,OACE;CACH,CAAC;AAEF,UAAU;CACR,OAAO;EACL,GAAG;EACH,GAAG;EACH,IAAI;EACJ,IAAI;EACJ,IAAI;EACL;CACD,SAAS;EACP,OAAO;GACL,QAAQ;GACR,SAAS;GACT,QAAQ;GACR,SAAS;GACT,WAAW;GACZ;EACD,QAAQ;GACN,YAAY;GACZ,aAAa;GACb,gBAAgB;GAChB,+BAA+B;GAC/B,MAAM;GACN,OAAO;GACP,QAAQ;IACN,IAAI;IACJ,UAAU;IACV,eAAe;IACf,UAAU;IACX;GACF;EACD,OAAO;GACL,YAAY;GACZ,aAAa;GACb,OAAO;GACP,MAAM;GACP;EACD,kBAAkB;GAChB,aAAa;GACb,YAAY,EACV,aAAa,QACd;GACD,2BAA2B;IACzB,IAAI;IACJ,aAAa;IACd;GACD,YAAY,EACV,aAAa,iBACd;GACD,QAAQ,EACN,aAAa,gCACd;GACD,QAAQ,EACN,aAAa,WACd;GACD,mBAAmB;IACjB,IAAI;IACJ,cAAc;IACf;GACF;EACD,qBAAqB;GACnB,2BAA2B;GAC3B,OAAO;GACR;EACD,8BAA8B;GAC5B,MAAM;GACN,YAAY;GACb;EACF;CACF,CAAC;AAEF,MAAM,cAAc,MAAM;CACxB,IAAI;CACJ,QAAQ;EACN,SAAS;EACT,OAAO;EACP,QAAQ;EACT;CACF,CAAC;AAEF,MAAM,SAAS,CAAC,GAAG,aAAa,GAAG,aAAa;AAwChD,SAAgB,KAAK,UAAyB;CAC5C,IAAI,EACF,UAEA,YACA,cAAc,QACd,OACA,WACA,YACA,MACA,eACA,mBAAmB,oBACnB,UACA,iBAAiB,OACjB,OACA,QACA,SACA,MACA,QACA,GAAG,UACD;AAOJ,eAAc;AACZ,MAAI,QAAS,kBAAiB,QAAQ;IACrC,CAAC,QAAQ,CAAC;CAEb,MAAM,MAAM,OAAO,KAAK;CAExB,MAAM,CAAC,SAAS,cAAc,UAAU;AAExC,iBAAgB;AACd,MAAI,CAAC,QAEH,YAAW,KAAK,QAAQ;IAEzB,EAAE,CAAC;CAEN,MAAM,SAAS,cAAc,OAAO,OAAO;AAE3C,QACE,oBAACA;EAAmB;EAAc;YAChC,oBAAC;GAAqB;GAAY,MAAM;aACtC,oBAAC;IAAiB,OAAO,UAAU;cACjC,qBAAC;KACM;KACL,cAAY;KACZ,cAAY;KACZ,qBAAmB;KACnB,GAAI,gBAAgB,OAAO,EAAE,YAAY,MAAM,CAAC;KACxC;KACR,OAAO;MACL,aAAa,mBAAmB,QAAQ,YAAY;MACpD,GAAG;MACJ;KACO;gBAER,oBAAC;MACa;MACD;MACJ;MACD;MACS;MACF;OACb,EACF,oBAAC,2BACC,oBAAC;MAAe,OAAO;gBACrB,oBAAC,8BACC,oBAAC,6BACC,oBAAC,0BAAwB,WAAkC,GAC3C,GACD;OACJ,GACH;MACJ;KACG;IACV;GACE"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { extractStyles } from "../../../utils/styles.js";
|
|
3
3
|
import { useAction } from "../use-action.js";
|
|
4
4
|
import { CONTAINER_STYLES, TEXT_STYLES, tasty } from "@tenphi/tasty";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { useEvent } from "../../../_internal/hooks/use-event.js";
|
|
3
3
|
import { _Item } from "../../content/Item/Item.js";
|
|
4
4
|
import { useI18n } from "../../../i18n/useI18n.js";
|
|
@@ -4,6 +4,7 @@ import { DynamicIcon } from "../../../utils/react/resolveIcon.js";
|
|
|
4
4
|
import "../../../utils/react/index.js";
|
|
5
5
|
import { CubeActionProps } from "../Action/Action.js";
|
|
6
6
|
import { Mods, Styles } from "@tenphi/tasty";
|
|
7
|
+
import "react";
|
|
7
8
|
import { OverlayProps } from "react-aria";
|
|
8
9
|
|
|
9
10
|
//#region src/components/actions/Button/Button.d.ts
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { extractStyles } from "../../../utils/styles.js";
|
|
3
3
|
import { getDisabledElementProps } from "../../../utils/react/disabledProps.js";
|
|
4
4
|
import { mergeProps } from "../../../utils/react/mergeProps.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { useSlotProps } from "../../../utils/react/Slots.js";
|
|
3
3
|
import { Space } from "../../layout/Space.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.167.0 | Cube Dev Team */
|
|
2
2
|
import { extractStyles } from "../../../utils/styles.js";
|
|
3
3
|
import { mergeProps } from "../../../utils/react/mergeProps.js";
|
|
4
4
|
import { DirectionIcon } from "../../../icons/DirectionIcon.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.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 { TooltipProvider } from "../../overlays/Tooltip/TooltipProvider.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps } from "../../../utils/react/mergeProps.js";
|
|
3
3
|
import { TooltipProvider } from "../../overlays/Tooltip/TooltipProvider.js";
|
|
4
4
|
import { CURRENT_CLEAR_STYLES, CURRENT_OUTLINE_STYLES, CURRENT_PRIMARY_STYLES, DANGER_CLEAR_STYLES, DANGER_OUTLINE_STYLES, DANGER_PRIMARY_STYLES, DEFAULT_CLEAR_STYLES, DEFAULT_OUTLINE_STYLES, DEFAULT_PRIMARY_STYLES, ITEM_ACTION_BASE_STYLES, NOTE_CLEAR_STYLES, NOTE_OUTLINE_STYLES, NOTE_PRIMARY_STYLES, SPECIAL_CLEAR_STYLES, SPECIAL_OUTLINE_STYLES, SPECIAL_PRIMARY_STYLES, SUCCESS_CLEAR_STYLES, SUCCESS_OUTLINE_STYLES, SUCCESS_PRIMARY_STYLES, WARNING_CLEAR_STYLES, WARNING_OUTLINE_STYLES, WARNING_PRIMARY_STYLES } from "../../../data/item-themes.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
|
|
3
3
|
import { mergeRefs } from "../../../utils/react/useCombinedRefs.js";
|
|
4
4
|
import { useDismissParentPopover } from "../../../utils/react/usePopoverSync.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.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 { _CollectionItem } from "../../CollectionItem.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
|
|
3
3
|
import { filterCollectionItemProps } from "../../CollectionItem.js";
|
|
4
4
|
import { _Item } from "../../content/Item/Item.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { TooltipProvider } from "../../overlays/Tooltip/TooltipProvider.js";
|
|
3
3
|
import { MenuItem } from "./MenuItem.js";
|
|
4
4
|
import { StyledMenu, StyledSection, StyledSectionHeading } from "./styled.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { SlotProvider } from "../../../utils/react/Slots.js";
|
|
3
3
|
import { usePopoverSync } from "../../../utils/react/usePopoverSync.js";
|
|
4
4
|
import { useEvent } from "../../../_internal/hooks/use-event.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { usePopoverSync } from "../../../utils/react/usePopoverSync.js";
|
|
3
3
|
import { useEvent } from "../../../_internal/hooks/use-event.js";
|
|
4
4
|
import { MenuContext, useMenuContext } from "./context.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { DEFAULT_CLEAR_STYLES } from "../../../data/item-themes.js";
|
|
3
3
|
import { Space } from "../../layout/Space.js";
|
|
4
4
|
import { DEFAULT_BUTTON_STYLES } from "../Button/Button.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { ItemActionProvider, useItemActionContext } from "./ItemActionContext.js";
|
|
3
3
|
import { openLink, parseTo, performClickHandler, useAction } from "./use-action.js";
|
|
4
4
|
import { ItemAction } from "./ItemAction/ItemAction.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.167.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps as mergeProps$1 } from "../../utils/react/mergeProps.js";
|
|
3
3
|
import { useEvent } from "../../_internal/hooks/use-event.js";
|
|
4
4
|
import { useFocus as useFocus$1 } from "../../utils/react/interactions.js";
|
|
@@ -8,14 +8,18 @@ interface UseAnchoredMenuReturn<P, T> {
|
|
|
8
8
|
/** Ref to attach to the anchor element for positioning the menu. */
|
|
9
9
|
anchorRef: RefObject<HTMLElement | null>;
|
|
10
10
|
/**
|
|
11
|
-
* Programmatically opens the menu with the provided props.
|
|
11
|
+
* Programmatically opens the menu with the provided props. They are merged
|
|
12
|
+
* over the CURRENT `defaultMenuProps` on every render, so defaults that change
|
|
13
|
+
* while the menu is open reach it without an `update()` call.
|
|
14
|
+
*
|
|
12
15
|
* @param props - Props to pass to the menu component
|
|
13
16
|
* @param triggerProps - Additional props for MenuTrigger (merged with defaultTriggerProps)
|
|
14
17
|
*/
|
|
15
18
|
open(props?: P, triggerProps?: T): void;
|
|
16
19
|
/**
|
|
17
|
-
* Updates the props of the currently open menu.
|
|
18
|
-
*
|
|
20
|
+
* Updates the RUNTIME props of the currently open menu. Props are merged over
|
|
21
|
+
* the current `defaultMenuProps`. Only needed for props the caller owns —
|
|
22
|
+
* `defaultMenuProps` is re-read on every render.
|
|
19
23
|
*/
|
|
20
24
|
update(props: P, triggerProps?: T): void;
|
|
21
25
|
/** Closes the menu programmatically. */
|