@sanity/ui 4.2.0 → 5.0.0-alpha.10
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 +194 -28
- package/bin/sanity-ui.js +14 -0
- package/dist/_chunks-es/LazyRefractor.js +20 -0
- package/dist/_chunks-es/LazyRefractor.js.map +1 -0
- package/dist/cli/checks.js +148 -0
- package/dist/cli/config.js +23 -0
- package/dist/cli/detect.js +181 -0
- package/dist/cli/doctor.js +49 -0
- package/dist/cli/index.js +69 -0
- package/dist/cli/init.js +189 -0
- package/dist/cli/install.js +79 -0
- package/dist/cli/log.js +66 -0
- package/dist/cli/selfPackage.js +11 -0
- package/dist/cli/styles.js +185 -0
- package/dist/cli/test-utils.js +8 -0
- package/dist/cli/tsconfig.js +236 -0
- package/dist/cli/types.js +1 -0
- package/dist/cli/versions.js +45 -0
- package/dist/index.d.ts +1203 -1469
- package/dist/index.js +2123 -1989
- package/dist/index.js.map +1 -1
- package/dist/polyfills.d.ts +1 -0
- package/dist/polyfills.js +5 -0
- package/dist/polyfills.js.map +1 -0
- package/dist/styles.css +1 -547
- package/package.json +57 -58
- package/src/cli/checks.test.ts +38 -0
- package/src/cli/checks.ts +200 -0
- package/src/cli/config.ts +44 -0
- package/src/cli/detect.test.ts +191 -0
- package/src/cli/detect.ts +205 -0
- package/src/cli/doctor.test.ts +52 -0
- package/src/cli/doctor.ts +65 -0
- package/src/cli/index.ts +77 -0
- package/src/cli/init.ts +225 -0
- package/src/cli/install.test.ts +52 -0
- package/src/cli/install.ts +108 -0
- package/src/cli/log.ts +79 -0
- package/src/cli/selfPackage.ts +14 -0
- package/src/cli/styles.test.ts +130 -0
- package/src/cli/styles.ts +205 -0
- package/src/cli/test-utils.ts +10 -0
- package/src/cli/tsconfig.test.ts +174 -0
- package/src/cli/tsconfig.ts +282 -0
- package/src/cli/types.ts +77 -0
- package/src/cli/versions.test.ts +35 -0
- package/src/cli/versions.ts +41 -0
- package/src/components/badge/Badge.tsx +53 -0
- package/src/components/badge/badge.css +6 -0
- package/src/components/badge/badge.props.ts +31 -0
- package/src/components/box/Box.tsx +30 -0
- package/src/components/box/box.css +4 -0
- package/src/components/box/box.props.ts +29 -0
- package/src/components/button/Button.tsx +78 -0
- package/src/components/button/button.css +72 -0
- package/src/components/button/button.props.ts +122 -0
- package/src/components/card/Card.tsx +31 -0
- package/src/components/card/card.css +4 -0
- package/src/components/card/card.props.ts +58 -0
- package/src/components/checkbox/Checkbox.tsx +64 -0
- package/src/components/checkbox/checkbox.css +100 -0
- package/src/components/checkbox/checkbox.props.ts +33 -0
- package/src/components/code/Code.tsx +38 -0
- package/src/components/code/LazyRefractor.tsx +9 -0
- package/src/components/code/code.css +40 -0
- package/src/components/code/code.props.ts +44 -0
- package/src/components/container/Container.tsx +30 -0
- package/src/components/container/container.css +4 -0
- package/src/components/container/container.props.ts +28 -0
- package/src/components/dialog/Dialog.tsx +139 -0
- package/src/components/dialog/dialog.css +49 -0
- package/src/components/dialog/dialog.props.ts +45 -0
- package/src/components/divider/Divider.tsx +23 -0
- package/src/components/divider/divider.props.ts +9 -0
- package/src/components/eyebrow/Eyebrow.tsx +54 -0
- package/src/components/eyebrow/eyebrow.css +11 -0
- package/src/components/eyebrow/eyebrow.props.ts +28 -0
- package/src/components/flex/Flex.tsx +30 -0
- package/src/components/flex/flex.css +4 -0
- package/src/components/flex/flex.props.ts +33 -0
- package/src/components/grid/Grid.tsx +30 -0
- package/src/components/grid/grid.css +4 -0
- package/src/components/grid/grid.props.ts +33 -0
- package/src/components/h-stack/HStack.tsx +34 -0
- package/src/components/h-stack/hStack.props.ts +17 -0
- package/src/components/heading/Heading.tsx +54 -0
- package/src/components/heading/heading.css +9 -0
- package/src/components/heading/heading.props.ts +31 -0
- package/src/components/icon/Icon.tsx +24 -0
- package/src/components/icon/icon.css +17 -0
- package/src/components/icon/icon.props.ts +35 -0
- package/src/components/icon-button/IconButton.tsx +32 -0
- package/src/components/icon-button/iconButton.props.ts +31 -0
- package/src/components/index.css +28 -0
- package/src/components/indicator/Indicator.tsx +42 -0
- package/src/components/indicator/indicator.css +4 -0
- package/src/components/indicator/indicator.props.ts +24 -0
- package/src/components/indicator-stack/IndicatorStack.tsx +31 -0
- package/src/components/indicator-stack/indicator-stack.css +7 -0
- package/src/components/indicator-stack/indicatorStack.props.ts +15 -0
- package/src/components/inline/Inline.tsx +38 -0
- package/src/components/inline/inline.css +4 -0
- package/src/components/inline/inline.props.ts +100 -0
- package/src/components/label/Label.tsx +34 -0
- package/src/components/label/label.css +3 -0
- package/src/components/label/label.props.ts +25 -0
- package/src/components/link/Link.tsx +29 -0
- package/src/components/link/link.css +12 -0
- package/src/components/link/link.props.ts +23 -0
- package/src/components/list/List.tsx +167 -0
- package/src/components/list/list.css +25 -0
- package/src/components/list/list.props.ts +130 -0
- package/src/components/popover/Popover.tsx +85 -0
- package/src/components/popover/popover.css +21 -0
- package/src/components/popover/popover.props.ts +38 -0
- package/src/components/press-area/PressArea.tsx +29 -0
- package/src/components/press-area/press-area.css +22 -0
- package/src/components/press-area/pressArea.props.ts +16 -0
- package/src/components/radio/Radio.tsx +48 -0
- package/src/components/radio/radio.css +97 -0
- package/src/components/radio/radio.props.ts +25 -0
- package/src/components/skip-to-content/SkipToContent.tsx +35 -0
- package/src/components/skip-to-content/skip-to-content.css +9 -0
- package/src/components/skip-to-content/skipToContent.props.ts +25 -0
- package/src/components/spinner/Spinner.tsx +28 -0
- package/src/components/spinner/spinner.css +10 -0
- package/src/components/spinner/spinner.props.ts +19 -0
- package/src/components/switch/Switch.tsx +48 -0
- package/src/components/switch/switch.css +119 -0
- package/src/components/switch/switch.props.ts +25 -0
- package/src/components/text/Text.tsx +53 -0
- package/src/components/text/text.css +9 -0
- package/src/components/text/text.props.ts +28 -0
- package/src/components/tooltip/Tooltip.tsx +97 -0
- package/src/components/tooltip/tooltip.css +31 -0
- package/src/components/tooltip/tooltip.props.ts +36 -0
- package/src/components/tooltip-group/TooltipGroup.tsx +64 -0
- package/src/components/tooltip-group/tooltipGroup.props.ts +15 -0
- package/src/components/v-stack/VStack.tsx +32 -0
- package/src/components/v-stack/vStack.props.ts +17 -0
- package/src/components/visually-hidden/VisuallyHidden.tsx +29 -0
- package/src/components/visually-hidden/visually-hidden.css +9 -0
- package/src/components/visually-hidden/visuallyHidden.props.ts +23 -0
- package/src/css/classes/dynamic/flex-child.css +5 -0
- package/src/css/classes/dynamic/grid-child.css +8 -0
- package/src/css/classes/dynamic/grid-parent.css +6 -0
- package/src/css/classes/dynamic/height.css +5 -0
- package/src/css/classes/dynamic/index.css +7 -0
- package/src/css/classes/dynamic/line-clamp.css +5 -0
- package/src/css/classes/dynamic/readme.md +3 -0
- package/src/css/classes/dynamic/width.css +7 -0
- package/src/css/classes/dynamic/z-index.css +3 -0
- package/src/css/classes/generic/display.css +10 -0
- package/src/css/classes/generic/flex.css +24 -0
- package/src/css/classes/generic/grid.css +7 -0
- package/src/css/classes/generic/index.css +7 -0
- package/src/css/classes/generic/overflow.css +19 -0
- package/src/css/classes/generic/placement.css +202 -0
- package/src/css/classes/generic/position.css +7 -0
- package/src/css/classes/generic/readme.md +3 -0
- package/src/css/classes/generic/text-align.css +5 -0
- package/src/css/classes/index.css +4 -0
- package/src/css/classes/local/animation.css +4 -0
- package/src/css/classes/local/border.css +20 -0
- package/src/css/classes/local/index.css +6 -0
- package/src/css/classes/local/readme.md +3 -0
- package/src/css/classes/local/text-overflow.css +5 -0
- package/src/css/classes/local/text-trim.css +45 -0
- package/src/css/classes/local/tone.css +75 -0
- package/src/css/classes/local/top-anchor.css +4 -0
- package/src/css/classes/system/color.css +223 -0
- package/src/css/classes/system/container.css +8 -0
- package/src/css/classes/system/font-family.css +2 -0
- package/src/css/classes/system/font-weight.css +4 -0
- package/src/css/classes/system/gap.css +37 -0
- package/src/css/classes/system/index.css +10 -0
- package/src/css/classes/system/inset.css +56 -0
- package/src/css/classes/system/margin.css +148 -0
- package/src/css/classes/system/padding.css +78 -0
- package/src/css/classes/system/radius.css +10 -0
- package/src/css/classes/system/readme.md +3 -0
- package/src/css/classes/system/shadow.css +6 -0
- package/src/css/classes/system/typography.css +31 -0
- package/src/css/global/font-face.css +20 -0
- package/src/css/global/index.css +2 -0
- package/src/css/global/reset.css +76 -0
- package/src/css/tokens/index.css +3 -0
- package/src/css/tokens/opacity.css +6 -0
- package/src/css/tokens/semantic.css +25 -0
- package/src/css/tokens/surface.css +27 -0
- package/src/hooks/useIsClient.ts +10 -0
- package/src/index.css +18 -0
- package/src/index.ts +65 -0
- package/src/polyfills.ts +15 -0
- package/src/props/border.ts +51 -0
- package/src/props/flexChild.ts +29 -0
- package/src/props/flexParent.ts +47 -0
- package/src/props/gap.ts +31 -0
- package/src/props/gridChild.ts +50 -0
- package/src/props/gridParent.ts +45 -0
- package/src/props/height.ts +29 -0
- package/src/props/layout.ts +44 -0
- package/src/props/margin.ts +59 -0
- package/src/props/overflow.ts +30 -0
- package/src/props/padding.ts +59 -0
- package/src/props/placement.ts +16 -0
- package/src/props/position.ts +52 -0
- package/src/props/shadow.ts +15 -0
- package/src/props/tone.ts +15 -0
- package/src/props/typography.ts +62 -0
- package/src/props/width.ts +29 -0
- package/src/props/zIndex.ts +15 -0
- package/src/styles.css.d.ts +1 -0
- package/src/styles.css.node.js +2 -0
- package/src/styles.css.test.ts +24 -0
- package/src/types/Button.ts +8 -0
- package/src/types/Code.ts +6 -0
- package/src/types/Container.ts +3 -0
- package/src/types/Density.ts +3 -0
- package/src/types/Display.ts +11 -0
- package/src/types/Eyebrow.ts +3 -0
- package/src/types/Flex.ts +22 -0
- package/src/types/FontWeight.ts +3 -0
- package/src/types/Grid.ts +3 -0
- package/src/types/Heading.ts +6 -0
- package/src/types/Icon.ts +3 -0
- package/src/types/Interactive.ts +8 -0
- package/src/types/List.ts +2 -0
- package/src/types/Overflow.ts +3 -0
- package/src/types/Placement.ts +16 -0
- package/src/types/Position.ts +3 -0
- package/src/types/PropDef.ts +73 -0
- package/src/types/Radius.ts +3 -0
- package/src/types/Responsive.ts +10 -0
- package/src/types/Shadow.ts +3 -0
- package/src/types/Space.ts +15 -0
- package/src/types/Text.ts +3 -0
- package/src/types/TextAlign.ts +3 -0
- package/src/types/Tone.ts +3 -0
- package/src/utils/getProps.test.ts +156 -0
- package/src/utils/getProps.ts +156 -0
- package/src/utils/mergeTriggerProps.ts +66 -0
- package/src/utils/renderPortal.tsx +14 -0
- package/src/utils/suffixClassName.ts +5 -0
- package/src/version.ts +3 -0
- package/LICENSE +0 -21
- package/dist/_system-CTe2lb5l.d.ts +0 -40
- package/dist/_system-CTe2lb5l.d.ts.map +0 -1
- package/dist/arrow-BmX6qbAS.js +0 -170
- package/dist/arrow-BmX6qbAS.js.map +0 -1
- package/dist/autocomplete.d.ts +0 -140
- package/dist/autocomplete.d.ts.map +0 -1
- package/dist/autocomplete.js +0 -470
- package/dist/autocomplete.js.map +0 -1
- package/dist/breadcrumbs.d.ts +0 -18
- package/dist/breadcrumbs.d.ts.map +0 -1
- package/dist/breadcrumbs.js +0 -119
- package/dist/breadcrumbs.js.map +0 -1
- package/dist/button-BNyKSDyA.js +0 -180
- package/dist/button-BNyKSDyA.js.map +0 -1
- package/dist/button-dnqMFkWg.d.ts +0 -76
- package/dist/button-dnqMFkWg.d.ts.map +0 -1
- package/dist/card-C0a0wQTc.d.ts +0 -7
- package/dist/card-C0a0wQTc.d.ts.map +0 -1
- package/dist/code.d.ts +0 -20
- package/dist/code.d.ts.map +0 -1
- package/dist/code.js +0 -90
- package/dist/code.js.map +0 -1
- package/dist/codeFontStyle-84SMhFtI.js +0 -11
- package/dist/codeFontStyle-84SMhFtI.js.map +0 -1
- package/dist/component-DVlwaWB-.d.ts +0 -25
- package/dist/component-DVlwaWB-.d.ts.map +0 -1
- package/dist/element-BYgCE_iK.js +0 -51
- package/dist/element-BYgCE_iK.js.map +0 -1
- package/dist/factory-BzXTX8_Q.js +0 -3056
- package/dist/factory-BzXTX8_Q.js.map +0 -1
- package/dist/flex-DmbDG2ks.js +0 -76
- package/dist/flex-DmbDG2ks.js.map +0 -1
- package/dist/font-EtfxKPUz.d.ts +0 -49
- package/dist/font-EtfxKPUz.d.ts.map +0 -1
- package/dist/getElementRef-Jw7gY0eV.js +0 -102
- package/dist/getElementRef-Jw7gY0eV.js.map +0 -1
- package/dist/getScopedTheme-C-sZsyAz.js +0 -267
- package/dist/getScopedTheme-C-sZsyAz.js.map +0 -1
- package/dist/getTheme_v2-y09KqtEb.js +0 -487
- package/dist/getTheme_v2-y09KqtEb.js.map +0 -1
- package/dist/grid-6JSgMj1O.js +0 -115
- package/dist/grid-6JSgMj1O.js.map +0 -1
- package/dist/helpers-C8xxXAQC.js +0 -63
- package/dist/helpers-C8xxXAQC.js.map +0 -1
- package/dist/hotkeys-CaHsQlsO.js +0 -168
- package/dist/hotkeys-CaHsQlsO.js.map +0 -1
- package/dist/index.d.ts.map +0 -1
- package/dist/layer-Bl5R3uNR.js +0 -61
- package/dist/layer-Bl5R3uNR.js.map +0 -1
- package/dist/layer-ChlP9Ik6.d.ts +0 -242
- package/dist/layer-ChlP9Ik6.d.ts.map +0 -1
- package/dist/menu.d.ts +0 -146
- package/dist/menu.d.ts.map +0 -1
- package/dist/menu.js +0 -626
- package/dist/menu.js.map +0 -1
- package/dist/popover-B7-28L8y.js +0 -408
- package/dist/popover-B7-28L8y.js.map +0 -1
- package/dist/popover-CMlQeKn0.d.ts +0 -96
- package/dist/popover-CMlQeKn0.d.ts.map +0 -1
- package/dist/popover.d.ts +0 -2
- package/dist/popover.js +0 -3
- package/dist/refractor-CC48DwHi.js +0 -20
- package/dist/refractor-CC48DwHi.js.map +0 -1
- package/dist/responsiveFont-CilwaORG.js +0 -55
- package/dist/responsiveFont-CilwaORG.js.map +0 -1
- package/dist/rgba-BSYaEUW6.d.ts +0 -846
- package/dist/rgba-BSYaEUW6.d.ts.map +0 -1
- package/dist/selectable-B0GUIL74.d.ts +0 -7
- package/dist/selectable-B0GUIL74.d.ts.map +0 -1
- package/dist/stack-rsNFPq2-.js +0 -112
- package/dist/stack-rsNFPq2-.js.map +0 -1
- package/dist/styles-css.d.ts +0 -2
- package/dist/styles-css.js +0 -4
- package/dist/textInput-pSfQjkmx.js +0 -313
- package/dist/textInput-pSfQjkmx.js.map +0 -1
- package/dist/theme.d.ts +0 -280
- package/dist/theme.d.ts.map +0 -1
- package/dist/theme.js +0 -55
- package/dist/theme.js.map +0 -1
- package/dist/toast.d.ts +0 -73
- package/dist/toast.d.ts.map +0 -1
- package/dist/toast.js +0 -302
- package/dist/toast.js.map +0 -1
- package/dist/tooltip.d.ts +0 -88
- package/dist/tooltip.d.ts.map +0 -1
- package/dist/tooltip.js +0 -435
- package/dist/tooltip.js.map +0 -1
- package/dist/useClickOutsideEvent-wGLGWBZN.js +0 -36
- package/dist/useClickOutsideEvent-wGLGWBZN.js.map +0 -1
- package/dist/useElementSize-BJvbGHq8.js +0 -51
- package/dist/useElementSize-BJvbGHq8.js.map +0 -1
- package/dist/useLayer-D1usxIE0.js +0 -712
- package/dist/useLayer-D1usxIE0.js.map +0 -1
package/dist/rgba-BSYaEUW6.d.ts
DELETED
|
@@ -1,846 +0,0 @@
|
|
|
1
|
-
import { a as ThemeColorInputModeKey, c as ThemeColorStateKey, i as ThemeColorCardToneKey, l as ThemeColorStateToneKey, n as ThemeColorBlendModeKey, o as ThemeColorInputStateKey, r as ThemeColorButtonModeKey, s as ThemeColorSchemeKey, t as ThemeColorAvatarColorKey } from "./_system-CTe2lb5l.js";
|
|
2
|
-
import { a as ThemeFontWeightKey, o as ThemeFonts } from "./font-EtfxKPUz.js";
|
|
3
|
-
import * as CSS from "csstype";
|
|
4
|
-
/**
|
|
5
|
-
* @internal
|
|
6
|
-
*/
|
|
7
|
-
interface RGB {
|
|
8
|
-
r: number;
|
|
9
|
-
g: number;
|
|
10
|
-
b: number;
|
|
11
|
-
a?: undefined;
|
|
12
|
-
}
|
|
13
|
-
/**
|
|
14
|
-
* @internal
|
|
15
|
-
*/
|
|
16
|
-
interface RGBA {
|
|
17
|
-
r: number;
|
|
18
|
-
g: number;
|
|
19
|
-
b: number;
|
|
20
|
-
a: number;
|
|
21
|
-
}
|
|
22
|
-
/**
|
|
23
|
-
* @internal
|
|
24
|
-
*/
|
|
25
|
-
interface HSL {
|
|
26
|
-
h: number;
|
|
27
|
-
s: number;
|
|
28
|
-
l: number;
|
|
29
|
-
}
|
|
30
|
-
/**
|
|
31
|
-
* @public
|
|
32
|
-
*/
|
|
33
|
-
interface ThemeColorSyntax {
|
|
34
|
-
atrule: string;
|
|
35
|
-
attrName: string;
|
|
36
|
-
attrValue: string;
|
|
37
|
-
attribute: string;
|
|
38
|
-
boolean: string;
|
|
39
|
-
builtin: string;
|
|
40
|
-
cdata: string;
|
|
41
|
-
char: string;
|
|
42
|
-
class: string;
|
|
43
|
-
className: string;
|
|
44
|
-
comment: string;
|
|
45
|
-
constant: string;
|
|
46
|
-
deleted: string;
|
|
47
|
-
doctype: string;
|
|
48
|
-
entity: string;
|
|
49
|
-
function: string;
|
|
50
|
-
hexcode: string;
|
|
51
|
-
id: string;
|
|
52
|
-
important: string;
|
|
53
|
-
inserted: string;
|
|
54
|
-
keyword: string;
|
|
55
|
-
number: string;
|
|
56
|
-
operator: string;
|
|
57
|
-
prolog: string;
|
|
58
|
-
property: string;
|
|
59
|
-
pseudoClass: string;
|
|
60
|
-
pseudoElement: string;
|
|
61
|
-
punctuation: string;
|
|
62
|
-
regex: string;
|
|
63
|
-
selector: string;
|
|
64
|
-
string: string;
|
|
65
|
-
symbol: string;
|
|
66
|
-
tag: string;
|
|
67
|
-
unit: string;
|
|
68
|
-
url: string;
|
|
69
|
-
variable: string;
|
|
70
|
-
}
|
|
71
|
-
/**
|
|
72
|
-
* @public
|
|
73
|
-
*/
|
|
74
|
-
interface ThemeLayer {
|
|
75
|
-
dialog: {
|
|
76
|
-
zOffset: number;
|
|
77
|
-
};
|
|
78
|
-
popover: {
|
|
79
|
-
zOffset: number;
|
|
80
|
-
};
|
|
81
|
-
tooltip: {
|
|
82
|
-
zOffset: number;
|
|
83
|
-
};
|
|
84
|
-
}
|
|
85
|
-
/**
|
|
86
|
-
* @public
|
|
87
|
-
*/
|
|
88
|
-
type ThemeBoxShadow = [number, number, number, number];
|
|
89
|
-
/**
|
|
90
|
-
* @public
|
|
91
|
-
*/
|
|
92
|
-
interface ThemeShadow {
|
|
93
|
-
umbra: ThemeBoxShadow;
|
|
94
|
-
penumbra: ThemeBoxShadow;
|
|
95
|
-
ambient: ThemeBoxShadow;
|
|
96
|
-
}
|
|
97
|
-
/**
|
|
98
|
-
* A CSS-in-JS style object: standard CSS properties plus an index signature that allows nested
|
|
99
|
-
* selectors, at-rules and custom properties.
|
|
100
|
-
*
|
|
101
|
-
* This is a self-owned definition (based on `csstype`) so the published `.d.ts` types stay fully
|
|
102
|
-
* controlled by us and do not reference any external CSS-in-JS library types.
|
|
103
|
-
*
|
|
104
|
-
* @internal
|
|
105
|
-
*/
|
|
106
|
-
interface CSSObject extends CSS.Properties<number | (string & {})> {
|
|
107
|
-
[key: string]: CSSObject | string | number | undefined;
|
|
108
|
-
}
|
|
109
|
-
/**
|
|
110
|
-
* @internal
|
|
111
|
-
*/
|
|
112
|
-
interface ThemeStyles {
|
|
113
|
-
button?: {
|
|
114
|
-
root?: CSSObject;
|
|
115
|
-
};
|
|
116
|
-
card?: {
|
|
117
|
-
root?: CSSObject;
|
|
118
|
-
};
|
|
119
|
-
}
|
|
120
|
-
/**
|
|
121
|
-
* @public
|
|
122
|
-
*/
|
|
123
|
-
interface ThemeFocusRing {
|
|
124
|
-
offset: number;
|
|
125
|
-
width: number;
|
|
126
|
-
}
|
|
127
|
-
/**
|
|
128
|
-
* @public
|
|
129
|
-
*/
|
|
130
|
-
interface ThemeAvatar_v2 {
|
|
131
|
-
sizes: {
|
|
132
|
-
/** Spacing between avatars in an <AvatarStack> component (px) */
|
|
133
|
-
distance: number;
|
|
134
|
-
/** Diameter of the avatar (px) */
|
|
135
|
-
size: number;
|
|
136
|
-
}[];
|
|
137
|
-
focusRing: ThemeFocusRing;
|
|
138
|
-
}
|
|
139
|
-
/**
|
|
140
|
-
* @public
|
|
141
|
-
*/
|
|
142
|
-
interface ThemeColorAvatarHue_v2 {
|
|
143
|
-
_blend?: ThemeColorBlendModeKey;
|
|
144
|
-
bg: string;
|
|
145
|
-
fg: string;
|
|
146
|
-
}
|
|
147
|
-
/**
|
|
148
|
-
* @public
|
|
149
|
-
*/
|
|
150
|
-
type ThemeColorAvatar_v2 = Record<ThemeColorAvatarColorKey, ThemeColorAvatarHue_v2>;
|
|
151
|
-
/**
|
|
152
|
-
* @public
|
|
153
|
-
*/
|
|
154
|
-
interface ThemeColorBadgeTone_v2 {
|
|
155
|
-
bg: string;
|
|
156
|
-
fg: string;
|
|
157
|
-
dot: string;
|
|
158
|
-
icon: string;
|
|
159
|
-
}
|
|
160
|
-
/**
|
|
161
|
-
* @public
|
|
162
|
-
*/
|
|
163
|
-
type ThemeColorBadge_v2 = Record<ThemeColorStateToneKey, ThemeColorBadgeTone_v2>;
|
|
164
|
-
/**
|
|
165
|
-
* @public
|
|
166
|
-
*/
|
|
167
|
-
interface ThemeColorKBD {
|
|
168
|
-
bg: string;
|
|
169
|
-
fg: string;
|
|
170
|
-
border: string;
|
|
171
|
-
}
|
|
172
|
-
/**
|
|
173
|
-
* @public
|
|
174
|
-
*/
|
|
175
|
-
interface ThemeColorState_v2 {
|
|
176
|
-
/** @internal */
|
|
177
|
-
_blend?: ThemeColorBlendModeKey;
|
|
178
|
-
accent: {
|
|
179
|
-
fg: string;
|
|
180
|
-
};
|
|
181
|
-
/**
|
|
182
|
-
* @internal This may be removed in a future release
|
|
183
|
-
* */
|
|
184
|
-
avatar: ThemeColorAvatar_v2;
|
|
185
|
-
/**
|
|
186
|
-
* @internal This may be removed in a future release
|
|
187
|
-
* */
|
|
188
|
-
badge: ThemeColorBadge_v2;
|
|
189
|
-
bg: string;
|
|
190
|
-
border: string;
|
|
191
|
-
code: {
|
|
192
|
-
bg: string;
|
|
193
|
-
fg: string;
|
|
194
|
-
};
|
|
195
|
-
fg: string;
|
|
196
|
-
icon: string;
|
|
197
|
-
kbd: ThemeColorKBD;
|
|
198
|
-
link: {
|
|
199
|
-
fg: string;
|
|
200
|
-
};
|
|
201
|
-
muted: {
|
|
202
|
-
bg: string;
|
|
203
|
-
fg: string;
|
|
204
|
-
};
|
|
205
|
-
skeleton: {
|
|
206
|
-
from: string;
|
|
207
|
-
to: string;
|
|
208
|
-
};
|
|
209
|
-
}
|
|
210
|
-
/**
|
|
211
|
-
* @public
|
|
212
|
-
*/
|
|
213
|
-
type ThemeColorButtonTone_v2 = Record<ThemeColorStateKey, ThemeColorState_v2>;
|
|
214
|
-
/**
|
|
215
|
-
* @public
|
|
216
|
-
*/
|
|
217
|
-
type ThemeColorButtonMode_v2 = Record<ThemeColorStateToneKey, ThemeColorButtonTone_v2>;
|
|
218
|
-
/**
|
|
219
|
-
* @public
|
|
220
|
-
*/
|
|
221
|
-
type ThemeColorButton_v2 = Record<ThemeColorButtonModeKey, ThemeColorButtonMode_v2>;
|
|
222
|
-
/**
|
|
223
|
-
* @public
|
|
224
|
-
*/
|
|
225
|
-
interface ThemeColorInputState_v2 {
|
|
226
|
-
_blend?: ThemeColorBlendModeKey;
|
|
227
|
-
bg: string;
|
|
228
|
-
border: string;
|
|
229
|
-
fg: string;
|
|
230
|
-
muted: {
|
|
231
|
-
bg: string;
|
|
232
|
-
};
|
|
233
|
-
placeholder: string;
|
|
234
|
-
}
|
|
235
|
-
/**
|
|
236
|
-
* @public
|
|
237
|
-
*/
|
|
238
|
-
type ThemeColorInputMode_v2 = Record<ThemeColorInputStateKey, ThemeColorInputState_v2>;
|
|
239
|
-
/**
|
|
240
|
-
* @public
|
|
241
|
-
*/
|
|
242
|
-
type ThemeColorInput_v2 = Record<ThemeColorInputModeKey, ThemeColorInputMode_v2>;
|
|
243
|
-
/**
|
|
244
|
-
* @public
|
|
245
|
-
*/
|
|
246
|
-
type ThemeColorSelectableTone_v2 = Record<ThemeColorStateKey, ThemeColorState_v2>;
|
|
247
|
-
/**
|
|
248
|
-
* @public
|
|
249
|
-
*/
|
|
250
|
-
type ThemeColorSelectable_v2 = Record<ThemeColorStateToneKey, ThemeColorSelectableTone_v2>;
|
|
251
|
-
/** @public */
|
|
252
|
-
interface ThemeColorShadow {
|
|
253
|
-
outline: string;
|
|
254
|
-
umbra: string;
|
|
255
|
-
penumbra: string;
|
|
256
|
-
ambient: string;
|
|
257
|
-
}
|
|
258
|
-
/**
|
|
259
|
-
* @public
|
|
260
|
-
*/
|
|
261
|
-
interface ThemeColorCard_v2 extends ThemeColorState_v2 {
|
|
262
|
-
/** @internal */
|
|
263
|
-
_blend: ThemeColorBlendModeKey;
|
|
264
|
-
_dark: boolean;
|
|
265
|
-
backdrop: string;
|
|
266
|
-
button: ThemeColorButton_v2;
|
|
267
|
-
focusRing: string;
|
|
268
|
-
input: ThemeColorInput_v2;
|
|
269
|
-
selectable: ThemeColorSelectable_v2;
|
|
270
|
-
shadow: ThemeColorShadow;
|
|
271
|
-
syntax: ThemeColorSyntax;
|
|
272
|
-
}
|
|
273
|
-
/**
|
|
274
|
-
* @public
|
|
275
|
-
*/
|
|
276
|
-
type ThemeColorScheme_v2 = Record<ThemeColorCardToneKey, ThemeColorCard_v2>;
|
|
277
|
-
/**
|
|
278
|
-
* @public
|
|
279
|
-
*/
|
|
280
|
-
type ThemeColorSchemes_v2 = Record<ThemeColorSchemeKey, ThemeColorScheme_v2>;
|
|
281
|
-
/**
|
|
282
|
-
* @public
|
|
283
|
-
*/
|
|
284
|
-
interface ThemeInput_v2 {
|
|
285
|
-
checkbox: {
|
|
286
|
-
size: number;
|
|
287
|
-
focusRing: ThemeFocusRing;
|
|
288
|
-
};
|
|
289
|
-
radio: {
|
|
290
|
-
size: number;
|
|
291
|
-
markSize: number;
|
|
292
|
-
focusRing: ThemeFocusRing;
|
|
293
|
-
};
|
|
294
|
-
switch: {
|
|
295
|
-
width: number;
|
|
296
|
-
height: number;
|
|
297
|
-
padding: number;
|
|
298
|
-
transitionDurationMs: number;
|
|
299
|
-
transitionTimingFunction: string;
|
|
300
|
-
focusRing: ThemeFocusRing;
|
|
301
|
-
};
|
|
302
|
-
border: {
|
|
303
|
-
width: number;
|
|
304
|
-
};
|
|
305
|
-
select: {
|
|
306
|
-
focusRing: ThemeFocusRing;
|
|
307
|
-
};
|
|
308
|
-
text: {
|
|
309
|
-
focusRing: ThemeFocusRing;
|
|
310
|
-
};
|
|
311
|
-
}
|
|
312
|
-
/**
|
|
313
|
-
* @public
|
|
314
|
-
* @deprecated Use `ThemeAvatar_v2` from `@sanity/ui/theme` instead.
|
|
315
|
-
*/
|
|
316
|
-
interface ThemeAvatar {
|
|
317
|
-
sizes: {
|
|
318
|
-
distance: number;
|
|
319
|
-
size: number;
|
|
320
|
-
}[];
|
|
321
|
-
}
|
|
322
|
-
/**
|
|
323
|
-
* @public
|
|
324
|
-
* @deprecated Use `ThemeColorState_v2` instead.
|
|
325
|
-
*/
|
|
326
|
-
interface ThemeColorGenericState {
|
|
327
|
-
/** @internal */
|
|
328
|
-
_blend?: ThemeColorBlendModeKey;
|
|
329
|
-
bg: string;
|
|
330
|
-
/**
|
|
331
|
-
* @beta
|
|
332
|
-
*/
|
|
333
|
-
bg2?: string;
|
|
334
|
-
border: string;
|
|
335
|
-
fg: string;
|
|
336
|
-
icon: string;
|
|
337
|
-
muted: {
|
|
338
|
-
fg: string;
|
|
339
|
-
};
|
|
340
|
-
accent: {
|
|
341
|
-
fg: string;
|
|
342
|
-
};
|
|
343
|
-
link: {
|
|
344
|
-
fg: string;
|
|
345
|
-
};
|
|
346
|
-
code: {
|
|
347
|
-
bg: string;
|
|
348
|
-
fg: string;
|
|
349
|
-
};
|
|
350
|
-
skeleton?: {
|
|
351
|
-
from: string;
|
|
352
|
-
to: string;
|
|
353
|
-
};
|
|
354
|
-
}
|
|
355
|
-
/**
|
|
356
|
-
* @public
|
|
357
|
-
* @deprecated Use `ThemeColorCardToneKey` instead.
|
|
358
|
-
*/
|
|
359
|
-
type ThemeColorName = 'transparent' | 'default' | 'primary' | 'positive' | 'caution' | 'critical';
|
|
360
|
-
/**
|
|
361
|
-
* @public
|
|
362
|
-
* @deprecated Use `ThemeColorCardToneKey` instead.
|
|
363
|
-
*/
|
|
364
|
-
type ThemeColorToneKey = ThemeColorName;
|
|
365
|
-
/**
|
|
366
|
-
* @public
|
|
367
|
-
* @deprecated Use `ThemeColorCard_v2` instead.
|
|
368
|
-
*/
|
|
369
|
-
interface ThemeColorBase {
|
|
370
|
-
bg: string;
|
|
371
|
-
fg: string;
|
|
372
|
-
border: string;
|
|
373
|
-
focusRing: string;
|
|
374
|
-
backdrop?: string;
|
|
375
|
-
shadow: {
|
|
376
|
-
outline: string;
|
|
377
|
-
umbra: string;
|
|
378
|
-
penumbra: string;
|
|
379
|
-
ambient: string;
|
|
380
|
-
};
|
|
381
|
-
skeleton?: {
|
|
382
|
-
from: string;
|
|
383
|
-
to: string;
|
|
384
|
-
};
|
|
385
|
-
}
|
|
386
|
-
/**
|
|
387
|
-
* @public
|
|
388
|
-
* @deprecated Use `ThemeColorState_v2` instead.
|
|
389
|
-
*/
|
|
390
|
-
type ThemeColorButtonState = ThemeColorGenericState;
|
|
391
|
-
/**
|
|
392
|
-
* @public
|
|
393
|
-
* @deprecated Use `ThemeColorButtonStates_v2` instead.
|
|
394
|
-
*/
|
|
395
|
-
interface ThemeColorButtonStates {
|
|
396
|
-
enabled: ThemeColorGenericState;
|
|
397
|
-
hovered: ThemeColorGenericState;
|
|
398
|
-
pressed: ThemeColorGenericState;
|
|
399
|
-
selected: ThemeColorGenericState;
|
|
400
|
-
disabled: ThemeColorGenericState;
|
|
401
|
-
}
|
|
402
|
-
/**
|
|
403
|
-
* TODO: Rename to `ThemeColorButtonMode`.
|
|
404
|
-
* @public
|
|
405
|
-
* @deprecated Use `ThemeColorButtonTones_v2` instead.
|
|
406
|
-
*/
|
|
407
|
-
interface ThemeColorButtonTones {
|
|
408
|
-
default: ThemeColorButtonStates;
|
|
409
|
-
primary: ThemeColorButtonStates;
|
|
410
|
-
positive: ThemeColorButtonStates;
|
|
411
|
-
caution: ThemeColorButtonStates;
|
|
412
|
-
critical: ThemeColorButtonStates;
|
|
413
|
-
}
|
|
414
|
-
/**
|
|
415
|
-
* @public
|
|
416
|
-
* @deprecated Use `ThemeColorButton_v2` instead.
|
|
417
|
-
*/
|
|
418
|
-
interface ThemeColorButton {
|
|
419
|
-
default: ThemeColorButtonTones;
|
|
420
|
-
ghost: ThemeColorButtonTones;
|
|
421
|
-
bleed: ThemeColorButtonTones;
|
|
422
|
-
}
|
|
423
|
-
/**
|
|
424
|
-
* @public
|
|
425
|
-
* @deprecated Use `ThemeColorState_v2` instead.
|
|
426
|
-
*/
|
|
427
|
-
type ThemeColorCardState = ThemeColorGenericState;
|
|
428
|
-
/**
|
|
429
|
-
* @public
|
|
430
|
-
* @deprecated Use `ThemeColorSelectable_v2` instead.
|
|
431
|
-
*/
|
|
432
|
-
interface ThemeColorCard {
|
|
433
|
-
enabled: ThemeColorGenericState;
|
|
434
|
-
hovered: ThemeColorGenericState;
|
|
435
|
-
pressed: ThemeColorGenericState;
|
|
436
|
-
selected: ThemeColorGenericState;
|
|
437
|
-
disabled: ThemeColorGenericState;
|
|
438
|
-
}
|
|
439
|
-
/**
|
|
440
|
-
* @public
|
|
441
|
-
* @deprecated Use `ThemeColorInputState_v2` instead.
|
|
442
|
-
*/
|
|
443
|
-
interface ThemeColorInputState {
|
|
444
|
-
_blend?: ThemeColorBlendModeKey;
|
|
445
|
-
bg: string;
|
|
446
|
-
bg2: string;
|
|
447
|
-
border: string;
|
|
448
|
-
fg: string;
|
|
449
|
-
placeholder: string;
|
|
450
|
-
}
|
|
451
|
-
/**
|
|
452
|
-
* @public
|
|
453
|
-
* @deprecated Use `ThemeColorInputMode_v2` instead.
|
|
454
|
-
*/
|
|
455
|
-
interface ThemeColorInputStates {
|
|
456
|
-
enabled: ThemeColorInputState;
|
|
457
|
-
disabled: ThemeColorInputState;
|
|
458
|
-
hovered: ThemeColorInputState;
|
|
459
|
-
readOnly: ThemeColorInputState;
|
|
460
|
-
}
|
|
461
|
-
/**
|
|
462
|
-
* @public
|
|
463
|
-
* @deprecated Use `ThemeColorInput_v2` instead.
|
|
464
|
-
*/
|
|
465
|
-
interface ThemeColorInput {
|
|
466
|
-
default: ThemeColorInputStates;
|
|
467
|
-
invalid: ThemeColorInputStates;
|
|
468
|
-
}
|
|
469
|
-
/**
|
|
470
|
-
* @public
|
|
471
|
-
* @deprecated Use `ThemeColorSelectableTone_v2` instead.
|
|
472
|
-
*/
|
|
473
|
-
interface ThemeColorMutedTone {
|
|
474
|
-
enabled: ThemeColorGenericState;
|
|
475
|
-
disabled: ThemeColorGenericState;
|
|
476
|
-
hovered: ThemeColorGenericState;
|
|
477
|
-
pressed: ThemeColorGenericState;
|
|
478
|
-
selected: ThemeColorGenericState;
|
|
479
|
-
}
|
|
480
|
-
/**
|
|
481
|
-
* @public
|
|
482
|
-
* @deprecated Use `ThemeColorSelectable_v2` instead.
|
|
483
|
-
*/
|
|
484
|
-
interface ThemeColorMuted {
|
|
485
|
-
default: ThemeColorMutedTone;
|
|
486
|
-
transparent: ThemeColorMutedTone;
|
|
487
|
-
primary: ThemeColorMutedTone;
|
|
488
|
-
positive: ThemeColorMutedTone;
|
|
489
|
-
caution: ThemeColorMutedTone;
|
|
490
|
-
critical: ThemeColorMutedTone;
|
|
491
|
-
}
|
|
492
|
-
/**
|
|
493
|
-
* @public
|
|
494
|
-
* @deprecated Use `ThemeColorState_v2` instead.
|
|
495
|
-
*/
|
|
496
|
-
type ThemeColorSelectableState = ThemeColorGenericState;
|
|
497
|
-
/**
|
|
498
|
-
* @public
|
|
499
|
-
* @deprecated Use `ThemeColorSelectableStates_v2` instead.
|
|
500
|
-
*/
|
|
501
|
-
interface ThemeColorSelectableStates {
|
|
502
|
-
enabled: ThemeColorSelectableState;
|
|
503
|
-
hovered: ThemeColorSelectableState;
|
|
504
|
-
pressed: ThemeColorSelectableState;
|
|
505
|
-
selected: ThemeColorSelectableState;
|
|
506
|
-
disabled: ThemeColorSelectableState;
|
|
507
|
-
}
|
|
508
|
-
/**
|
|
509
|
-
* @public
|
|
510
|
-
* @deprecated Use `ThemeColorSelectable_v2` instead.
|
|
511
|
-
*/
|
|
512
|
-
interface ThemeColorSelectable {
|
|
513
|
-
default: ThemeColorSelectableStates;
|
|
514
|
-
primary: ThemeColorSelectableStates;
|
|
515
|
-
positive: ThemeColorSelectableStates;
|
|
516
|
-
caution: ThemeColorSelectableStates;
|
|
517
|
-
critical: ThemeColorSelectableStates;
|
|
518
|
-
}
|
|
519
|
-
/**
|
|
520
|
-
* @public
|
|
521
|
-
* @deprecated Use `ThemeColorSelectableTone_v2` instead.
|
|
522
|
-
*/
|
|
523
|
-
interface ThemeColorSolidTone {
|
|
524
|
-
enabled: ThemeColorGenericState;
|
|
525
|
-
disabled: ThemeColorGenericState;
|
|
526
|
-
hovered: ThemeColorGenericState;
|
|
527
|
-
pressed: ThemeColorGenericState;
|
|
528
|
-
selected: ThemeColorGenericState;
|
|
529
|
-
}
|
|
530
|
-
/**
|
|
531
|
-
* @public
|
|
532
|
-
* @deprecated Use `ThemeColorSelectable_v2` instead.
|
|
533
|
-
*/
|
|
534
|
-
interface ThemeColorSolid {
|
|
535
|
-
default: ThemeColorSolidTone;
|
|
536
|
-
transparent: ThemeColorSolidTone;
|
|
537
|
-
primary: ThemeColorSolidTone;
|
|
538
|
-
positive: ThemeColorSolidTone;
|
|
539
|
-
caution: ThemeColorSolidTone;
|
|
540
|
-
critical: ThemeColorSolidTone;
|
|
541
|
-
}
|
|
542
|
-
/**
|
|
543
|
-
* @public
|
|
544
|
-
* @deprecated Use `ThemeColorAvatarColorKey` instead
|
|
545
|
-
*/
|
|
546
|
-
type ThemeColorSpotKey = ThemeColorAvatarColorKey;
|
|
547
|
-
/**
|
|
548
|
-
* @public
|
|
549
|
-
* @deprecated Use `ThemeColorAvatar_v2` instead
|
|
550
|
-
*/
|
|
551
|
-
type ThemeColorSpot = Record<ThemeColorSpotKey, string>;
|
|
552
|
-
/**
|
|
553
|
-
* @public
|
|
554
|
-
* @deprecated Use `ThemeColor_v2` instead.
|
|
555
|
-
*/
|
|
556
|
-
interface ThemeColor extends Partial<Omit<ThemeColorGenericState, 'muted'>> {
|
|
557
|
-
base: ThemeColorBase;
|
|
558
|
-
button: ThemeColorButton;
|
|
559
|
-
card: ThemeColorCard;
|
|
560
|
-
dark: boolean;
|
|
561
|
-
input: ThemeColorInput;
|
|
562
|
-
muted: ThemeColorMuted;
|
|
563
|
-
selectable?: ThemeColorSelectable;
|
|
564
|
-
solid: ThemeColorSolid;
|
|
565
|
-
spot: ThemeColorSpot;
|
|
566
|
-
syntax: ThemeColorSyntax;
|
|
567
|
-
}
|
|
568
|
-
/**
|
|
569
|
-
* @public
|
|
570
|
-
* @deprecated Use `ThemeColorScheme_v2` instead.
|
|
571
|
-
*/
|
|
572
|
-
type ThemeColorScheme = Record<ThemeColorName, ThemeColor>;
|
|
573
|
-
/**
|
|
574
|
-
* @public
|
|
575
|
-
* @deprecated Use `ThemeColorSchemes_v2` instead.
|
|
576
|
-
*/
|
|
577
|
-
type ThemeColorSchemes = Record<ThemeColorSchemeKey, ThemeColorScheme>;
|
|
578
|
-
/**
|
|
579
|
-
* @public
|
|
580
|
-
* @deprecated Use `ThemeInput_v2` instead
|
|
581
|
-
*/
|
|
582
|
-
interface ThemeInput {
|
|
583
|
-
checkbox: {
|
|
584
|
-
size: number;
|
|
585
|
-
};
|
|
586
|
-
radio: {
|
|
587
|
-
size: number;
|
|
588
|
-
markSize: number;
|
|
589
|
-
};
|
|
590
|
-
switch: {
|
|
591
|
-
width: number;
|
|
592
|
-
height: number;
|
|
593
|
-
padding: number;
|
|
594
|
-
transitionDurationMs: number;
|
|
595
|
-
transitionTimingFunction: string;
|
|
596
|
-
};
|
|
597
|
-
border: {
|
|
598
|
-
width: number;
|
|
599
|
-
};
|
|
600
|
-
}
|
|
601
|
-
/**
|
|
602
|
-
* @public
|
|
603
|
-
*/
|
|
604
|
-
interface RootTheme_v2 {
|
|
605
|
-
_version: 2;
|
|
606
|
-
avatar: ThemeAvatar_v2;
|
|
607
|
-
button: {
|
|
608
|
-
border: {
|
|
609
|
-
width: number;
|
|
610
|
-
};
|
|
611
|
-
focusRing: ThemeFocusRing;
|
|
612
|
-
textWeight: ThemeFontWeightKey;
|
|
613
|
-
};
|
|
614
|
-
card: {
|
|
615
|
-
border: {
|
|
616
|
-
width: number;
|
|
617
|
-
};
|
|
618
|
-
focusRing: ThemeFocusRing;
|
|
619
|
-
shadow: {
|
|
620
|
-
outline: number;
|
|
621
|
-
};
|
|
622
|
-
};
|
|
623
|
-
color: ThemeColorSchemes_v2;
|
|
624
|
-
container: number[];
|
|
625
|
-
font: ThemeFonts;
|
|
626
|
-
input: ThemeInput_v2;
|
|
627
|
-
layer: ThemeLayer;
|
|
628
|
-
media: number[];
|
|
629
|
-
radius: number[];
|
|
630
|
-
shadow: Array<ThemeShadow | null>;
|
|
631
|
-
space: number[];
|
|
632
|
-
/** @internal */
|
|
633
|
-
style?: ThemeStyles;
|
|
634
|
-
}
|
|
635
|
-
/**
|
|
636
|
-
* @public
|
|
637
|
-
*/
|
|
638
|
-
interface BaseTheme {
|
|
639
|
-
_version?: 0;
|
|
640
|
-
/**
|
|
641
|
-
* @deprecated Use `v2.avatar` instead
|
|
642
|
-
*/
|
|
643
|
-
avatar: ThemeAvatar;
|
|
644
|
-
/**
|
|
645
|
-
* @deprecated Use `v2.button` instead
|
|
646
|
-
*/
|
|
647
|
-
button: {
|
|
648
|
-
textWeight: ThemeFontWeightKey;
|
|
649
|
-
};
|
|
650
|
-
/**
|
|
651
|
-
* @deprecated Use `v2.color` instead
|
|
652
|
-
*/
|
|
653
|
-
color: ThemeColorSchemes;
|
|
654
|
-
/**
|
|
655
|
-
* @deprecated Use `v2.container` instead
|
|
656
|
-
*/
|
|
657
|
-
container: number[];
|
|
658
|
-
/**
|
|
659
|
-
* @deprecated Use component-specific `v2.{button | card | input}.focusRing` values instead
|
|
660
|
-
*/
|
|
661
|
-
focusRing: {
|
|
662
|
-
offset: number;
|
|
663
|
-
width: number;
|
|
664
|
-
};
|
|
665
|
-
/**
|
|
666
|
-
* @deprecated Use `v2.font` instead
|
|
667
|
-
*/
|
|
668
|
-
fonts: ThemeFonts;
|
|
669
|
-
/**
|
|
670
|
-
* @deprecated Use `v2.input` instead
|
|
671
|
-
*/
|
|
672
|
-
input: ThemeInput;
|
|
673
|
-
/**
|
|
674
|
-
* THIS API MAY BE UNSTABLE. DO NOT USE IN PRODUCTION.
|
|
675
|
-
* @beta
|
|
676
|
-
* @deprecated Use `v2.layer` instead
|
|
677
|
-
*/
|
|
678
|
-
layer?: ThemeLayer;
|
|
679
|
-
/**
|
|
680
|
-
* @deprecated Use `v2.media` instead
|
|
681
|
-
*/
|
|
682
|
-
media: number[];
|
|
683
|
-
/**
|
|
684
|
-
* @deprecated Use `v2.radius` instead
|
|
685
|
-
*/
|
|
686
|
-
radius: number[];
|
|
687
|
-
/**
|
|
688
|
-
* @deprecated Use `v2.shadow` instead
|
|
689
|
-
*/
|
|
690
|
-
shadows: Array<ThemeShadow | null>;
|
|
691
|
-
/**
|
|
692
|
-
* @deprecated Use `v2.space` instead
|
|
693
|
-
*/
|
|
694
|
-
space: number[];
|
|
695
|
-
/**
|
|
696
|
-
* @internal
|
|
697
|
-
* @deprecated Use `v2.style` instead
|
|
698
|
-
*/
|
|
699
|
-
styles?: ThemeStyles;
|
|
700
|
-
v2?: RootTheme_v2;
|
|
701
|
-
}
|
|
702
|
-
/**
|
|
703
|
-
* @public
|
|
704
|
-
*/
|
|
705
|
-
type RootTheme = BaseTheme;
|
|
706
|
-
/**
|
|
707
|
-
* @public
|
|
708
|
-
*/
|
|
709
|
-
type Theme_v2 = Omit<RootTheme_v2, 'color'> & {
|
|
710
|
-
color: ThemeColorCard_v2;
|
|
711
|
-
/**
|
|
712
|
-
* Indicates whether the theme is resolved or raw, it's necessary to avoid issues
|
|
713
|
-
* with sanity V2 components accessing a v1 <ThemeProvider>.
|
|
714
|
-
* See https://github.com/sanity-io/ui/pull/1203 for more info.
|
|
715
|
-
*/
|
|
716
|
-
_resolved: boolean;
|
|
717
|
-
};
|
|
718
|
-
/**
|
|
719
|
-
* @public
|
|
720
|
-
*/
|
|
721
|
-
interface Theme {
|
|
722
|
-
sanity: Omit<RootTheme, 'color' | 'v2'> & {
|
|
723
|
-
/**
|
|
724
|
-
* @deprecated Use `v2.color` instead
|
|
725
|
-
*/
|
|
726
|
-
color: ThemeColor;
|
|
727
|
-
v2?: Theme_v2;
|
|
728
|
-
};
|
|
729
|
-
}
|
|
730
|
-
/**
|
|
731
|
-
* @public
|
|
732
|
-
* @deprecated Use `buildColorTheme` instead.
|
|
733
|
-
*/
|
|
734
|
-
interface ThemeColorBuilderOpts {
|
|
735
|
-
base: (opts: {
|
|
736
|
-
dark: boolean;
|
|
737
|
-
name: ThemeColorName;
|
|
738
|
-
}) => ThemeColorBase;
|
|
739
|
-
solid: (opts: {
|
|
740
|
-
base: ThemeColorBase;
|
|
741
|
-
dark: boolean;
|
|
742
|
-
tone: ThemeColorName;
|
|
743
|
-
name: ThemeColorName;
|
|
744
|
-
state: 'enabled' | 'disabled' | 'hovered' | 'pressed' | 'selected';
|
|
745
|
-
}) => ThemeColorGenericState;
|
|
746
|
-
muted: (opts: {
|
|
747
|
-
base: ThemeColorBase;
|
|
748
|
-
dark: boolean;
|
|
749
|
-
tone: ThemeColorToneKey;
|
|
750
|
-
name: ThemeColorName;
|
|
751
|
-
state: 'enabled' | 'disabled' | 'hovered' | 'pressed' | 'selected';
|
|
752
|
-
}) => ThemeColorGenericState;
|
|
753
|
-
card: (opts: {
|
|
754
|
-
base: ThemeColorBase;
|
|
755
|
-
dark: boolean;
|
|
756
|
-
muted: ThemeColorMuted;
|
|
757
|
-
name: ThemeColorName;
|
|
758
|
-
solid: ThemeColorSolid;
|
|
759
|
-
state: 'enabled' | 'disabled' | 'hovered' | 'pressed' | 'selected';
|
|
760
|
-
}) => ThemeColorGenericState;
|
|
761
|
-
button: (opts: {
|
|
762
|
-
dark: boolean;
|
|
763
|
-
mode: ThemeColorButtonModeKey;
|
|
764
|
-
base: ThemeColorBase;
|
|
765
|
-
solid: ThemeColorSolidTone;
|
|
766
|
-
muted: ThemeColorMutedTone;
|
|
767
|
-
}) => ThemeColorButtonStates;
|
|
768
|
-
input: (opts: {
|
|
769
|
-
base: ThemeColorBase;
|
|
770
|
-
solid: ThemeColorSolidTone;
|
|
771
|
-
muted: ThemeColorMutedTone;
|
|
772
|
-
dark: boolean;
|
|
773
|
-
mode: 'default' | 'invalid';
|
|
774
|
-
state: 'enabled' | 'disabled' | 'hovered' | 'readOnly';
|
|
775
|
-
}) => ThemeColorInputState;
|
|
776
|
-
selectable: (opts: {
|
|
777
|
-
dark: boolean;
|
|
778
|
-
base: ThemeColorBase;
|
|
779
|
-
solid: ThemeColorSolid;
|
|
780
|
-
muted: ThemeColorMuted;
|
|
781
|
-
state: 'enabled' | 'disabled' | 'hovered' | 'pressed' | 'selected';
|
|
782
|
-
tone: 'default' | 'primary' | 'positive' | 'caution' | 'critical';
|
|
783
|
-
}) => ThemeColorGenericState;
|
|
784
|
-
syntax: (opts: {
|
|
785
|
-
base: ThemeColorBase;
|
|
786
|
-
dark: boolean;
|
|
787
|
-
}) => ThemeColorSyntax;
|
|
788
|
-
spot: (opts: {
|
|
789
|
-
base: ThemeColorBase;
|
|
790
|
-
dark: boolean;
|
|
791
|
-
key: ThemeColorSpotKey;
|
|
792
|
-
}) => string;
|
|
793
|
-
}
|
|
794
|
-
/**
|
|
795
|
-
* @public
|
|
796
|
-
* @deprecated Use `ThemeConfig` instead.
|
|
797
|
-
*/
|
|
798
|
-
type PartialThemeColorBuilderOpts = Partial<ThemeColorBuilderOpts>;
|
|
799
|
-
/**
|
|
800
|
-
* @public
|
|
801
|
-
* @deprecated Use `buildColorTheme` instead.
|
|
802
|
-
*/
|
|
803
|
-
declare function createColorTheme(partialOpts?: PartialThemeColorBuilderOpts): ThemeColorSchemes;
|
|
804
|
-
/**
|
|
805
|
-
* Apply the \`multiply\` blend mode
|
|
806
|
-
* Source: https://www.w3.org/TR/compositing-1/#blendingmultiply
|
|
807
|
-
* @internal
|
|
808
|
-
*/
|
|
809
|
-
declare function multiply(b: RGB | RGBA, s: RGB | RGBA): RGB;
|
|
810
|
-
/**
|
|
811
|
-
* Apply the \`screen\` blend mode
|
|
812
|
-
* Source: https://www.w3.org/TR/compositing-1/#blendingscreen
|
|
813
|
-
* @internal
|
|
814
|
-
*/
|
|
815
|
-
declare function screen(b: RGB | RGBA, s: RGB | RGBA): RGB;
|
|
816
|
-
/**
|
|
817
|
-
* @internal
|
|
818
|
-
*/
|
|
819
|
-
declare function hexToRgb(hex: string): RGB;
|
|
820
|
-
/**
|
|
821
|
-
* @internal
|
|
822
|
-
*/
|
|
823
|
-
declare function rgbaToRGBA(rgba: string): RGBA;
|
|
824
|
-
/**
|
|
825
|
-
* @internal
|
|
826
|
-
*/
|
|
827
|
-
declare function rgbToHex(color: RGB | RGBA): string;
|
|
828
|
-
/**
|
|
829
|
-
* @internal
|
|
830
|
-
* @see https://css-tricks.com/converting-color-spaces-in-javascript/
|
|
831
|
-
*/
|
|
832
|
-
declare function rgbToHsl({ r, g, b }: RGB): HSL;
|
|
833
|
-
/**
|
|
834
|
-
* @internal
|
|
835
|
-
*/
|
|
836
|
-
declare function hslToRgb(hsl: HSL): RGB;
|
|
837
|
-
/**
|
|
838
|
-
* @internal
|
|
839
|
-
*/
|
|
840
|
-
declare function parseColor(color: unknown): RGB | RGBA;
|
|
841
|
-
/**
|
|
842
|
-
* @internal
|
|
843
|
-
*/
|
|
844
|
-
declare function rgba(color: unknown, a: number): string;
|
|
845
|
-
export { ThemeColorInputState_v2 as $, ThemeColorMutedTone as A, ThemeColorBase as B, ThemeColorSpotKey as C, ThemeColorSelectableState as D, ThemeColorSelectable as E, ThemeColorCardState as F, ThemeInput_v2 as G, ThemeColorToneKey as H, ThemeColorButton as I, ThemeColorSchemes_v2 as J, ThemeColorCard_v2 as K, ThemeColorButtonState as L, ThemeColorInputState as M, ThemeColorInputStates as N, ThemeColorSelectableStates as O, ThemeColorCard as P, ThemeColorInputMode_v2 as Q, ThemeColorButtonStates as R, ThemeColorSpot as S, ThemeColorSolidTone as T, ThemeColorGenericState as U, ThemeColorName as V, ThemeAvatar as W, ThemeColorSelectableTone_v2 as X, ThemeColorShadow as Y, ThemeColorSelectable_v2 as Z, Theme_v2 as _, ThemeColorSyntax as _t, rgbToHex as a, ThemeColorKBD as at, ThemeColorScheme as b, RGBA as bt, screen as c, ThemeColorAvatarHue_v2 as ct, ThemeColorBuilderOpts as d, ThemeFocusRing as dt, ThemeColorInput_v2 as et, createColorTheme as f, ThemeStyles as ft, Theme as g, ThemeLayer as gt, RootTheme_v2 as h, ThemeShadow as ht, hslToRgb as i, ThemeColorState_v2 as it, ThemeColorInput as j, ThemeColorMuted as k, multiply as l, ThemeColorAvatar_v2 as lt, RootTheme as m, ThemeBoxShadow as mt, parseColor as n, ThemeColorButtonTone_v2 as nt, rgbToHsl as o, ThemeColorBadgeTone_v2 as ot, BaseTheme as p, CSSObject as pt, ThemeColorScheme_v2 as q, hexToRgb as r, ThemeColorButton_v2 as rt, rgbaToRGBA as s, ThemeColorBadge_v2 as st, rgba as t, ThemeColorButtonMode_v2 as tt, PartialThemeColorBuilderOpts as u, ThemeAvatar_v2 as ut, ThemeInput as v, HSL as vt, ThemeColorSolid as w, ThemeColorSchemes as x, ThemeColor as y, RGB as yt, ThemeColorButtonTones as z };
|
|
846
|
-
//# sourceMappingURL=rgba-BSYaEUW6.d.ts.map
|