@cube-dev/ui-kit 0.0.0-canary-fd2e2f2 → 0.0.0-canary-7985452
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/CHANGELOG.md +21 -0
- package/dist/_internal/hooks/use-chained-callback.js +1 -1
- package/dist/_internal/hooks/use-debounced-value.js +1 -1
- package/dist/_internal/hooks/use-deprecation-warning.js +1 -1
- package/dist/_internal/hooks/use-event.js +1 -1
- package/dist/_internal/hooks/use-is-first-render.js +1 -1
- package/dist/_internal/hooks/use-sync-ref.js +1 -1
- package/dist/_internal/hooks/use-timer/timer.js +1 -1
- package/dist/_internal/hooks/use-timer/use-timer.js +1 -1
- package/dist/_internal/hooks/use-warn.js +1 -1
- package/dist/components/Block.js +1 -1
- package/dist/components/CollectionItem.js +1 -1
- package/dist/components/GlobalStyles.js +54 -43
- 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 +9 -4
- 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.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 +3 -3
- package/dist/components/actions/CommandMenu/styled.js.map +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 +5 -5
- 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 +2 -2
- package/dist/components/content/Card/Card.js.map +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 +2 -2
- package/dist/components/content/Disclosure/Disclosure.js.map +1 -1
- package/dist/components/content/Divider.js +1 -1
- package/dist/components/content/Footer.js +1 -1
- package/dist/components/content/Header.js +1 -1
- package/dist/components/content/HotKeys/HotKeys.js +1 -1
- package/dist/components/content/Item/Item.js +2 -2
- package/dist/components/content/Item/Item.js.map +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 +2 -5
- package/dist/components/content/Layout/LayoutHeader.js.map +1 -1
- package/dist/components/content/Layout/LayoutPane.js +2 -2
- package/dist/components/content/Layout/LayoutPane.js.map +1 -1
- package/dist/components/content/Layout/LayoutPanel.js +3 -3
- package/dist/components/content/Layout/LayoutPanel.js.map +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/fields/Checkbox/Checkbox.js +5 -5
- 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/ComboBox/ComboBox.js +2 -2
- package/dist/components/fields/ComboBox/ComboBox.js.map +1 -1
- package/dist/components/fields/DatePicker/DateInput.js +1 -1
- package/dist/components/fields/DatePicker/DateInputBase.js +1 -1
- package/dist/components/fields/DatePicker/DatePicker.js +1 -1
- package/dist/components/fields/DatePicker/DatePickerButton.js +1 -1
- package/dist/components/fields/DatePicker/DatePickerElement.js +1 -1
- package/dist/components/fields/DatePicker/DatePickerInput.js +1 -1
- package/dist/components/fields/DatePicker/DatePickerSegment.js +1 -1
- package/dist/components/fields/DatePicker/DateRangePicker.js +1 -1
- package/dist/components/fields/DatePicker/DateRangeSeparatedPicker.js +1 -1
- package/dist/components/fields/DatePicker/TimeInput.js +1 -1
- package/dist/components/fields/DatePicker/intl.js +1 -1
- package/dist/components/fields/DatePicker/parseDate.js +1 -1
- package/dist/components/fields/DatePicker/props.js +1 -1
- package/dist/components/fields/DatePicker/utils.js +1 -1
- package/dist/components/fields/FileInput/FileInput.js +3 -3
- package/dist/components/fields/FileInput/FileInput.js.map +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/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 +4 -4
- package/dist/components/fields/RadioGroup/Radio.js.map +1 -1
- package/dist/components/fields/RadioGroup/RadioGroup.js +1 -1
- package/dist/components/fields/RadioGroup/context.js +1 -1
- package/dist/components/fields/SearchInput/SearchInput.js +1 -1
- package/dist/components/fields/Select/Select.js +5 -5
- 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 +3 -3
- package/dist/components/fields/Slider/elements.js.map +1 -1
- package/dist/components/fields/Slider/index.js +1 -1
- package/dist/components/fields/Switch/Switch.js +2 -2
- package/dist/components/fields/Switch/Switch.js.map +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 +3 -3
- package/dist/components/fields/TextInput/TextInputBase.js.map +1 -1
- package/dist/components/fields/TextInputMapper/TextInputMapper.js +1 -1
- package/dist/components/form/FieldWrapper/FieldWrapper.js +1 -1
- package/dist/components/form/FieldWrapper/extract-field-wrapper-props.js +1 -1
- package/dist/components/form/Form/Field.js +1 -1
- package/dist/components/form/Form/Form.js +1 -1
- package/dist/components/form/Form/ResetButton/ResetButton.js +1 -1
- package/dist/components/form/Form/SubmitButton/SubmitButton.js +1 -1
- package/dist/components/form/Form/SubmitError.js +1 -1
- package/dist/components/form/Form/index.js +1 -1
- package/dist/components/form/Form/use-field/use-field-props.js +1 -1
- package/dist/components/form/Form/use-field/use-field.js +1 -1
- package/dist/components/form/Form/use-form.js +1 -1
- package/dist/components/form/Form/validation.js +1 -1
- package/dist/components/form/Label.js +1 -1
- package/dist/components/form/wrapper.js +1 -1
- package/dist/components/helpers/DisplayTransition/DisplayTransition.js +1 -1
- package/dist/components/helpers/IconSwitch/IconSwitch.js +1 -1
- package/dist/components/layout/Flex.js +1 -1
- package/dist/components/layout/Flow.js +1 -1
- package/dist/components/layout/Grid.js +1 -1
- package/dist/components/layout/Panel.js +1 -1
- package/dist/components/layout/Prefix.js +1 -1
- package/dist/components/layout/ResizablePanel.js +2 -2
- package/dist/components/layout/ResizablePanel.js.map +1 -1
- package/dist/components/layout/Space.js +1 -1
- package/dist/components/layout/Suffix.js +1 -1
- package/dist/components/navigation/Tabs/DraggableTabList.js +1 -1
- package/dist/components/navigation/Tabs/EditableTitle.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/styled.js +2 -2
- package/dist/components/navigation/Tabs/styled.js.map +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/FileTabs/FileTabs.js +2 -2
- package/dist/components/organisms/FileTabs/FileTabs.js.map +1 -1
- package/dist/components/organisms/StatsCard/StatsCard.js +2 -2
- package/dist/components/organisms/StatsCard/StatsCard.js.map +1 -1
- package/dist/components/other/Calendar/Calendar.js +1 -1
- package/dist/components/other/Calendar/CalendarCell.js +1 -1
- package/dist/components/other/Calendar/CalendarGrid.js +1 -1
- package/dist/components/other/Calendar/RangeCalendar.js +1 -1
- package/dist/components/other/CloudLogo/CloudLogo.js +1 -1
- package/dist/components/overlays/AlertDialog/AlertDialog.js +1 -1
- package/dist/components/overlays/AlertDialog/AlertDialogApiProvider.js +1 -1
- package/dist/components/overlays/AlertDialog/AlertDialogZone.js +1 -1
- package/dist/components/overlays/Dialog/Dialog.js +2 -2
- package/dist/components/overlays/Dialog/Dialog.js.map +1 -1
- package/dist/components/overlays/Dialog/DialogContainer.js +1 -1
- package/dist/components/overlays/Dialog/DialogForm.js +1 -1
- package/dist/components/overlays/Dialog/DialogTrigger.js +1 -1
- package/dist/components/overlays/Dialog/context.js +1 -1
- package/dist/components/overlays/Dialog/use-dialog-container.js +1 -1
- package/dist/components/overlays/Modal/Modal.js +1 -1
- package/dist/components/overlays/Modal/OpenTransitionContext.js +1 -1
- package/dist/components/overlays/Modal/Overlay.js +1 -1
- package/dist/components/overlays/Modal/Popover.js +1 -1
- package/dist/components/overlays/Modal/Tray.js +1 -1
- package/dist/components/overlays/Modal/Underlay.js +1 -1
- package/dist/components/overlays/Notifications/Notification.js +1 -1
- package/dist/components/overlays/Notifications/NotificationAction.js +1 -1
- package/dist/components/overlays/Notifications/NotificationCard.js +1 -1
- package/dist/components/overlays/Notifications/NotificationContext.js +1 -1
- package/dist/components/overlays/Notifications/NotificationItem.js +1 -1
- package/dist/components/overlays/Notifications/OverlayContainer.js +1 -1
- package/dist/components/overlays/Notifications/OverlayProvider.js +1 -1
- package/dist/components/overlays/Notifications/PersistentNotificationsList.js +1 -1
- package/dist/components/overlays/Notifications/dismissed-storage.js +1 -1
- package/dist/components/overlays/Notifications/format-relative-time.js +1 -1
- package/dist/components/overlays/Notifications/index.js +1 -1
- package/dist/components/overlays/Notifications/use-notification-state.js +1 -1
- package/dist/components/overlays/Notifications/use-notifications.js +1 -1
- package/dist/components/overlays/Notifications/use-overlay-timers.js +1 -1
- package/dist/components/overlays/Notifications/use-persistent-notifications.js +1 -1
- package/dist/components/overlays/Notifications/use-persistent-state.js +1 -1
- package/dist/components/overlays/Notifications/use-toast-state.js +1 -1
- package/dist/components/overlays/Toast/ToastItem.js +1 -1
- package/dist/components/overlays/Toast/index.js +1 -1
- package/dist/components/overlays/Toast/useProgressToast.js +1 -1
- package/dist/components/overlays/Toast/useToast.js +1 -1
- package/dist/components/overlays/Tooltip/Tooltip.js +7 -7
- 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.js +1 -1
- 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 +23 -7
- package/dist/components/status/LoadingAnimation/LoadingAnimation.js.map +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 +108 -109
- package/dist/data/item-themes.js.map +1 -1
- package/dist/data/themes.d.ts +17 -17
- package/dist/data/themes.js +18 -18
- package/dist/data/themes.js.map +1 -1
- package/dist/icons/AdjustmentsHorizontalIcon.js +1 -1
- package/dist/icons/AdjustmentsIcon.js +1 -1
- package/dist/icons/AiIcon.js +1 -1
- package/dist/icons/AreaChartIcon.js +1 -1
- package/dist/icons/BackwardIcon.js +1 -1
- package/dist/icons/BarChartIcon.js +1 -1
- package/dist/icons/BellFilledIcon.js +1 -1
- package/dist/icons/BellIcon.js +1 -1
- package/dist/icons/BooleanIcon.js +1 -1
- package/dist/icons/CalendarEditIcon.js +1 -1
- package/dist/icons/CalendarIcon.js +1 -1
- package/dist/icons/CaretDownIcon.js +1 -1
- package/dist/icons/CaretUpIcon.js +1 -1
- package/dist/icons/ChartAreaStackedIcon.js +1 -1
- package/dist/icons/ChartAreaStackedPercentageIcon.js +1 -1
- package/dist/icons/ChartBarGroupedHorizontalIcon.js +1 -1
- package/dist/icons/ChartBarGroupedIcon.js +1 -1
- package/dist/icons/ChartBarHorizontalIcon.js +1 -1
- package/dist/icons/ChartBarLineIcon.js +1 -1
- package/dist/icons/ChartBarStackedHorizontalIcon.js +1 -1
- package/dist/icons/ChartBarStackedIcon.js +1 -1
- package/dist/icons/ChartBarStackedPercentageHorizontalIcon.js +1 -1
- package/dist/icons/ChartBarStackedPercentageIcon.js +1 -1
- package/dist/icons/ChartBoxPlot2Icon.js +1 -1
- package/dist/icons/ChartBoxPlotIcon.js +1 -1
- package/dist/icons/ChartBubbleIcon.js +1 -1
- package/dist/icons/ChartDonut2Icon.js +1 -1
- package/dist/icons/ChartFunnelIcon.js +1 -1
- package/dist/icons/ChartHeatmapIcon.js +1 -1
- package/dist/icons/ChartKPIIcon.js +1 -1
- package/dist/icons/ChartPie2Icon.js +1 -1
- package/dist/icons/ChartScatterIcon.js +1 -1
- package/dist/icons/CheckCircleFilledIcon.js +1 -1
- package/dist/icons/CheckCircleIcon.js +1 -1
- package/dist/icons/CheckIcon.js +1 -1
- package/dist/icons/CircleFilledIcon.js +1 -1
- package/dist/icons/ClearIcon.js +1 -1
- package/dist/icons/CloseCircleFilledIcon.js +1 -1
- package/dist/icons/CloseCircleIcon.js +1 -1
- package/dist/icons/CloseIcon.js +1 -1
- package/dist/icons/CodeIcon.js +1 -1
- package/dist/icons/ColumnTotalIcon.js +1 -1
- package/dist/icons/CopyIcon.js +1 -1
- package/dist/icons/CountIcon.js +1 -1
- package/dist/icons/CubeIcon.js +1 -1
- package/dist/icons/CubePauseIcon.js +1 -1
- package/dist/icons/CubePlayIcon.js +1 -1
- package/dist/icons/CurrencyDollarIcon.js +1 -1
- package/dist/icons/DangerIcon.js +1 -1
- package/dist/icons/DashboardIcon.js +1 -1
- package/dist/icons/DatabaseIcon.js +1 -1
- package/dist/icons/DecimalDecreaseIcon.js +1 -1
- package/dist/icons/DecimalIncreaseIcon.js +1 -1
- package/dist/icons/DirectionIcon.js +1 -1
- package/dist/icons/DonutIcon.js +1 -1
- package/dist/icons/DownIcon.js +1 -1
- package/dist/icons/EditIcon.js +1 -1
- package/dist/icons/ExclamationCircleFilledIcon.js +1 -1
- package/dist/icons/ExclamationCircleIcon.js +1 -1
- package/dist/icons/ExclamationIcon.js +1 -1
- package/dist/icons/EyeIcon.js +1 -1
- package/dist/icons/EyeInvisibleIcon.js +1 -1
- package/dist/icons/FilterIcon.js +1 -1
- package/dist/icons/FolderFilledIcon.js +1 -1
- package/dist/icons/FolderIcon.js +1 -1
- package/dist/icons/FolderOpenFilledIcon.js +1 -1
- package/dist/icons/FolderOpenIcon.js +1 -1
- package/dist/icons/ForwardIcon.js +1 -1
- package/dist/icons/GripVerticalIcon.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/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.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/base.js +1 -1
- package/dist/tokens/colors.d.ts +4 -3
- package/dist/tokens/colors.js +91 -83
- package/dist/tokens/colors.js.map +1 -1
- package/dist/tokens/index.js +1 -1
- package/dist/tokens/layout.js +1 -1
- package/dist/tokens/palette.js +351 -0
- package/dist/tokens/palette.js.map +1 -0
- package/dist/tokens/shadows.d.ts +4 -1
- package/dist/tokens/shadows.js +9 -6
- 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/is-dev-env.js +1 -1
- package/dist/utils/modules.js +1 -1
- package/dist/utils/promise.js +1 -1
- package/dist/utils/raf.js +1 -1
- package/dist/utils/random.js +1 -1
- package/dist/utils/range.js +1 -1
- package/dist/utils/react/RenderCache.js +1 -1
- package/dist/utils/react/Slots.js +1 -1
- package/dist/utils/react/chain.js +1 -1
- package/dist/utils/react/forwardRefWithGenerics.js +1 -1
- package/dist/utils/react/index.js +1 -1
- package/dist/utils/react/interactions.js +1 -1
- package/dist/utils/react/isTextOnly.js +1 -1
- package/dist/utils/react/mapProps.js +1 -1
- package/dist/utils/react/mergeProps.js +1 -1
- package/dist/utils/react/nullableValue.js +1 -1
- package/dist/utils/react/resolveIcon.js +1 -1
- package/dist/utils/react/sharedStore.js +1 -1
- package/dist/utils/react/useCombinedRefs.js +1 -1
- package/dist/utils/react/useControlledFocusVisible.js +1 -1
- package/dist/utils/react/useEventBus.js +1 -1
- package/dist/utils/react/useId.js +1 -1
- package/dist/utils/react/useIsDarwin.js +1 -1
- package/dist/utils/react/useKeySymbols.js +1 -1
- package/dist/utils/react/useLayoutEffect.js +1 -1
- package/dist/utils/react/useLocalStorage.js +1 -1
- package/dist/utils/react/useMergeStyles.js +1 -1
- package/dist/utils/react/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.d.ts +3 -0
- package/dist/version.js +13 -5
- package/dist/version.js.map +1 -1
- package/docs/Usage.md +97 -29
- package/docs/components/content/Card.md +1 -1
- package/docs/components/content/PrismCode.md +21 -0
- package/docs/components/form/Field.md +1 -1
- package/docs/components/layout/ResizablePanel.md +1 -1
- package/docs/components/organisms/FileTabs.md +1 -1
- package/docs/components/organisms/StatsCard.md +1 -1
- package/docs/tasty/configuration.md +44 -0
- package/docs/tasty/dsl.md +14 -13
- package/docs/tasty/methodology.md +26 -0
- package/docs/tasty/react-api.md +24 -0
- package/docs/tasty/ssr.md +5 -3
- package/docs/tasty/styles.md +9 -7
- package/docs/tasty/tasty-static.md +15 -0
- package/package.json +10 -8
package/dist/tokens/shadows.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | Cube Dev Team */
|
|
2
2
|
//#region src/tokens/shadows.ts
|
|
3
3
|
/**
|
|
4
4
|
* Shadow tokens using tasty shorthand syntax.
|
|
@@ -6,15 +6,18 @@
|
|
|
6
6
|
* Format: `<offset-y> <blur> <spread?> <color>`
|
|
7
7
|
* - `1bw` = 1 × border-width
|
|
8
8
|
* - `.5x` = 0.5 × gap
|
|
9
|
-
*
|
|
9
|
+
*
|
|
10
|
+
* The shadow colors (`#shadow-sm` / `#shadow-md` / `#shadow-lg`) are
|
|
11
|
+
* generated by Glaze and adapt automatically to dark / high-contrast
|
|
12
|
+
* schemes — see `src/tokens/palette.ts`.
|
|
10
13
|
*
|
|
11
14
|
* Keys use $ prefix for CSS custom properties.
|
|
12
15
|
*/
|
|
13
16
|
const SHADOW_TOKENS = {
|
|
14
|
-
"$item-shadow": "0 1bw .375x #
|
|
15
|
-
"$card-shadow": "0 .5x 2x #shadow",
|
|
16
|
-
$shadow: "0 .5x 2x #shadow",
|
|
17
|
-
"$dialog-shadow": "0 1x 4x #
|
|
17
|
+
"$item-shadow": "0 1bw .375x #shadow-sm",
|
|
18
|
+
"$card-shadow": "0 .5x 2x #shadow-md",
|
|
19
|
+
$shadow: "0 .5x 2x #shadow-md",
|
|
20
|
+
"$dialog-shadow": "0 1x 4x #shadow-lg"
|
|
18
21
|
};
|
|
19
22
|
|
|
20
23
|
//#endregion
|
|
@@ -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 * - `#
|
|
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/is-dev-env.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | Cube Dev Team */
|
|
2
2
|
//#region src/utils/is-dev-env.ts
|
|
3
3
|
function isDevEnv() {
|
|
4
4
|
if (typeof window !== "undefined" && window.localStorage) try {
|
package/dist/utils/modules.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | Cube Dev Team */
|
|
2
2
|
//#region src/utils/modules.ts
|
|
3
3
|
function extractModule(promise) {
|
|
4
4
|
return promise.then((module) => module.default || module);
|
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.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | 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";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | Cube Dev Team */
|
|
2
2
|
//#region src/utils/react/chain.ts
|
|
3
3
|
/**
|
|
4
4
|
* Calls all functions in the order they were chained with the same arguments.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | Cube Dev Team */
|
|
2
2
|
//#region src/utils/react/forwardRefWithGenerics.tsx
|
|
3
3
|
/**
|
|
4
4
|
* A helper for creating forwardRef components with generic types.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | Cube Dev Team */
|
|
2
2
|
import { chain } from "./chain.js";
|
|
3
3
|
import { forwardRefWithGenerics } from "./forwardRefWithGenerics.js";
|
|
4
4
|
import { isTextOnly } from "./isTextOnly.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | Cube Dev Team */
|
|
2
2
|
//#region src/utils/react/mapProps.ts
|
|
3
3
|
/** Converts AriaButtonProps to CubeButtonProps */
|
|
4
4
|
function ariaToCubeButtonProps(props) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | Cube Dev Team */
|
|
2
2
|
import { chain } from "./chain.js";
|
|
3
3
|
import { mergeIds } from "./useId.js";
|
|
4
4
|
import { mergeStyles } from "@tenphi/tasty";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | 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.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | Cube Dev Team */
|
|
2
2
|
import { createSharedStore } from "./sharedStore.js";
|
|
3
3
|
import { useEffect } from "react";
|
|
4
4
|
import { useFocusVisible } from "react-aria";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | Cube Dev Team */
|
|
2
2
|
import React, { createContext, useCallback, useContext, useEffect, 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.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | 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,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | Cube Dev Team */
|
|
2
2
|
import { useEvent } from "../../_internal/hooks/use-event.js";
|
|
3
3
|
import { useCallback, useSyncExternalStore } from "react";
|
|
4
4
|
|
package/dist/utils/selection.js
CHANGED
package/dist/utils/styles.js
CHANGED
package/dist/utils/tree.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | Cube Dev Team */
|
|
2
2
|
//#region src/utils/tree.ts
|
|
3
3
|
function toFlatTree(tree, includingFolders) {
|
|
4
4
|
return tree.reduce((result, node) => {
|
package/dist/utils/warnings.js
CHANGED
package/dist/version.d.ts
CHANGED
|
@@ -4,9 +4,12 @@ declare global {
|
|
|
4
4
|
interface Window {
|
|
5
5
|
CubeUIKit: {
|
|
6
6
|
version: string;
|
|
7
|
+
tastyVersion: string;
|
|
7
8
|
};
|
|
8
9
|
}
|
|
9
10
|
/** Replaced at build time by tsdown `define` */
|
|
10
11
|
const __UIKIT_VERSION__: string;
|
|
12
|
+
/** Replaced at build time by tsdown `define` */
|
|
13
|
+
const __TASTY_VERSION__: string;
|
|
11
14
|
}
|
|
12
15
|
//# sourceMappingURL=version.d.ts.map
|
package/dist/version.js
CHANGED
|
@@ -1,13 +1,21 @@
|
|
|
1
|
-
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-
|
|
1
|
+
/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7985452 | Cube Dev Team */
|
|
2
2
|
//#region src/version.ts
|
|
3
|
-
const VERSION = "0.0.0-canary-
|
|
3
|
+
const VERSION = "0.0.0-canary-7985452";
|
|
4
|
+
const TASTY_VERSION = "2.6.0";
|
|
4
5
|
if (typeof window !== "undefined") {
|
|
5
6
|
const version = VERSION;
|
|
6
|
-
|
|
7
|
+
const tastyVersion = TASTY_VERSION;
|
|
8
|
+
window.CubeUIKit = window.CubeUIKit || {
|
|
9
|
+
version,
|
|
10
|
+
tastyVersion
|
|
11
|
+
};
|
|
7
12
|
if (window.CubeUIKit.version && window.CubeUIKit.version !== version) console.error("More than one version of CubeUIKit is loaded", { loadedVersions: [window.CubeUIKit.version, version] });
|
|
8
|
-
else
|
|
13
|
+
else {
|
|
14
|
+
window.CubeUIKit.version = version;
|
|
15
|
+
window.CubeUIKit.tastyVersion = tastyVersion;
|
|
16
|
+
}
|
|
9
17
|
}
|
|
10
18
|
|
|
11
19
|
//#endregion
|
|
12
|
-
export { VERSION };
|
|
20
|
+
export { TASTY_VERSION, VERSION };
|
|
13
21
|
//# sourceMappingURL=version.js.map
|
package/dist/version.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.js","names":[],"sources":["../src/version.ts"],"sourcesContent":["declare global {\n interface Window {\n CubeUIKit: {\n version: string;\n };\n }\n\n /** Replaced at build time by tsdown `define` */\n const __UIKIT_VERSION__: string;\n}\n\n// eslint-disable-next-line no-undef -- replaced at build time by tsdown `define`\nexport const VERSION: string = __UIKIT_VERSION__;\n\nif (typeof window !== 'undefined') {\n const version = VERSION;\n\n // Ensure CubeUIKit is defined on window in a way bundlers recognize\n window.CubeUIKit = window.CubeUIKit || { version };\n\n // Check for multiple versions\n if (window.CubeUIKit.version && window.CubeUIKit.version !== version) {\n console.error('More than one version of CubeUIKit is loaded', {\n loadedVersions: [window.CubeUIKit.version, version],\n });\n } else {\n
|
|
1
|
+
{"version":3,"file":"version.js","names":[],"sources":["../src/version.ts"],"sourcesContent":["declare global {\n interface Window {\n CubeUIKit: {\n version: string;\n tastyVersion: string;\n };\n }\n\n /** Replaced at build time by tsdown `define` */\n const __UIKIT_VERSION__: string;\n /** Replaced at build time by tsdown `define` */\n const __TASTY_VERSION__: string;\n}\n\n// eslint-disable-next-line no-undef -- replaced at build time by tsdown `define`\nexport const VERSION: string = __UIKIT_VERSION__;\n// eslint-disable-next-line no-undef -- replaced at build time by tsdown `define`\nexport const TASTY_VERSION: string = __TASTY_VERSION__;\n\nif (typeof window !== 'undefined') {\n const version = VERSION;\n const tastyVersion = TASTY_VERSION;\n\n // Ensure CubeUIKit is defined on window in a way bundlers recognize\n window.CubeUIKit = window.CubeUIKit || { version, tastyVersion };\n\n // Check for multiple versions\n if (window.CubeUIKit.version && window.CubeUIKit.version !== version) {\n console.error('More than one version of CubeUIKit is loaded', {\n loadedVersions: [window.CubeUIKit.version, version],\n });\n } else {\n window.CubeUIKit.version = version;\n window.CubeUIKit.tastyVersion = tastyVersion;\n }\n}\n"],"mappings":";;AAeA,MAAa;AAEb,MAAa;AAEb,IAAI,OAAO,WAAW,aAAa;CACjC,MAAM,UAAU;CAChB,MAAM,eAAe;AAGrB,QAAO,YAAY,OAAO,aAAa;EAAE;EAAS;EAAc;AAGhE,KAAI,OAAO,UAAU,WAAW,OAAO,UAAU,YAAY,QAC3D,SAAQ,MAAM,gDAAgD,EAC5D,gBAAgB,CAAC,OAAO,UAAU,SAAS,QAAQ,EACpD,CAAC;MACG;AACL,SAAO,UAAU,UAAU;AAC3B,SAAO,UAAU,eAAe"}
|
package/docs/Usage.md
CHANGED
|
@@ -69,13 +69,14 @@ Defined in `src/tokens/sizes.ts`. Used for component heights and icon sizes.
|
|
|
69
69
|
|
|
70
70
|
## Shadow Tokens
|
|
71
71
|
|
|
72
|
-
Defined in `src/tokens/shadows.ts`.
|
|
72
|
+
Defined in `src/tokens/shadows.ts`. Shadow colors (`#shadow-sm`, `#shadow-md`, `#shadow-lg`) are generated by Glaze and adapt automatically to dark / high-contrast schemes.
|
|
73
73
|
|
|
74
74
|
| Token | Value |
|
|
75
75
|
|-------|-------|
|
|
76
|
-
| `$item-shadow` | `0 1bw 0.375x #
|
|
77
|
-
| `$card-shadow` | `0 0.5x 2x #shadow` |
|
|
78
|
-
| `$
|
|
76
|
+
| `$item-shadow` | `0 1bw 0.375x #shadow-sm` |
|
|
77
|
+
| `$card-shadow` | `0 0.5x 2x #shadow-md` |
|
|
78
|
+
| `$shadow` | `0 0.5x 2x #shadow-md` |
|
|
79
|
+
| `$dialog-shadow` | `0 1x 4x #shadow-lg` |
|
|
79
80
|
|
|
80
81
|
## Layout Tokens
|
|
81
82
|
|
|
@@ -89,43 +90,110 @@ Defined in `src/tokens/layout.ts`.
|
|
|
89
90
|
|
|
90
91
|
## Color Tokens
|
|
91
92
|
|
|
92
|
-
All color tokens use `#name` syntax in styles. Opacity variants use `#name.NN` (e.g. `#
|
|
93
|
+
All color tokens use `#name` syntax in styles. Opacity variants use `#name.NN` (e.g. `#surface-text.06` for 6% opacity).
|
|
93
94
|
|
|
94
|
-
|
|
95
|
+
The palette is generated by [`@tenphi/glaze`](https://github.com/tenphi/glaze) (see `src/tokens/palette.ts`). Every color token is emitted as a state map with `light`, `@dark`, and `@hc` (high-contrast) variants, so the entire UI Kit adapts to dark / high-contrast schemes automatically.
|
|
95
96
|
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
97
|
+
### Color Schemes
|
|
98
|
+
|
|
99
|
+
The `@dark` and `@hc` predefined states are wired up in `src/components/Root.tsx` to support both an attribute opt-in and the user's system preference:
|
|
100
|
+
|
|
101
|
+
```html
|
|
102
|
+
<!-- Force dark scheme -->
|
|
103
|
+
<html data-schema="dark">
|
|
104
|
+
|
|
105
|
+
<!-- Force high-contrast scheme -->
|
|
106
|
+
<html data-contrast="high">
|
|
107
|
+
|
|
108
|
+
<!-- Both can be combined -->
|
|
109
|
+
<html data-schema="dark" data-contrast="high">
|
|
110
|
+
```
|
|
111
|
+
|
|
112
|
+
When the attribute is absent, the scheme falls back to `@media (prefers-color-scheme: dark)` and `@media (prefers-contrast: more)`.
|
|
113
|
+
|
|
114
|
+
### Surface & Text Vocabulary
|
|
115
|
+
|
|
116
|
+
The neutral palette uses a `surface` / `surface-text` model. Each surface depth has its own AAA text color, plus a soft (AA) variant for secondary copy:
|
|
117
|
+
|
|
118
|
+
| Token | Role |
|
|
119
|
+
|-------|------|
|
|
120
|
+
| `#surface` | Primary background |
|
|
121
|
+
| `#surface-2` | Slightly recessed background (cards, inputs) |
|
|
122
|
+
| `#surface-3` | Deepest background (panels, code blocks) |
|
|
123
|
+
| `#surface-text` | AAA text on `#surface` |
|
|
124
|
+
| `#surface-text-soft` | AA text on `#surface` (secondary copy, body text) |
|
|
125
|
+
| `#surface-text-soft-2` | AA-large text on `#surface` (placeholders, captions) |
|
|
126
|
+
| `#surface-2-text`, `#surface-2-text-soft` | Same scale, anchored to `#surface-2` |
|
|
127
|
+
| `#surface-3-text`, `#surface-3-text-soft` | Same scale, anchored to `#surface-3` |
|
|
128
|
+
|
|
129
|
+
### Other Neutral Tokens
|
|
130
|
+
|
|
131
|
+
| Token | Role |
|
|
132
|
+
|-------|------|
|
|
100
133
|
| `#border` | Default border color |
|
|
101
134
|
| `#placeholder` | Input placeholder text |
|
|
102
|
-
| `#shadow` | Shadow color |
|
|
103
|
-
| `#minor` | Secondary/muted text |
|
|
104
135
|
| `#focus` | Focus ring color |
|
|
105
|
-
| `#
|
|
106
|
-
| `#
|
|
107
|
-
|
|
108
|
-
|
|
136
|
+
| `#disabled` | Disabled state fill / text |
|
|
137
|
+
| `#pink` | Accent pink (independent hue) |
|
|
138
|
+
| `#shadow-sm` / `#shadow-md` / `#shadow-lg` | Tinted shadow colors (used by `$*-shadow` tokens) |
|
|
139
|
+
| `#overlay` | Dim backdrop (50% transparent) |
|
|
140
|
+
| `#clear` | `transparent` |
|
|
109
141
|
|
|
110
|
-
|
|
142
|
+
### Accent System
|
|
111
143
|
|
|
112
|
-
|
|
113
|
-
|-------|-----|---------|
|
|
114
|
-
| `#primary` / `#purple` | 280.3° | Primary actions, brand color |
|
|
115
|
-
| `#danger` | 23.1° | Errors, destructive actions |
|
|
116
|
-
| `#success` | 156.9° | Success states, confirmations |
|
|
117
|
-
| `#warning` | 84.3° | Warning states, caution |
|
|
118
|
-
| `#note` | 302.3° | Informational notes |
|
|
144
|
+
Each themed color (default, primary, success, danger, warning, note) provides an `accent-*` family anchored to a fixed white "accent surface text". These tokens stay recognizable across schemes (used for branded buttons, CTAs, etc.):
|
|
119
145
|
|
|
120
|
-
|
|
146
|
+
| Token (default theme; prefixed in others) | Role |
|
|
147
|
+
|-------|------|
|
|
148
|
+
| `#accent-surface` | Saturated brand fill (button bg) |
|
|
149
|
+
| `#accent-surface-2`, `#accent-surface-3` | Darker / more saturated variants |
|
|
150
|
+
| `#accent-surface-text` | Near-white text on accent fill |
|
|
151
|
+
| `#accent-text` | Saturated colored text (used on neutral surface) |
|
|
152
|
+
| `#accent-icon` | Saturated colored icon |
|
|
121
153
|
|
|
122
|
-
|
|
154
|
+
In the `default` theme these tokens are unprefixed (`#accent-surface`). In colored themes they are prefixed (`#success-accent-surface`, `#danger-accent-text`, …).
|
|
123
155
|
|
|
124
|
-
|
|
156
|
+
### Themed Surfaces
|
|
125
157
|
|
|
126
|
-
|
|
158
|
+
Each colored theme (`primary`, `purple`, `success`, `danger`, `warning`, `note`) also provides its own tinted `<theme>-surface` (banner / chip background) and `<theme>-surface-text` (banner text):
|
|
127
159
|
|
|
128
|
-
|
|
160
|
+
| Group | Hue | Purpose |
|
|
161
|
+
|-------|-----|---------|
|
|
162
|
+
| `#primary-*` / `#purple-*` | 280.3° | Primary actions, brand color |
|
|
163
|
+
| `#success-*` | 156.9° | Success states, confirmations |
|
|
164
|
+
| `#danger-*` | 23.1° | Errors, destructive actions |
|
|
165
|
+
| `#warning-*` | 84.3° | Warning states, caution |
|
|
166
|
+
| `#note-*` | 302.3° | Informational notes |
|
|
167
|
+
|
|
168
|
+
For example, a success banner uses `fill: '#success-surface'` + `color: '#success-surface-text'`, while a primary button uses `fill: '#primary-accent-surface'` + `color: '#primary-accent-surface-text'`.
|
|
169
|
+
|
|
170
|
+
### Legacy Aliases
|
|
171
|
+
|
|
172
|
+
The previous token names continue to work as aliases (defined at the bottom of `src/tokens/colors.ts`). New code should prefer the Glaze tokens, but existing components do not need to be migrated:
|
|
173
|
+
|
|
174
|
+
| Legacy | Resolves to |
|
|
175
|
+
|-------|------------|
|
|
176
|
+
| `#text` | `#surface-text-soft` |
|
|
177
|
+
| `#dark` / `#dark-01` | `#surface-text` |
|
|
178
|
+
| `#dark-02` | `#surface-text-soft` |
|
|
179
|
+
| `#dark-03` | `#surface-text-soft-2` |
|
|
180
|
+
| `#dark-04` | `#placeholder` |
|
|
181
|
+
| `#dark-05` | `#border` |
|
|
182
|
+
| `#minor` | `#surface-text-soft.65` |
|
|
183
|
+
| `#shadow` | `#shadow-md` |
|
|
184
|
+
| `#light` | `#surface-3` |
|
|
185
|
+
| `#dark-bg` | `#surface-2` |
|
|
186
|
+
| `#primary` / `#purple` | `#primary-accent-surface` |
|
|
187
|
+
| `#primary-text` / `#purple-text` | `#primary-accent-text` |
|
|
188
|
+
| `#primary-bg` / `#purple-bg` | `#primary-surface` |
|
|
189
|
+
| `#primary-icon` / `#purple-icon` | `#primary-accent-icon` |
|
|
190
|
+
| `#<status>` | `#<status>-accent-surface` |
|
|
191
|
+
| `#<status>-text` | `#<status>-accent-text` |
|
|
192
|
+
| `#<status>-bg` | `#<status>-surface` |
|
|
193
|
+
| `#<status>-icon` | `#<status>-accent-icon` |
|
|
194
|
+
| `#<status>-disabled` | `#disabled` |
|
|
195
|
+
|
|
196
|
+
`#white`, `#black`, and `#clear` are not defined in the palette — `#white` and `#black` are tasty's built-in named colors, and `#clear` is an alias for `transparent`.
|
|
129
197
|
|
|
130
198
|
## Typography Presets
|
|
131
199
|
|
|
@@ -24,6 +24,27 @@ Syntax-highlighted code block using Prism. Supports multiple languages.
|
|
|
24
24
|
|
|
25
25
|
Supports [Base properties](../../BaseProperties.md).
|
|
26
26
|
|
|
27
|
+
## Theme
|
|
28
|
+
|
|
29
|
+
Syntax colors are driven by a dedicated, scheme-aware palette of `code-*`
|
|
30
|
+
tokens. Each token uses a different hue so token classes stay visually
|
|
31
|
+
separable, and every token meets at least **WCAG AA (4.5:1)** contrast
|
|
32
|
+
against `#surface` in light, dark, and high-contrast schemes (AAA in HC).
|
|
33
|
+
|
|
34
|
+
| Token | Hue | Used for |
|
|
35
|
+
| -------------------- | -------------- | -------------------------------------------------------------- |
|
|
36
|
+
| `#code-comment` | gray | comments, prolog, doctype, cdata |
|
|
37
|
+
| `#code-punctuation` | muted pink | operators, punctuation |
|
|
38
|
+
| `#code-keyword` | pink | keywords, booleans, constants, atrules (`font-weight: 500`) |
|
|
39
|
+
| `#code-string` | primary purple | strings, characters, attribute values, URLs |
|
|
40
|
+
| `#code-number` | green | numbers, numeric entities |
|
|
41
|
+
| `#code-function` | pink | functions, class names, regex, variables |
|
|
42
|
+
| `#code-attribute` | cyan | tags, attribute names, properties, selectors, built-ins, keys |
|
|
43
|
+
|
|
44
|
+
Diff insertion (`+`) and deletion (`-`) intentionally re-use the existing
|
|
45
|
+
`#success-*` / `#danger-*` ramps — both the line background tint and the
|
|
46
|
+
foreground color adapt to the active scheme.
|
|
47
|
+
|
|
27
48
|
## Examples
|
|
28
49
|
|
|
29
50
|
```jsx
|
|
@@ -50,7 +50,7 @@ These properties allow direct style application without using the `styles` prop:
|
|
|
50
50
|
### Resizable sidebar
|
|
51
51
|
|
|
52
52
|
```jsx
|
|
53
|
-
<Panel isFlex isStretched height="min 30x" fill="#
|
|
53
|
+
<Panel isFlex isStretched height="min 30x" fill="#surface">
|
|
54
54
|
<ResizablePanel direction="right">
|
|
55
55
|
<Block padding="1x">Sidebar content</Block>
|
|
56
56
|
</ResizablePanel>
|
|
@@ -21,7 +21,7 @@ A tab bar for file-like items with close buttons and dirty state indicators. Des
|
|
|
21
21
|
|
|
22
22
|
- Tab `radius` — `1r 1r 0 0`
|
|
23
23
|
- Tab `padding` — `1x 1.5x`
|
|
24
|
-
- Tab `fill` — `#dark.04` (active tabs use `#
|
|
24
|
+
- Tab `fill` — `#dark.04` (active tabs use `#surface`)
|
|
25
25
|
- Tab gap — `.5x`
|
|
26
26
|
|
|
27
27
|
### Base Properties
|
|
@@ -22,7 +22,7 @@ Extends Card with:
|
|
|
22
22
|
- `placeContent` — `space-between`
|
|
23
23
|
- `gap` — `1x`
|
|
24
24
|
- `border` — none
|
|
25
|
-
- `shadow` — `
|
|
25
|
+
- `shadow` — `$shadow` (design-system elevation token, scheme-aware via `#shadow-md`)
|
|
26
26
|
- `padding` — `2.5x`
|
|
27
27
|
|
|
28
28
|
### Base Properties
|