@sanity/ui 3.0.0-static.33 → 3.0.0-static.35
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/_chunks-cjs/_visual-editing.cjs +263 -375
- package/dist/_chunks-cjs/_visual-editing.cjs.map +1 -1
- package/dist/_chunks-cjs/refractor.cjs.map +1 -1
- package/dist/_chunks-es/_visual-editing.js +263 -377
- package/dist/_chunks-es/_visual-editing.js.map +1 -1
- package/dist/_chunks-es/refractor.js.map +1 -1
- package/dist/_visual-editing.cjs +0 -2
- package/dist/_visual-editing.cjs.map +1 -1
- package/dist/_visual-editing.d.cts +34 -85
- package/dist/_visual-editing.d.ts +34 -85
- package/dist/_visual-editing.js +2 -4
- package/dist/css/index.cjs +12 -12
- package/dist/css/index.cjs.map +1 -1
- package/dist/css/index.css +1 -1
- package/dist/css/index.d.cts +383 -13934
- package/dist/css/index.d.ts +383 -13934
- package/dist/css/index.js +12 -12
- package/dist/css/index.js.map +1 -1
- package/dist/index.cjs +241 -366
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +107 -817
- package/dist/index.d.ts +107 -817
- package/dist/index.js +243 -360
- package/dist/index.js.map +1 -1
- package/dist/theme.cjs +367 -4288
- package/dist/theme.cjs.map +1 -1
- package/dist/theme.d.cts +180 -1582
- package/dist/theme.d.ts +180 -1582
- package/dist/theme.js +371 -4292
- package/dist/theme.js.map +1 -1
- package/exports/_visual-editing.ts +0 -2
- package/package.json +3 -4
- package/src/core/Root.tsx +4 -2
- package/src/core/RootProvider.tsx +4 -4
- package/src/core/__workshop__/boundary.tsx +1 -1
- package/src/core/__workshop__/index.ts +5 -3
- package/src/core/components/autocomplete/__workshop__/async.tsx +1 -1
- package/src/core/components/autocomplete/__workshop__/constrainedHeight.tsx +2 -2
- package/src/core/components/autocomplete/__workshop__/custom.tsx +2 -2
- package/src/core/components/autocomplete/__workshop__/example.tsx +2 -2
- package/src/core/components/autocomplete/__workshop__/focusAndBlur.tsx +1 -1
- package/src/core/components/autocomplete/__workshop__/fullscreen.tsx +1 -1
- package/src/core/components/autocomplete/__workshop__/index.ts +5 -3
- package/src/core/components/autocomplete/__workshop__/mock/apiStore.ts +1 -1
- package/src/core/components/autocomplete/__workshop__/mock/countries.ts +1 -1
- package/src/core/components/autocomplete/autocomplete.tsx +2 -2
- package/src/core/components/autocomplete/autocompleteOption.tsx +2 -2
- package/src/core/components/autocomplete/constants.ts +2 -2
- package/src/core/components/breadcrumbs/__workshop__/example.tsx +1 -1
- package/src/core/components/breadcrumbs/__workshop__/index.ts +5 -3
- package/src/core/components/breadcrumbs/breadcrumbs.tsx +6 -11
- package/src/core/components/dialog/__workshop__/activate.tsx +1 -1
- package/src/core/components/dialog/__workshop__/autoFocus.tsx +1 -1
- package/src/core/components/dialog/__workshop__/index.ts +5 -3
- package/src/core/components/dialog/__workshop__/layering.tsx +1 -1
- package/src/core/components/dialog/__workshop__/nested.tsx +2 -3
- package/src/core/components/dialog/__workshop__/onScroll.tsx +1 -1
- package/src/core/components/dialog/__workshop__/panes.tsx +1 -1
- package/src/core/components/dialog/__workshop__/position.tsx +1 -1
- package/src/core/components/dialog/__workshop__/props.tsx +1 -1
- package/src/core/components/dialog/__workshop__/provider.tsx +1 -1
- package/src/core/components/dialog/__workshop__/wrapped.tsx +1 -1
- package/src/core/components/dialog/dialog.tsx +5 -6
- package/src/core/components/dialog/dialogCard.tsx +2 -2
- package/src/core/components/dialog/dialogContext.ts +3 -4
- package/src/core/components/dialog/dialogProvider.tsx +2 -2
- package/src/core/components/hotkeys/__workshop__/index.ts +5 -3
- package/src/core/components/hotkeys/__workshop__/plain.tsx +1 -1
- package/src/core/components/hotkeys/hotkeys.tsx +4 -15
- package/src/core/components/menu/__workshop__/asComponent.tsx +1 -1
- package/src/core/components/menu/__workshop__/avatarMenu.tsx +1 -1
- package/src/core/components/menu/__workshop__/closableMenuButton.tsx +1 -1
- package/src/core/components/menu/__workshop__/constrainedInBoundary.tsx +3 -3
- package/src/core/components/menu/__workshop__/customMenuItem.tsx +1 -1
- package/src/core/components/menu/__workshop__/customSelectedState.tsx +1 -1
- package/src/core/components/menu/__workshop__/disableFocusOnClose.tsx +1 -1
- package/src/core/components/menu/__workshop__/groups.tsx +1 -1
- package/src/core/components/menu/__workshop__/index.ts +5 -3
- package/src/core/components/menu/__workshop__/menuButton.tsx +2 -2
- package/src/core/components/menu/__workshop__/menuGroupRight.tsx +1 -1
- package/src/core/components/menu/__workshop__/nestedMenu.tsx +1 -1
- package/src/core/components/menu/__workshop__/onCloseMenuButton.tsx +1 -1
- package/src/core/components/menu/__workshop__/selectedItem.tsx +1 -1
- package/src/core/components/menu/__workshop__/shouldFocus.tsx +1 -1
- package/src/core/components/menu/__workshop__/tones.tsx +3 -3
- package/src/core/components/menu/__workshop__/withoutArrow.tsx +1 -1
- package/src/core/components/menu/menu.test.tsx +2 -1
- package/src/core/components/menu/menu.tsx +7 -22
- package/src/core/components/menu/menuButton.tsx +4 -50
- package/src/core/components/menu/menuContext.ts +3 -15
- package/src/core/components/menu/menuDivider.tsx +2 -2
- package/src/core/components/menu/menuGroup.tsx +10 -15
- package/src/core/components/menu/menuItem.tsx +7 -18
- package/src/core/components/tab/__workshop__/example.tsx +1 -1
- package/src/core/components/tab/__workshop__/index.ts +5 -3
- package/src/core/components/tab/tab.tsx +6 -4
- package/src/core/components/tab/tabList.tsx +3 -8
- package/src/core/components/tab/tabPanel.tsx +2 -2
- package/src/core/components/toast/__workshop__/hook.tsx +1 -1
- package/src/core/components/toast/__workshop__/index.ts +5 -3
- package/src/core/components/toast/__workshop__/toast.tsx +1 -1
- package/src/core/components/toast/toast.test.tsx +2 -1
- package/src/core/components/toast/toast.tsx +2 -2
- package/src/core/components/toast/toastContext.ts +4 -4
- package/src/core/components/toast/toastLayer.tsx +3 -3
- package/src/core/components/tree/__workshop__/basic.perf.ts +1 -1
- package/src/core/components/tree/__workshop__/basic.tsx +1 -1
- package/src/core/components/tree/__workshop__/index.ts +5 -3
- package/src/core/components/tree/__workshop__/tabFromElement.tsx +1 -1
- package/src/core/components/tree/tree.tsx +8 -9
- package/src/core/components/tree/treeContext.ts +4 -4
- package/src/core/components/tree/treeGroup.tsx +6 -8
- package/src/core/components/tree/treeItem.tsx +4 -4
- package/src/core/components/tree/types.ts +1 -1
- package/src/core/components/virtualList/__workshop__/changingProps.tsx +1 -1
- package/src/core/components/virtualList/__workshop__/elementScroll.tsx +1 -1
- package/src/core/components/virtualList/__workshop__/index.ts +5 -3
- package/src/core/components/virtualList/__workshop__/infiniteList.tsx +1 -1
- package/src/core/components/virtualList/__workshop__/windowScrolll.tsx +1 -1
- package/src/core/components/virtualList/virtualList.tsx +2 -2
- package/src/core/constants.ts +0 -18
- package/src/core/hooks/useMediaIndex/__workshop__/index.ts +5 -3
- package/src/core/hooks/useMediaIndex/__workshop__/test.tsx +1 -1
- package/src/core/hooks/useMediaIndex/useMediaIndex.ts +6 -1
- package/src/core/index.ts +1 -24
- package/src/core/lib/createGlobalScopedContext.ts +1 -1
- package/src/core/lib/globalScope.ts +1 -1
- package/src/core/observers/elementSize.ts +1 -1
- package/src/core/primitives/arrow/arrow.tsx +2 -2
- package/src/core/primitives/avatar/__workshop__/asButton.tsx +1 -1
- package/src/core/primitives/avatar/__workshop__/index.ts +5 -3
- package/src/core/primitives/avatar/__workshop__/stack.tsx +1 -1
- package/src/core/primitives/avatar/__workshop__/withinButton.tsx +1 -1
- package/src/core/primitives/avatar/__workshop__/withinMenuItem.tsx +1 -1
- package/src/core/primitives/avatar/avatar.tsx +3 -10
- package/src/core/primitives/avatar/avatarCounter.tsx +2 -2
- package/src/core/primitives/avatar/avatarStack.tsx +2 -4
- package/src/core/primitives/avatar/types.ts +0 -32
- package/src/core/primitives/badge/__workshop__/index.ts +5 -3
- package/src/core/primitives/badge/__workshop__/props.tsx +1 -1
- package/src/core/primitives/badge/__workshop__/tones.tsx +3 -3
- package/src/core/primitives/badge/badge.test.tsx +2 -1
- package/src/core/primitives/badge/badge.tsx +12 -11
- package/src/core/primitives/box/__workshop__/index.ts +5 -3
- package/src/core/primitives/box/__workshop__/props.tsx +1 -1
- package/src/core/primitives/box/__workshop__/responsive.tsx +1 -1
- package/src/core/primitives/box/box.tsx +28 -32
- package/src/core/primitives/button/__workshop__/custom.tsx +5 -5
- package/src/core/primitives/button/__workshop__/customIcons.tsx +1 -1
- package/src/core/primitives/button/__workshop__/disabled.tsx +3 -3
- package/src/core/primitives/button/__workshop__/index.ts +5 -3
- package/src/core/primitives/button/__workshop__/mixedChildren.tsx +1 -1
- package/src/core/primitives/button/__workshop__/props.tsx +1 -1
- package/src/core/primitives/button/__workshop__/sanityUploadButton.tsx +1 -1
- package/src/core/primitives/button/__workshop__/stacked.tsx +1 -1
- package/src/core/primitives/button/__workshop__/styled1.tsx +1 -1
- package/src/core/primitives/button/__workshop__/styled2.tsx +1 -1
- package/src/core/primitives/button/__workshop__/textOverflow.tsx +1 -1
- package/src/core/primitives/button/__workshop__/uploadButton.tsx +1 -1
- package/src/core/primitives/button/button.test.tsx +2 -1
- package/src/core/primitives/button/button.tsx +4 -7
- package/src/core/primitives/button/types.ts +0 -20
- package/src/core/primitives/card/__workshop__/asButton.tsx +2 -2
- package/src/core/primitives/card/__workshop__/asComponent.tsx +1 -1
- package/src/core/primitives/card/__workshop__/checkered.tsx +3 -3
- package/src/core/primitives/card/__workshop__/index.ts +5 -3
- package/src/core/primitives/card/__workshop__/interactive.tsx +1 -1
- package/src/core/primitives/card/__workshop__/listNavigation.tsx +1 -1
- package/src/core/primitives/card/__workshop__/props.tsx +1 -1
- package/src/core/primitives/card/__workshop__/selected.tsx +1 -1
- package/src/core/primitives/card/__workshop__/styled.tsx +1 -1
- package/src/core/primitives/card/__workshop__/tones.tsx +3 -3
- package/src/core/primitives/card/card.tsx +4 -2
- package/src/core/primitives/card/cardContext.ts +1 -1
- package/src/core/primitives/card/cardProvider.tsx +4 -4
- package/src/core/primitives/card/types.ts +5 -19
- package/src/core/primitives/checkbox/__workshop__/example.tsx +1 -1
- package/src/core/primitives/checkbox/__workshop__/index.ts +5 -3
- package/src/core/primitives/checkbox/__workshop__/props.tsx +1 -1
- package/src/core/primitives/checkbox/__workshop__/readOnly.tsx +1 -1
- package/src/core/primitives/checkbox/__workshop__/tones.tsx +3 -3
- package/src/core/primitives/checkbox/checkbox.tsx +2 -2
- package/src/core/primitives/code/__workshop__/index.ts +5 -3
- package/src/core/primitives/code/__workshop__/opticalAlignment.tsx +1 -1
- package/src/core/primitives/code/__workshop__/props.tsx +1 -1
- package/src/core/primitives/code/code.tsx +4 -2
- package/src/core/primitives/code/refractor.tsx +1 -1
- package/src/core/primitives/container/__workshop__/example.tsx +1 -1
- package/src/core/primitives/container/__workshop__/index.ts +5 -3
- package/src/core/primitives/container/container.tsx +2 -2
- package/src/core/primitives/flex/__workshop__/example.tsx +1 -1
- package/src/core/primitives/flex/__workshop__/gap.tsx +1 -1
- package/src/core/primitives/flex/__workshop__/index.ts +5 -3
- package/src/core/primitives/flex/flex.tsx +4 -2
- package/src/core/primitives/grid/__workshop__/index.ts +5 -3
- package/src/core/primitives/grid/__workshop__/responsive.tsx +3 -3
- package/src/core/primitives/grid/grid.tsx +4 -2
- package/src/core/primitives/heading/__workshop__/index.ts +5 -3
- package/src/core/primitives/heading/__workshop__/opticalAlignment.tsx +1 -1
- package/src/core/primitives/heading/__workshop__/plain.tsx +1 -1
- package/src/core/primitives/heading/heading.tsx +2 -4
- package/src/core/primitives/inline/__workshop__/index.ts +5 -3
- package/src/core/primitives/inline/__workshop__/plain.tsx +1 -1
- package/src/core/primitives/inline/inline.tsx +4 -11
- package/src/core/primitives/kbd/__workshop__/index.ts +5 -3
- package/src/core/primitives/kbd/__workshop__/plain.tsx +1 -1
- package/src/core/primitives/kbd/kbd.tsx +4 -2
- package/src/core/primitives/label/__workshop__/index.ts +5 -3
- package/src/core/primitives/label/__workshop__/opticalAlignment.tsx +1 -1
- package/src/core/primitives/label/__workshop__/plain.tsx +1 -1
- package/src/core/primitives/label/label.tsx +2 -4
- package/src/core/primitives/layer/__workshop__/_debug.tsx +1 -1
- package/src/core/primitives/layer/__workshop__/index.ts +5 -3
- package/src/core/primitives/layer/__workshop__/multipleRoots.tsx +1 -1
- package/src/core/primitives/layer/__workshop__/nested.tsx +1 -1
- package/src/core/primitives/layer/__workshop__/responsiveZOffset.tsx +1 -1
- package/src/core/primitives/layer/layer.test.tsx +2 -1
- package/src/core/primitives/layer/layer.tsx +2 -2
- package/src/core/primitives/layer/layerCard.tsx +2 -2
- package/src/core/primitives/layer/layerContext.ts +4 -4
- package/src/core/primitives/layer/layerProvider.tsx +2 -10
- package/src/core/primitives/popover/__workshop__/AlignedStory.tsx +2 -2
- package/src/core/primitives/popover/__workshop__/MarginsStory.tsx +1 -1
- package/src/core/primitives/popover/__workshop__/MatchReferenceWidthStory.tsx +1 -1
- package/src/core/primitives/popover/__workshop__/OpenOnMountStory.tsx +1 -1
- package/src/core/primitives/popover/__workshop__/PlainStory.tsx +2 -2
- package/src/core/primitives/popover/__workshop__/RecursiveStory.tsx +3 -3
- package/src/core/primitives/popover/__workshop__/SidePanelStory.tsx +3 -3
- package/src/core/primitives/popover/__workshop__/index.ts +5 -3
- package/src/core/primitives/popover/popover.tsx +4 -9
- package/src/core/primitives/popover/popoverLayer.tsx +2 -2
- package/src/core/primitives/radio/__workshop__/example.tsx +1 -1
- package/src/core/primitives/radio/__workshop__/index.ts +5 -3
- package/src/core/primitives/radio/__workshop__/plain.tsx +1 -1
- package/src/core/primitives/radio/radio.tsx +2 -2
- package/src/core/primitives/select/__workshop__/index.ts +5 -3
- package/src/core/primitives/select/__workshop__/plain.tsx +1 -1
- package/src/core/primitives/select/__workshop__/readOnly.tsx +1 -1
- package/src/core/primitives/select/select.tsx +5 -15
- package/src/core/primitives/selectable/selectable.tsx +4 -4
- package/src/core/primitives/skeleton/__workshop__/delay.tsx +1 -1
- package/src/core/primitives/skeleton/__workshop__/index.ts +5 -3
- package/src/core/primitives/skeleton/__workshop__/skeleton.tsx +2 -2
- package/src/core/primitives/skeleton/codeSkeleton.tsx +2 -2
- package/src/core/primitives/skeleton/headingSkeleton.tsx +2 -2
- package/src/core/primitives/skeleton/labelSkeleton.tsx +2 -2
- package/src/core/primitives/skeleton/skeleton.tsx +2 -2
- package/src/core/primitives/skeleton/textSkeleton.tsx +2 -2
- package/src/core/primitives/spinner/__workshop__/Props.tsx +1 -1
- package/src/core/primitives/spinner/__workshop__/index.ts +5 -3
- package/src/core/primitives/spinner/animatedSpinnerIcon.tsx +2 -2
- package/src/core/primitives/spinner/spinner.tsx +2 -2
- package/src/core/primitives/srOnly/srOnly.tsx +2 -2
- package/src/core/primitives/stack/__workshop__/index.ts +5 -3
- package/src/core/primitives/stack/__workshop__/plain.tsx +1 -1
- package/src/core/primitives/stack/stack.tsx +5 -10
- package/src/core/primitives/switch/__workshop__/example.tsx +1 -1
- package/src/core/primitives/switch/__workshop__/index.ts +5 -3
- package/src/core/primitives/switch/__workshop__/props.tsx +1 -1
- package/src/core/primitives/switch/switch.tsx +2 -2
- package/src/core/primitives/text/__workshop__/colored.tsx +1 -1
- package/src/core/primitives/text/__workshop__/example.tsx +1 -1
- package/src/core/primitives/text/__workshop__/index.ts +5 -3
- package/src/core/primitives/text/__workshop__/opticalAlignment.tsx +1 -1
- package/src/core/primitives/text/text.tsx +4 -4
- package/src/core/primitives/textArea/__workshop__/index.ts +5 -3
- package/src/core/primitives/textArea/__workshop__/plain.tsx +1 -1
- package/src/core/primitives/textArea/textArea.tsx +5 -15
- package/src/core/primitives/textInput/__workshop__/clearButton.tsx +1 -1
- package/src/core/primitives/textInput/__workshop__/customValidity.tsx +1 -1
- package/src/core/primitives/textInput/__workshop__/index.ts +5 -3
- package/src/core/primitives/textInput/__workshop__/plain.tsx +1 -1
- package/src/core/primitives/textInput/__workshop__/readOnly.tsx +1 -1
- package/src/core/primitives/textInput/__workshop__/states.tsx +1 -1
- package/src/core/primitives/textInput/__workshop__/tones.tsx +1 -1
- package/src/core/primitives/textInput/__workshop__/typed.tsx +1 -1
- package/src/core/primitives/textInput/textInput.tsx +6 -9
- package/src/core/primitives/tooltip/__workshop__/customPortal.tsx +1 -1
- package/src/core/primitives/tooltip/__workshop__/index.ts +5 -3
- package/src/core/primitives/tooltip/__workshop__/overflowingBoundary.tsx +1 -1
- package/src/core/primitives/tooltip/__workshop__/props.tsx +1 -1
- package/src/core/primitives/tooltip/__workshop__/resizableBoundary.tsx +1 -1
- package/src/core/primitives/tooltip/constants.ts +1 -1
- package/src/core/primitives/tooltip/tooltip.test.tsx +2 -4
- package/src/core/primitives/tooltip/tooltip.tsx +5 -9
- package/src/core/primitives/tooltip/tooltipDelayGroup/tooltipDelayGroupContext.tsx +4 -2
- package/src/core/primitives/tooltip/tooltipDelayGroup/tooltipDelayGroupProvider.tsx +5 -3
- package/src/core/primitives/tooltip/tooltipLayer.tsx +2 -2
- package/src/core/{types/props.ts → types.ts} +27 -0
- package/src/core/utils/boundaryElement/__workshop__/index.ts +5 -3
- package/src/core/utils/boundaryElement/__workshop__/plain.tsx +1 -1
- package/src/core/utils/boundaryElement/boundaryElement.test.tsx +2 -1
- package/src/core/utils/boundaryElement/boundaryElementContext.ts +7 -4
- package/src/core/utils/boundaryElement/boundaryElementProvider.tsx +2 -2
- package/src/core/utils/elementQuery/__workshop__/customMedia.tsx +1 -1
- package/src/core/utils/elementQuery/__workshop__/index.ts +5 -3
- package/src/core/utils/elementQuery/elementQuery.tsx +2 -2
- package/src/core/utils/getElementRef.ts +1 -1
- package/src/core/utils/portal/__workshop__/index.ts +5 -3
- package/src/core/utils/portal/__workshop__/named.tsx +1 -1
- package/src/core/utils/portal/portal.test.tsx +2 -1
- package/src/core/utils/portal/portalContext.ts +5 -2
- package/src/core/utils/portal/portalProvider.tsx +5 -9
- package/src/css/_responsiveClassName.ts +2 -2
- package/src/css/_style.css.ts +1 -1
- package/src/css/components/breadcrumbs/breadcrumbs.css.ts +1 -1
- package/src/css/components/dialog/dialog.css.ts +9 -17
- package/src/css/components/menu/menu.css.ts +2 -2
- package/src/css/components/menu/menu.ts +2 -2
- package/src/css/components/skeleton/skeleton.css.ts +2 -6
- package/src/css/components/toast/toast.css.ts +2 -2
- package/src/css/components/toast/toast.ts +2 -2
- package/src/css/components/tree/tree.css.ts +1 -1
- package/src/css/components/tree/tree.ts +1 -1
- package/src/css/defaultTheme.css.ts +59 -60
- package/src/css/layers.css.ts +4 -1
- package/src/css/primitives/_arrow/_arrow.css.ts +5 -5
- package/src/css/primitives/_input/_input.css.ts +4 -4
- package/src/css/primitives/_selectable/_selectable.css.ts +4 -4
- package/src/css/primitives/_selectable/types.ts +2 -2
- package/src/css/primitives/avatar/avatar.css.ts +10 -10
- package/src/css/primitives/badge/badge.css.ts +4 -4
- package/src/css/primitives/badge/types.ts +8 -2
- package/src/css/primitives/box/box.css.ts +2 -2
- package/src/css/primitives/button/button.css.ts +6 -6
- package/src/css/primitives/button/button.ts +2 -2
- package/src/css/primitives/button/types.ts +3 -3
- package/src/css/primitives/card/__workshop__/color.tsx +9 -9
- package/src/css/primitives/card/__workshop__/index.ts +5 -3
- package/src/css/primitives/card/card.css.ts +12 -18
- package/src/css/primitives/card/types.ts +3 -3
- package/src/css/primitives/checkbox/checkbox.css.ts +3 -3
- package/src/css/primitives/checkbox/checkbox.ts +3 -3
- package/src/css/primitives/code/code.css.ts +4 -3
- package/src/css/primitives/code/types.ts +3 -4
- package/src/css/primitives/container/container.css.ts +1 -1
- package/src/css/primitives/heading/heading.css.ts +5 -4
- package/src/css/primitives/heading/types.ts +3 -6
- package/src/css/primitives/kbd/kbd.css.ts +1 -1
- package/src/css/primitives/label/label.css.ts +5 -4
- package/src/css/primitives/label/types.ts +0 -8
- package/src/css/primitives/popover/popover.css.ts +2 -2
- package/src/css/primitives/popover/popover.ts +2 -2
- package/src/css/primitives/radio/radio.css.ts +3 -3
- package/src/css/primitives/radio/radio.ts +3 -3
- package/src/css/primitives/root/root.css.ts +1 -1
- package/src/css/primitives/root/root.ts +1 -1
- package/src/css/primitives/root/types.ts +3 -3
- package/src/css/primitives/select/select.css.ts +3 -3
- package/src/css/primitives/spinner/spinner.css.ts +2 -6
- package/src/css/primitives/spinner/spinner.ts +2 -2
- package/src/css/primitives/srOnly/srOnly.css.ts +1 -1
- package/src/css/primitives/srOnly/srOnly.ts +1 -1
- package/src/css/primitives/stack/stack.css.ts +1 -1
- package/src/css/primitives/stack/stack.ts +1 -1
- package/src/css/primitives/switch/switch.css.ts +5 -5
- package/src/css/primitives/text/text.css.ts +5 -4
- package/src/css/primitives/text/types.ts +3 -5
- package/src/css/primitives/textArea/textArea.css.ts +1 -1
- package/src/css/primitives/textInput/textInput.css.ts +4 -4
- package/src/css/primitives/tooltip/tooltip.css.ts +1 -1
- package/src/css/props/alignItems/alignItems.ts +1 -1
- package/src/css/props/border/border.ts +1 -16
- package/src/css/props/boxSizing/boxSizing.css.ts +2 -1
- package/src/css/props/boxSizing/boxSizing.ts +0 -3
- package/src/css/props/display/display.ts +1 -10
- package/src/css/props/flex/flex.ts +1 -1
- package/src/css/props/flexDirection/flexDirection.ts +1 -1
- package/src/css/props/flexWrap/flexWrap.ts +1 -1
- package/src/css/props/font/font.css.ts +3 -2
- package/src/css/props/font/font.ts +1 -1
- package/src/css/props/gap/gap.ts +1 -1
- package/src/css/props/gridAutoColumns/gridAutoColumns.css.ts +2 -2
- package/src/css/props/gridAutoColumns/gridAutoColumns.ts +2 -2
- package/src/css/props/gridAutoColumns/types.ts +0 -10
- package/src/css/props/gridAutoFlow/gridAutoFlow.ts +2 -2
- package/src/css/props/gridAutoFlow/types.ts +0 -4
- package/src/css/props/gridAutoRows/gridAutoRows.ts +2 -2
- package/src/css/props/gridAutoRows/types.ts +0 -4
- package/src/css/props/gridColumn/gridColumn.ts +3 -3
- package/src/css/props/gridColumn/types.ts +0 -10
- package/src/css/props/gridColumnEnd/gridColumnEnd.ts +3 -3
- package/src/css/props/gridColumnEnd/types.ts +0 -10
- package/src/css/props/gridColumnStart/gridColumnStart.ts +3 -6
- package/src/css/props/gridColumnStart/types.ts +0 -10
- package/src/css/props/gridRow/gridRow.ts +3 -3
- package/src/css/props/gridRow/types.ts +0 -10
- package/src/css/props/gridRowEnd/gridRowEnd.ts +3 -3
- package/src/css/props/gridRowEnd/types.ts +0 -10
- package/src/css/props/gridRowStart/gridRowStart.ts +3 -3
- package/src/css/props/gridRowStart/types.ts +0 -10
- package/src/css/props/gridTemplateColumns/gridTemplateColumns.ts +2 -2
- package/src/css/props/gridTemplateColumns/types.ts +0 -10
- package/src/css/props/gridTemplateRows/gridTemplateRows.ts +2 -2
- package/src/css/props/gridTemplateRows/types.ts +0 -10
- package/src/css/props/height/height.ts +1 -1
- package/src/css/props/height/types.ts +0 -6
- package/src/css/props/inset/inset.ts +1 -1
- package/src/css/props/justifyContent/justifyContent.ts +1 -1
- package/src/css/props/margin/margin.ts +1 -1
- package/src/css/props/maxWidth/maxWidth.ts +1 -1
- package/src/css/props/minHeight/minHeight.ts +1 -1
- package/src/css/props/minWidth/minWidth.ts +1 -1
- package/src/css/props/outline/outline.ts +1 -1
- package/src/css/props/overflow/overflow.ts +1 -1
- package/src/css/props/overflow/types.ts +0 -6
- package/src/css/props/padding/padding.ts +1 -1
- package/src/css/props/pointerEvents/pointerEvents.ts +1 -1
- package/src/css/props/position/position.ts +1 -1
- package/src/css/props/radius/radius.ts +1 -1
- package/src/css/props/shadow/shadow.ts +1 -1
- package/src/css/props/textAlign/textAlign.ts +1 -1
- package/src/css/props/textOverflow/textOverflow.ts +1 -1
- package/src/css/props/width/width.ts +1 -1
- package/src/css/types.ts +225 -53
- package/src/css/util.ts +2 -2
- package/src/css/vars.css.ts +33 -36
- package/src/theme/{v3/_parseColorToken.ts → _parseColorToken.ts} +2 -2
- package/src/theme/buildTheme.ts +33 -0
- package/src/theme/constants.ts +90 -0
- package/src/theme/defaults/color.ts +197 -0
- package/src/theme/{v2/defaults/config.ts → defaults/common.ts} +3 -16
- package/src/theme/{v3/defaultFonts.ts → defaults/fonts.ts} +2 -2
- package/src/theme/index.ts +4 -5
- package/src/theme/{v3/resolveTokens.ts → resolveTokens.ts} +15 -15
- package/src/theme/types.ts +355 -15
- package/src/core/__DEV__.ts +0 -5
- package/src/core/_compat/helpers.ts +0 -72
- package/src/core/_compat/styles/_responsive.ts +0 -19
- package/src/core/_compat/theme/theme.test.tsx +0 -73
- package/src/core/_compat/theme/themeColorProvider.tsx +0 -24
- package/src/core/_compat/theme/themeContext.ts +0 -10
- package/src/core/_compat/theme/themeProvider.tsx +0 -68
- package/src/core/_compat/theme/types.ts +0 -10
- package/src/core/_compat/theme/useRootTheme.ts +0 -15
- package/src/core/_compat/theme/useTheme.ts +0 -12
- package/src/core/_compat/types.ts +0 -191
- package/src/core/hooks/useArrayProp.ts +0 -26
- package/src/core/hooks/useClickOutside.test.tsx +0 -481
- package/src/core/hooks/useClickOutside.ts +0 -113
- package/src/core/hooks/useElementRect/__workshop__/example.tsx +0 -30
- package/src/core/hooks/useElementRect/__workshop__/index.ts +0 -14
- package/src/core/hooks/useElementRect/useElementRect.ts +0 -13
- package/src/core/hooks/useForwardedRef.ts +0 -19
- package/src/core/hooks/useIsomorphicEffect.ts +0 -7
- package/src/core/primitives/badge/types.ts +0 -18
- package/src/core/primitives/box/types.ts +0 -22
- package/src/core/primitives/flex/types.ts +0 -27
- package/src/core/primitives/grid/types.ts +0 -17
- package/src/core/primitives/selectable/types.ts +0 -7
- package/src/core/primitives/types.ts +0 -153
- package/src/core/types/gridItem.ts +0 -32
- package/src/core/types/placement.ts +0 -18
- package/src/core/types/radius.ts +0 -7
- package/src/core/types/textAlign.ts +0 -7
- package/src/core/utils/spanWithTextOverflow.tsx +0 -10
- package/src/theme/getScopedTheme.ts +0 -88
- package/src/theme/v0/avatar.ts +0 -10
- package/src/theme/v0/color/_generic.ts +0 -35
- package/src/theme/v0/color/_system.ts +0 -17
- package/src/theme/v0/color/base.ts +0 -21
- package/src/theme/v0/color/button.ts +0 -42
- package/src/theme/v0/color/card.ts +0 -19
- package/src/theme/v0/color/color.ts +0 -40
- package/src/theme/v0/color/index.ts +0 -11
- package/src/theme/v0/color/input.ts +0 -34
- package/src/theme/v0/color/muted.ts +0 -26
- package/src/theme/v0/color/selectable.ts +0 -31
- package/src/theme/v0/color/solid.ts +0 -26
- package/src/theme/v0/color/spot.ts +0 -13
- package/src/theme/v0/css.ts +0 -10
- package/src/theme/v0/focusRing.ts +0 -5
- package/src/theme/v0/font.ts +0 -40
- package/src/theme/v0/index.ts +0 -10
- package/src/theme/v0/input.ts +0 -23
- package/src/theme/v0/layer.ts +0 -6
- package/src/theme/v0/shadow.ts +0 -15
- package/src/theme/v0/styles.ts +0 -13
- package/src/theme/v0/theme.ts +0 -72
- package/src/theme/v2/avatar.ts +0 -12
- package/src/theme/v2/build/_deprecated/color/_selectable/createSelectableTones.ts +0 -76
- package/src/theme/v2/build/_deprecated/color/_solid/createSolidTones.ts +0 -54
- package/src/theme/v2/build/_deprecated/color/button/createButtonModes.ts +0 -22
- package/src/theme/v2/build/_deprecated/color/button/createButtonTones.ts +0 -55
- package/src/theme/v2/build/_deprecated/color/card/createCardStates.ts +0 -60
- package/src/theme/v2/build/_deprecated/color/color.test.ts +0 -63
- package/src/theme/v2/build/_deprecated/color/defaults.ts +0 -390
- package/src/theme/v2/build/_deprecated/color/factory.ts +0 -141
- package/src/theme/v2/build/_deprecated/color/index.ts +0 -1
- package/src/theme/v2/build/_deprecated/color/input/createInputModes.ts +0 -86
- package/src/theme/v2/build/_deprecated/color/muted/createMuted.ts +0 -54
- package/src/theme/v2/build/_deprecated/color/spot/createSpot.ts +0 -20
- package/src/theme/v2/build/buildColorTheme.test.ts +0 -185
- package/src/theme/v2/build/buildColorTheme.ts +0 -494
- package/src/theme/v2/build/buildTheme.test.ts +0 -89
- package/src/theme/v2/build/buildTheme.ts +0 -37
- package/src/theme/v2/build/colorToken/colorToken.ts +0 -19
- package/src/theme/v2/build/colorToken/compileColorToken.ts +0 -21
- package/src/theme/v2/build/colorToken/index.ts +0 -2
- package/src/theme/v2/build/colorToken/types.ts +0 -6
- package/src/theme/v2/build/index.ts +0 -3
- package/src/theme/v2/build/lib/color-fns/blend/index.ts +0 -3
- package/src/theme/v2/build/lib/color-fns/blend/mix.ts +0 -21
- package/src/theme/v2/build/lib/color-fns/blend/multiply.ts +0 -18
- package/src/theme/v2/build/lib/color-fns/blend/screen.ts +0 -18
- package/src/theme/v2/build/lib/color-fns/color-fns.test.ts +0 -68
- package/src/theme/v2/build/lib/color-fns/contrastRatio.ts +0 -34
- package/src/theme/v2/build/lib/color-fns/convert.ts +0 -150
- package/src/theme/v2/build/lib/color-fns/index.ts +0 -6
- package/src/theme/v2/build/lib/color-fns/parse.ts +0 -60
- package/src/theme/v2/build/lib/color-fns/rgba.ts +0 -14
- package/src/theme/v2/build/lib/color-fns/types.ts +0 -28
- package/src/theme/v2/build/lib/isRecord.ts +0 -3
- package/src/theme/v2/build/lib/utils.ts +0 -19
- package/src/theme/v2/build/merge.ts +0 -28
- package/src/theme/v2/build/mixThemeColor.test.ts +0 -23
- package/src/theme/v2/build/mixThemeColor.ts +0 -53
- package/src/theme/v2/build/renderColorTheme.ts +0 -532
- package/src/theme/v2/build/renderColorValue.ts +0 -85
- package/src/theme/v2/build/resolveColorTokens.ts +0 -268
- package/src/theme/v2/color/_constants.ts +0 -45
- package/src/theme/v2/color/_helpers.ts +0 -24
- package/src/theme/v2/color/_system.ts +0 -38
- package/src/theme/v2/color/avatar.ts +0 -11
- package/src/theme/v2/color/badge.ts +0 -12
- package/src/theme/v2/color/button.ts +0 -11
- package/src/theme/v2/color/color.ts +0 -28
- package/src/theme/v2/color/index.ts +0 -13
- package/src/theme/v2/color/input.ts +0 -23
- package/src/theme/v2/color/kbd.ts +0 -6
- package/src/theme/v2/color/selectable.ts +0 -8
- package/src/theme/v2/color/shadow.ts +0 -7
- package/src/theme/v2/color/state.ts +0 -41
- package/src/theme/v2/color/syntax.ts +0 -39
- package/src/theme/v2/config/helpers.ts +0 -48
- package/src/theme/v2/config/index.ts +0 -4
- package/src/theme/v2/config/system.ts +0 -114
- package/src/theme/v2/config/tokens/color/index.ts +0 -1
- package/src/theme/v2/config/tokens/color/types.ts +0 -137
- package/src/theme/v2/config/tokens/index.ts +0 -3
- package/src/theme/v2/config/tokens/parseTokenValue.test.ts +0 -44
- package/src/theme/v2/config/tokens/parseTokenValue.ts +0 -133
- package/src/theme/v2/config/tokens/types.ts +0 -53
- package/src/theme/v2/config/types.ts +0 -47
- package/src/theme/v2/defaults/colorPalette.ts +0 -5
- package/src/theme/v2/defaults/colorTokens.ts +0 -648
- package/src/theme/v2/defaults/fonts.ts +0 -227
- package/src/theme/v2/index.ts +0 -6
- package/src/theme/v2/input.ts +0 -31
- package/src/theme/v2/theme.ts +0 -45
- package/src/theme/v3/_constants.ts +0 -29
- package/src/theme/v3/buildTheme_v3.ts +0 -39
- package/src/theme/v3/color/_constants.ts +0 -15
- package/src/theme/v3/color/avatar.ts +0 -14
- package/src/theme/v3/color/card.ts +0 -79
- package/src/theme/v3/color/color.ts +0 -98
- package/src/theme/v3/color/element.ts +0 -19
- package/src/theme/v3/color/index.ts +0 -7
- package/src/theme/v3/color/token.ts +0 -32
- package/src/theme/v3/color/tokens.ts +0 -5
- package/src/theme/v3/defaultTokens.ts +0 -199
- package/src/theme/v3/index.ts +0 -9
- package/src/theme/v3/palette/constants.ts +0 -15
- package/src/theme/v3/palette/index.ts +0 -2
- package/src/theme/v3/palette/types.ts +0 -7
- package/src/theme/v3/tokens.ts +0 -16
- package/src/theme/v3/types.ts +0 -133
- package/src/theme/versioning/getTheme_v2.ts +0 -58
- package/src/theme/versioning/index.ts +0 -1
- package/src/theme/versioning/is_v0.ts +0 -7
- package/src/theme/versioning/is_v2.ts +0 -7
- package/src/theme/versioning/themeColor_v0_v2.ts +0 -245
- package/src/theme/versioning/themeColor_v2_v2_9.ts +0 -49
- package/src/theme/versioning/themeColor_v3_v2.ts +0 -383
- package/src/theme/versioning/v0_v2.ts +0 -95
- package/src/theme/versioning/v2_v0.ts +0 -127
- package/src/theme/versioning/v3_v2.ts +0 -130
- /package/src/theme/{v3/merge.ts → merge.ts} +0 -0
package/dist/theme.d.ts
CHANGED
|
@@ -1,9 +1,5 @@
|
|
|
1
|
-
import {ColorHueKey} from '@sanity/color'
|
|
2
1
|
import type {ColorHues} from '@sanity/color'
|
|
3
2
|
import type {ColorTint} from '@sanity/color'
|
|
4
|
-
import {ColorTintKey} from '@sanity/color'
|
|
5
|
-
import type {Hue as Hue_2} from '@sanity/ui/theme'
|
|
6
|
-
import type {StyledObject} from 'styled-components'
|
|
7
3
|
|
|
8
4
|
/** @public */
|
|
9
5
|
export declare const AVATAR_COLORS: readonly [
|
|
@@ -24,29 +20,47 @@ export declare const AVATAR_SIZE: readonly [0, 1, 2, 3]
|
|
|
24
20
|
/** @public */
|
|
25
21
|
export declare type AvatarColor = (typeof AVATAR_COLORS)[number]
|
|
26
22
|
|
|
23
|
+
/** @public */
|
|
24
|
+
export declare interface AvatarColorProperties {
|
|
25
|
+
_hue: Hue
|
|
26
|
+
bg: ColorValue
|
|
27
|
+
fg: ColorValue
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
/** @public */
|
|
31
|
+
export declare type AvatarsColor = Record<AvatarColor, AvatarColorProperties>
|
|
32
|
+
|
|
27
33
|
/** @public */
|
|
28
34
|
export declare type AvatarSize = (typeof AVATAR_SIZE)[number]
|
|
29
35
|
|
|
30
36
|
/** @public */
|
|
31
|
-
export declare type
|
|
37
|
+
export declare type BoxShadow = [number, number, number, number]
|
|
32
38
|
|
|
33
|
-
/** @
|
|
34
|
-
export declare function buildTheme(
|
|
39
|
+
/** @public */
|
|
40
|
+
export declare function buildTheme(options?: Options): Theme
|
|
41
|
+
|
|
42
|
+
/** @public */
|
|
43
|
+
export declare const BUTTON_MODES: readonly ['default', 'ghost', 'bleed']
|
|
35
44
|
|
|
36
45
|
/** @public */
|
|
37
|
-
export declare
|
|
46
|
+
export declare type ButtonMode = (typeof BUTTON_MODES)[number]
|
|
47
|
+
|
|
48
|
+
/** @public */
|
|
49
|
+
export declare const CARD_TONES: readonly [
|
|
50
|
+
'transparent',
|
|
51
|
+
'default',
|
|
52
|
+
'neutral',
|
|
53
|
+
'primary',
|
|
54
|
+
'suggest',
|
|
55
|
+
'positive',
|
|
56
|
+
'caution',
|
|
57
|
+
'critical',
|
|
58
|
+
]
|
|
38
59
|
|
|
39
60
|
/** @public */
|
|
40
61
|
export declare interface CardColorTokens {
|
|
41
62
|
_hue: Hue
|
|
42
|
-
avatar:
|
|
43
|
-
Hue,
|
|
44
|
-
{
|
|
45
|
-
_hue: Hue
|
|
46
|
-
bg: ColorValue
|
|
47
|
-
fg: ColorValue
|
|
48
|
-
}
|
|
49
|
-
>
|
|
63
|
+
avatar: AvatarsColor
|
|
50
64
|
backdrop: ColorValue
|
|
51
65
|
code: {
|
|
52
66
|
bg: ColorValue
|
|
@@ -104,161 +118,21 @@ export declare interface CardColorTokens {
|
|
|
104
118
|
from: ColorValue
|
|
105
119
|
to: ColorValue
|
|
106
120
|
}
|
|
107
|
-
variant:
|
|
108
|
-
solid: Record<'*' | ThemeColorStateToneKey, ElementColorTokens>
|
|
109
|
-
tinted: Record<'*' | ThemeColorStateToneKey, ElementColorTokens>
|
|
110
|
-
}
|
|
121
|
+
variant: Record<ColorVariant, ElementsColorTokens>
|
|
111
122
|
}
|
|
112
123
|
|
|
113
124
|
/** @public */
|
|
114
|
-
export declare
|
|
115
|
-
|
|
116
|
-
/** @public */
|
|
117
|
-
export declare const COLOR_CONFIG_BLEND_KEYS: readonly ['_blend']
|
|
118
|
-
|
|
119
|
-
/** @public */
|
|
120
|
-
export declare const COLOR_CONFIG_CARD_KEYS: readonly [
|
|
121
|
-
'_hue',
|
|
122
|
-
'bg',
|
|
123
|
-
'fg',
|
|
124
|
-
'border',
|
|
125
|
-
'focusRing',
|
|
126
|
-
'muted/fg',
|
|
127
|
-
'accent/fg',
|
|
128
|
-
'link/fg',
|
|
129
|
-
'code/bg',
|
|
130
|
-
'code/fg',
|
|
131
|
-
'skeleton/from',
|
|
132
|
-
'skeleton/to',
|
|
133
|
-
'status/dot',
|
|
134
|
-
'status/icon',
|
|
135
|
-
'_hue',
|
|
136
|
-
'bg',
|
|
137
|
-
'fg',
|
|
138
|
-
'border',
|
|
139
|
-
'focusRing',
|
|
140
|
-
'shadow/outline',
|
|
141
|
-
'shadow/umbra',
|
|
142
|
-
'shadow/penumbra',
|
|
143
|
-
'shadow/ambient',
|
|
144
|
-
]
|
|
145
|
-
|
|
146
|
-
/** @public */
|
|
147
|
-
export declare const COLOR_CONFIG_CARD_TONES: readonly [
|
|
148
|
-
'*',
|
|
149
|
-
'transparent',
|
|
150
|
-
'default',
|
|
151
|
-
'neutral',
|
|
152
|
-
'primary',
|
|
153
|
-
'suggest',
|
|
154
|
-
'positive',
|
|
155
|
-
'caution',
|
|
156
|
-
'critical',
|
|
157
|
-
]
|
|
158
|
-
|
|
159
|
-
/** @public */
|
|
160
|
-
export declare const COLOR_CONFIG_INPUT_MODES: readonly ['*', 'default', 'invalid']
|
|
161
|
-
|
|
162
|
-
/** @public */
|
|
163
|
-
export declare const COLOR_CONFIG_INPUT_STATES: readonly [
|
|
164
|
-
'*',
|
|
165
|
-
'enabled',
|
|
166
|
-
'hovered',
|
|
167
|
-
'readOnly',
|
|
168
|
-
'disabled',
|
|
169
|
-
]
|
|
170
|
-
|
|
171
|
-
/** @public */
|
|
172
|
-
export declare const COLOR_CONFIG_STATE_KEYS: readonly [
|
|
173
|
-
'_hue',
|
|
174
|
-
'bg',
|
|
175
|
-
'fg',
|
|
176
|
-
'border',
|
|
177
|
-
'focusRing',
|
|
178
|
-
'muted/fg',
|
|
179
|
-
'accent/fg',
|
|
180
|
-
'link/fg',
|
|
181
|
-
'code/bg',
|
|
182
|
-
'code/fg',
|
|
183
|
-
'skeleton/from',
|
|
184
|
-
'skeleton/to',
|
|
185
|
-
'status/dot',
|
|
186
|
-
'status/icon',
|
|
187
|
-
]
|
|
125
|
+
export declare type CardTone = (typeof CARD_TONES)[number]
|
|
188
126
|
|
|
189
127
|
/** @public */
|
|
190
|
-
export declare
|
|
191
|
-
'*',
|
|
192
|
-
'default',
|
|
193
|
-
'neutral',
|
|
194
|
-
'primary',
|
|
195
|
-
'suggest',
|
|
196
|
-
'positive',
|
|
197
|
-
'caution',
|
|
198
|
-
'critical',
|
|
199
|
-
]
|
|
128
|
+
export declare type Color = Record<CardTone, CardColorTokens>
|
|
200
129
|
|
|
201
130
|
/** @public */
|
|
202
|
-
export declare const
|
|
203
|
-
'*',
|
|
204
|
-
'enabled',
|
|
205
|
-
'hovered',
|
|
206
|
-
'pressed',
|
|
207
|
-
'selected',
|
|
208
|
-
'disabled',
|
|
209
|
-
]
|
|
131
|
+
export declare const COLOR_SCHEMES: readonly ['light', 'dark']
|
|
210
132
|
|
|
211
133
|
/** @public */
|
|
212
134
|
export declare const COLOR_VARIANTS: readonly ['tinted', 'solid']
|
|
213
135
|
|
|
214
|
-
/** @public */
|
|
215
|
-
export declare type ColorBlendModeTokenValue = [ThemeColorBlendModeKey, ThemeColorBlendModeKey]
|
|
216
|
-
|
|
217
|
-
/** @public */
|
|
218
|
-
export declare type ColorConfigAvatarColor = (typeof COLOR_CONFIG_AVATAR_COLORS)[number]
|
|
219
|
-
|
|
220
|
-
/** @public */
|
|
221
|
-
export declare type ColorConfigBlendKey = (typeof COLOR_CONFIG_BLEND_KEYS)[number]
|
|
222
|
-
|
|
223
|
-
/** @public */
|
|
224
|
-
export declare type ColorConfigCardKey = (typeof COLOR_CONFIG_CARD_KEYS)[number]
|
|
225
|
-
|
|
226
|
-
/** @public */
|
|
227
|
-
export declare type ColorConfigCardTone = (typeof COLOR_CONFIG_CARD_TONES)[number]
|
|
228
|
-
|
|
229
|
-
/** @public */
|
|
230
|
-
export declare type ColorConfigInputMode = (typeof COLOR_CONFIG_INPUT_MODES)[number]
|
|
231
|
-
|
|
232
|
-
/** @public */
|
|
233
|
-
export declare type ColorConfigInputState = (typeof COLOR_CONFIG_INPUT_STATES)[number]
|
|
234
|
-
|
|
235
|
-
/** @public */
|
|
236
|
-
export declare type ColorConfigOpacityValue = `0` | `0.${number}` | `1`
|
|
237
|
-
|
|
238
|
-
/** @public */
|
|
239
|
-
export declare type ColorConfigState = (typeof COLOR_CONFIG_STATES)[number]
|
|
240
|
-
|
|
241
|
-
/** @public */
|
|
242
|
-
export declare type ColorConfigStateKey = (typeof COLOR_CONFIG_STATE_KEYS)[number]
|
|
243
|
-
|
|
244
|
-
/** @public */
|
|
245
|
-
export declare type ColorConfigStateTone = (typeof COLOR_CONFIG_STATE_TONES)[number]
|
|
246
|
-
|
|
247
|
-
/** @public */
|
|
248
|
-
export declare type ColorConfigValue =
|
|
249
|
-
| `black`
|
|
250
|
-
| `white`
|
|
251
|
-
| `black/${ColorConfigOpacityValue}`
|
|
252
|
-
| `white/${ColorConfigOpacityValue}`
|
|
253
|
-
| `${Hue}`
|
|
254
|
-
| `${Hue} ${number}%`
|
|
255
|
-
| `${Hue}/${Tint}`
|
|
256
|
-
| `${Hue}/${Tint} ${number}%`
|
|
257
|
-
| `${Hue}/${Tint}/${ColorConfigOpacityValue}`
|
|
258
|
-
| `${Tint}`
|
|
259
|
-
| `${Tint} ${number}%`
|
|
260
|
-
| `${Tint}/${ColorConfigOpacityValue}`
|
|
261
|
-
|
|
262
136
|
/** @internal */
|
|
263
137
|
export declare interface ColorInheritNode {
|
|
264
138
|
type: 'inherit'
|
|
@@ -274,6 +148,9 @@ export declare interface ColorNode {
|
|
|
274
148
|
mix: number
|
|
275
149
|
}
|
|
276
150
|
|
|
151
|
+
/** @public */
|
|
152
|
+
export declare type ColorScheme = (typeof COLOR_SCHEMES)[number]
|
|
153
|
+
|
|
277
154
|
/** @internal */
|
|
278
155
|
export declare interface ColorTintNode {
|
|
279
156
|
type: 'tint'
|
|
@@ -303,7 +180,7 @@ export declare type ColorToken =
|
|
|
303
180
|
export declare type ColorTokenOpacityValue = `0` | `0.${number}` | `1`
|
|
304
181
|
|
|
305
182
|
/** @public */
|
|
306
|
-
export declare type ColorTokens = Record<'*' |
|
|
183
|
+
export declare type ColorTokens = Record<'*' | CardTone, CardColorTokens>
|
|
307
184
|
|
|
308
185
|
/**
|
|
309
186
|
* Theme color values are tuples of [light, dark] color tokens.
|
|
@@ -313,7 +190,10 @@ export declare type ColorTokens = Record<'*' | ThemeColorCardToneKey, CardColorT
|
|
|
313
190
|
export declare type ColorValue = [ColorToken, ColorToken]
|
|
314
191
|
|
|
315
192
|
/** @public */
|
|
316
|
-
export declare
|
|
193
|
+
export declare type ColorVariant = (typeof COLOR_VARIANTS)[number]
|
|
194
|
+
|
|
195
|
+
/** @public */
|
|
196
|
+
export declare const CONTAINER: [...typeof CONTAINER_SCALE, 'auto']
|
|
317
197
|
|
|
318
198
|
/** @public */
|
|
319
199
|
export declare const CONTAINER_SCALE: readonly [0, 1, 2, 3, 4, 5]
|
|
@@ -324,23 +204,16 @@ export declare type ContainerScale = (typeof CONTAINER_SCALE)[number]
|
|
|
324
204
|
/** @public */
|
|
325
205
|
export declare type ContainerWidth = (typeof CONTAINER)[number]
|
|
326
206
|
|
|
327
|
-
/**
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
* https://github.com/styled-components/styled-components/issues/4062
|
|
338
|
-
* @internal
|
|
339
|
-
*/
|
|
340
|
-
export declare type CSSObject = StyledObject<any>
|
|
341
|
-
|
|
342
|
-
/** @internal */
|
|
343
|
-
export declare const defaultTokens: PartialTokens<Tokens>
|
|
207
|
+
/** @public */
|
|
208
|
+
export declare const ELEMENT_TONES: readonly [
|
|
209
|
+
'default',
|
|
210
|
+
'neutral',
|
|
211
|
+
'primary',
|
|
212
|
+
'suggest',
|
|
213
|
+
'positive',
|
|
214
|
+
'caution',
|
|
215
|
+
'critical',
|
|
216
|
+
]
|
|
344
217
|
|
|
345
218
|
/** @public */
|
|
346
219
|
export declare interface ElementColorTokens {
|
|
@@ -359,6 +232,26 @@ export declare interface ElementColorTokens {
|
|
|
359
232
|
}
|
|
360
233
|
}
|
|
361
234
|
|
|
235
|
+
/** @public */
|
|
236
|
+
export declare type ElementsColorTokens = Record<'*' | ElementTone, ElementColorTokens>
|
|
237
|
+
|
|
238
|
+
/** @public */
|
|
239
|
+
export declare type ElementTone = (typeof ELEMENT_TONES)[number]
|
|
240
|
+
|
|
241
|
+
/** @public */
|
|
242
|
+
export declare interface FocusRing {
|
|
243
|
+
offset: number
|
|
244
|
+
width: number
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
/** @public */
|
|
248
|
+
export declare interface Font {
|
|
249
|
+
family: string
|
|
250
|
+
featureSettings?: string
|
|
251
|
+
weight: FontWeights
|
|
252
|
+
scale: FontSize[]
|
|
253
|
+
}
|
|
254
|
+
|
|
362
255
|
/** @public */
|
|
363
256
|
export declare const FONT_CODE_SIZE: readonly [0, 1, 2, 3, 4]
|
|
364
257
|
|
|
@@ -381,46 +274,38 @@ export declare type FontHeadingSize = (typeof FONT_HEADING_SIZE)[number]
|
|
|
381
274
|
export declare type FontLabelSize = (typeof FONT_LABEL_SIZE)[number]
|
|
382
275
|
|
|
383
276
|
/** @public */
|
|
384
|
-
export declare
|
|
277
|
+
export declare interface Fonts {
|
|
278
|
+
code: Font
|
|
279
|
+
heading: Font
|
|
280
|
+
label: Font
|
|
281
|
+
text: Font
|
|
282
|
+
}
|
|
385
283
|
|
|
386
284
|
/** @public */
|
|
387
|
-
export declare
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
export declare function getScopedTheme(
|
|
397
|
-
themeProp: RootTheme | RootTheme_v2,
|
|
398
|
-
scheme: ThemeColorSchemeKey,
|
|
399
|
-
tone: ThemeColorCardToneKey,
|
|
400
|
-
): Theme
|
|
285
|
+
export declare interface FontSize {
|
|
286
|
+
ascenderHeight: number
|
|
287
|
+
descenderHeight: number
|
|
288
|
+
fontSize: number
|
|
289
|
+
iconSize: number
|
|
290
|
+
letterSpacing: number
|
|
291
|
+
lineHeight: number
|
|
292
|
+
customIconSize: number
|
|
293
|
+
}
|
|
401
294
|
|
|
402
295
|
/** @public */
|
|
403
|
-
export declare
|
|
296
|
+
export declare type FontTextSize = (typeof FONT_TEXT_SIZE)[number]
|
|
404
297
|
|
|
405
|
-
/**
|
|
406
|
-
|
|
407
|
-
*/
|
|
408
|
-
export declare function hexToRgb(hex: string): RGB
|
|
298
|
+
/** @public */
|
|
299
|
+
export declare type FontWeight = 'regular' | 'medium' | 'semibold' | 'bold'
|
|
409
300
|
|
|
410
|
-
/**
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
l: number
|
|
301
|
+
/** @public */
|
|
302
|
+
export declare interface FontWeights {
|
|
303
|
+
regular: number
|
|
304
|
+
medium: number
|
|
305
|
+
semibold: number
|
|
306
|
+
bold: number
|
|
417
307
|
}
|
|
418
308
|
|
|
419
|
-
/**
|
|
420
|
-
* @internal
|
|
421
|
-
*/
|
|
422
|
-
export declare function hslToRgb(hsl: HSL): RGB
|
|
423
|
-
|
|
424
309
|
/** @public */
|
|
425
310
|
export declare type Hue = (typeof HUES)[number]
|
|
426
311
|
|
|
@@ -437,56 +322,60 @@ export declare const HUES: readonly [
|
|
|
437
322
|
'cyan',
|
|
438
323
|
]
|
|
439
324
|
|
|
440
|
-
/** @
|
|
441
|
-
export declare
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
/** @internal */
|
|
471
|
-
export declare function isColorValue(str: string): str is 'black' | 'white'
|
|
325
|
+
/** @public */
|
|
326
|
+
export declare interface Input {
|
|
327
|
+
checkbox: {
|
|
328
|
+
size: number
|
|
329
|
+
focusRing: FocusRing
|
|
330
|
+
}
|
|
331
|
+
radio: {
|
|
332
|
+
size: number
|
|
333
|
+
markSize: number
|
|
334
|
+
focusRing: FocusRing
|
|
335
|
+
}
|
|
336
|
+
switch: {
|
|
337
|
+
width: number
|
|
338
|
+
height: number
|
|
339
|
+
padding: number
|
|
340
|
+
transitionDurationMs: number
|
|
341
|
+
transitionTimingFunction: string
|
|
342
|
+
focusRing: FocusRing
|
|
343
|
+
}
|
|
344
|
+
border: {
|
|
345
|
+
width: number
|
|
346
|
+
}
|
|
347
|
+
select: {
|
|
348
|
+
focusRing: FocusRing
|
|
349
|
+
}
|
|
350
|
+
text: {
|
|
351
|
+
focusRing: FocusRing
|
|
352
|
+
}
|
|
353
|
+
}
|
|
472
354
|
|
|
473
|
-
/**
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
355
|
+
/** @public */
|
|
356
|
+
export declare interface Layer {
|
|
357
|
+
dialog: {
|
|
358
|
+
zOffset: number
|
|
359
|
+
}
|
|
360
|
+
popover: {
|
|
361
|
+
zOffset: number
|
|
362
|
+
}
|
|
363
|
+
tooltip: {
|
|
364
|
+
zOffset: number
|
|
365
|
+
}
|
|
366
|
+
}
|
|
478
367
|
|
|
479
|
-
/**
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
*/
|
|
484
|
-
export declare function multiply(b: RGB | RGBA, s: RGB | RGBA): RGB
|
|
368
|
+
/** @public */
|
|
369
|
+
export declare interface Options {
|
|
370
|
+
tokens?: PartialTokens<Tokens>
|
|
371
|
+
}
|
|
485
372
|
|
|
486
|
-
/**
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
373
|
+
/** @public */
|
|
374
|
+
export declare interface Palette {
|
|
375
|
+
black: ColorTint
|
|
376
|
+
white: ColorTint
|
|
377
|
+
hues: ColorHues
|
|
378
|
+
}
|
|
490
379
|
|
|
491
380
|
/** @internal */
|
|
492
381
|
export declare function _parseColorToken(
|
|
@@ -496,15 +385,6 @@ export declare function _parseColorToken(
|
|
|
496
385
|
},
|
|
497
386
|
): TokenizeColorResult
|
|
498
387
|
|
|
499
|
-
/** @internal */
|
|
500
|
-
export declare function parseTokenValue(str: string): TokenValueNode | undefined
|
|
501
|
-
|
|
502
|
-
/**
|
|
503
|
-
* @public
|
|
504
|
-
* @deprecated Use `ThemeConfig` instead.
|
|
505
|
-
*/
|
|
506
|
-
export declare type PartialThemeColorBuilderOpts = Partial<ThemeColorBuilderOpts>
|
|
507
|
-
|
|
508
388
|
/** @public */
|
|
509
389
|
export declare type PartialTokens<T> = T extends [ColorToken, ColorToken]
|
|
510
390
|
? T
|
|
@@ -541,1363 +421,81 @@ export declare interface ResolvedColorToken {
|
|
|
541
421
|
/** @internal */
|
|
542
422
|
export declare function resolveTokens(tokens?: PartialTokens<Tokens>): Tokens
|
|
543
423
|
|
|
544
|
-
/**
|
|
545
|
-
|
|
546
|
-
*/
|
|
547
|
-
export declare interface RGB {
|
|
548
|
-
r: number
|
|
549
|
-
g: number
|
|
550
|
-
b: number
|
|
551
|
-
a?: undefined
|
|
552
|
-
}
|
|
553
|
-
|
|
554
|
-
/**
|
|
555
|
-
* @internal
|
|
556
|
-
*/
|
|
557
|
-
export declare interface RGBA {
|
|
558
|
-
r: number
|
|
559
|
-
g: number
|
|
560
|
-
b: number
|
|
561
|
-
a: number
|
|
562
|
-
}
|
|
563
|
-
|
|
564
|
-
/**
|
|
565
|
-
* @internal
|
|
566
|
-
*/
|
|
567
|
-
export declare function rgba(color: unknown, a: number): string
|
|
424
|
+
/** @public */
|
|
425
|
+
export declare const SHADOW: readonly [0, 1, 2, 3, 4, 5]
|
|
568
426
|
|
|
569
|
-
/**
|
|
570
|
-
|
|
571
|
-
*/
|
|
572
|
-
export declare function rgbaToRGBA(rgba: string): RGBA
|
|
427
|
+
/** @public */
|
|
428
|
+
export declare type Shadow = (typeof SHADOW)[number]
|
|
573
429
|
|
|
574
|
-
/**
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
430
|
+
/** @public */
|
|
431
|
+
export declare interface ShadowProperties {
|
|
432
|
+
umbra: BoxShadow
|
|
433
|
+
penumbra: BoxShadow
|
|
434
|
+
ambient: BoxShadow
|
|
435
|
+
}
|
|
578
436
|
|
|
579
|
-
/**
|
|
580
|
-
|
|
581
|
-
* @see https://css-tricks.com/converting-color-spaces-in-javascript/
|
|
582
|
-
*/
|
|
583
|
-
export declare function rgbToHsl({r, g, b}: RGB): HSL
|
|
437
|
+
/** @public */
|
|
438
|
+
export declare const SPACE: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
|
|
584
439
|
|
|
585
440
|
/** @public */
|
|
586
|
-
export declare
|
|
587
|
-
v2?: RootTheme_v2
|
|
588
|
-
v3?: Theme_v3
|
|
589
|
-
}
|
|
441
|
+
export declare type Space = (typeof SPACE)[number]
|
|
590
442
|
|
|
591
443
|
/** @public */
|
|
592
|
-
export declare interface
|
|
593
|
-
_version
|
|
594
|
-
|
|
595
|
-
* @deprecated Use `v2.avatar` instead
|
|
596
|
-
*/
|
|
444
|
+
export declare interface Theme {
|
|
445
|
+
_version: 3
|
|
446
|
+
_tokens: Tokens
|
|
597
447
|
avatar: ThemeAvatar
|
|
598
|
-
/**
|
|
599
|
-
* @deprecated Use `v2.button` instead
|
|
600
|
-
*/
|
|
601
|
-
button: {
|
|
602
|
-
textWeight: ThemeFontWeightKey
|
|
603
|
-
}
|
|
604
|
-
/**
|
|
605
|
-
* @deprecated Use `v2.color` instead
|
|
606
|
-
*/
|
|
607
|
-
color: ThemeColorSchemes
|
|
608
|
-
/**
|
|
609
|
-
* @deprecated Use `v2.container` instead
|
|
610
|
-
*/
|
|
611
|
-
container: number[]
|
|
612
|
-
/**
|
|
613
|
-
* @deprecated Use component-specific `v2.{button | card | input}.focusRing` values instead
|
|
614
|
-
*/
|
|
615
|
-
focusRing: {
|
|
616
|
-
offset: number
|
|
617
|
-
width: number
|
|
618
|
-
}
|
|
619
|
-
/**
|
|
620
|
-
* @deprecated Use `v2.font` instead
|
|
621
|
-
*/
|
|
622
|
-
fonts: ThemeFonts
|
|
623
|
-
/**
|
|
624
|
-
* @deprecated Use `v2.input` instead
|
|
625
|
-
*/
|
|
626
|
-
input: ThemeInput
|
|
627
|
-
/**
|
|
628
|
-
* THIS API MAY BE UNSTABLE. DO NOT USE IN PRODUCTION.
|
|
629
|
-
* @beta
|
|
630
|
-
* @deprecated Use `v2.layer` instead
|
|
631
|
-
*/
|
|
632
|
-
layer?: ThemeLayer
|
|
633
|
-
/**
|
|
634
|
-
* @deprecated Use `v2.media` instead
|
|
635
|
-
*/
|
|
636
|
-
media: number[]
|
|
637
|
-
/**
|
|
638
|
-
* @deprecated Use `v2.radius` instead
|
|
639
|
-
*/
|
|
640
|
-
radius: number[]
|
|
641
|
-
/**
|
|
642
|
-
* @deprecated Use `v2.shadow` instead
|
|
643
|
-
*/
|
|
644
|
-
shadows: Array<ThemeShadow | null>
|
|
645
|
-
/**
|
|
646
|
-
* @deprecated Use `v2.space` instead
|
|
647
|
-
*/
|
|
648
|
-
space: number[]
|
|
649
|
-
/**
|
|
650
|
-
* @internal
|
|
651
|
-
* @deprecated Use `v2.style` instead
|
|
652
|
-
*/
|
|
653
|
-
styles?: ThemeStyles
|
|
654
|
-
}
|
|
655
|
-
|
|
656
|
-
/** @public */
|
|
657
|
-
export declare interface RootTheme_v2 {
|
|
658
|
-
_version: 2
|
|
659
|
-
avatar: ThemeAvatar_v2
|
|
660
|
-
button: {
|
|
661
|
-
border: {
|
|
662
|
-
width: number
|
|
663
|
-
}
|
|
664
|
-
focusRing: ThemeFocusRing
|
|
665
|
-
textWeight: ThemeFontWeightKey
|
|
666
|
-
}
|
|
667
|
-
card: {
|
|
668
|
-
border: {
|
|
669
|
-
width: number
|
|
670
|
-
}
|
|
671
|
-
focusRing: ThemeFocusRing
|
|
672
|
-
shadow: {
|
|
673
|
-
outline: number
|
|
674
|
-
}
|
|
675
|
-
}
|
|
676
|
-
color: ThemeColorSchemes_v2
|
|
677
|
-
container: number[]
|
|
678
|
-
font: ThemeFonts
|
|
679
|
-
input: ThemeInput_v2
|
|
680
|
-
layer: ThemeLayer
|
|
681
|
-
media: number[]
|
|
682
|
-
radius: number[]
|
|
683
|
-
shadow: Array<ThemeShadow | null>
|
|
684
|
-
space: number[]
|
|
685
|
-
/** @internal */
|
|
686
|
-
style?: ThemeStyles
|
|
687
|
-
}
|
|
688
|
-
|
|
689
|
-
/**
|
|
690
|
-
* Apply the \`screen\` blend mode
|
|
691
|
-
* Source: https://www.w3.org/TR/compositing-1/#blendingscreen
|
|
692
|
-
* @internal
|
|
693
|
-
*/
|
|
694
|
-
declare function screen_2(b: RGB | RGBA, s: RGB | RGBA): RGB
|
|
695
|
-
export {screen_2 as screen}
|
|
696
|
-
|
|
697
|
-
/** @public */
|
|
698
|
-
export declare const SHADOW: readonly [0, 1, 2, 3, 4, 5]
|
|
699
|
-
|
|
700
|
-
/** @public */
|
|
701
|
-
export declare type Shadow = (typeof SHADOW)[number]
|
|
702
|
-
|
|
703
|
-
/** @public */
|
|
704
|
-
export declare const SPACE: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
|
|
705
|
-
|
|
706
|
-
/** @public */
|
|
707
|
-
export declare type Space = (typeof SPACE)[number]
|
|
708
|
-
|
|
709
|
-
/**
|
|
710
|
-
* Used for the `theme` prop in `styled-components`’s `ThemeProvider`.
|
|
711
|
-
*
|
|
712
|
-
* @public
|
|
713
|
-
*/
|
|
714
|
-
export declare interface Theme {
|
|
715
|
-
sanity: Omit<RootTheme, 'color' | 'v2'> & {
|
|
716
|
-
/**
|
|
717
|
-
* @deprecated Use `v2.color` instead
|
|
718
|
-
*/
|
|
719
|
-
color: ThemeColor
|
|
720
|
-
v2?: Theme_v2
|
|
721
|
-
}
|
|
722
|
-
}
|
|
723
|
-
|
|
724
|
-
/** @public */
|
|
725
|
-
export declare const THEME_COLOR_AVATAR_COLORS: ColorHueKey[]
|
|
726
|
-
|
|
727
|
-
/** @public */
|
|
728
|
-
export declare const THEME_COLOR_BLEND_MODES: readonly ['multiply', 'screen']
|
|
729
|
-
|
|
730
|
-
/** @public */
|
|
731
|
-
export declare const THEME_COLOR_BUTTON_MODES: readonly ['default', 'ghost', 'bleed']
|
|
732
|
-
|
|
733
|
-
/** @public */
|
|
734
|
-
export declare const THEME_COLOR_CARD_TONES: readonly [
|
|
735
|
-
'transparent',
|
|
736
|
-
'default',
|
|
737
|
-
'neutral',
|
|
738
|
-
'primary',
|
|
739
|
-
'suggest',
|
|
740
|
-
'positive',
|
|
741
|
-
'caution',
|
|
742
|
-
'critical',
|
|
743
|
-
]
|
|
744
|
-
|
|
745
|
-
/** @public */
|
|
746
|
-
export declare const THEME_COLOR_INPUT_MODES: readonly ['default', 'invalid']
|
|
747
|
-
|
|
748
|
-
/** @public */
|
|
749
|
-
export declare const THEME_COLOR_INPUT_STATES: readonly [
|
|
750
|
-
'enabled',
|
|
751
|
-
'hovered',
|
|
752
|
-
'readOnly',
|
|
753
|
-
'disabled',
|
|
754
|
-
]
|
|
755
|
-
|
|
756
|
-
/** @public */
|
|
757
|
-
export declare const THEME_COLOR_SCHEMES: readonly ['light', 'dark']
|
|
758
|
-
|
|
759
|
-
/** @public */
|
|
760
|
-
export declare const THEME_COLOR_STATE_TONES: readonly [
|
|
761
|
-
'default',
|
|
762
|
-
'neutral',
|
|
763
|
-
'primary',
|
|
764
|
-
'suggest',
|
|
765
|
-
'positive',
|
|
766
|
-
'caution',
|
|
767
|
-
'critical',
|
|
768
|
-
]
|
|
769
|
-
|
|
770
|
-
/** @public */
|
|
771
|
-
export declare const THEME_COLOR_STATES: readonly [
|
|
772
|
-
'enabled',
|
|
773
|
-
'hovered',
|
|
774
|
-
'pressed',
|
|
775
|
-
'selected',
|
|
776
|
-
'disabled',
|
|
777
|
-
]
|
|
778
|
-
|
|
779
|
-
/** @public */
|
|
780
|
-
export declare type Theme_v2 = Omit<RootTheme_v2, 'color'> & {
|
|
781
|
-
color: ThemeColorCard_v2
|
|
782
|
-
/**
|
|
783
|
-
* Indicates whether the theme is resolved or raw, it's necessary to avoid issues
|
|
784
|
-
* with sanity V2 components accessing a v1 <ThemeProvider>.
|
|
785
|
-
* See https://github.com/sanity-io/ui/pull/1203 for more info.
|
|
786
|
-
*/
|
|
787
|
-
_resolved: boolean
|
|
788
|
-
}
|
|
789
|
-
|
|
790
|
-
/**
|
|
791
|
-
* Supersedes `RootTheme` and `RootTheme_v2`.
|
|
792
|
-
*
|
|
793
|
-
* @public
|
|
794
|
-
*/
|
|
795
|
-
export declare interface Theme_v3 {
|
|
796
|
-
_version: 3
|
|
797
|
-
_tokens: Tokens
|
|
798
|
-
avatar: ThemeAvatar_v2
|
|
799
448
|
button: {
|
|
800
449
|
border: {
|
|
801
450
|
width: number
|
|
802
451
|
}
|
|
803
|
-
focusRing:
|
|
804
|
-
textWeight:
|
|
452
|
+
focusRing: FocusRing
|
|
453
|
+
textWeight: FontWeight
|
|
805
454
|
}
|
|
806
455
|
card: {
|
|
807
456
|
border: {
|
|
808
457
|
width: number
|
|
809
458
|
}
|
|
810
|
-
focusRing:
|
|
459
|
+
focusRing: FocusRing
|
|
811
460
|
shadow: {
|
|
812
461
|
outline: number
|
|
813
462
|
}
|
|
814
463
|
}
|
|
815
|
-
color:
|
|
464
|
+
color: Color
|
|
816
465
|
container: number[]
|
|
817
|
-
font:
|
|
818
|
-
input:
|
|
819
|
-
layer:
|
|
466
|
+
font: Fonts
|
|
467
|
+
input: Input
|
|
468
|
+
layer: Layer
|
|
820
469
|
media: number[]
|
|
821
|
-
palette:
|
|
470
|
+
palette: Palette
|
|
822
471
|
radius: Record<Radius, number>
|
|
823
|
-
shadow: Record<Shadow,
|
|
472
|
+
shadow: Record<Shadow, ShadowProperties | undefined>
|
|
824
473
|
space: Record<Space, number>
|
|
825
474
|
}
|
|
826
475
|
|
|
827
|
-
/**
|
|
828
|
-
* @public
|
|
829
|
-
* @deprecated Use `ThemeAvatar_v2` from `@sanity/ui/theme` instead.
|
|
830
|
-
*/
|
|
831
|
-
export declare interface ThemeAvatar {
|
|
832
|
-
sizes: {
|
|
833
|
-
distance: number
|
|
834
|
-
size: number
|
|
835
|
-
}[]
|
|
836
|
-
}
|
|
837
|
-
|
|
838
476
|
/** @public */
|
|
839
|
-
export declare interface
|
|
477
|
+
export declare interface ThemeAvatar {
|
|
840
478
|
sizes: {
|
|
841
479
|
/** Spacing between avatars in an <AvatarStack> component (px) */
|
|
842
480
|
distance: number
|
|
843
481
|
/** Diameter of the avatar (px) */
|
|
844
482
|
size: number
|
|
845
483
|
}[]
|
|
846
|
-
focusRing:
|
|
847
|
-
}
|
|
848
|
-
|
|
849
|
-
/** @public */
|
|
850
|
-
export declare type ThemeBoxShadow = [number, number, number, number]
|
|
851
|
-
|
|
852
|
-
/**
|
|
853
|
-
* @public
|
|
854
|
-
* @deprecated Use `ThemeColor_v2` instead.
|
|
855
|
-
*/
|
|
856
|
-
export declare interface ThemeColor extends Partial<Omit<ThemeColorGenericState, 'muted'>> {
|
|
857
|
-
base: ThemeColorBase
|
|
858
|
-
button: ThemeColorButton
|
|
859
|
-
card: ThemeColorCard
|
|
860
|
-
dark: boolean
|
|
861
|
-
input: ThemeColorInput
|
|
862
|
-
muted: ThemeColorMuted
|
|
863
|
-
selectable?: ThemeColorSelectable
|
|
864
|
-
solid: ThemeColorSolid
|
|
865
|
-
spot: ThemeColorSpot
|
|
866
|
-
syntax: ThemeColorSyntax
|
|
867
|
-
}
|
|
868
|
-
|
|
869
|
-
/** @public */
|
|
870
|
-
export declare type ThemeColor_v3 = Record<ThemeColorCardToneKey, ThemeColorCard_v3>
|
|
871
|
-
|
|
872
|
-
/** @public */
|
|
873
|
-
export declare type ThemeColorAvatar_v2 = Record<ThemeColorAvatarColorKey, ThemeColorAvatarHue_v2>
|
|
874
|
-
|
|
875
|
-
/** @public */
|
|
876
|
-
export declare type ThemeColorAvatar_v3 = Record<AvatarColor, ThemeColorAvatarHue_v3>
|
|
877
|
-
|
|
878
|
-
/** @public */
|
|
879
|
-
export declare type ThemeColorAvatarColorKey = (typeof THEME_COLOR_AVATAR_COLORS)[number]
|
|
880
|
-
|
|
881
|
-
/** @public */
|
|
882
|
-
export declare interface ThemeColorAvatarHue_v2 {
|
|
883
|
-
_blend?: ThemeColorBlendModeKey
|
|
884
|
-
bg: string
|
|
885
|
-
fg: string
|
|
886
|
-
}
|
|
887
|
-
|
|
888
|
-
/** @public */
|
|
889
|
-
export declare interface ThemeColorAvatarHue_v3 {
|
|
890
|
-
bg: ColorValue
|
|
891
|
-
fg: ColorValue
|
|
892
|
-
}
|
|
893
|
-
|
|
894
|
-
/** @public */
|
|
895
|
-
export declare interface ThemeColorAvatarHueTokens {
|
|
896
|
-
_blend?: ColorBlendModeTokenValue
|
|
897
|
-
_hue?: Hue_2
|
|
898
|
-
bg?: ThemeColorTokenValue
|
|
899
|
-
fg?: ThemeColorTokenValue
|
|
900
|
-
}
|
|
901
|
-
|
|
902
|
-
/** @public */
|
|
903
|
-
export declare interface ThemeColorAvatarTokens {
|
|
904
|
-
'*'?: ThemeColorAvatarHueTokens
|
|
905
|
-
'gray'?: ThemeColorAvatarHueTokens
|
|
906
|
-
'blue'?: ThemeColorAvatarHueTokens
|
|
907
|
-
'purple'?: ThemeColorAvatarHueTokens
|
|
908
|
-
'magenta'?: ThemeColorAvatarHueTokens
|
|
909
|
-
'red'?: ThemeColorAvatarHueTokens
|
|
910
|
-
'orange'?: ThemeColorAvatarHueTokens
|
|
911
|
-
'yellow'?: ThemeColorAvatarHueTokens
|
|
912
|
-
'green'?: ThemeColorAvatarHueTokens
|
|
913
|
-
'cyan'?: ThemeColorAvatarHueTokens
|
|
914
|
-
}
|
|
915
|
-
|
|
916
|
-
/** @public */
|
|
917
|
-
export declare type ThemeColorBadge_v2 = Record<ThemeColorStateToneKey, ThemeColorBadgeTone_v2>
|
|
918
|
-
|
|
919
|
-
/** @public */
|
|
920
|
-
export declare type ThemeColorBadgeTokens = Partial<
|
|
921
|
-
Record<'*' | ThemeColorStateToneKey, ThemeColorBadgeToneTokens>
|
|
922
|
-
>
|
|
923
|
-
|
|
924
|
-
/** @public */
|
|
925
|
-
export declare interface ThemeColorBadgeTone_v2 {
|
|
926
|
-
bg: string
|
|
927
|
-
fg: string
|
|
928
|
-
dot: string
|
|
929
|
-
icon: string
|
|
930
|
-
}
|
|
931
|
-
|
|
932
|
-
/** @public */
|
|
933
|
-
export declare interface ThemeColorBadgeToneTokens {
|
|
934
|
-
_blend?: ColorBlendModeTokenValue
|
|
935
|
-
_hue?: Hue_2
|
|
936
|
-
bg?: ThemeColorTokenValue
|
|
937
|
-
dot?: ThemeColorTokenValue
|
|
938
|
-
fg?: ThemeColorTokenValue
|
|
939
|
-
icon?: ThemeColorTokenValue
|
|
940
|
-
}
|
|
941
|
-
|
|
942
|
-
/**
|
|
943
|
-
* @public
|
|
944
|
-
* @deprecated Use `ThemeColorCard_v2` instead.
|
|
945
|
-
*/
|
|
946
|
-
export declare interface ThemeColorBase {
|
|
947
|
-
bg: string
|
|
948
|
-
fg: string
|
|
949
|
-
border: string
|
|
950
|
-
focusRing: string
|
|
951
|
-
backdrop?: string
|
|
952
|
-
shadow: {
|
|
953
|
-
outline: string
|
|
954
|
-
umbra: string
|
|
955
|
-
penumbra: string
|
|
956
|
-
ambient: string
|
|
957
|
-
}
|
|
958
|
-
skeleton?: {
|
|
959
|
-
from: string
|
|
960
|
-
to: string
|
|
961
|
-
}
|
|
962
|
-
}
|
|
963
|
-
|
|
964
|
-
/** @public */
|
|
965
|
-
export declare interface ThemeColorBaseTokens extends ThemeColorStateTokens {
|
|
966
|
-
focusRing?: ThemeColorTokenValue
|
|
967
|
-
backdrop?: ThemeColorTokenValue
|
|
968
|
-
shadow?: {
|
|
969
|
-
outline?: ThemeColorTokenValue
|
|
970
|
-
umbra?: ThemeColorTokenValue
|
|
971
|
-
penumbra?: ThemeColorTokenValue
|
|
972
|
-
ambient?: ThemeColorTokenValue
|
|
973
|
-
}
|
|
974
|
-
}
|
|
975
|
-
|
|
976
|
-
/** @public */
|
|
977
|
-
export declare type ThemeColorBlendModeKey = (typeof THEME_COLOR_BLEND_MODES)[number]
|
|
978
|
-
|
|
979
|
-
/**
|
|
980
|
-
* @public
|
|
981
|
-
* @deprecated Use `buildColorTheme` instead.
|
|
982
|
-
*/
|
|
983
|
-
export declare interface ThemeColorBuilderOpts {
|
|
984
|
-
base: (opts: {dark: boolean; name: ThemeColorName}) => ThemeColorBase
|
|
985
|
-
solid: (opts: {
|
|
986
|
-
base: ThemeColorBase
|
|
987
|
-
dark: boolean
|
|
988
|
-
tone: ThemeColorName
|
|
989
|
-
name: ThemeColorName
|
|
990
|
-
state: 'enabled' | 'disabled' | 'hovered' | 'pressed' | 'selected'
|
|
991
|
-
}) => ThemeColorGenericState
|
|
992
|
-
muted: (opts: {
|
|
993
|
-
base: ThemeColorBase
|
|
994
|
-
dark: boolean
|
|
995
|
-
tone: ThemeColorToneKey
|
|
996
|
-
name: ThemeColorName
|
|
997
|
-
state: 'enabled' | 'disabled' | 'hovered' | 'pressed' | 'selected'
|
|
998
|
-
}) => ThemeColorGenericState
|
|
999
|
-
card: (opts: {
|
|
1000
|
-
base: ThemeColorBase
|
|
1001
|
-
dark: boolean
|
|
1002
|
-
muted: ThemeColorMuted
|
|
1003
|
-
name: ThemeColorName
|
|
1004
|
-
solid: ThemeColorSolid
|
|
1005
|
-
state: 'enabled' | 'disabled' | 'hovered' | 'pressed' | 'selected'
|
|
1006
|
-
}) => ThemeColorGenericState
|
|
1007
|
-
button: (opts: {
|
|
1008
|
-
dark: boolean
|
|
1009
|
-
mode: ThemeColorButtonModeKey
|
|
1010
|
-
base: ThemeColorBase
|
|
1011
|
-
solid: ThemeColorSolidTone
|
|
1012
|
-
muted: ThemeColorMutedTone
|
|
1013
|
-
}) => ThemeColorButtonStates
|
|
1014
|
-
input: (opts: {
|
|
1015
|
-
base: ThemeColorBase
|
|
1016
|
-
solid: ThemeColorSolidTone
|
|
1017
|
-
muted: ThemeColorMutedTone
|
|
1018
|
-
dark: boolean
|
|
1019
|
-
mode: 'default' | 'invalid'
|
|
1020
|
-
state: 'enabled' | 'disabled' | 'hovered' | 'readOnly'
|
|
1021
|
-
}) => ThemeColorInputState
|
|
1022
|
-
selectable: (opts: {
|
|
1023
|
-
dark: boolean
|
|
1024
|
-
base: ThemeColorBase
|
|
1025
|
-
solid: ThemeColorSolid
|
|
1026
|
-
muted: ThemeColorMuted
|
|
1027
|
-
state: 'enabled' | 'disabled' | 'hovered' | 'pressed' | 'selected'
|
|
1028
|
-
tone: 'default' | 'primary' | 'positive' | 'caution' | 'critical'
|
|
1029
|
-
}) => ThemeColorGenericState
|
|
1030
|
-
syntax: (opts: {base: ThemeColorBase; dark: boolean}) => ThemeColorSyntax
|
|
1031
|
-
spot: (opts: {base: ThemeColorBase; dark: boolean; key: ThemeColorSpotKey}) => string
|
|
1032
|
-
}
|
|
1033
|
-
|
|
1034
|
-
/**
|
|
1035
|
-
* @public
|
|
1036
|
-
* @deprecated Use `ThemeColorButton_v2` instead.
|
|
1037
|
-
*/
|
|
1038
|
-
export declare interface ThemeColorButton {
|
|
1039
|
-
default: ThemeColorButtonTones
|
|
1040
|
-
ghost: ThemeColorButtonTones
|
|
1041
|
-
bleed: ThemeColorButtonTones
|
|
1042
|
-
}
|
|
1043
|
-
|
|
1044
|
-
/** @public */
|
|
1045
|
-
export declare type ThemeColorButton_v2 = Record<ThemeColorButtonModeKey, ThemeColorButtonMode_v2>
|
|
1046
|
-
|
|
1047
|
-
/** @public */
|
|
1048
|
-
export declare type ThemeColorButtonMode_v2 = Record<
|
|
1049
|
-
ThemeColorStateToneKey,
|
|
1050
|
-
ThemeColorButtonTone_v2
|
|
1051
|
-
>
|
|
1052
|
-
|
|
1053
|
-
/** @public */
|
|
1054
|
-
export declare type ThemeColorButtonModeKey = (typeof THEME_COLOR_BUTTON_MODES)[number]
|
|
1055
|
-
|
|
1056
|
-
/**
|
|
1057
|
-
* @public
|
|
1058
|
-
* @deprecated Use `ThemeColorState_v2` instead.
|
|
1059
|
-
*/
|
|
1060
|
-
export declare type ThemeColorButtonState = ThemeColorGenericState
|
|
1061
|
-
|
|
1062
|
-
/**
|
|
1063
|
-
* @public
|
|
1064
|
-
* @deprecated Use `ThemeColorButtonStates_v2` instead.
|
|
1065
|
-
*/
|
|
1066
|
-
export declare interface ThemeColorButtonStates {
|
|
1067
|
-
enabled: ThemeColorGenericState
|
|
1068
|
-
hovered: ThemeColorGenericState
|
|
1069
|
-
pressed: ThemeColorGenericState
|
|
1070
|
-
selected: ThemeColorGenericState
|
|
1071
|
-
disabled: ThemeColorGenericState
|
|
484
|
+
focusRing: FocusRing
|
|
1072
485
|
}
|
|
1073
486
|
|
|
1074
487
|
/** @public */
|
|
1075
|
-
export declare
|
|
1076
|
-
extends Partial<Record<ColorConfigStateTone, ThemeColorStatesTokens>> {
|
|
1077
|
-
_hue?: Hue_2
|
|
1078
|
-
}
|
|
488
|
+
export declare type Tint = (typeof TINTS)[number]
|
|
1079
489
|
|
|
1080
490
|
/** @public */
|
|
1081
|
-
export declare
|
|
1082
|
-
|
|
1083
|
-
/**
|
|
1084
|
-
* TODO: Rename to `ThemeColorButtonMode`.
|
|
1085
|
-
* @public
|
|
1086
|
-
* @deprecated Use `ThemeColorButtonTones_v2` instead.
|
|
1087
|
-
*/
|
|
1088
|
-
export declare interface ThemeColorButtonTones {
|
|
1089
|
-
default: ThemeColorButtonStates
|
|
1090
|
-
primary: ThemeColorButtonStates
|
|
1091
|
-
positive: ThemeColorButtonStates
|
|
1092
|
-
caution: ThemeColorButtonStates
|
|
1093
|
-
critical: ThemeColorButtonStates
|
|
1094
|
-
}
|
|
491
|
+
export declare const TINTS: readonly [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950]
|
|
1095
492
|
|
|
1096
|
-
/**
|
|
1097
|
-
|
|
1098
|
-
* @deprecated Use `ThemeColorSelectable_v2` instead.
|
|
1099
|
-
*/
|
|
1100
|
-
export declare interface ThemeColorCard {
|
|
1101
|
-
enabled: ThemeColorGenericState
|
|
1102
|
-
hovered: ThemeColorGenericState
|
|
1103
|
-
pressed: ThemeColorGenericState
|
|
1104
|
-
selected: ThemeColorGenericState
|
|
1105
|
-
disabled: ThemeColorGenericState
|
|
1106
|
-
}
|
|
493
|
+
/** @internal */
|
|
494
|
+
export declare type TokenizeColorResult = ColorNode | ColorTintNode | ColorInheritNode
|
|
1107
495
|
|
|
1108
496
|
/** @public */
|
|
1109
|
-
export declare interface
|
|
1110
|
-
|
|
1111
|
-
_blend: ThemeColorBlendModeKey
|
|
1112
|
-
_dark: boolean
|
|
1113
|
-
backdrop: string
|
|
1114
|
-
button: ThemeColorButton_v2
|
|
1115
|
-
focusRing: string
|
|
1116
|
-
input: ThemeColorInput_v2
|
|
1117
|
-
selectable: ThemeColorSelectable_v2
|
|
1118
|
-
shadow: ThemeColorShadow
|
|
1119
|
-
syntax: ThemeColorSyntax
|
|
497
|
+
export declare interface Tokens {
|
|
498
|
+
color: ColorTokens
|
|
1120
499
|
}
|
|
1121
500
|
|
|
1122
|
-
/** @public */
|
|
1123
|
-
export declare interface ThemeColorCard_v3 {
|
|
1124
|
-
_hue: Hue
|
|
1125
|
-
avatar: ThemeColorAvatar_v3
|
|
1126
|
-
backdrop: ColorValue
|
|
1127
|
-
code: {
|
|
1128
|
-
bg: ColorValue
|
|
1129
|
-
fg: ColorValue
|
|
1130
|
-
token: {
|
|
1131
|
-
atrule: ColorValue
|
|
1132
|
-
attrName: ColorValue
|
|
1133
|
-
attrValue: ColorValue
|
|
1134
|
-
attribute: ColorValue
|
|
1135
|
-
boolean: ColorValue
|
|
1136
|
-
builtin: ColorValue
|
|
1137
|
-
cdata: ColorValue
|
|
1138
|
-
char: ColorValue
|
|
1139
|
-
class: ColorValue
|
|
1140
|
-
className: ColorValue
|
|
1141
|
-
comment: ColorValue
|
|
1142
|
-
constant: ColorValue
|
|
1143
|
-
deleted: ColorValue
|
|
1144
|
-
doctype: ColorValue
|
|
1145
|
-
entity: ColorValue
|
|
1146
|
-
function: ColorValue
|
|
1147
|
-
hexcode: ColorValue
|
|
1148
|
-
id: ColorValue
|
|
1149
|
-
important: ColorValue
|
|
1150
|
-
inserted: ColorValue
|
|
1151
|
-
keyword: ColorValue
|
|
1152
|
-
number: ColorValue
|
|
1153
|
-
operator: ColorValue
|
|
1154
|
-
prolog: ColorValue
|
|
1155
|
-
property: ColorValue
|
|
1156
|
-
pseudoClass: ColorValue
|
|
1157
|
-
pseudoElement: ColorValue
|
|
1158
|
-
punctuation: ColorValue
|
|
1159
|
-
regex: ColorValue
|
|
1160
|
-
selector: ColorValue
|
|
1161
|
-
string: ColorValue
|
|
1162
|
-
symbol: ColorValue
|
|
1163
|
-
tag: ColorValue
|
|
1164
|
-
unit: ColorValue
|
|
1165
|
-
url: ColorValue
|
|
1166
|
-
variable: ColorValue
|
|
1167
|
-
}
|
|
1168
|
-
}
|
|
1169
|
-
focusRing: ColorValue
|
|
1170
|
-
link: {
|
|
1171
|
-
fg: ColorValue
|
|
1172
|
-
}
|
|
1173
|
-
shadow: {
|
|
1174
|
-
outline: ColorValue
|
|
1175
|
-
umbra: ColorValue
|
|
1176
|
-
penumbra: ColorValue
|
|
1177
|
-
ambient: ColorValue
|
|
1178
|
-
}
|
|
1179
|
-
skeleton: {
|
|
1180
|
-
from: ColorValue
|
|
1181
|
-
to: ColorValue
|
|
1182
|
-
}
|
|
1183
|
-
variant: Record<ThemeColorVariantKey, ThemeColorVariant>
|
|
1184
|
-
}
|
|
1185
|
-
|
|
1186
|
-
/**
|
|
1187
|
-
* @public
|
|
1188
|
-
* @deprecated Use `ThemeColorState_v2` instead.
|
|
1189
|
-
*/
|
|
1190
|
-
export declare type ThemeColorCardState = ThemeColorGenericState
|
|
1191
|
-
|
|
1192
|
-
/** @public */
|
|
1193
|
-
export declare type ThemeColorCardToneKey = (typeof THEME_COLOR_CARD_TONES)[number]
|
|
1194
|
-
|
|
1195
|
-
/** @public */
|
|
1196
|
-
export declare interface ThemeColorElement {
|
|
1197
|
-
_hue: Hue
|
|
1198
|
-
bg: {
|
|
1199
|
-
0: ColorValue
|
|
1200
|
-
4: ColorValue
|
|
1201
|
-
}
|
|
1202
|
-
border: {
|
|
1203
|
-
0: ColorValue
|
|
1204
|
-
4: ColorValue
|
|
1205
|
-
}
|
|
1206
|
-
fg: {
|
|
1207
|
-
0: ColorValue
|
|
1208
|
-
4: ColorValue
|
|
1209
|
-
}
|
|
1210
|
-
}
|
|
1211
|
-
|
|
1212
|
-
/**
|
|
1213
|
-
* @public
|
|
1214
|
-
* @deprecated Use `ThemeColorState_v2` instead.
|
|
1215
|
-
*/
|
|
1216
|
-
export declare interface ThemeColorGenericState {
|
|
1217
|
-
/** @internal */
|
|
1218
|
-
_blend?: ThemeColorBlendModeKey
|
|
1219
|
-
bg: string
|
|
1220
|
-
/**
|
|
1221
|
-
* @beta
|
|
1222
|
-
*/
|
|
1223
|
-
bg2?: string
|
|
1224
|
-
border: string
|
|
1225
|
-
fg: string
|
|
1226
|
-
icon: string
|
|
1227
|
-
muted: {
|
|
1228
|
-
fg: string
|
|
1229
|
-
}
|
|
1230
|
-
accent: {
|
|
1231
|
-
fg: string
|
|
1232
|
-
}
|
|
1233
|
-
link: {
|
|
1234
|
-
fg: string
|
|
1235
|
-
}
|
|
1236
|
-
code: {
|
|
1237
|
-
bg: string
|
|
1238
|
-
fg: string
|
|
1239
|
-
}
|
|
1240
|
-
skeleton?: {
|
|
1241
|
-
from: string
|
|
1242
|
-
to: string
|
|
1243
|
-
}
|
|
1244
|
-
}
|
|
1245
|
-
|
|
1246
|
-
/**
|
|
1247
|
-
* @public
|
|
1248
|
-
* @deprecated Use `ThemeColorInput_v2` instead.
|
|
1249
|
-
*/
|
|
1250
|
-
export declare interface ThemeColorInput {
|
|
1251
|
-
default: ThemeColorInputStates
|
|
1252
|
-
invalid: ThemeColorInputStates
|
|
1253
|
-
}
|
|
1254
|
-
|
|
1255
|
-
/** @public */
|
|
1256
|
-
export declare type ThemeColorInput_v2 = Record<ThemeColorInputModeKey, ThemeColorInputMode_v2>
|
|
1257
|
-
|
|
1258
|
-
/** @public */
|
|
1259
|
-
export declare type ThemeColorInputMode_v2 = Record<
|
|
1260
|
-
ThemeColorInputStateKey,
|
|
1261
|
-
ThemeColorInputState_v2
|
|
1262
|
-
>
|
|
1263
|
-
|
|
1264
|
-
/** @public */
|
|
1265
|
-
export declare type ThemeColorInputModeKey = (typeof THEME_COLOR_INPUT_MODES)[number]
|
|
1266
|
-
|
|
1267
|
-
/**
|
|
1268
|
-
* @public
|
|
1269
|
-
* @deprecated Use `ThemeColorInputState_v2` instead.
|
|
1270
|
-
*/
|
|
1271
|
-
export declare interface ThemeColorInputState {
|
|
1272
|
-
_blend?: ThemeColorBlendModeKey
|
|
1273
|
-
bg: string
|
|
1274
|
-
bg2: string
|
|
1275
|
-
border: string
|
|
1276
|
-
fg: string
|
|
1277
|
-
placeholder: string
|
|
1278
|
-
}
|
|
1279
|
-
|
|
1280
|
-
/** @public */
|
|
1281
|
-
export declare interface ThemeColorInputState_v2 {
|
|
1282
|
-
_blend?: ThemeColorBlendModeKey
|
|
1283
|
-
bg: string
|
|
1284
|
-
border: string
|
|
1285
|
-
fg: string
|
|
1286
|
-
muted: {
|
|
1287
|
-
bg: string
|
|
1288
|
-
}
|
|
1289
|
-
placeholder: string
|
|
1290
|
-
}
|
|
1291
|
-
|
|
1292
|
-
/** @public */
|
|
1293
|
-
export declare type ThemeColorInputStateKey = (typeof THEME_COLOR_INPUT_STATES)[number]
|
|
1294
|
-
|
|
1295
|
-
/**
|
|
1296
|
-
* @public
|
|
1297
|
-
* @deprecated Use `ThemeColorInputMode_v2` instead.
|
|
1298
|
-
*/
|
|
1299
|
-
export declare interface ThemeColorInputStates {
|
|
1300
|
-
enabled: ThemeColorInputState
|
|
1301
|
-
disabled: ThemeColorInputState
|
|
1302
|
-
hovered: ThemeColorInputState
|
|
1303
|
-
readOnly: ThemeColorInputState
|
|
1304
|
-
}
|
|
1305
|
-
|
|
1306
|
-
/** @public */
|
|
1307
|
-
export declare interface ThemeColorInputStateTokens {
|
|
1308
|
-
_blend?: ColorBlendModeTokenValue
|
|
1309
|
-
_hue?: Hue_2
|
|
1310
|
-
bg?: ThemeColorTokenValue
|
|
1311
|
-
border?: ThemeColorTokenValue
|
|
1312
|
-
fg?: ThemeColorTokenValue
|
|
1313
|
-
muted?: {
|
|
1314
|
-
bg?: ThemeColorTokenValue
|
|
1315
|
-
}
|
|
1316
|
-
placeholder?: ThemeColorTokenValue
|
|
1317
|
-
}
|
|
1318
|
-
|
|
1319
|
-
/** @public */
|
|
1320
|
-
export declare interface ThemeColorInputTokens
|
|
1321
|
-
extends Partial<Record<ColorConfigInputState, ThemeColorInputStateTokens>> {
|
|
1322
|
-
_hue?: Hue_2
|
|
1323
|
-
}
|
|
1324
|
-
|
|
1325
|
-
/** @public */
|
|
1326
|
-
export declare interface ThemeColorKBD {
|
|
1327
|
-
bg: string
|
|
1328
|
-
fg: string
|
|
1329
|
-
border: string
|
|
1330
|
-
}
|
|
1331
|
-
|
|
1332
|
-
/**
|
|
1333
|
-
* @public
|
|
1334
|
-
* @deprecated Use `ThemeColorSelectable_v2` instead.
|
|
1335
|
-
*/
|
|
1336
|
-
export declare interface ThemeColorMuted {
|
|
1337
|
-
default: ThemeColorMutedTone
|
|
1338
|
-
transparent: ThemeColorMutedTone
|
|
1339
|
-
primary: ThemeColorMutedTone
|
|
1340
|
-
positive: ThemeColorMutedTone
|
|
1341
|
-
caution: ThemeColorMutedTone
|
|
1342
|
-
critical: ThemeColorMutedTone
|
|
1343
|
-
}
|
|
1344
|
-
|
|
1345
|
-
/**
|
|
1346
|
-
* @public
|
|
1347
|
-
* @deprecated Use `ThemeColorSelectableTone_v2` instead.
|
|
1348
|
-
*/
|
|
1349
|
-
export declare interface ThemeColorMutedTone {
|
|
1350
|
-
enabled: ThemeColorGenericState
|
|
1351
|
-
disabled: ThemeColorGenericState
|
|
1352
|
-
hovered: ThemeColorGenericState
|
|
1353
|
-
pressed: ThemeColorGenericState
|
|
1354
|
-
selected: ThemeColorGenericState
|
|
1355
|
-
}
|
|
1356
|
-
|
|
1357
|
-
/**
|
|
1358
|
-
* @public
|
|
1359
|
-
* @deprecated Use `ThemeColorCardToneKey` instead.
|
|
1360
|
-
*/
|
|
1361
|
-
export declare type ThemeColorName =
|
|
1362
|
-
| 'transparent'
|
|
1363
|
-
| 'default'
|
|
1364
|
-
| 'primary'
|
|
1365
|
-
| 'positive'
|
|
1366
|
-
| 'caution'
|
|
1367
|
-
| 'critical'
|
|
1368
|
-
|
|
1369
|
-
/** @public */
|
|
1370
|
-
export declare type ThemeColorPalette = {
|
|
1371
|
-
black: string | ColorTint
|
|
1372
|
-
white: string | ColorTint
|
|
1373
|
-
} & Record<Hue, Record<Tint, string | ColorTint>>
|
|
1374
|
-
|
|
1375
|
-
/**
|
|
1376
|
-
* @public
|
|
1377
|
-
* @deprecated Use `ThemeColorScheme_v2` instead.
|
|
1378
|
-
*/
|
|
1379
|
-
export declare type ThemeColorScheme = Record<ThemeColorName, ThemeColor>
|
|
1380
|
-
|
|
1381
|
-
/** @public */
|
|
1382
|
-
export declare type ThemeColorScheme_v2 = Record<ThemeColorCardToneKey, ThemeColorCard_v2>
|
|
1383
|
-
|
|
1384
|
-
/** @public */
|
|
1385
|
-
export declare type ThemeColorSchemeKey = (typeof THEME_COLOR_SCHEMES)[number]
|
|
1386
|
-
|
|
1387
|
-
/**
|
|
1388
|
-
* @public
|
|
1389
|
-
* @deprecated Use `ThemeColorSchemes_v2` instead.
|
|
1390
|
-
*/
|
|
1391
|
-
export declare type ThemeColorSchemes = Record<ThemeColorSchemeKey, ThemeColorScheme>
|
|
1392
|
-
|
|
1393
|
-
/** @public */
|
|
1394
|
-
export declare type ThemeColorSchemes_v2 = Record<ThemeColorSchemeKey, ThemeColorScheme_v2>
|
|
1395
|
-
|
|
1396
|
-
/**
|
|
1397
|
-
* @public
|
|
1398
|
-
* @deprecated Use `ThemeColorSelectable_v2` instead.
|
|
1399
|
-
*/
|
|
1400
|
-
export declare interface ThemeColorSelectable {
|
|
1401
|
-
default: ThemeColorSelectableStates
|
|
1402
|
-
primary: ThemeColorSelectableStates
|
|
1403
|
-
positive: ThemeColorSelectableStates
|
|
1404
|
-
caution: ThemeColorSelectableStates
|
|
1405
|
-
critical: ThemeColorSelectableStates
|
|
1406
|
-
}
|
|
1407
|
-
|
|
1408
|
-
/** @public */
|
|
1409
|
-
export declare type ThemeColorSelectable_v2 = Record<
|
|
1410
|
-
ThemeColorStateToneKey,
|
|
1411
|
-
ThemeColorSelectableTone_v2
|
|
1412
|
-
>
|
|
1413
|
-
|
|
1414
|
-
/**
|
|
1415
|
-
* @public
|
|
1416
|
-
* @deprecated Use `ThemeColorState_v2` instead.
|
|
1417
|
-
*/
|
|
1418
|
-
export declare type ThemeColorSelectableState = ThemeColorGenericState
|
|
1419
|
-
|
|
1420
|
-
/**
|
|
1421
|
-
* @public
|
|
1422
|
-
* @deprecated Use `ThemeColorSelectableStates_v2` instead.
|
|
1423
|
-
*/
|
|
1424
|
-
export declare interface ThemeColorSelectableStates {
|
|
1425
|
-
enabled: ThemeColorSelectableState
|
|
1426
|
-
hovered: ThemeColorSelectableState
|
|
1427
|
-
pressed: ThemeColorSelectableState
|
|
1428
|
-
selected: ThemeColorSelectableState
|
|
1429
|
-
disabled: ThemeColorSelectableState
|
|
1430
|
-
}
|
|
1431
|
-
|
|
1432
|
-
/** @public */
|
|
1433
|
-
export declare type ThemeColorSelectableTone_v2 = Record<ThemeColorStateKey, ThemeColorState_v2>
|
|
1434
|
-
|
|
1435
|
-
/** @public */
|
|
1436
|
-
export declare interface ThemeColorShadow {
|
|
1437
|
-
outline: string
|
|
1438
|
-
umbra: string
|
|
1439
|
-
penumbra: string
|
|
1440
|
-
ambient: string
|
|
1441
|
-
}
|
|
1442
|
-
|
|
1443
|
-
/**
|
|
1444
|
-
* @public
|
|
1445
|
-
* @deprecated Use `ThemeColorSelectable_v2` instead.
|
|
1446
|
-
*/
|
|
1447
|
-
export declare interface ThemeColorSolid {
|
|
1448
|
-
default: ThemeColorSolidTone
|
|
1449
|
-
transparent: ThemeColorSolidTone
|
|
1450
|
-
primary: ThemeColorSolidTone
|
|
1451
|
-
positive: ThemeColorSolidTone
|
|
1452
|
-
caution: ThemeColorSolidTone
|
|
1453
|
-
critical: ThemeColorSolidTone
|
|
1454
|
-
}
|
|
1455
|
-
|
|
1456
|
-
/**
|
|
1457
|
-
* @public
|
|
1458
|
-
* @deprecated Use `ThemeColorSelectableTone_v2` instead.
|
|
1459
|
-
*/
|
|
1460
|
-
export declare interface ThemeColorSolidTone {
|
|
1461
|
-
enabled: ThemeColorGenericState
|
|
1462
|
-
disabled: ThemeColorGenericState
|
|
1463
|
-
hovered: ThemeColorGenericState
|
|
1464
|
-
pressed: ThemeColorGenericState
|
|
1465
|
-
selected: ThemeColorGenericState
|
|
1466
|
-
}
|
|
1467
|
-
|
|
1468
|
-
/**
|
|
1469
|
-
* @public
|
|
1470
|
-
* @deprecated Use `ThemeColorAvatar_v2` instead
|
|
1471
|
-
*/
|
|
1472
|
-
export declare type ThemeColorSpot = Record<ThemeColorSpotKey, string>
|
|
1473
|
-
|
|
1474
|
-
/**
|
|
1475
|
-
* @public
|
|
1476
|
-
* @deprecated Use `ThemeColorAvatarColorKey` instead
|
|
1477
|
-
*/
|
|
1478
|
-
export declare type ThemeColorSpotKey = ThemeColorAvatarColorKey
|
|
1479
|
-
|
|
1480
|
-
/** @public */
|
|
1481
|
-
export declare interface ThemeColorState_v2 {
|
|
1482
|
-
/** @internal */
|
|
1483
|
-
_blend?: ThemeColorBlendModeKey
|
|
1484
|
-
accent: {
|
|
1485
|
-
fg: string
|
|
1486
|
-
}
|
|
1487
|
-
/**
|
|
1488
|
-
* @internal This may be removed in a future release
|
|
1489
|
-
* */
|
|
1490
|
-
avatar: ThemeColorAvatar_v2
|
|
1491
|
-
/**
|
|
1492
|
-
* @internal This may be removed in a future release
|
|
1493
|
-
* */
|
|
1494
|
-
badge: ThemeColorBadge_v2
|
|
1495
|
-
bg: string
|
|
1496
|
-
border: string
|
|
1497
|
-
code: {
|
|
1498
|
-
bg: string
|
|
1499
|
-
fg: string
|
|
1500
|
-
}
|
|
1501
|
-
fg: string
|
|
1502
|
-
icon: string
|
|
1503
|
-
kbd: ThemeColorKBD
|
|
1504
|
-
link: {
|
|
1505
|
-
fg: string
|
|
1506
|
-
}
|
|
1507
|
-
muted: {
|
|
1508
|
-
bg: string
|
|
1509
|
-
fg: string
|
|
1510
|
-
}
|
|
1511
|
-
skeleton: {
|
|
1512
|
-
from: string
|
|
1513
|
-
to: string
|
|
1514
|
-
}
|
|
1515
|
-
}
|
|
1516
|
-
|
|
1517
|
-
/** @public */
|
|
1518
|
-
export declare type ThemeColorStateKey = (typeof THEME_COLOR_STATES)[number]
|
|
1519
|
-
|
|
1520
|
-
/** @public */
|
|
1521
|
-
export declare type ThemeColorStatesTokens = Partial<
|
|
1522
|
-
Record<ColorConfigState, ThemeColorStateTokens>
|
|
1523
|
-
>
|
|
1524
|
-
|
|
1525
|
-
/** @public */
|
|
1526
|
-
export declare interface ThemeColorStateTokens {
|
|
1527
|
-
_blend?: ColorBlendModeTokenValue
|
|
1528
|
-
_hue?: Hue_2
|
|
1529
|
-
accent?: {
|
|
1530
|
-
fg?: ThemeColorTokenValue
|
|
1531
|
-
}
|
|
1532
|
-
avatar?: ThemeColorAvatarTokens
|
|
1533
|
-
badge?: ThemeColorBadgeTokens
|
|
1534
|
-
bg?: ThemeColorTokenValue
|
|
1535
|
-
border?: ThemeColorTokenValue
|
|
1536
|
-
code?: {
|
|
1537
|
-
bg?: ThemeColorTokenValue
|
|
1538
|
-
fg?: ThemeColorTokenValue
|
|
1539
|
-
}
|
|
1540
|
-
fg?: ThemeColorTokenValue
|
|
1541
|
-
icon?: ThemeColorTokenValue
|
|
1542
|
-
kbd?: {
|
|
1543
|
-
bg?: ThemeColorTokenValue
|
|
1544
|
-
fg?: ThemeColorTokenValue
|
|
1545
|
-
border?: ThemeColorTokenValue
|
|
1546
|
-
}
|
|
1547
|
-
link?: {
|
|
1548
|
-
fg?: ThemeColorTokenValue
|
|
1549
|
-
}
|
|
1550
|
-
muted?: {
|
|
1551
|
-
bg?: ThemeColorTokenValue
|
|
1552
|
-
fg?: ThemeColorTokenValue
|
|
1553
|
-
}
|
|
1554
|
-
skeleton?: {
|
|
1555
|
-
from?: ThemeColorTokenValue
|
|
1556
|
-
to?: ThemeColorTokenValue
|
|
1557
|
-
}
|
|
1558
|
-
}
|
|
1559
|
-
|
|
1560
|
-
/** @public */
|
|
1561
|
-
export declare type ThemeColorStateToneKey = (typeof THEME_COLOR_STATE_TONES)[number]
|
|
1562
|
-
|
|
1563
|
-
/** @public */
|
|
1564
|
-
export declare interface ThemeColorSyntax {
|
|
1565
|
-
atrule: string
|
|
1566
|
-
attrName: string
|
|
1567
|
-
attrValue: string
|
|
1568
|
-
attribute: string
|
|
1569
|
-
boolean: string
|
|
1570
|
-
builtin: string
|
|
1571
|
-
cdata: string
|
|
1572
|
-
char: string
|
|
1573
|
-
class: string
|
|
1574
|
-
className: string
|
|
1575
|
-
comment: string
|
|
1576
|
-
constant: string
|
|
1577
|
-
deleted: string
|
|
1578
|
-
doctype: string
|
|
1579
|
-
entity: string
|
|
1580
|
-
function: string
|
|
1581
|
-
hexcode: string
|
|
1582
|
-
id: string
|
|
1583
|
-
important: string
|
|
1584
|
-
inserted: string
|
|
1585
|
-
keyword: string
|
|
1586
|
-
number: string
|
|
1587
|
-
operator: string
|
|
1588
|
-
prolog: string
|
|
1589
|
-
property: string
|
|
1590
|
-
pseudoClass: string
|
|
1591
|
-
pseudoElement: string
|
|
1592
|
-
punctuation: string
|
|
1593
|
-
regex: string
|
|
1594
|
-
selector: string
|
|
1595
|
-
string: string
|
|
1596
|
-
symbol: string
|
|
1597
|
-
tag: string
|
|
1598
|
-
unit: string
|
|
1599
|
-
url: string
|
|
1600
|
-
variable: string
|
|
1601
|
-
}
|
|
1602
|
-
|
|
1603
|
-
/** @public */
|
|
1604
|
-
export declare interface ThemeColorTokens {
|
|
1605
|
-
base?: Partial<Record<ColorConfigCardTone, ThemeColorBaseTokens>>
|
|
1606
|
-
button?: Partial<Record<ThemeColorButtonModeKey, ThemeColorButtonTokens>>
|
|
1607
|
-
input?: Partial<Record<ColorConfigInputMode, ThemeColorInputTokens>>
|
|
1608
|
-
selectable?: Partial<
|
|
1609
|
-
Record<
|
|
1610
|
-
ColorConfigStateTone,
|
|
1611
|
-
{
|
|
1612
|
-
_hue?: Hue_2
|
|
1613
|
-
} & ThemeColorStatesTokens
|
|
1614
|
-
>
|
|
1615
|
-
>
|
|
1616
|
-
syntax?: Partial<Record<keyof ThemeColorSyntax, ThemeColorTokenValue>>
|
|
1617
|
-
}
|
|
1618
|
-
|
|
1619
|
-
/** @public */
|
|
1620
|
-
export declare type ThemeColorTokenValue = [ColorConfigValue, ColorConfigValue]
|
|
1621
|
-
|
|
1622
|
-
/**
|
|
1623
|
-
* @public
|
|
1624
|
-
* @deprecated Use `ThemeColorCardToneKey` instead.
|
|
1625
|
-
*/
|
|
1626
|
-
export declare type ThemeColorToneKey = ThemeColorName
|
|
1627
|
-
|
|
1628
|
-
/** @public */
|
|
1629
|
-
export declare type ThemeColorVariant = Record<ThemeColorStateToneKey, ThemeColorElement>
|
|
1630
|
-
|
|
1631
|
-
/** @public */
|
|
1632
|
-
export declare type ThemeColorVariantKey = (typeof COLOR_VARIANTS)[number]
|
|
1633
|
-
|
|
1634
|
-
/** @public */
|
|
1635
|
-
export declare interface ThemeConfig {
|
|
1636
|
-
avatar?: ThemeAvatar_v2
|
|
1637
|
-
button?: {
|
|
1638
|
-
border: {
|
|
1639
|
-
width: number
|
|
1640
|
-
}
|
|
1641
|
-
focusRing: ThemeFocusRing
|
|
1642
|
-
textWeight: ThemeFontWeightKey
|
|
1643
|
-
}
|
|
1644
|
-
card?: {
|
|
1645
|
-
border: {
|
|
1646
|
-
width: number
|
|
1647
|
-
}
|
|
1648
|
-
focusRing: ThemeFocusRing
|
|
1649
|
-
shadow: {
|
|
1650
|
-
outline: number
|
|
1651
|
-
}
|
|
1652
|
-
}
|
|
1653
|
-
color?: ThemeColorTokens
|
|
1654
|
-
container?: number[]
|
|
1655
|
-
font?: ThemeFonts
|
|
1656
|
-
input?: ThemeInput_v2
|
|
1657
|
-
layer?: ThemeLayer
|
|
1658
|
-
media?: number[]
|
|
1659
|
-
palette?: ThemeColorPalette
|
|
1660
|
-
radius?: number[]
|
|
1661
|
-
shadow?: Array<ThemeShadow | null>
|
|
1662
|
-
space?: number[]
|
|
1663
|
-
/** @internal */
|
|
1664
|
-
style?: ThemeStyles
|
|
1665
|
-
}
|
|
1666
|
-
|
|
1667
|
-
/** @public */
|
|
1668
|
-
export declare type ThemeEntry = [`--${string}`, string]
|
|
1669
|
-
|
|
1670
|
-
/** @public */
|
|
1671
|
-
export declare interface ThemeFocusRing {
|
|
1672
|
-
offset: number
|
|
1673
|
-
width: number
|
|
1674
|
-
}
|
|
1675
|
-
|
|
1676
|
-
/** @public */
|
|
1677
|
-
export declare interface ThemeFont {
|
|
1678
|
-
family: string
|
|
1679
|
-
weights: ThemeFontWeight
|
|
1680
|
-
sizes: ThemeFontSize[]
|
|
1681
|
-
/** @deprecated No longer supported. */
|
|
1682
|
-
horizontalOffset?: number
|
|
1683
|
-
}
|
|
1684
|
-
|
|
1685
|
-
/** @public */
|
|
1686
|
-
export declare interface ThemeFont_v3 {
|
|
1687
|
-
family: string
|
|
1688
|
-
featureSettings?: string
|
|
1689
|
-
weight: ThemeFontWeight
|
|
1690
|
-
scale: ThemeFontSize_v3[]
|
|
1691
|
-
}
|
|
1692
|
-
|
|
1693
|
-
/** @public */
|
|
1694
|
-
export declare type ThemeFontKey = 'code' | 'heading' | 'label' | 'text'
|
|
1695
|
-
|
|
1696
|
-
/** @public */
|
|
1697
|
-
export declare interface ThemeFonts {
|
|
1698
|
-
code: ThemeFont
|
|
1699
|
-
heading: ThemeFont
|
|
1700
|
-
label: ThemeFont
|
|
1701
|
-
text: ThemeFont
|
|
1702
|
-
}
|
|
1703
|
-
|
|
1704
|
-
/** @public */
|
|
1705
|
-
export declare interface ThemeFonts_v3 {
|
|
1706
|
-
code: ThemeFont_v3
|
|
1707
|
-
heading: ThemeFont_v3
|
|
1708
|
-
label: ThemeFont_v3
|
|
1709
|
-
text: ThemeFont_v3
|
|
1710
|
-
}
|
|
1711
|
-
|
|
1712
|
-
/** @public */
|
|
1713
|
-
export declare interface ThemeFontSize {
|
|
1714
|
-
ascenderHeight: number
|
|
1715
|
-
descenderHeight: number
|
|
1716
|
-
fontSize: number
|
|
1717
|
-
iconSize: number
|
|
1718
|
-
letterSpacing: number
|
|
1719
|
-
lineHeight: number
|
|
1720
|
-
}
|
|
1721
|
-
|
|
1722
|
-
/** @public */
|
|
1723
|
-
export declare interface ThemeFontSize_v3 {
|
|
1724
|
-
ascenderHeight: number
|
|
1725
|
-
descenderHeight: number
|
|
1726
|
-
fontSize: number
|
|
1727
|
-
iconSize: number
|
|
1728
|
-
letterSpacing: number
|
|
1729
|
-
lineHeight: number
|
|
1730
|
-
customIconSize: number
|
|
1731
|
-
}
|
|
1732
|
-
|
|
1733
|
-
/** @public */
|
|
1734
|
-
export declare interface ThemeFontWeight {
|
|
1735
|
-
regular: number
|
|
1736
|
-
medium: number
|
|
1737
|
-
semibold: number
|
|
1738
|
-
bold: number
|
|
1739
|
-
}
|
|
1740
|
-
|
|
1741
|
-
/** @public */
|
|
1742
|
-
export declare type ThemeFontWeightKey = 'regular' | 'medium' | 'semibold' | 'bold'
|
|
1743
|
-
|
|
1744
|
-
/**
|
|
1745
|
-
* @public
|
|
1746
|
-
* @deprecated Use `ThemeInput_v2` instead
|
|
1747
|
-
*/
|
|
1748
|
-
export declare interface ThemeInput {
|
|
1749
|
-
checkbox: {
|
|
1750
|
-
size: number
|
|
1751
|
-
}
|
|
1752
|
-
radio: {
|
|
1753
|
-
size: number
|
|
1754
|
-
markSize: number
|
|
1755
|
-
}
|
|
1756
|
-
switch: {
|
|
1757
|
-
width: number
|
|
1758
|
-
height: number
|
|
1759
|
-
padding: number
|
|
1760
|
-
transitionDurationMs: number
|
|
1761
|
-
transitionTimingFunction: string
|
|
1762
|
-
}
|
|
1763
|
-
border: {
|
|
1764
|
-
width: number
|
|
1765
|
-
}
|
|
1766
|
-
}
|
|
1767
|
-
|
|
1768
|
-
/** @public */
|
|
1769
|
-
export declare interface ThemeInput_v2 {
|
|
1770
|
-
checkbox: {
|
|
1771
|
-
size: number
|
|
1772
|
-
focusRing: ThemeFocusRing
|
|
1773
|
-
}
|
|
1774
|
-
radio: {
|
|
1775
|
-
size: number
|
|
1776
|
-
markSize: number
|
|
1777
|
-
focusRing: ThemeFocusRing
|
|
1778
|
-
}
|
|
1779
|
-
switch: {
|
|
1780
|
-
width: number
|
|
1781
|
-
height: number
|
|
1782
|
-
padding: number
|
|
1783
|
-
transitionDurationMs: number
|
|
1784
|
-
transitionTimingFunction: string
|
|
1785
|
-
focusRing: ThemeFocusRing
|
|
1786
|
-
}
|
|
1787
|
-
border: {
|
|
1788
|
-
width: number
|
|
1789
|
-
}
|
|
1790
|
-
select: {
|
|
1791
|
-
focusRing: ThemeFocusRing
|
|
1792
|
-
}
|
|
1793
|
-
text: {
|
|
1794
|
-
focusRing: ThemeFocusRing
|
|
1795
|
-
}
|
|
1796
|
-
}
|
|
1797
|
-
|
|
1798
|
-
/** @public */
|
|
1799
|
-
export declare interface ThemeLayer {
|
|
1800
|
-
dialog: {
|
|
1801
|
-
zOffset: number
|
|
1802
|
-
}
|
|
1803
|
-
popover: {
|
|
1804
|
-
zOffset: number
|
|
1805
|
-
}
|
|
1806
|
-
tooltip: {
|
|
1807
|
-
zOffset: number
|
|
1808
|
-
}
|
|
1809
|
-
}
|
|
1810
|
-
|
|
1811
|
-
/** @public */
|
|
1812
|
-
export declare interface ThemeOptions {
|
|
1813
|
-
v2?: ThemeConfig
|
|
1814
|
-
tokens?: PartialTokens<Tokens>
|
|
1815
|
-
}
|
|
1816
|
-
|
|
1817
|
-
/** @public */
|
|
1818
|
-
export declare interface ThemePalette_v3 {
|
|
1819
|
-
black: ColorTint
|
|
1820
|
-
white: ColorTint
|
|
1821
|
-
hues: ColorHues
|
|
1822
|
-
}
|
|
1823
|
-
|
|
1824
|
-
/** @public */
|
|
1825
|
-
export declare interface ThemeShadow {
|
|
1826
|
-
umbra: ThemeBoxShadow
|
|
1827
|
-
penumbra: ThemeBoxShadow
|
|
1828
|
-
ambient: ThemeBoxShadow
|
|
1829
|
-
}
|
|
1830
|
-
|
|
1831
|
-
/**
|
|
1832
|
-
* @internal
|
|
1833
|
-
*/
|
|
1834
|
-
export declare interface ThemeStyles {
|
|
1835
|
-
button?: {
|
|
1836
|
-
root?: CSSObject
|
|
1837
|
-
}
|
|
1838
|
-
card?: {
|
|
1839
|
-
root?: CSSObject
|
|
1840
|
-
}
|
|
1841
|
-
}
|
|
1842
|
-
|
|
1843
|
-
/** @public */
|
|
1844
|
-
export declare type Tint = (typeof TINTS)[number]
|
|
1845
|
-
|
|
1846
|
-
/** @public */
|
|
1847
|
-
export declare const TINTS: readonly [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950]
|
|
1848
|
-
|
|
1849
|
-
/** @internal */
|
|
1850
|
-
export declare interface TokenBaseKeyNode {
|
|
1851
|
-
type: 'base'
|
|
1852
|
-
tone: ColorConfigCardTone
|
|
1853
|
-
key: ColorConfigCardKey | ColorConfigBlendKey
|
|
1854
|
-
}
|
|
1855
|
-
|
|
1856
|
-
/** @internal */
|
|
1857
|
-
export declare interface TokenBlendModeValueNode {
|
|
1858
|
-
type: 'blendMode'
|
|
1859
|
-
value?: ThemeColorBlendModeKey
|
|
1860
|
-
}
|
|
1861
|
-
|
|
1862
|
-
/** @internal */
|
|
1863
|
-
export declare interface TokenButtonKeyNode {
|
|
1864
|
-
type: 'button'
|
|
1865
|
-
tone: ColorConfigStateTone
|
|
1866
|
-
mode: ThemeColorButtonModeKey
|
|
1867
|
-
key: ColorConfigStateKey | ColorConfigBlendKey
|
|
1868
|
-
}
|
|
1869
|
-
|
|
1870
|
-
/** @internal */
|
|
1871
|
-
export declare interface TokenColorValueNode {
|
|
1872
|
-
type: 'color'
|
|
1873
|
-
key?: 'black' | 'white'
|
|
1874
|
-
hue?: ColorHueKey
|
|
1875
|
-
mix?: number
|
|
1876
|
-
opacity?: number
|
|
1877
|
-
tint?: ColorTintKey
|
|
1878
|
-
}
|
|
1879
|
-
|
|
1880
|
-
/** @internal */
|
|
1881
|
-
export declare interface TokenHueValueNode {
|
|
1882
|
-
type: 'hue'
|
|
1883
|
-
value?: ColorHueKey
|
|
1884
|
-
}
|
|
1885
|
-
|
|
1886
|
-
/** @internal */
|
|
1887
|
-
export declare type TokenizeColorResult = ColorNode | ColorTintNode | ColorInheritNode
|
|
1888
|
-
|
|
1889
|
-
/** @internal */
|
|
1890
|
-
export declare type TokenKeyNode = TokenBaseKeyNode | TokenButtonKeyNode
|
|
1891
|
-
|
|
1892
|
-
/** @public */
|
|
1893
|
-
export declare interface Tokens {
|
|
1894
|
-
color: ColorTokens
|
|
1895
|
-
}
|
|
1896
|
-
|
|
1897
|
-
/** @internal */
|
|
1898
|
-
export declare type TokenValueNode =
|
|
1899
|
-
| TokenColorValueNode
|
|
1900
|
-
| TokenHueValueNode
|
|
1901
|
-
| TokenBlendModeValueNode
|
|
1902
|
-
|
|
1903
501
|
export {}
|