@sanity/ui 3.4.4 → 3.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/_chunks/{theme.cjs → getScopedTheme.cjs} +3534 -3597
- package/dist/_chunks/getScopedTheme.cjs.map +1 -0
- package/dist/_chunks/{theme.js → getScopedTheme.js} +3477 -3525
- package/dist/_chunks/getScopedTheme.js.map +1 -0
- package/dist/_chunks/{tabList.cjs → portalProvider.cjs} +1561 -1554
- package/dist/_chunks/portalProvider.cjs.map +1 -0
- package/dist/_chunks/{useTheme.d.ts → portalProvider.d.cts} +307 -647
- package/dist/_chunks/portalProvider.d.cts.map +1 -0
- package/dist/_chunks/{useTheme.d.cts → portalProvider.d.ts} +307 -647
- package/dist/_chunks/portalProvider.d.ts.map +1 -0
- package/dist/_chunks/{tabList.js → portalProvider.js} +1359 -1352
- package/dist/_chunks/portalProvider.js.map +1 -0
- package/dist/_chunks/{theme.d.ts → rgba.d.cts} +178 -453
- package/dist/_chunks/rgba.d.cts.map +1 -0
- package/dist/_chunks/{theme.d.cts → rgba.d.ts} +178 -453
- package/dist/_chunks/rgba.d.ts.map +1 -0
- package/dist/_visual-editing.cjs +3 -2
- package/dist/_visual-editing.d.cts +1 -1
- package/dist/_visual-editing.d.ts +1 -1
- package/dist/_visual-editing.js +2 -1
- package/dist/index.cjs +2802 -2798
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +549 -203
- package/dist/index.d.cts.map +1 -1
- package/dist/index.d.ts +549 -203
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2781 -2777
- package/dist/index.js.map +1 -1
- package/dist/theme.cjs +53 -2
- package/dist/theme.cjs.map +1 -0
- package/dist/theme.d.cts +278 -2
- package/dist/theme.d.cts.map +1 -0
- package/dist/theme.d.ts +278 -2
- package/dist/theme.d.ts.map +1 -0
- package/dist/theme.js +52 -1
- package/dist/theme.js.map +1 -0
- package/package.json +2 -3
- package/dist/_chunks/tabList.cjs.map +0 -1
- package/dist/_chunks/tabList.js.map +0 -1
- package/dist/_chunks/theme.cjs.map +0 -1
- package/dist/_chunks/theme.d.cts.map +0 -1
- package/dist/_chunks/theme.d.ts.map +0 -1
- package/dist/_chunks/theme.js.map +0 -1
- package/dist/_chunks/useTheme.d.cts.map +0 -1
- package/dist/_chunks/useTheme.d.ts.map +0 -1
|
@@ -1,23 +1,29 @@
|
|
|
1
|
-
import { ColorHueKey, ColorTint, ColorTintKey } from "@sanity/color";
|
|
2
1
|
import * as CSS from "csstype";
|
|
3
2
|
/**
|
|
4
|
-
* @
|
|
3
|
+
* @internal
|
|
5
4
|
*/
|
|
6
|
-
interface
|
|
7
|
-
|
|
8
|
-
|
|
5
|
+
interface RGB {
|
|
6
|
+
r: number;
|
|
7
|
+
g: number;
|
|
8
|
+
b: number;
|
|
9
|
+
a?: undefined;
|
|
9
10
|
}
|
|
10
11
|
/**
|
|
11
|
-
* @
|
|
12
|
+
* @internal
|
|
12
13
|
*/
|
|
13
|
-
interface
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
14
|
+
interface RGBA {
|
|
15
|
+
r: number;
|
|
16
|
+
g: number;
|
|
17
|
+
b: number;
|
|
18
|
+
a: number;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* @internal
|
|
22
|
+
*/
|
|
23
|
+
interface HSL {
|
|
24
|
+
h: number;
|
|
25
|
+
s: number;
|
|
26
|
+
l: number;
|
|
21
27
|
}
|
|
22
28
|
/** @public */
|
|
23
29
|
declare const THEME_COLOR_SCHEMES: readonly ['light', 'dark'];
|
|
@@ -57,14 +63,162 @@ type ThemeColorInputModeKey = (typeof THEME_COLOR_INPUT_MODES)[number];
|
|
|
57
63
|
type ThemeColorInputStateKey = (typeof THEME_COLOR_INPUT_STATES)[number];
|
|
58
64
|
/** @public */
|
|
59
65
|
type ThemeColorAvatarColorKey = (typeof THEME_COLOR_AVATAR_COLORS)[number];
|
|
60
|
-
/**
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
66
|
+
/**
|
|
67
|
+
* @public
|
|
68
|
+
*/
|
|
69
|
+
interface ThemeColorSyntax {
|
|
70
|
+
atrule: string;
|
|
71
|
+
attrName: string;
|
|
72
|
+
attrValue: string;
|
|
73
|
+
attribute: string;
|
|
74
|
+
boolean: string;
|
|
75
|
+
builtin: string;
|
|
76
|
+
cdata: string;
|
|
77
|
+
char: string;
|
|
78
|
+
class: string;
|
|
79
|
+
className: string;
|
|
80
|
+
comment: string;
|
|
81
|
+
constant: string;
|
|
82
|
+
deleted: string;
|
|
83
|
+
doctype: string;
|
|
84
|
+
entity: string;
|
|
85
|
+
function: string;
|
|
86
|
+
hexcode: string;
|
|
87
|
+
id: string;
|
|
88
|
+
important: string;
|
|
89
|
+
inserted: string;
|
|
90
|
+
keyword: string;
|
|
91
|
+
number: string;
|
|
92
|
+
operator: string;
|
|
93
|
+
prolog: string;
|
|
94
|
+
property: string;
|
|
95
|
+
pseudoClass: string;
|
|
96
|
+
pseudoElement: string;
|
|
97
|
+
punctuation: string;
|
|
98
|
+
regex: string;
|
|
99
|
+
selector: string;
|
|
100
|
+
string: string;
|
|
101
|
+
symbol: string;
|
|
102
|
+
tag: string;
|
|
103
|
+
unit: string;
|
|
104
|
+
url: string;
|
|
105
|
+
variable: string;
|
|
106
|
+
}
|
|
107
|
+
/**
|
|
108
|
+
* @public
|
|
109
|
+
*/
|
|
110
|
+
type ThemeFontKey = 'code' | 'heading' | 'label' | 'text';
|
|
111
|
+
/**
|
|
112
|
+
* @public
|
|
113
|
+
*/
|
|
114
|
+
type ThemeFontWeightKey = 'regular' | 'medium' | 'semibold' | 'bold';
|
|
115
|
+
/**
|
|
116
|
+
* @public
|
|
117
|
+
*/
|
|
118
|
+
interface ThemeFontSize {
|
|
119
|
+
ascenderHeight: number;
|
|
120
|
+
descenderHeight: number;
|
|
121
|
+
fontSize: number;
|
|
122
|
+
iconSize: number;
|
|
123
|
+
letterSpacing: number;
|
|
124
|
+
lineHeight: number;
|
|
125
|
+
}
|
|
126
|
+
/**
|
|
127
|
+
* @public
|
|
128
|
+
*/
|
|
129
|
+
interface ThemeFontWeight {
|
|
130
|
+
regular: number;
|
|
131
|
+
medium: number;
|
|
132
|
+
semibold: number;
|
|
133
|
+
bold: number;
|
|
134
|
+
}
|
|
135
|
+
/**
|
|
136
|
+
* @public
|
|
137
|
+
*/
|
|
138
|
+
interface ThemeFont {
|
|
139
|
+
family: string;
|
|
140
|
+
weights: ThemeFontWeight;
|
|
141
|
+
sizes: ThemeFontSize[];
|
|
142
|
+
/** @deprecated No longer supported. */
|
|
143
|
+
horizontalOffset?: number;
|
|
144
|
+
}
|
|
145
|
+
/**
|
|
146
|
+
* @public
|
|
147
|
+
*/
|
|
148
|
+
interface ThemeFonts {
|
|
149
|
+
code: ThemeFont;
|
|
150
|
+
heading: ThemeFont;
|
|
151
|
+
label: ThemeFont;
|
|
152
|
+
text: ThemeFont;
|
|
153
|
+
}
|
|
154
|
+
/**
|
|
155
|
+
* @public
|
|
156
|
+
*/
|
|
157
|
+
interface ThemeLayer {
|
|
158
|
+
dialog: {
|
|
159
|
+
zOffset: number;
|
|
160
|
+
};
|
|
161
|
+
popover: {
|
|
162
|
+
zOffset: number;
|
|
163
|
+
};
|
|
164
|
+
tooltip: {
|
|
165
|
+
zOffset: number;
|
|
166
|
+
};
|
|
167
|
+
}
|
|
168
|
+
/**
|
|
169
|
+
* @public
|
|
170
|
+
*/
|
|
171
|
+
type ThemeBoxShadow = [number, number, number, number];
|
|
172
|
+
/**
|
|
173
|
+
* @public
|
|
174
|
+
*/
|
|
175
|
+
interface ThemeShadow {
|
|
176
|
+
umbra: ThemeBoxShadow;
|
|
177
|
+
penumbra: ThemeBoxShadow;
|
|
178
|
+
ambient: ThemeBoxShadow;
|
|
179
|
+
}
|
|
180
|
+
/**
|
|
181
|
+
* A CSS-in-JS style object: standard CSS properties plus an index signature that allows nested
|
|
182
|
+
* selectors, at-rules and custom properties.
|
|
183
|
+
*
|
|
184
|
+
* This is a self-owned definition (based on `csstype`) so the published `.d.ts` types stay fully
|
|
185
|
+
* controlled by us and do not reference any external CSS-in-JS library types.
|
|
186
|
+
*
|
|
187
|
+
* @internal
|
|
188
|
+
*/
|
|
189
|
+
interface CSSObject extends CSS.Properties<number | (string & {})> {
|
|
190
|
+
[key: string]: CSSObject | string | number | undefined;
|
|
191
|
+
}
|
|
192
|
+
/**
|
|
193
|
+
* @internal
|
|
194
|
+
*/
|
|
195
|
+
interface ThemeStyles {
|
|
196
|
+
button?: {
|
|
197
|
+
root?: CSSObject;
|
|
198
|
+
};
|
|
199
|
+
card?: {
|
|
200
|
+
root?: CSSObject;
|
|
201
|
+
};
|
|
202
|
+
}
|
|
203
|
+
/**
|
|
204
|
+
* @public
|
|
205
|
+
*/
|
|
206
|
+
interface ThemeFocusRing {
|
|
207
|
+
offset: number;
|
|
208
|
+
width: number;
|
|
209
|
+
}
|
|
210
|
+
/**
|
|
211
|
+
* @public
|
|
212
|
+
*/
|
|
213
|
+
interface ThemeAvatar_v2 {
|
|
214
|
+
sizes: {
|
|
215
|
+
/** Spacing between avatars in an <AvatarStack> component (px) */
|
|
216
|
+
distance: number;
|
|
217
|
+
/** Diameter of the avatar (px) */
|
|
218
|
+
size: number;
|
|
219
|
+
}[];
|
|
220
|
+
focusRing: ThemeFocusRing;
|
|
221
|
+
}
|
|
68
222
|
/**
|
|
69
223
|
* @public
|
|
70
224
|
*/
|
|
@@ -184,47 +338,6 @@ interface ThemeColorShadow {
|
|
|
184
338
|
penumbra: string;
|
|
185
339
|
ambient: string;
|
|
186
340
|
}
|
|
187
|
-
/**
|
|
188
|
-
* @public
|
|
189
|
-
*/
|
|
190
|
-
interface ThemeColorSyntax {
|
|
191
|
-
atrule: string;
|
|
192
|
-
attrName: string;
|
|
193
|
-
attrValue: string;
|
|
194
|
-
attribute: string;
|
|
195
|
-
boolean: string;
|
|
196
|
-
builtin: string;
|
|
197
|
-
cdata: string;
|
|
198
|
-
char: string;
|
|
199
|
-
class: string;
|
|
200
|
-
className: string;
|
|
201
|
-
comment: string;
|
|
202
|
-
constant: string;
|
|
203
|
-
deleted: string;
|
|
204
|
-
doctype: string;
|
|
205
|
-
entity: string;
|
|
206
|
-
function: string;
|
|
207
|
-
hexcode: string;
|
|
208
|
-
id: string;
|
|
209
|
-
important: string;
|
|
210
|
-
inserted: string;
|
|
211
|
-
keyword: string;
|
|
212
|
-
number: string;
|
|
213
|
-
operator: string;
|
|
214
|
-
prolog: string;
|
|
215
|
-
property: string;
|
|
216
|
-
pseudoClass: string;
|
|
217
|
-
pseudoElement: string;
|
|
218
|
-
punctuation: string;
|
|
219
|
-
regex: string;
|
|
220
|
-
selector: string;
|
|
221
|
-
string: string;
|
|
222
|
-
symbol: string;
|
|
223
|
-
tag: string;
|
|
224
|
-
unit: string;
|
|
225
|
-
url: string;
|
|
226
|
-
variable: string;
|
|
227
|
-
}
|
|
228
341
|
/**
|
|
229
342
|
* @public
|
|
230
343
|
*/
|
|
@@ -248,65 +361,6 @@ type ThemeColorScheme_v2 = Record<ThemeColorCardToneKey, ThemeColorCard_v2>;
|
|
|
248
361
|
* @public
|
|
249
362
|
*/
|
|
250
363
|
type ThemeColorSchemes_v2 = Record<ThemeColorSchemeKey, ThemeColorScheme_v2>;
|
|
251
|
-
/**
|
|
252
|
-
* A CSS-in-JS style object: standard CSS properties plus an index signature that allows nested
|
|
253
|
-
* selectors, at-rules and custom properties.
|
|
254
|
-
*
|
|
255
|
-
* This is a self-owned definition (based on `csstype`) so the published `.d.ts` types stay fully
|
|
256
|
-
* controlled by us and do not reference any external CSS-in-JS library types.
|
|
257
|
-
*
|
|
258
|
-
* @internal
|
|
259
|
-
*/
|
|
260
|
-
interface CSSObject extends CSS.Properties<number | (string & {})> {
|
|
261
|
-
[key: string]: CSSObject | string | number | undefined;
|
|
262
|
-
}
|
|
263
|
-
/**
|
|
264
|
-
* @public
|
|
265
|
-
*/
|
|
266
|
-
type ThemeFontKey = 'code' | 'heading' | 'label' | 'text';
|
|
267
|
-
/**
|
|
268
|
-
* @public
|
|
269
|
-
*/
|
|
270
|
-
type ThemeFontWeightKey = 'regular' | 'medium' | 'semibold' | 'bold';
|
|
271
|
-
/**
|
|
272
|
-
* @public
|
|
273
|
-
*/
|
|
274
|
-
interface ThemeFontSize {
|
|
275
|
-
ascenderHeight: number;
|
|
276
|
-
descenderHeight: number;
|
|
277
|
-
fontSize: number;
|
|
278
|
-
iconSize: number;
|
|
279
|
-
letterSpacing: number;
|
|
280
|
-
lineHeight: number;
|
|
281
|
-
}
|
|
282
|
-
/**
|
|
283
|
-
* @public
|
|
284
|
-
*/
|
|
285
|
-
interface ThemeFontWeight {
|
|
286
|
-
regular: number;
|
|
287
|
-
medium: number;
|
|
288
|
-
semibold: number;
|
|
289
|
-
bold: number;
|
|
290
|
-
}
|
|
291
|
-
/**
|
|
292
|
-
* @public
|
|
293
|
-
*/
|
|
294
|
-
interface ThemeFont {
|
|
295
|
-
family: string;
|
|
296
|
-
weights: ThemeFontWeight;
|
|
297
|
-
sizes: ThemeFontSize[];
|
|
298
|
-
/** @deprecated No longer supported. */
|
|
299
|
-
horizontalOffset?: number;
|
|
300
|
-
}
|
|
301
|
-
/**
|
|
302
|
-
* @public
|
|
303
|
-
*/
|
|
304
|
-
interface ThemeFonts {
|
|
305
|
-
code: ThemeFont;
|
|
306
|
-
heading: ThemeFont;
|
|
307
|
-
label: ThemeFont;
|
|
308
|
-
text: ThemeFont;
|
|
309
|
-
}
|
|
310
364
|
/**
|
|
311
365
|
* @public
|
|
312
366
|
*/
|
|
@@ -338,43 +392,6 @@ interface ThemeInput_v2 {
|
|
|
338
392
|
focusRing: ThemeFocusRing;
|
|
339
393
|
};
|
|
340
394
|
}
|
|
341
|
-
/**
|
|
342
|
-
* @public
|
|
343
|
-
*/
|
|
344
|
-
interface ThemeLayer {
|
|
345
|
-
dialog: {
|
|
346
|
-
zOffset: number;
|
|
347
|
-
};
|
|
348
|
-
popover: {
|
|
349
|
-
zOffset: number;
|
|
350
|
-
};
|
|
351
|
-
tooltip: {
|
|
352
|
-
zOffset: number;
|
|
353
|
-
};
|
|
354
|
-
}
|
|
355
|
-
/**
|
|
356
|
-
* @public
|
|
357
|
-
*/
|
|
358
|
-
type ThemeBoxShadow = [number, number, number, number];
|
|
359
|
-
/**
|
|
360
|
-
* @public
|
|
361
|
-
*/
|
|
362
|
-
interface ThemeShadow {
|
|
363
|
-
umbra: ThemeBoxShadow;
|
|
364
|
-
penumbra: ThemeBoxShadow;
|
|
365
|
-
ambient: ThemeBoxShadow;
|
|
366
|
-
}
|
|
367
|
-
/**
|
|
368
|
-
* @internal
|
|
369
|
-
*/
|
|
370
|
-
interface ThemeStyles {
|
|
371
|
-
button?: {
|
|
372
|
-
root?: CSSObject;
|
|
373
|
-
};
|
|
374
|
-
card?: {
|
|
375
|
-
root?: CSSObject;
|
|
376
|
-
};
|
|
377
|
-
}
|
|
378
395
|
/**
|
|
379
396
|
* @public
|
|
380
397
|
* @deprecated Use `ThemeAvatar_v2` from `@sanity/ui/theme` instead.
|
|
@@ -867,284 +884,6 @@ type PartialThemeColorBuilderOpts = Partial<ThemeColorBuilderOpts>;
|
|
|
867
884
|
* @deprecated Use `buildColorTheme` instead.
|
|
868
885
|
*/
|
|
869
886
|
declare function createColorTheme(partialOpts?: PartialThemeColorBuilderOpts): ThemeColorSchemes;
|
|
870
|
-
/** @public */
|
|
871
|
-
declare const COLOR_CONFIG_STATE_KEYS: readonly ['_hue', 'bg', 'fg', 'border', 'focusRing', 'muted/fg', 'accent/fg', 'link/fg', 'code/bg', 'code/fg', 'skeleton/from', 'skeleton/to', 'status/dot', 'status/icon'];
|
|
872
|
-
/** @public */
|
|
873
|
-
type ColorConfigStateKey = (typeof COLOR_CONFIG_STATE_KEYS)[number];
|
|
874
|
-
/** @public */
|
|
875
|
-
declare const COLOR_CONFIG_CARD_KEYS: readonly ["_hue", "bg", "fg", "border", "focusRing", "muted/fg", "accent/fg", "link/fg", "code/bg", "code/fg", "skeleton/from", "skeleton/to", "status/dot", "status/icon", "_hue", "bg", "fg", "border", "focusRing", "shadow/outline", "shadow/umbra", "shadow/penumbra", "shadow/ambient"];
|
|
876
|
-
/** @public */
|
|
877
|
-
type ColorConfigCardKey = (typeof COLOR_CONFIG_CARD_KEYS)[number];
|
|
878
|
-
/** @public */
|
|
879
|
-
declare const COLOR_CONFIG_BLEND_KEYS: readonly ['_blend'];
|
|
880
|
-
/** @public */
|
|
881
|
-
type ColorConfigBlendKey = (typeof COLOR_CONFIG_BLEND_KEYS)[number];
|
|
882
|
-
/** @public */
|
|
883
|
-
type ColorConfigOpacityValue = `0` | `0.${number}` | `1`;
|
|
884
|
-
/** @public */
|
|
885
|
-
type ColorConfigValue = `black` | `white` | `black/${ColorConfigOpacityValue}` | `white/${ColorConfigOpacityValue}` | `${ColorHueKey}` | `${ColorHueKey} ${number}%` | `${ColorHueKey}/${ColorTintKey}` | `${ColorHueKey}/${ColorTintKey} ${number}%` | `${ColorHueKey}/${ColorTintKey}/${ColorConfigOpacityValue}` | `${ColorTintKey}` | `${ColorTintKey} ${number}%` | `${ColorTintKey}/${ColorConfigOpacityValue}`;
|
|
886
|
-
/** @public */
|
|
887
|
-
type ThemeColorTokenValue = [ColorConfigValue, ColorConfigValue];
|
|
888
|
-
/** @public */
|
|
889
|
-
type ColorBlendModeTokenValue = [ThemeColorBlendModeKey, ThemeColorBlendModeKey];
|
|
890
|
-
/** @public */
|
|
891
|
-
declare const COLOR_CONFIG_AVATAR_COLORS: readonly ["*", ...ColorHueKey[]];
|
|
892
|
-
/** @public */
|
|
893
|
-
type ColorConfigAvatarColor = (typeof COLOR_CONFIG_AVATAR_COLORS)[number];
|
|
894
|
-
/** @public */
|
|
895
|
-
declare const COLOR_CONFIG_CARD_TONES: readonly ["*", "transparent", "default", "neutral", "primary", "suggest", "positive", "caution", "critical"];
|
|
896
|
-
/** @public */
|
|
897
|
-
type ColorConfigCardTone = (typeof COLOR_CONFIG_CARD_TONES)[number];
|
|
898
|
-
/** @public */
|
|
899
|
-
declare const COLOR_CONFIG_STATE_TONES: readonly ["*", "default", "neutral", "primary", "suggest", "positive", "caution", "critical"];
|
|
900
|
-
/** @public */
|
|
901
|
-
type ColorConfigStateTone = (typeof COLOR_CONFIG_STATE_TONES)[number];
|
|
902
|
-
/** @public */
|
|
903
|
-
declare const COLOR_CONFIG_STATES: readonly ["*", "enabled", "hovered", "pressed", "selected", "disabled"];
|
|
904
|
-
/** @public */
|
|
905
|
-
type ColorConfigState = (typeof COLOR_CONFIG_STATES)[number];
|
|
906
|
-
/** @public */
|
|
907
|
-
declare const COLOR_CONFIG_INPUT_MODES: readonly ["*", "default", "invalid"];
|
|
908
|
-
/** @public */
|
|
909
|
-
type ColorConfigInputMode = (typeof COLOR_CONFIG_INPUT_MODES)[number];
|
|
910
|
-
/** @public */
|
|
911
|
-
declare const COLOR_CONFIG_INPUT_STATES: readonly ["*", "enabled", "hovered", "readOnly", "disabled"];
|
|
912
|
-
/** @public */
|
|
913
|
-
type ColorConfigInputState = (typeof COLOR_CONFIG_INPUT_STATES)[number];
|
|
914
|
-
/** @internal */
|
|
915
|
-
declare function isColorConfigBaseTone(str: string): str is ColorConfigCardTone;
|
|
916
|
-
/** @internal */
|
|
917
|
-
declare function isColorConfigBaseKey(str: string): str is ColorConfigCardKey;
|
|
918
|
-
/** @internal */
|
|
919
|
-
declare function isColorConfigStateKey(str: string): str is ColorConfigStateKey;
|
|
920
|
-
/** @internal */
|
|
921
|
-
declare function isColorConfigStateTone(str: string): str is ColorConfigStateTone;
|
|
922
|
-
/** @internal */
|
|
923
|
-
declare function isColorConfigBlendKey(str: string): str is ColorConfigBlendKey;
|
|
924
|
-
/** @internal */
|
|
925
|
-
declare function isColorTokenValue(str: string): str is ColorConfigValue;
|
|
926
|
-
/** @internal */
|
|
927
|
-
declare function isColorValue(str: string): str is 'black' | 'white';
|
|
928
|
-
/** @internal */
|
|
929
|
-
declare function isColorOpacityValue(str: string): str is ColorConfigOpacityValue;
|
|
930
|
-
/** @public */
|
|
931
|
-
interface ThemeColorAvatarHueTokens {
|
|
932
|
-
_blend?: ColorBlendModeTokenValue;
|
|
933
|
-
_hue?: ColorHueKey;
|
|
934
|
-
bg?: ThemeColorTokenValue;
|
|
935
|
-
fg?: ThemeColorTokenValue;
|
|
936
|
-
}
|
|
937
|
-
/** @public */
|
|
938
|
-
interface ThemeColorAvatarTokens {
|
|
939
|
-
'*'?: ThemeColorAvatarHueTokens;
|
|
940
|
-
'gray'?: ThemeColorAvatarHueTokens;
|
|
941
|
-
'blue'?: ThemeColorAvatarHueTokens;
|
|
942
|
-
'purple'?: ThemeColorAvatarHueTokens;
|
|
943
|
-
'magenta'?: ThemeColorAvatarHueTokens;
|
|
944
|
-
'red'?: ThemeColorAvatarHueTokens;
|
|
945
|
-
'orange'?: ThemeColorAvatarHueTokens;
|
|
946
|
-
'yellow'?: ThemeColorAvatarHueTokens;
|
|
947
|
-
'green'?: ThemeColorAvatarHueTokens;
|
|
948
|
-
'cyan'?: ThemeColorAvatarHueTokens;
|
|
949
|
-
}
|
|
950
|
-
/** @public */
|
|
951
|
-
interface ThemeColorBaseTokens extends ThemeColorStateTokens {
|
|
952
|
-
focusRing?: ThemeColorTokenValue;
|
|
953
|
-
backdrop?: ThemeColorTokenValue;
|
|
954
|
-
shadow?: {
|
|
955
|
-
outline?: ThemeColorTokenValue;
|
|
956
|
-
umbra?: ThemeColorTokenValue;
|
|
957
|
-
penumbra?: ThemeColorTokenValue;
|
|
958
|
-
ambient?: ThemeColorTokenValue;
|
|
959
|
-
};
|
|
960
|
-
}
|
|
961
|
-
/** @public */
|
|
962
|
-
interface ThemeColorBadgeToneTokens {
|
|
963
|
-
_blend?: ColorBlendModeTokenValue;
|
|
964
|
-
_hue?: ColorHueKey;
|
|
965
|
-
bg?: ThemeColorTokenValue;
|
|
966
|
-
dot?: ThemeColorTokenValue;
|
|
967
|
-
fg?: ThemeColorTokenValue;
|
|
968
|
-
icon?: ThemeColorTokenValue;
|
|
969
|
-
}
|
|
970
|
-
/** @public */
|
|
971
|
-
type ThemeColorBadgeTokens = Partial<Record<'*' | ThemeColorStateToneKey, ThemeColorBadgeToneTokens>>;
|
|
972
|
-
/** @public */
|
|
973
|
-
interface ThemeColorStateTokens {
|
|
974
|
-
_blend?: ColorBlendModeTokenValue;
|
|
975
|
-
_hue?: ColorHueKey;
|
|
976
|
-
accent?: {
|
|
977
|
-
fg?: ThemeColorTokenValue;
|
|
978
|
-
};
|
|
979
|
-
avatar?: ThemeColorAvatarTokens;
|
|
980
|
-
badge?: ThemeColorBadgeTokens;
|
|
981
|
-
bg?: ThemeColorTokenValue;
|
|
982
|
-
border?: ThemeColorTokenValue;
|
|
983
|
-
code?: {
|
|
984
|
-
bg?: ThemeColorTokenValue;
|
|
985
|
-
fg?: ThemeColorTokenValue;
|
|
986
|
-
};
|
|
987
|
-
fg?: ThemeColorTokenValue;
|
|
988
|
-
icon?: ThemeColorTokenValue;
|
|
989
|
-
kbd?: {
|
|
990
|
-
bg?: ThemeColorTokenValue;
|
|
991
|
-
fg?: ThemeColorTokenValue;
|
|
992
|
-
border?: ThemeColorTokenValue;
|
|
993
|
-
};
|
|
994
|
-
link?: {
|
|
995
|
-
fg?: ThemeColorTokenValue;
|
|
996
|
-
};
|
|
997
|
-
muted?: {
|
|
998
|
-
bg?: ThemeColorTokenValue;
|
|
999
|
-
fg?: ThemeColorTokenValue;
|
|
1000
|
-
};
|
|
1001
|
-
skeleton?: {
|
|
1002
|
-
from?: ThemeColorTokenValue;
|
|
1003
|
-
to?: ThemeColorTokenValue;
|
|
1004
|
-
};
|
|
1005
|
-
}
|
|
1006
|
-
/** @public */
|
|
1007
|
-
type ThemeColorStatesTokens = Partial<Record<ColorConfigState, ThemeColorStateTokens>>;
|
|
1008
|
-
/** @public */
|
|
1009
|
-
interface ThemeColorButtonTokens extends Partial<Record<ColorConfigStateTone, ThemeColorStatesTokens>> {
|
|
1010
|
-
_hue?: ColorHueKey;
|
|
1011
|
-
}
|
|
1012
|
-
/** @public */
|
|
1013
|
-
interface ThemeColorInputStateTokens {
|
|
1014
|
-
_blend?: ColorBlendModeTokenValue;
|
|
1015
|
-
_hue?: ColorHueKey;
|
|
1016
|
-
bg?: ThemeColorTokenValue;
|
|
1017
|
-
border?: ThemeColorTokenValue;
|
|
1018
|
-
fg?: ThemeColorTokenValue;
|
|
1019
|
-
muted?: {
|
|
1020
|
-
bg?: ThemeColorTokenValue;
|
|
1021
|
-
};
|
|
1022
|
-
placeholder?: ThemeColorTokenValue;
|
|
1023
|
-
}
|
|
1024
|
-
/** @public */
|
|
1025
|
-
interface ThemeColorInputTokens extends Partial<Record<ColorConfigInputState, ThemeColorInputStateTokens>> {
|
|
1026
|
-
_hue?: ColorHueKey;
|
|
1027
|
-
}
|
|
1028
|
-
/** @public */
|
|
1029
|
-
interface ThemeColorTokens {
|
|
1030
|
-
base?: Partial<Record<ColorConfigCardTone, ThemeColorBaseTokens>>;
|
|
1031
|
-
button?: Partial<Record<ThemeColorButtonModeKey, ThemeColorButtonTokens>>;
|
|
1032
|
-
input?: Partial<Record<ColorConfigInputMode, ThemeColorInputTokens>>;
|
|
1033
|
-
selectable?: Partial<Record<ColorConfigStateTone, {
|
|
1034
|
-
_hue?: ColorHueKey;
|
|
1035
|
-
} & ThemeColorStatesTokens>>;
|
|
1036
|
-
syntax?: Partial<Record<keyof ThemeColorSyntax, ThemeColorTokenValue>>;
|
|
1037
|
-
}
|
|
1038
|
-
/** @internal */
|
|
1039
|
-
interface TokenBaseKeyNode {
|
|
1040
|
-
type: 'base';
|
|
1041
|
-
tone: ColorConfigCardTone;
|
|
1042
|
-
key: ColorConfigCardKey | ColorConfigBlendKey;
|
|
1043
|
-
}
|
|
1044
|
-
/** @internal */
|
|
1045
|
-
interface TokenButtonKeyNode {
|
|
1046
|
-
type: 'button';
|
|
1047
|
-
tone: ColorConfigStateTone;
|
|
1048
|
-
mode: ThemeColorButtonModeKey;
|
|
1049
|
-
key: ColorConfigStateKey | ColorConfigBlendKey;
|
|
1050
|
-
}
|
|
1051
|
-
/** @internal */
|
|
1052
|
-
type TokenKeyNode = TokenBaseKeyNode | TokenButtonKeyNode;
|
|
1053
|
-
/** @internal */
|
|
1054
|
-
interface TokenColorValueNode {
|
|
1055
|
-
type: 'color';
|
|
1056
|
-
key?: 'black' | 'white';
|
|
1057
|
-
hue?: ColorHueKey;
|
|
1058
|
-
mix?: number;
|
|
1059
|
-
opacity?: number;
|
|
1060
|
-
tint?: ColorTintKey;
|
|
1061
|
-
}
|
|
1062
|
-
/** @internal */
|
|
1063
|
-
interface TokenHueValueNode {
|
|
1064
|
-
type: 'hue';
|
|
1065
|
-
value?: ColorHueKey;
|
|
1066
|
-
}
|
|
1067
|
-
/** @internal */
|
|
1068
|
-
interface TokenBlendModeValueNode {
|
|
1069
|
-
type: 'blendMode';
|
|
1070
|
-
value?: ThemeColorBlendModeKey;
|
|
1071
|
-
}
|
|
1072
|
-
/** @internal */
|
|
1073
|
-
type TokenValueNode = TokenColorValueNode | TokenHueValueNode | TokenBlendModeValueNode;
|
|
1074
|
-
/** @internal */
|
|
1075
|
-
declare function parseTokenKey(str: string): TokenKeyNode | undefined;
|
|
1076
|
-
/** @internal */
|
|
1077
|
-
declare function parseTokenValue(str: string): TokenValueNode | undefined;
|
|
1078
|
-
/** @public */
|
|
1079
|
-
type ThemeColorPalette = {
|
|
1080
|
-
black: string | ColorTint;
|
|
1081
|
-
white: string | ColorTint;
|
|
1082
|
-
} & Record<ColorHueKey, Record<ColorTintKey, string | ColorTint>>;
|
|
1083
|
-
/** @public */
|
|
1084
|
-
interface ThemeConfig {
|
|
1085
|
-
avatar?: ThemeAvatar_v2;
|
|
1086
|
-
button?: {
|
|
1087
|
-
border: {
|
|
1088
|
-
width: number;
|
|
1089
|
-
};
|
|
1090
|
-
focusRing: ThemeFocusRing;
|
|
1091
|
-
textWeight: ThemeFontWeightKey;
|
|
1092
|
-
};
|
|
1093
|
-
card?: {
|
|
1094
|
-
border: {
|
|
1095
|
-
width: number;
|
|
1096
|
-
};
|
|
1097
|
-
focusRing: ThemeFocusRing;
|
|
1098
|
-
shadow: {
|
|
1099
|
-
outline: number;
|
|
1100
|
-
};
|
|
1101
|
-
};
|
|
1102
|
-
color?: ThemeColorTokens;
|
|
1103
|
-
container?: number[];
|
|
1104
|
-
font?: ThemeFonts;
|
|
1105
|
-
input?: ThemeInput_v2;
|
|
1106
|
-
layer?: ThemeLayer;
|
|
1107
|
-
media?: number[];
|
|
1108
|
-
palette?: ThemeColorPalette;
|
|
1109
|
-
radius?: number[];
|
|
1110
|
-
shadow?: Array<ThemeShadow | null>;
|
|
1111
|
-
space?: number[];
|
|
1112
|
-
/** @internal */
|
|
1113
|
-
style?: ThemeStyles;
|
|
1114
|
-
}
|
|
1115
|
-
/** @internal */
|
|
1116
|
-
declare function buildTheme(config?: ThemeConfig): RootTheme;
|
|
1117
|
-
/**
|
|
1118
|
-
* @internal
|
|
1119
|
-
*/
|
|
1120
|
-
interface RGB {
|
|
1121
|
-
r: number;
|
|
1122
|
-
g: number;
|
|
1123
|
-
b: number;
|
|
1124
|
-
a?: undefined;
|
|
1125
|
-
}
|
|
1126
|
-
/**
|
|
1127
|
-
* @internal
|
|
1128
|
-
*/
|
|
1129
|
-
interface RGBA {
|
|
1130
|
-
r: number;
|
|
1131
|
-
g: number;
|
|
1132
|
-
b: number;
|
|
1133
|
-
a: number;
|
|
1134
|
-
}
|
|
1135
|
-
/**
|
|
1136
|
-
* @internal
|
|
1137
|
-
*/
|
|
1138
|
-
interface HSL {
|
|
1139
|
-
h: number;
|
|
1140
|
-
s: number;
|
|
1141
|
-
l: number;
|
|
1142
|
-
}
|
|
1143
|
-
/**
|
|
1144
|
-
* Apply the \`mix\` blend mode
|
|
1145
|
-
* @internal
|
|
1146
|
-
*/
|
|
1147
|
-
declare function mix(b: RGB | RGBA, s: RGB | RGBA, weight: number): RGB;
|
|
1148
887
|
/**
|
|
1149
888
|
* Apply the \`multiply\` blend mode
|
|
1150
889
|
* Source: https://www.w3.org/TR/compositing-1/#blendingmultiply
|
|
@@ -1157,8 +896,6 @@ declare function multiply(b: RGB | RGBA, s: RGB | RGBA): RGB;
|
|
|
1157
896
|
* @internal
|
|
1158
897
|
*/
|
|
1159
898
|
declare function screen(b: RGB | RGBA, s: RGB | RGBA): RGB;
|
|
1160
|
-
/** @internal */
|
|
1161
|
-
declare function getContrastRatio(bg: string, fg: string): number;
|
|
1162
899
|
/**
|
|
1163
900
|
* @internal
|
|
1164
901
|
*/
|
|
@@ -1188,17 +925,5 @@ declare function parseColor(color: unknown): RGB | RGBA;
|
|
|
1188
925
|
* @internal
|
|
1189
926
|
*/
|
|
1190
927
|
declare function rgba(color: unknown, a: number): string;
|
|
1191
|
-
|
|
1192
|
-
|
|
1193
|
-
/** @public */
|
|
1194
|
-
declare function getTheme_v2(theme: Theme): Theme_v2;
|
|
1195
|
-
/** @internal */
|
|
1196
|
-
declare function is_v0(themeProp: RootTheme | RootTheme_v2): themeProp is RootTheme;
|
|
1197
|
-
/** @internal */
|
|
1198
|
-
declare function is_v2(themeProp: RootTheme | RootTheme_v2): themeProp is RootTheme_v2;
|
|
1199
|
-
/** @internal */
|
|
1200
|
-
declare function v0_v2(v0: RootTheme): RootTheme_v2;
|
|
1201
|
-
/** @internal */
|
|
1202
|
-
declare function v2_v0(v2: RootTheme_v2): RootTheme;
|
|
1203
|
-
export { COLOR_CONFIG_BLEND_KEYS as $, THEME_COLOR_STATE_TONES as $n, ThemeColorGenericState as $t, TokenHueValueNode as A, ThemeColorAvatarHue_v2 as An, ThemeColorScheme as At, ThemeColorInputTokens as B, ThemeColorInputModeKey as Bn, ThemeColorMutedTone as Bt, ThemeConfig as C, ThemeColorButtonMode_v2 as Cn, BaseTheme as Ct, TokenBlendModeValueNode as D, ThemeColorKBD as Dn, Theme_v2 as Dt, TokenBaseKeyNode as E, ThemeColorState_v2 as En, Theme as Et, ThemeColorBadgeTokens as F, isColorTintKey as Fn, ThemeColorSolidTone as Ft, isColorConfigBaseTone as G, THEME_COLOR_AVATAR_COLORS as Gn, ThemeColorCardState as Gt, ThemeColorStatesTokens as H, ThemeColorSchemeKey as Hn, ThemeColorInputState as Ht, ThemeColorBadgeToneTokens as I, ThemeColorAvatarColorKey as In, ThemeColorSelectable as It, isColorConfigStateTone as J, THEME_COLOR_CARD_TONES as Jn, ThemeColorButtonStates as Jt, isColorConfigBlendKey as K, THEME_COLOR_BLEND_MODES as Kn, ThemeColorButton as Kt, ThemeColorBaseTokens as L, ThemeColorBlendModeKey as Ln, ThemeColorSelectableState as Lt, TokenValueNode as M, isColorBlendModeValue as Mn, ThemeColorSpot as Mt, ThemeColorAvatarHueTokens as N, isColorButtonMode as Nn, ThemeColorSpotKey as Nt, TokenButtonKeyNode as O, ThemeColorBadgeTone_v2 as On, ThemeInput as Ot, ThemeColorAvatarTokens as P, isColorHueKey as Pn, ThemeColorSolid as Pt, COLOR_CONFIG_AVATAR_COLORS as Q, THEME_COLOR_STATES as Qn, ThemeColorToneKey as Qt, ThemeColorButtonTokens as R, ThemeColorButtonModeKey as Rn, ThemeColorSelectableStates as Rt, ThemeColorPalette as S, ThemeColorInput_v2 as Sn, createColorTheme as St, parseTokenKey as T, ThemeColorButton_v2 as Tn, RootTheme_v2 as Tt, ThemeColorTokens as U, ThemeColorStateKey as Un, ThemeColorInputStates as Ut, ThemeColorStateTokens as V, ThemeColorInputStateKey as Vn, ThemeColorInput as Vt, isColorConfigBaseKey as W, ThemeColorStateToneKey as Wn, ThemeColorCard as Wt, isColorTokenValue as X, THEME_COLOR_INPUT_STATES as Xn, ThemeColorBase as Xt, isColorOpacityValue as Y, THEME_COLOR_INPUT_MODES as Yn, ThemeColorButtonTones as Yt, isColorValue as Z, THEME_COLOR_SCHEMES as Zn, ThemeColorName as Zt, mix as _, ThemeColorShadow as _n, ColorConfigStateTone as _t, getTheme_v2 as a, ThemeInput_v2 as an, COLOR_CONFIG_STATE_KEYS as at, RGBA as b, ThemeColorInputMode_v2 as bn, PartialThemeColorBuilderOpts as bt, parseColor as c, ThemeFontSize as cn, ColorConfigAvatarColor as ct, rgbToHex as d, ThemeFonts as dn, ColorConfigCardTone as dt, ThemeAvatar as en, ThemeAvatar_v2 as er, COLOR_CONFIG_CARD_KEYS as et, rgbToHsl as f, CSSObject as fn, ColorConfigInputMode as ft, multiply as g, ThemeColorSyntax as gn, ColorConfigStateKey as gt, screen as h, ThemeColorSchemes_v2 as hn, ColorConfigState as ht, is_v0 as i, ThemeLayer as in, COLOR_CONFIG_STATES as it, TokenKeyNode as j, ThemeColorAvatar_v2 as jn, ThemeColorSchemes as jt, TokenColorValueNode as k, ThemeColorBadge_v2 as kn, ThemeColor as kt, hexToRgb as l, ThemeFontWeight as ln, ColorConfigBlendKey as lt, getContrastRatio as m, ThemeColorScheme_v2 as mn, ColorConfigOpacityValue as mt, v0_v2 as n, ThemeBoxShadow as nn, COLOR_CONFIG_INPUT_MODES as nt, getScopedTheme as o, ThemeFont as on, COLOR_CONFIG_STATE_TONES as ot, rgbaToRGBA as p, ThemeColorCard_v2 as pn, ColorConfigInputState as pt, isColorConfigStateKey as q, THEME_COLOR_BUTTON_MODES as qn, ThemeColorButtonState as qt, is_v2 as r, ThemeShadow as rn, COLOR_CONFIG_INPUT_STATES as rt, rgba as s, ThemeFontKey as sn, ColorBlendModeTokenValue as st, v2_v0 as t, ThemeStyles as tn, ThemeFocusRing as tr, COLOR_CONFIG_CARD_TONES as tt, hslToRgb as u, ThemeFontWeightKey as un, ColorConfigCardKey as ut, HSL as v, ThemeColorSelectableTone_v2 as vn, ColorConfigValue as vt, parseTokenValue as w, ThemeColorButtonTone_v2 as wn, RootTheme as wt, buildTheme as x, ThemeColorInputState_v2 as xn, ThemeColorBuilderOpts as xt, RGB as y, ThemeColorSelectable_v2 as yn, ThemeColorTokenValue as yt, ThemeColorInputStateTokens as z, ThemeColorCardToneKey as zn, ThemeColorMuted as zt };
|
|
1204
|
-
//# sourceMappingURL=theme.d.ts.map
|
|
928
|
+
export { ThemeColorInputState_v2 as $, ThemeColorMutedTone as A, ThemeColorSchemeKey as At, ThemeColorBase as B, THEME_COLOR_STATES as Bt, ThemeColorSpotKey as C, ThemeColorSyntax as Ct, ThemeColorSelectableState as D, ThemeColorCardToneKey as Dt, ThemeColorSelectable as E, ThemeColorButtonModeKey as Et, ThemeColorCardState as F, THEME_COLOR_BUTTON_MODES as Ft, ThemeInput_v2 as G, ThemeColorToneKey as H, HSL as Ht, ThemeColorButton as I, THEME_COLOR_CARD_TONES as It, ThemeColorSchemes_v2 as J, ThemeColorCard_v2 as K, ThemeColorButtonState as L, THEME_COLOR_INPUT_MODES as Lt, ThemeColorInputState as M, ThemeColorStateToneKey as Mt, ThemeColorInputStates as N, THEME_COLOR_AVATAR_COLORS as Nt, ThemeColorSelectableStates as O, ThemeColorInputModeKey as Ot, ThemeColorCard as P, THEME_COLOR_BLEND_MODES as Pt, ThemeColorInputMode_v2 as Q, ThemeColorButtonStates as R, THEME_COLOR_INPUT_STATES as Rt, ThemeColorSpot as S, ThemeFonts as St, ThemeColorSolidTone as T, ThemeColorBlendModeKey as Tt, ThemeColorGenericState as U, RGB as Ut, ThemeColorName as V, THEME_COLOR_STATE_TONES as Vt, ThemeAvatar as W, RGBA as Wt, ThemeColorSelectableTone_v2 as X, ThemeColorShadow as Y, ThemeColorSelectable_v2 as Z, Theme_v2 as _, ThemeFont as _t, rgbToHex as a, ThemeColorKBD as at, ThemeColorScheme as b, ThemeFontWeight 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, ThemeColorStateKey as jt, ThemeColorMuted as k, ThemeColorInputStateKey as kt, 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, ThemeFontKey as vt, ThemeColorSolid as w, ThemeColorAvatarColorKey as wt, ThemeColorSchemes as x, ThemeFontWeightKey as xt, ThemeColor as y, ThemeFontSize as yt, ThemeColorButtonTones as z, THEME_COLOR_SCHEMES as zt };
|
|
929
|
+
//# sourceMappingURL=rgba.d.cts.map
|