@cube-dev/ui-kit 0.171.0 → 0.172.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 +1 -1
- package/dist/CHANGELOG.md +21 -0
- package/dist/README.md +1 -1
- 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 +6 -6
- 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 +2 -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/Banner/Banner.js.map +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/Menu/styled.js.map +1 -1
- package/dist/components/actions/index.js +1 -1
- package/dist/components/actions/use-action.js +1 -1
- package/dist/components/actions/use-anchored-menu.js +1 -1
- package/dist/components/actions/use-context-menu.js +1 -1
- package/dist/components/content/ActiveZone/ActiveZone.js +1 -1
- package/dist/components/content/Alert/Alert.js +1 -1
- package/dist/components/content/Alert/use-alert.js +1 -1
- package/dist/components/content/Avatar/Avatar.js +1 -1
- package/dist/components/content/Badge/Badge.js +1 -1
- package/dist/components/content/Card/Card.js +1 -1
- package/dist/components/content/Content.js +1 -1
- package/dist/components/content/CopyPasteBlock/CopyPasteBlock.js +1 -1
- package/dist/components/content/CopySnippet/CopySnippet.js +1 -1
- package/dist/components/content/Disclosure/Disclosure.js +1 -1
- package/dist/components/content/Divider.js +1 -1
- package/dist/components/content/Footer.js +1 -1
- package/dist/components/content/Header.js +1 -1
- package/dist/components/content/HotKeys/HotKeys.js +1 -1
- package/dist/components/content/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 +2 -2
- package/dist/components/data/TableBase/column-tint.js.map +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.d.ts +3 -3
- package/dist/components/data/TableBase/types.js +1 -1
- package/dist/components/data/TableBase/types.js.map +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/Checkbox.js.map +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 +2 -2
- package/dist/components/fields/ColorSwatchGroup/ColorSwatchGroup.js.map +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/Select/Select.js.map +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 +2 -2
- package/dist/components/fields/color/color.js.map +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.js +1 -1
- 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.js +1 -1
- package/dist/components/layout/Board/Widget.js +1 -1
- package/dist/components/layout/Board/WidgetHost.js +1 -1
- 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-store.js +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.js +1 -1
- package/dist/components/layout/Board/grid-core/sort.js +1 -1
- package/dist/components/layout/Board/index.js +1 -1
- package/dist/components/layout/Board/responsive-utils.js +1 -1
- package/dist/components/layout/Board/use-board-layout.js +1 -1
- package/dist/components/layout/Board/use-board-registry.js +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.d.ts +2 -2
- package/dist/components/other/CubeLogo/CubeLogo.js +12 -12
- package/dist/components/other/CubeLogo/CubeLogo.js.map +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 +1 -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/item-themes.js.map +1 -1
- package/dist/data/themes.js +1 -1
- package/dist/data/themes.js.map +1 -1
- package/dist/eslint-plugin/defaults.generated.js +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 +2 -2
- package/dist/index.js +3 -3
- 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.js +1 -1
- package/dist/tokens/base.js +1 -1
- package/dist/tokens/color-seed.js +1 -1
- package/dist/tokens/color-theme.d.ts +2 -2
- package/dist/tokens/color-theme.js +2 -2
- package/dist/tokens/color-theme.js.map +1 -1
- package/dist/tokens/colors.d.ts +3 -3
- package/dist/tokens/colors.js +4 -4
- package/dist/tokens/colors.js.map +1 -1
- package/dist/tokens/layout.js +1 -1
- package/dist/tokens/lazy-styles.js +1 -1
- package/dist/tokens/palette-config.d.ts +1 -1
- package/dist/tokens/palette-config.js +1 -1
- package/dist/tokens/palette-config.js.map +1 -1
- package/dist/tokens/palette.d.ts +5 -5
- package/dist/tokens/palette.js +11 -11
- package/dist/tokens/palette.js.map +1 -1
- package/dist/tokens/resolve.d.ts +2 -2
- package/dist/tokens/resolve.js +9 -9
- package/dist/tokens/resolve.js.map +1 -1
- package/dist/tokens/shadows.d.ts +1 -1
- package/dist/tokens/shadows.js +2 -2
- package/dist/tokens/shadows.js.map +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/index.d.ts +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.d.ts +1 -1
- package/dist/utils/react/index.js +2 -2
- 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.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/{useSchema.d.ts → useScheme.d.ts} +16 -16
- package/dist/utils/react/{useSchema.js → useScheme.js} +30 -30
- package/dist/utils/react/{useSchema.js.map → useScheme.js.map} +1 -1
- package/dist/utils/react/useViewportSize.js +1 -1
- package/dist/utils/react/wrapNodeIfPlain.js +1 -1
- package/dist/utils/selection.js +1 -1
- package/dist/utils/styles.js +1 -1
- package/dist/utils/tree.js +1 -1
- package/dist/utils/warnings.js +1 -1
- package/dist/version.js +2 -2
- package/docs/Colors.md +2 -2
- package/docs/Introduction.md +1 -1
- package/docs/Theming.md +19 -19
- package/docs/Usage.md +19 -19
- package/docs/components/content/ItemCard.md +1 -1
- package/docs/components/content/PrismCode.md +2 -2
- package/docs/components/data/DataTable.md +1 -1
- package/docs/components/fields/Picker.md +1 -1
- package/docs/components/organisms/StatsCard.md +1 -1
- package/docs/components/other/CubeLogo.md +9 -9
- package/docs/components/overlays/Tooltip.md +3 -3
- package/docs/components/overlays/TooltipProvider.md +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resolve.js","names":[],"sources":["../../src/tokens/resolve.ts"],"sourcesContent":["import { useState, useSyncExternalStore } from 'react';\n\nimport { useLayoutEffect } from '../utils/react/useLayoutEffect';\nimport { subscribeSchema } from '../utils/react/useSchema';\nimport { warn } from '../utils/warnings';\n\nimport { getTokens } from './all-tokens';\nimport { getPaletteVersion, usePaletteVersion } from './palette-config';\n\n/**\n * Resolving a design token to a literal value, for consumers that render into a\n * surface our stylesheets do not reach — a third-party iframe (Stripe Elements),\n * a CodeMirror / Monaco theme object, a Vega spec. Those take colors, lengths and\n * font descriptors as values; `var(--purple-color)` means nothing to them.\n *\n * Doing it by hand fails silently, because a token read from the wrong element\n * does not come back empty. Tasty registers `@property` rules — its own defaults\n * plus one for every custom property whose type it can infer — and an undeclared\n * token reads back as that rule's `initial-value`. Some of those are obvious\n * duds (`rgba(0, 0, 0, 0)` for a `<color>`, `0px` for a `<length>`), but many are\n * ordinary-looking values: off the token block `--gap` reads `4px` rather than\n * the kit's `8px`, `--transition` reads `80ms`, `--radius` reads `6px`. So\n * inspecting the value cannot tell a real token from a miss, in either\n * direction — `#clear` really is `transparent` and `$h2-letter-spacing` really\n * is `0px`.\n *\n * The question that CAN be answered is \"are the kit's tokens in effect on this\n * element?\", and `$tokens-applied` (see `src/tokens/base.ts`) answers it: it is\n * declared alongside the tokens, so it is present exactly where they are. Off\n * that surface every read is reported as unresolved; on it, the computed value\n * is the truth.\n */\n\n/**\n * Declared by the token block and nothing else — see `src/tokens/base.ts`.\n *\n * Matched by VALUE rather than by presence, because presence is not the signal\n * it looks like: tasty infers a type for the marker as readily as for any other\n * token, registers `@property --tokens-applied` with `initial-value: 0`, and so\n * hands back `0` off the block instead of an empty string. Comparing against the\n * declared value is right either way, and cannot drift from `base.ts`.\n */\nconst SURFACE_MARKER = '$tokens-applied';\n\nfunction isTokenSurface(computed: CSSStyleDeclaration): boolean {\n const declared = getTokens()[SURFACE_MARKER];\n const name = tokenToProperty(SURFACE_MARKER);\n\n if (typeof declared !== 'string' || !name) return false;\n\n return (\n normalizeValue(computed.getPropertyValue(name)) === normalizeValue(declared)\n );\n}\n\n/**\n * Values that mean \"this property was never declared\" once we already know the\n * token block IS in effect. Only used to catch a token the kit does not declare\n * at all — a typo, or a name from another design system — since for those there\n * is no marker to lean on.\n */\nconst PLACEHOLDER_VALUES = new Set([\n 'transparent',\n 'rgba(0,0,0,0)',\n '0',\n '0px',\n '0deg',\n '0s',\n]);\n\n/** Custom property names are CSS identifiers: a letter or `_`, then word chars or `-`. */\nconst PROPERTY_NAME_RE = /^[a-zA-Z_][\\w-]*$/;\n\nexport interface ResolveTokenOptions {\n /**\n * Element to read the tokens off. Defaults to the document `<body>`, which is\n * where `<Root>` declares them.\n *\n * Pass an element when the value has to reflect a *local* override — a subtree\n * carrying its own `tokens` prop (`renderColorTokens()`), or one under a\n * `data-schema` / `data-contrast` attribute that differs from the document's.\n * The element's own document and view are used, so a node inside a same-origin\n * iframe resolves against that iframe.\n */\n element?: Element | null;\n /**\n * Returned in place of `null` when a token is unset, unresolvable, or reads\n * back as an `@property` placeholder — including on the server, where there is\n * no DOM to read.\n */\n fallback?: string;\n}\n\n/**\n * Fields mirror {@link TypographyPreset}. A field the preset does not define is\n * `null`, except `fontFamily`, which falls back to the document's `--font-sans`\n * so the common case (`t1`–`t4`, `h1`–`h6`, which inherit the sans stack rather\n * than naming it) still hands back a usable stack.\n */\nexport type ResolvedPreset = {\n fontFamily: string | null;\n fontSize: string | null;\n fontStyle: string | null;\n fontWeight: string | null;\n lineHeight: string | null;\n letterSpacing: string | null;\n textTransform: string | null;\n boldFontWeight: string | null;\n iconSize: string | null;\n};\n\nconst PRESET_FIELD_SUFFIXES: Record<keyof ResolvedPreset, string> = {\n fontFamily: 'font-family',\n fontSize: 'font-size',\n fontStyle: 'font-style',\n fontWeight: 'font-weight',\n lineHeight: 'line-height',\n letterSpacing: 'letter-spacing',\n textTransform: 'text-transform',\n boldFontWeight: 'bold-font-weight',\n iconSize: 'icon-size',\n};\n\nconst PRESET_FIELDS = Object.keys(\n PRESET_FIELD_SUFFIXES,\n) as (keyof ResolvedPreset)[];\n\n/**\n * Map a token to its CSS custom property name, using the same convention tasty's\n * style DSL does: `#name` is a color (`--name-color`), `$name` is everything else\n * (`--name`). A raw `--name` or a bare `name` is taken as written.\n *\n * Returns `null` for anything that would not be a valid custom property.\n */\nfunction tokenToProperty(token: string): string | null {\n const trimmed = token.trim();\n\n let name: string;\n\n if (trimmed.startsWith('--')) {\n name = trimmed.slice(2);\n } else if (trimmed.startsWith('#')) {\n name = `${trimmed.slice(1)}-color`;\n } else if (trimmed.startsWith('$')) {\n name = trimmed.slice(1);\n } else {\n name = trimmed;\n }\n\n return PROPERTY_NAME_RE.test(name) ? `--${name}` : null;\n}\n\n/** Whitespace and case are not meaningful in the values we compare against. */\nfunction normalizeValue(value: string): string {\n return value.replace(/\\s+/g, '').toLowerCase();\n}\n\n/**\n * Every custom property the kit declares, by name. Membership only — the value\n * is deliberately not consulted, because a token's declared value tells you\n * nothing about whether it is in effect where you read it.\n *\n * Memoized against the palette version, like {@link getTokens} itself.\n */\nlet knownNamesCache: { version: number; names: Set<string> } | null = null;\n\nfunction getKnownTokenNames(): Set<string> {\n const version = getPaletteVersion();\n\n if (!knownNamesCache || knownNamesCache.version !== version) {\n const names = new Set<string>();\n\n for (const key of Object.keys(getTokens())) {\n const name = tokenToProperty(key);\n\n if (name) names.add(name);\n }\n\n knownNamesCache = { version, names };\n }\n\n return knownNamesCache.names;\n}\n\n/** These fire per token, per page — once each, not once per render. */\nconst warnedTokens = new Set<string>();\n\nfunction warnOnce(key: string, message: string) {\n if (warnedTokens.has(key)) return;\n\n warnedTokens.add(key);\n\n warn(message);\n}\n\n/** The document `<body>` is where `<Root>` declares the token block. */\nfunction resolveTarget(element?: Element | null): Element | null {\n if (element) return element;\n if (typeof document === 'undefined') return null;\n\n return document.body ?? document.documentElement ?? null;\n}\n\nfunction readValue(\n computed: CSSStyleDeclaration,\n token: string,\n fallback: string | null,\n silent: boolean,\n onTokenSurface: boolean,\n): string | null {\n const name = tokenToProperty(token);\n\n if (!name) {\n warnOnce(`name:${token}`, `\"${token}\" is not a valid design token name.`);\n\n return fallback;\n }\n\n if (!onTokenSurface) {\n if (!silent) {\n warnOnce(\n `surface:${name}`,\n `Token \"${token}\" (${name}) was read from an element the design tokens are not in effect on, so any value there is tasty's @property default rather than the kit's. <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. Pass \\`element\\` to read from a specific subtree, or \\`fallback\\` for a value to use instead.`,\n );\n }\n\n return fallback;\n }\n\n const value = computed.getPropertyValue(name).trim();\n\n if (!value) return fallback;\n\n // On a token surface the computed value is the truth, including a genuinely\n // transparent color or a real `0px`. The only thing left to catch is a name\n // the kit never declares, where an @property default is all there is to read.\n if (\n PLACEHOLDER_VALUES.has(normalizeValue(value)) &&\n !getKnownTokenNames().has(name)\n ) {\n if (!silent) {\n warnOnce(\n `unknown:${name}`,\n `Token \"${token}\" (${name}) is not declared by the kit, and read back as an unset custom property. Check the name, or pass \\`fallback\\`.`,\n );\n }\n\n return fallback;\n }\n\n return value;\n}\n\n/**\n * Read the resolved value of one design token — a color, a length, a font\n * descriptor — as a literal string.\n *\n * ```ts\n * resolveTokenValue('#purple'); // 'oklch(0.52 0.24 285)'\n * resolveTokenValue('$space-md'); // '8px'\n * resolveTokenValue('$t3-font-size'); // '14px'\n * ```\n *\n * Returns `options.fallback ?? null` when the token is not declared on the\n * element it was read from — see {@link ResolveTokenOptions}.\n */\nexport function resolveTokenValue(\n token: string,\n options: ResolveTokenOptions = {},\n): string | null {\n return resolveTokenValues([token], options)[token];\n}\n\n/**\n * {@link resolveTokenValue} for several tokens at once, through a single\n * `getComputedStyle` call. Prefer this when building a theme object — a Stripe\n * `Appearance`, a CodeMirror theme — which needs a dozen values at a time.\n *\n * ```ts\n * const { '#surface': background, '#surface-text': color } = resolveTokenValues([\n * '#surface',\n * '#surface-text',\n * ]);\n * ```\n */\nexport function resolveTokenValues<T extends string>(\n tokens: readonly T[],\n options: ResolveTokenOptions = {},\n): Record<T, string | null> {\n return readTokens(tokens, options, false);\n}\n\n/** Shared by the public reader and the preset reader, which suppresses warnings. */\nfunction readTokens<T extends string>(\n tokens: readonly T[],\n options: ResolveTokenOptions,\n silent: boolean,\n): Record<T, string | null> {\n const { element, fallback = null } = options;\n const result = {} as Record<T, string | null>;\n const target = resolveTarget(element);\n const view = target?.ownerDocument?.defaultView;\n\n if (!target || !view) {\n for (const token of tokens) result[token] = fallback;\n\n return result;\n }\n\n const computed = view.getComputedStyle(target);\n // One read for the whole batch: the marker is a property of the element, not\n // of any individual token.\n const onTokenSurface = isTokenSurface(computed);\n\n for (const token of tokens) {\n result[token] = readValue(\n computed,\n token,\n fallback,\n silent,\n onTokenSurface,\n );\n }\n\n return result;\n}\n\n/**\n * Resolve a typography preset — `'t3'`, `'h2'`, `'s3'` — to the literal font\n * descriptors behind it, for a surface that takes a font as values rather than\n * as a `preset` style.\n *\n * ```ts\n * const { fontFamily, fontSize, lineHeight } = resolvePresetValues('t3');\n * ```\n *\n * A preset legitimately leaves most of these unset — only headings carry an\n * `iconSize`, only the `s*` family names a `fontFamily` — so unlike\n * {@link resolveTokenValues} a miss here is expected and never warns.\n */\nexport function resolvePresetValues(\n preset: string,\n options: ResolveTokenOptions = {},\n): ResolvedPreset {\n const { fallback = null } = options;\n const names = PRESET_FIELDS.map(\n (field) => `$${preset}-${PRESET_FIELD_SUFFIXES[field]}`,\n );\n const values = readTokens(\n [...names, '--font-sans'],\n { element: options.element },\n true,\n );\n const resolved = {} as ResolvedPreset;\n\n PRESET_FIELDS.forEach((field, index) => {\n resolved[field] = values[names[index]] ?? fallback;\n });\n\n // Every preset but the `s*` family inherits the sans stack rather than naming\n // it, so the token is absent by design and `--font-sans` is the real answer.\n resolved.fontFamily =\n values[names[PRESET_FIELDS.indexOf('fontFamily')]] ??\n values['--font-sans'] ??\n fallback;\n\n return resolved;\n}\n\n// ============================================================================\n// Appearance subscription\n// ============================================================================\n\n/**\n * A token's resolved value changes for two reasons: the palette was re-seeded\n * (`setPaletteConfig()`, covered by `usePaletteVersion`), or the schema /\n * contrast tier flipped. This store covers the second.\n *\n * The watching itself belongs to `subscribeSchema()` (`src/utils/react/useSchema.ts`),\n * which owns the definition of both axes — the `data-schema` / `data-contrast`\n * attributes and the media queries they fall back to are the same strings\n * `<Root>` registers `@dark` and `@hc` from. This store only counts the changes,\n * so there is one observer for the document rather than one per concern.\n */\nlet appearanceVersion = 0;\nlet stopWatchingAppearance: (() => void) | null = null;\n\nconst appearanceListeners = new Set<() => void>();\n\nfunction onAppearanceChange() {\n appearanceVersion++;\n\n appearanceListeners.forEach((listener) => listener());\n}\n\nfunction subscribeAppearance(listener: () => void): () => void {\n appearanceListeners.add(listener);\n\n if (appearanceListeners.size === 1) {\n stopWatchingAppearance = subscribeSchema(onAppearanceChange);\n }\n\n return () => {\n appearanceListeners.delete(listener);\n\n if (!appearanceListeners.size) {\n stopWatchingAppearance?.();\n stopWatchingAppearance = null;\n }\n };\n}\n\nfunction getAppearanceVersion(): number {\n return appearanceVersion;\n}\n\n/**\n * A version React only ever hands out while rendering on the server or\n * hydrating: `useSyncExternalStore` reads `getServerSnapshot` in exactly those\n * two cases and `getSnapshot` in every other. That makes it a reliable \"this\n * render has to match the server's markup\" flag — see {@link useResolvedTokens}.\n *\n * A plain client render (`createRoot`) never sees it, so a CSR app still\n * resolves on its first render rather than paying an extra pass.\n */\nconst HYDRATING = -1;\n\nfunction getServerAppearanceVersion(): number {\n return HYDRATING;\n}\n\n/**\n * Re-render on a schema / contrast change. Returns the version rather than the\n * state so the snapshot is a primitive — the same reason `usePaletteVersion`\n * does, see `src/tokens/palette-config.ts`.\n */\nfunction useAppearanceVersion(): number {\n return useSyncExternalStore(\n subscribeAppearance,\n getAppearanceVersion,\n getServerAppearanceVersion,\n );\n}\n\n// ============================================================================\n// React bindings\n// ============================================================================\n\n/**\n * The value is read out of the DOM, so it re-resolves whenever the palette is\n * re-seeded or the schema / contrast tier flips, and it is `fallback ?? null`\n * during SSR. The layout effect is what covers the first commit: a consumer\n * rendered in the same pass as `<Root>` reads before the token block lands.\n */\nfunction useResolvedTokens<T extends string>(\n tokens: readonly T[],\n key: string,\n options: ResolveTokenOptions,\n): Record<T, string | null> {\n const { element, fallback } = options;\n const paletteVersion = usePaletteVersion();\n const appearance = useAppearanceVersion();\n\n const [values, setValues] = useState(() =>\n appearance === HYDRATING\n ? unresolved(tokens, fallback)\n : resolveTokenValues(tokens, options),\n );\n\n useLayoutEffect(() => {\n setValues((previous) => {\n const next = resolveTokenValues(tokens, { element, fallback });\n\n return isSameRecord(previous, next) ? previous : next;\n });\n // `tokens` is a fresh array on all but the first render, so `key` — its\n // joined identity — is what belongs in the dependency list.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [key, element, fallback, paletteVersion, appearance]);\n\n return values;\n}\n\n/**\n * What the server rendered: no DOM, so every token is the fallback. The first\n * client render has to agree with it or hydration reports a mismatch for any\n * consumer that renders the value; the layout effect above replaces it with the\n * resolved values before the browser paints.\n */\nfunction unresolved<T extends string>(\n tokens: readonly T[],\n fallback: string | undefined,\n): Record<T, string | null> {\n const result = {} as Record<T, string | null>;\n\n for (const token of tokens) result[token] = fallback ?? null;\n\n return result;\n}\n\n/** Keeps the previous object when nothing moved, so it stays usable as a dep. */\nfunction isSameRecord<T extends Record<string, string | null>>(\n a: T,\n b: T,\n): boolean {\n const keys = Object.keys(b);\n\n if (Object.keys(a).length !== keys.length) return false;\n\n return keys.every((key) => a[key] === b[key]);\n}\n\n/**\n * {@link resolveTokenValue} as a hook: re-renders when the palette is re-seeded\n * or the schema / contrast tier flips.\n *\n * ```tsx\n * const accent = useTokenValue('#purple');\n *\n * return <Chart series={{ color: accent ?? '#000' }} />;\n * ```\n */\nexport function useTokenValue(\n token: string,\n options: ResolveTokenOptions = {},\n): string | null {\n return useResolvedTokens([token], token, options)[token];\n}\n\n/**\n * {@link resolveTokenValues} as a hook. The returned object keeps its identity\n * while the values are unchanged, so it is safe as a dependency of the theme\n * object built from it — and the token list may be an inline literal.\n *\n * ```tsx\n * const colors = useTokenValues(['#surface', '#surface-text', '#border']);\n *\n * const appearance = useMemo(() => toStripeAppearance(colors), [colors]);\n * ```\n */\nexport function useTokenValues<T extends string>(\n tokens: readonly T[],\n options: ResolveTokenOptions = {},\n): Record<T, string | null> {\n return useResolvedTokens(tokens, tokens.join(' '), options);\n}\n\n/**\n * {@link resolvePresetValues} as a hook.\n *\n * ```tsx\n * const { fontFamily, fontSize } = usePresetValues('s3');\n * ```\n */\nexport function usePresetValues(\n preset: string,\n options: ResolveTokenOptions = {},\n): ResolvedPreset {\n const { element, fallback } = options;\n const paletteVersion = usePaletteVersion();\n const appearance = useAppearanceVersion();\n\n const [values, setValues] = useState(() =>\n appearance === HYDRATING\n ? unresolvedPreset(fallback)\n : resolvePresetValues(preset, options),\n );\n\n useLayoutEffect(() => {\n setValues((previous) => {\n const next = resolvePresetValues(preset, { element, fallback });\n\n return isSameRecord(previous, next) ? previous : next;\n });\n }, [preset, element, fallback, paletteVersion, appearance]);\n\n return values;\n}\n\n/** {@link unresolved} for the fixed shape {@link resolvePresetValues} returns. */\nfunction unresolvedPreset(fallback: string | undefined): ResolvedPreset {\n const resolved = {} as ResolvedPreset;\n\n for (const field of PRESET_FIELDS) resolved[field] = fallback ?? null;\n\n return resolved;\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"resolve.js","names":[],"sources":["../../src/tokens/resolve.ts"],"sourcesContent":["import { useState, useSyncExternalStore } from 'react';\n\nimport { useLayoutEffect } from '../utils/react/useLayoutEffect';\nimport { subscribeScheme } from '../utils/react/useScheme';\nimport { warn } from '../utils/warnings';\n\nimport { getTokens } from './all-tokens';\nimport { getPaletteVersion, usePaletteVersion } from './palette-config';\n\n/**\n * Resolving a design token to a literal value, for consumers that render into a\n * surface our stylesheets do not reach — a third-party iframe (Stripe Elements),\n * a CodeMirror / Monaco theme object, a Vega spec. Those take colors, lengths and\n * font descriptors as values; `var(--purple-color)` means nothing to them.\n *\n * Doing it by hand fails silently, because a token read from the wrong element\n * does not come back empty. Tasty registers `@property` rules — its own defaults\n * plus one for every custom property whose type it can infer — and an undeclared\n * token reads back as that rule's `initial-value`. Some of those are obvious\n * duds (`rgba(0, 0, 0, 0)` for a `<color>`, `0px` for a `<length>`), but many are\n * ordinary-looking values: off the token block `--gap` reads `4px` rather than\n * the kit's `8px`, `--transition` reads `80ms`, `--radius` reads `6px`. So\n * inspecting the value cannot tell a real token from a miss, in either\n * direction — `#clear` really is `transparent` and `$h2-letter-spacing` really\n * is `0px`.\n *\n * The question that CAN be answered is \"are the kit's tokens in effect on this\n * element?\", and `$tokens-applied` (see `src/tokens/base.ts`) answers it: it is\n * declared alongside the tokens, so it is present exactly where they are. Off\n * that surface every read is reported as unresolved; on it, the computed value\n * is the truth.\n */\n\n/**\n * Declared by the token block and nothing else — see `src/tokens/base.ts`.\n *\n * Matched by VALUE rather than by presence, because presence is not the signal\n * it looks like: tasty infers a type for the marker as readily as for any other\n * token, registers `@property --tokens-applied` with `initial-value: 0`, and so\n * hands back `0` off the block instead of an empty string. Comparing against the\n * declared value is right either way, and cannot drift from `base.ts`.\n */\nconst SURFACE_MARKER = '$tokens-applied';\n\nfunction isTokenSurface(computed: CSSStyleDeclaration): boolean {\n const declared = getTokens()[SURFACE_MARKER];\n const name = tokenToProperty(SURFACE_MARKER);\n\n if (typeof declared !== 'string' || !name) return false;\n\n return (\n normalizeValue(computed.getPropertyValue(name)) === normalizeValue(declared)\n );\n}\n\n/**\n * Values that mean \"this property was never declared\" once we already know the\n * token block IS in effect. Only used to catch a token the kit does not declare\n * at all — a typo, or a name from another design system — since for those there\n * is no marker to lean on.\n */\nconst PLACEHOLDER_VALUES = new Set([\n 'transparent',\n 'rgba(0,0,0,0)',\n '0',\n '0px',\n '0deg',\n '0s',\n]);\n\n/** Custom property names are CSS identifiers: a letter or `_`, then word chars or `-`. */\nconst PROPERTY_NAME_RE = /^[a-zA-Z_][\\w-]*$/;\n\nexport interface ResolveTokenOptions {\n /**\n * Element to read the tokens off. Defaults to the document `<body>`, which is\n * where `<Root>` declares them.\n *\n * Pass an element when the value has to reflect a *local* override — a subtree\n * carrying its own `tokens` prop (`renderColorTokens()`), or one under a\n * `data-scheme` / `data-contrast` attribute that differs from the document's.\n * The element's own document and view are used, so a node inside a same-origin\n * iframe resolves against that iframe.\n */\n element?: Element | null;\n /**\n * Returned in place of `null` when a token is unset, unresolvable, or reads\n * back as an `@property` placeholder — including on the server, where there is\n * no DOM to read.\n */\n fallback?: string;\n}\n\n/**\n * Fields mirror {@link TypographyPreset}. A field the preset does not define is\n * `null`, except `fontFamily`, which falls back to the document's `--font-sans`\n * so the common case (`t1`–`t4`, `h1`–`h6`, which inherit the sans stack rather\n * than naming it) still hands back a usable stack.\n */\nexport type ResolvedPreset = {\n fontFamily: string | null;\n fontSize: string | null;\n fontStyle: string | null;\n fontWeight: string | null;\n lineHeight: string | null;\n letterSpacing: string | null;\n textTransform: string | null;\n boldFontWeight: string | null;\n iconSize: string | null;\n};\n\nconst PRESET_FIELD_SUFFIXES: Record<keyof ResolvedPreset, string> = {\n fontFamily: 'font-family',\n fontSize: 'font-size',\n fontStyle: 'font-style',\n fontWeight: 'font-weight',\n lineHeight: 'line-height',\n letterSpacing: 'letter-spacing',\n textTransform: 'text-transform',\n boldFontWeight: 'bold-font-weight',\n iconSize: 'icon-size',\n};\n\nconst PRESET_FIELDS = Object.keys(\n PRESET_FIELD_SUFFIXES,\n) as (keyof ResolvedPreset)[];\n\n/**\n * Map a token to its CSS custom property name, using the same convention tasty's\n * style DSL does: `#name` is a color (`--name-color`), `$name` is everything else\n * (`--name`). A raw `--name` or a bare `name` is taken as written.\n *\n * Returns `null` for anything that would not be a valid custom property.\n */\nfunction tokenToProperty(token: string): string | null {\n const trimmed = token.trim();\n\n let name: string;\n\n if (trimmed.startsWith('--')) {\n name = trimmed.slice(2);\n } else if (trimmed.startsWith('#')) {\n name = `${trimmed.slice(1)}-color`;\n } else if (trimmed.startsWith('$')) {\n name = trimmed.slice(1);\n } else {\n name = trimmed;\n }\n\n return PROPERTY_NAME_RE.test(name) ? `--${name}` : null;\n}\n\n/** Whitespace and case are not meaningful in the values we compare against. */\nfunction normalizeValue(value: string): string {\n return value.replace(/\\s+/g, '').toLowerCase();\n}\n\n/**\n * Every custom property the kit declares, by name. Membership only — the value\n * is deliberately not consulted, because a token's declared value tells you\n * nothing about whether it is in effect where you read it.\n *\n * Memoized against the palette version, like {@link getTokens} itself.\n */\nlet knownNamesCache: { version: number; names: Set<string> } | null = null;\n\nfunction getKnownTokenNames(): Set<string> {\n const version = getPaletteVersion();\n\n if (!knownNamesCache || knownNamesCache.version !== version) {\n const names = new Set<string>();\n\n for (const key of Object.keys(getTokens())) {\n const name = tokenToProperty(key);\n\n if (name) names.add(name);\n }\n\n knownNamesCache = { version, names };\n }\n\n return knownNamesCache.names;\n}\n\n/** These fire per token, per page — once each, not once per render. */\nconst warnedTokens = new Set<string>();\n\nfunction warnOnce(key: string, message: string) {\n if (warnedTokens.has(key)) return;\n\n warnedTokens.add(key);\n\n warn(message);\n}\n\n/** The document `<body>` is where `<Root>` declares the token block. */\nfunction resolveTarget(element?: Element | null): Element | null {\n if (element) return element;\n if (typeof document === 'undefined') return null;\n\n return document.body ?? document.documentElement ?? null;\n}\n\nfunction readValue(\n computed: CSSStyleDeclaration,\n token: string,\n fallback: string | null,\n silent: boolean,\n onTokenSurface: boolean,\n): string | null {\n const name = tokenToProperty(token);\n\n if (!name) {\n warnOnce(`name:${token}`, `\"${token}\" is not a valid design token name.`);\n\n return fallback;\n }\n\n if (!onTokenSurface) {\n if (!silent) {\n warnOnce(\n `surface:${name}`,\n `Token \"${token}\" (${name}) was read from an element the design tokens are not in effect on, so any value there is tasty's @property default rather than the kit's. <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. Pass \\`element\\` to read from a specific subtree, or \\`fallback\\` for a value to use instead.`,\n );\n }\n\n return fallback;\n }\n\n const value = computed.getPropertyValue(name).trim();\n\n if (!value) return fallback;\n\n // On a token surface the computed value is the truth, including a genuinely\n // transparent color or a real `0px`. The only thing left to catch is a name\n // the kit never declares, where an @property default is all there is to read.\n if (\n PLACEHOLDER_VALUES.has(normalizeValue(value)) &&\n !getKnownTokenNames().has(name)\n ) {\n if (!silent) {\n warnOnce(\n `unknown:${name}`,\n `Token \"${token}\" (${name}) is not declared by the kit, and read back as an unset custom property. Check the name, or pass \\`fallback\\`.`,\n );\n }\n\n return fallback;\n }\n\n return value;\n}\n\n/**\n * Read the resolved value of one design token — a color, a length, a font\n * descriptor — as a literal string.\n *\n * ```ts\n * resolveTokenValue('#purple'); // 'oklch(0.52 0.24 285)'\n * resolveTokenValue('$space-md'); // '8px'\n * resolveTokenValue('$t3-font-size'); // '14px'\n * ```\n *\n * Returns `options.fallback ?? null` when the token is not declared on the\n * element it was read from — see {@link ResolveTokenOptions}.\n */\nexport function resolveTokenValue(\n token: string,\n options: ResolveTokenOptions = {},\n): string | null {\n return resolveTokenValues([token], options)[token];\n}\n\n/**\n * {@link resolveTokenValue} for several tokens at once, through a single\n * `getComputedStyle` call. Prefer this when building a theme object — a Stripe\n * `Appearance`, a CodeMirror theme — which needs a dozen values at a time.\n *\n * ```ts\n * const { '#surface': background, '#surface-text': color } = resolveTokenValues([\n * '#surface',\n * '#surface-text',\n * ]);\n * ```\n */\nexport function resolveTokenValues<T extends string>(\n tokens: readonly T[],\n options: ResolveTokenOptions = {},\n): Record<T, string | null> {\n return readTokens(tokens, options, false);\n}\n\n/** Shared by the public reader and the preset reader, which suppresses warnings. */\nfunction readTokens<T extends string>(\n tokens: readonly T[],\n options: ResolveTokenOptions,\n silent: boolean,\n): Record<T, string | null> {\n const { element, fallback = null } = options;\n const result = {} as Record<T, string | null>;\n const target = resolveTarget(element);\n const view = target?.ownerDocument?.defaultView;\n\n if (!target || !view) {\n for (const token of tokens) result[token] = fallback;\n\n return result;\n }\n\n const computed = view.getComputedStyle(target);\n // One read for the whole batch: the marker is a property of the element, not\n // of any individual token.\n const onTokenSurface = isTokenSurface(computed);\n\n for (const token of tokens) {\n result[token] = readValue(\n computed,\n token,\n fallback,\n silent,\n onTokenSurface,\n );\n }\n\n return result;\n}\n\n/**\n * Resolve a typography preset — `'t3'`, `'h2'`, `'s3'` — to the literal font\n * descriptors behind it, for a surface that takes a font as values rather than\n * as a `preset` style.\n *\n * ```ts\n * const { fontFamily, fontSize, lineHeight } = resolvePresetValues('t3');\n * ```\n *\n * A preset legitimately leaves most of these unset — only headings carry an\n * `iconSize`, only the `s*` family names a `fontFamily` — so unlike\n * {@link resolveTokenValues} a miss here is expected and never warns.\n */\nexport function resolvePresetValues(\n preset: string,\n options: ResolveTokenOptions = {},\n): ResolvedPreset {\n const { fallback = null } = options;\n const names = PRESET_FIELDS.map(\n (field) => `$${preset}-${PRESET_FIELD_SUFFIXES[field]}`,\n );\n const values = readTokens(\n [...names, '--font-sans'],\n { element: options.element },\n true,\n );\n const resolved = {} as ResolvedPreset;\n\n PRESET_FIELDS.forEach((field, index) => {\n resolved[field] = values[names[index]] ?? fallback;\n });\n\n // Every preset but the `s*` family inherits the sans stack rather than naming\n // it, so the token is absent by design and `--font-sans` is the real answer.\n resolved.fontFamily =\n values[names[PRESET_FIELDS.indexOf('fontFamily')]] ??\n values['--font-sans'] ??\n fallback;\n\n return resolved;\n}\n\n// ============================================================================\n// Appearance subscription\n// ============================================================================\n\n/**\n * A token's resolved value changes for two reasons: the palette was re-seeded\n * (`setPaletteConfig()`, covered by `usePaletteVersion`), or the scheme /\n * contrast tier flipped. This store covers the second.\n *\n * The watching itself belongs to `subscribeScheme()` (`src/utils/react/useScheme.ts`),\n * which owns the definition of both axes — the `data-scheme` / `data-contrast`\n * attributes and the media queries they fall back to are the same strings\n * `<Root>` registers `@dark` and `@hc` from. This store only counts the changes,\n * so there is one observer for the document rather than one per concern.\n */\nlet appearanceVersion = 0;\nlet stopWatchingAppearance: (() => void) | null = null;\n\nconst appearanceListeners = new Set<() => void>();\n\nfunction onAppearanceChange() {\n appearanceVersion++;\n\n appearanceListeners.forEach((listener) => listener());\n}\n\nfunction subscribeAppearance(listener: () => void): () => void {\n appearanceListeners.add(listener);\n\n if (appearanceListeners.size === 1) {\n stopWatchingAppearance = subscribeScheme(onAppearanceChange);\n }\n\n return () => {\n appearanceListeners.delete(listener);\n\n if (!appearanceListeners.size) {\n stopWatchingAppearance?.();\n stopWatchingAppearance = null;\n }\n };\n}\n\nfunction getAppearanceVersion(): number {\n return appearanceVersion;\n}\n\n/**\n * A version React only ever hands out while rendering on the server or\n * hydrating: `useSyncExternalStore` reads `getServerSnapshot` in exactly those\n * two cases and `getSnapshot` in every other. That makes it a reliable \"this\n * render has to match the server's markup\" flag — see {@link useResolvedTokens}.\n *\n * A plain client render (`createRoot`) never sees it, so a CSR app still\n * resolves on its first render rather than paying an extra pass.\n */\nconst HYDRATING = -1;\n\nfunction getServerAppearanceVersion(): number {\n return HYDRATING;\n}\n\n/**\n * Re-render on a scheme / contrast change. Returns the version rather than the\n * state so the snapshot is a primitive — the same reason `usePaletteVersion`\n * does, see `src/tokens/palette-config.ts`.\n */\nfunction useAppearanceVersion(): number {\n return useSyncExternalStore(\n subscribeAppearance,\n getAppearanceVersion,\n getServerAppearanceVersion,\n );\n}\n\n// ============================================================================\n// React bindings\n// ============================================================================\n\n/**\n * The value is read out of the DOM, so it re-resolves whenever the palette is\n * re-seeded or the scheme / contrast tier flips, and it is `fallback ?? null`\n * during SSR. The layout effect is what covers the first commit: a consumer\n * rendered in the same pass as `<Root>` reads before the token block lands.\n */\nfunction useResolvedTokens<T extends string>(\n tokens: readonly T[],\n key: string,\n options: ResolveTokenOptions,\n): Record<T, string | null> {\n const { element, fallback } = options;\n const paletteVersion = usePaletteVersion();\n const appearance = useAppearanceVersion();\n\n const [values, setValues] = useState(() =>\n appearance === HYDRATING\n ? unresolved(tokens, fallback)\n : resolveTokenValues(tokens, options),\n );\n\n useLayoutEffect(() => {\n setValues((previous) => {\n const next = resolveTokenValues(tokens, { element, fallback });\n\n return isSameRecord(previous, next) ? previous : next;\n });\n // `tokens` is a fresh array on all but the first render, so `key` — its\n // joined identity — is what belongs in the dependency list.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [key, element, fallback, paletteVersion, appearance]);\n\n return values;\n}\n\n/**\n * What the server rendered: no DOM, so every token is the fallback. The first\n * client render has to agree with it or hydration reports a mismatch for any\n * consumer that renders the value; the layout effect above replaces it with the\n * resolved values before the browser paints.\n */\nfunction unresolved<T extends string>(\n tokens: readonly T[],\n fallback: string | undefined,\n): Record<T, string | null> {\n const result = {} as Record<T, string | null>;\n\n for (const token of tokens) result[token] = fallback ?? null;\n\n return result;\n}\n\n/** Keeps the previous object when nothing moved, so it stays usable as a dep. */\nfunction isSameRecord<T extends Record<string, string | null>>(\n a: T,\n b: T,\n): boolean {\n const keys = Object.keys(b);\n\n if (Object.keys(a).length !== keys.length) return false;\n\n return keys.every((key) => a[key] === b[key]);\n}\n\n/**\n * {@link resolveTokenValue} as a hook: re-renders when the palette is re-seeded\n * or the scheme / contrast tier flips.\n *\n * ```tsx\n * const accent = useTokenValue('#purple');\n *\n * return <Chart series={{ color: accent ?? '#000' }} />;\n * ```\n */\nexport function useTokenValue(\n token: string,\n options: ResolveTokenOptions = {},\n): string | null {\n return useResolvedTokens([token], token, options)[token];\n}\n\n/**\n * {@link resolveTokenValues} as a hook. The returned object keeps its identity\n * while the values are unchanged, so it is safe as a dependency of the theme\n * object built from it — and the token list may be an inline literal.\n *\n * ```tsx\n * const colors = useTokenValues(['#surface', '#surface-text', '#border']);\n *\n * const appearance = useMemo(() => toStripeAppearance(colors), [colors]);\n * ```\n */\nexport function useTokenValues<T extends string>(\n tokens: readonly T[],\n options: ResolveTokenOptions = {},\n): Record<T, string | null> {\n return useResolvedTokens(tokens, tokens.join(' '), options);\n}\n\n/**\n * {@link resolvePresetValues} as a hook.\n *\n * ```tsx\n * const { fontFamily, fontSize } = usePresetValues('s3');\n * ```\n */\nexport function usePresetValues(\n preset: string,\n options: ResolveTokenOptions = {},\n): ResolvedPreset {\n const { element, fallback } = options;\n const paletteVersion = usePaletteVersion();\n const appearance = useAppearanceVersion();\n\n const [values, setValues] = useState(() =>\n appearance === HYDRATING\n ? unresolvedPreset(fallback)\n : resolvePresetValues(preset, options),\n );\n\n useLayoutEffect(() => {\n setValues((previous) => {\n const next = resolvePresetValues(preset, { element, fallback });\n\n return isSameRecord(previous, next) ? previous : next;\n });\n }, [preset, element, fallback, paletteVersion, appearance]);\n\n return values;\n}\n\n/** {@link unresolved} for the fixed shape {@link resolvePresetValues} returns. */\nfunction unresolvedPreset(fallback: string | undefined): ResolvedPreset {\n const resolved = {} as ResolvedPreset;\n\n for (const field of PRESET_FIELDS) resolved[field] = fallback ?? null;\n\n return resolved;\n}\n"],"mappings":"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"}
|
package/dist/tokens/shadows.d.ts
CHANGED
|
@@ -11,7 +11,7 @@ import { Styles } from "@tenphi/tasty";
|
|
|
11
11
|
*
|
|
12
12
|
* The shadow colors (`#shadow-sm` / `#shadow-md` / `#shadow-lg`) are
|
|
13
13
|
* generated by Glaze and adapt automatically to dark / high-contrast
|
|
14
|
-
*
|
|
14
|
+
* schemes — see `src/tokens/palette.ts`.
|
|
15
15
|
*
|
|
16
16
|
* Keys use $ prefix for CSS custom properties.
|
|
17
17
|
*/
|
package/dist/tokens/shadows.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
|
|
2
2
|
//#region src/tokens/shadows.ts
|
|
3
3
|
/**
|
|
4
4
|
* Shadow tokens using tasty shorthand syntax.
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
*
|
|
10
10
|
* The shadow colors (`#shadow-sm` / `#shadow-md` / `#shadow-lg`) are
|
|
11
11
|
* generated by Glaze and adapt automatically to dark / high-contrast
|
|
12
|
-
*
|
|
12
|
+
* schemes — see `src/tokens/palette.ts`.
|
|
13
13
|
*
|
|
14
14
|
* Keys use $ prefix for CSS custom properties.
|
|
15
15
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shadows.js","names":[],"sources":["../../src/tokens/shadows.ts"],"sourcesContent":["import type { Styles } from '@tenphi/tasty';\n\n/**\n * Shadow tokens using tasty shorthand syntax.\n *\n * Format: `<offset-y> <blur> <spread?> <color>`\n * - `1bw` = 1 × border-width\n * - `.5x` = 0.5 × gap\n *\n * The shadow colors (`#shadow-sm` / `#shadow-md` / `#shadow-lg`) are\n * generated by Glaze and adapt automatically to dark / high-contrast\n *
|
|
1
|
+
{"version":3,"file":"shadows.js","names":[],"sources":["../../src/tokens/shadows.ts"],"sourcesContent":["import type { Styles } from '@tenphi/tasty';\n\n/**\n * Shadow tokens using tasty shorthand syntax.\n *\n * Format: `<offset-y> <blur> <spread?> <color>`\n * - `1bw` = 1 × border-width\n * - `.5x` = 0.5 × gap\n *\n * The shadow colors (`#shadow-sm` / `#shadow-md` / `#shadow-lg`) are\n * generated by Glaze and adapt automatically to dark / high-contrast\n * schemes — see `src/tokens/palette.ts`.\n *\n * Keys use $ prefix for CSS custom properties.\n */\nexport const SHADOW_TOKENS: Styles = {\n /** Subtle shadow for list items */\n '$item-shadow': '0 1bw .375x #shadow-sm',\n /** Standard card shadow */\n '$card-shadow': '0 .5x 2x #shadow-md',\n /** Standard elevation */\n $shadow: '0 .5x 2x #shadow-md',\n /** Elevated dialog shadow */\n '$dialog-shadow': '0 1x 4x #shadow-lg',\n};\n"],"mappings":";;;;;;;;;;;;;;;AAeA,MAAa,gBAAwB;CAEnC,gBAAgB;CAEhB,gBAAgB;CAEhB,SAAS;CAET,kBAAkB;CACnB"}
|
package/dist/tokens/sizes.js
CHANGED
package/dist/tokens/spacing.js
CHANGED
package/dist/utils/index.d.ts
CHANGED
|
@@ -9,7 +9,7 @@ import { useLayoutEffect } from "./react/useLayoutEffect.js";
|
|
|
9
9
|
import { mergeRefs, useCombinedRefs } from "./react/useCombinedRefs.js";
|
|
10
10
|
import { wrapNodeIfPlain } from "./react/wrapNodeIfPlain.js";
|
|
11
11
|
import { useViewportSize } from "./react/useViewportSize.js";
|
|
12
|
-
import {
|
|
12
|
+
import { ColorScheme, resolveHighContrast, resolveScheme, subscribeScheme, useHighContrast, useScheme } from "./react/useScheme.js";
|
|
13
13
|
import { useQaProps } from "./react/useQaProps.js";
|
|
14
14
|
import { EventBusContextValue, EventBusListener, EventBusProvider, useEventBus, useEventListener } from "./react/useEventBus.js";
|
|
15
15
|
import { UsePopoverSyncOptions, useDismissParentPopover, usePopoverSync } from "./react/usePopoverSync.js";
|
package/dist/utils/is-dev-env.js
CHANGED
package/dist/utils/modules.js
CHANGED
package/dist/utils/promise.js
CHANGED
package/dist/utils/raf.js
CHANGED
package/dist/utils/random.js
CHANGED
package/dist/utils/range.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
|
|
2
2
|
import { mergeProps } from "./mergeProps.js";
|
|
3
3
|
import { Children, cloneElement, createContext, useContext, useMemo } from "react";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
@@ -9,7 +9,7 @@ import { useLayoutEffect } from "./useLayoutEffect.js";
|
|
|
9
9
|
import { mergeRefs, useCombinedRefs } from "./useCombinedRefs.js";
|
|
10
10
|
import { wrapNodeIfPlain } from "./wrapNodeIfPlain.js";
|
|
11
11
|
import { useViewportSize } from "./useViewportSize.js";
|
|
12
|
-
import {
|
|
12
|
+
import { ColorScheme, resolveHighContrast, resolveScheme, subscribeScheme, useHighContrast, useScheme } from "./useScheme.js";
|
|
13
13
|
import { useQaProps } from "./useQaProps.js";
|
|
14
14
|
import { EventBusContextValue, EventBusListener, EventBusProvider, useEventBus, useEventListener } from "./useEventBus.js";
|
|
15
15
|
import { UsePopoverSyncOptions, useDismissParentPopover, usePopoverSync } from "./usePopoverSync.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
|
|
2
2
|
import { chain } from "./chain.js";
|
|
3
3
|
import { getDisabledElementProps, omitActivationEventProps } from "./disabledProps.js";
|
|
4
4
|
import { forwardRefWithGenerics } from "./forwardRefWithGenerics.js";
|
|
@@ -9,7 +9,7 @@ import { ClearSlots, SlotProvider, useSlotProps } from "./Slots.js";
|
|
|
9
9
|
import { mergeRefs, useCombinedRefs } from "./useCombinedRefs.js";
|
|
10
10
|
import { wrapNodeIfPlain } from "./wrapNodeIfPlain.js";
|
|
11
11
|
import { useViewportSize } from "./useViewportSize.js";
|
|
12
|
-
import { resolveHighContrast,
|
|
12
|
+
import { resolveHighContrast, resolveScheme, subscribeScheme, useHighContrast, useScheme } from "./useScheme.js";
|
|
13
13
|
import { useQaProps } from "./useQaProps.js";
|
|
14
14
|
import { EventBusProvider, useEventBus, useEventListener } from "./useEventBus.js";
|
|
15
15
|
import { useDismissParentPopover, usePopoverSync } from "./usePopoverSync.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
|
|
2
2
|
//#region src/utils/react/nullableValue.ts
|
|
3
3
|
function castNullableStringValue(props) {
|
|
4
4
|
return castNullableField(props, ["value", "defaultValue"], "string", (v) => String(v));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
|
|
2
2
|
import React, { createContext, useCallback, useContext, useEffect, useMemo, useRef } from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/utils/react/useEventBus.ts
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
|
|
2
2
|
import { useLayoutEffect as useLayoutEffect$1 } from "./useLayoutEffect.js";
|
|
3
3
|
import { useEffect, useRef, useState } from "react";
|
|
4
4
|
import { useSSRSafeId } from "@react-aria/ssr";
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
|
|
2
|
-
//#region src/utils/react/
|
|
3
|
-
/** The color
|
|
4
|
-
type
|
|
2
|
+
//#region src/utils/react/useScheme.d.ts
|
|
3
|
+
/** The color scheme the document resolves to — the two arms of the `@dark` state. */
|
|
4
|
+
type ColorScheme = 'light' | 'dark';
|
|
5
5
|
/**
|
|
6
|
-
* The document's current color
|
|
6
|
+
* The document's current color scheme, read once — the JS answer to `@dark`.
|
|
7
7
|
*
|
|
8
8
|
* Outside React (a chart spec built in a module, an editor theme registered at
|
|
9
|
-
* import time). In React use {@link
|
|
9
|
+
* import time). In React use {@link useScheme}, which also re-renders on change.
|
|
10
10
|
* Returns `'light'` with no DOM.
|
|
11
11
|
*/
|
|
12
|
-
declare function
|
|
12
|
+
declare function resolveScheme(): ColorScheme;
|
|
13
13
|
/**
|
|
14
14
|
* Whether the document is showing the high-contrast tier, read once — the JS
|
|
15
15
|
* answer to `@hc`.
|
|
@@ -21,29 +21,29 @@ declare function resolveSchema(): ColorSchema;
|
|
|
21
21
|
*/
|
|
22
22
|
declare function resolveHighContrast(): boolean;
|
|
23
23
|
/**
|
|
24
|
-
* Subscribe to ambient condition changes — either the
|
|
24
|
+
* Subscribe to ambient condition changes — either the scheme or the contrast
|
|
25
25
|
* tier. Returns an unsubscribe function.
|
|
26
26
|
*
|
|
27
|
-
* The listener takes no argument: re-read with {@link
|
|
27
|
+
* The listener takes no argument: re-read with {@link resolveScheme} /
|
|
28
28
|
* {@link resolveHighContrast}, which is what the hooks below do. For non-React
|
|
29
29
|
* consumers that own a surface the stylesheet cannot reach — re-theming a Monaco
|
|
30
30
|
* instance, re-rendering a chart.
|
|
31
31
|
*/
|
|
32
|
-
declare function
|
|
32
|
+
declare function subscribeScheme(listener: () => void): () => void;
|
|
33
33
|
/**
|
|
34
|
-
* The document's color
|
|
34
|
+
* The document's color scheme, kept live — `'light'` or `'dark'`.
|
|
35
35
|
*
|
|
36
36
|
* ```tsx
|
|
37
|
-
* const
|
|
37
|
+
* const scheme = useScheme();
|
|
38
38
|
*
|
|
39
|
-
* <VegaChart spec={useMemo(() => buildSpec(
|
|
39
|
+
* <VegaChart spec={useMemo(() => buildSpec(scheme), [scheme])} />;
|
|
40
40
|
* ```
|
|
41
41
|
*
|
|
42
|
-
* Follows both the `<html data-
|
|
42
|
+
* Follows both the `<html data-scheme>` opt-in and `prefers-color-scheme`,
|
|
43
43
|
* exactly as the `@dark` state does. Under SSR it renders `'light'` and
|
|
44
44
|
* re-renders with the real value after hydration.
|
|
45
45
|
*/
|
|
46
|
-
declare function
|
|
46
|
+
declare function useScheme(): ColorScheme;
|
|
47
47
|
/**
|
|
48
48
|
* Whether the document is showing the high-contrast tier, kept live — the hook
|
|
49
49
|
* form of {@link resolveHighContrast}, following `<html data-contrast>` and
|
|
@@ -54,5 +54,5 @@ declare function useSchema(): ColorSchema;
|
|
|
54
54
|
*/
|
|
55
55
|
declare function useHighContrast(): boolean;
|
|
56
56
|
//#endregion
|
|
57
|
-
export {
|
|
58
|
-
//# sourceMappingURL=
|
|
57
|
+
export { ColorScheme, resolveHighContrast, resolveScheme, subscribeScheme, useHighContrast, useScheme };
|
|
58
|
+
//# sourceMappingURL=useScheme.d.ts.map
|