@vellira-ui/tokens 2.32.0 → 2.33.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/css/tokens.css +998 -98
- package/dist/dark/components/dropdown.d.ts +255 -0
- package/dist/dark/components/dropdown.d.ts.map +1 -1
- package/dist/dark/components/dropdown.js +106 -0
- package/dist/dark/components/select.d.ts +733 -6
- package/dist/dark/components/select.d.ts.map +1 -1
- package/dist/dark/components/select.js +57 -14
- package/dist/dark/theme.d.ts +7 -7
- package/dist/factories/createDropdownPalette.d.ts +69 -0
- package/dist/factories/createDropdownPalette.d.ts.map +1 -0
- package/dist/factories/createDropdownPalette.js +46 -0
- package/dist/factories/createSelectPalette.d.ts +156 -0
- package/dist/factories/createSelectPalette.d.ts.map +1 -1
- package/dist/factories/createSelectPalette.js +52 -33
- package/dist/generated/token-types.d.ts +4 -4
- package/dist/generated/token-types.d.ts.map +1 -1
- package/dist/generated/token-types.js +1200 -0
- package/dist/highContrast/components/dropdown.d.ts +255 -0
- package/dist/highContrast/components/dropdown.d.ts.map +1 -1
- package/dist/highContrast/components/dropdown.js +78 -0
- package/dist/highContrast/components/select.d.ts +731 -4
- package/dist/highContrast/components/select.d.ts.map +1 -1
- package/dist/highContrast/components/select.js +49 -1
- package/dist/highContrast/theme.d.ts +7 -7
- package/dist/index.d.ts +7 -7
- package/dist/light/components/contextMenu.d.ts +1 -1
- package/dist/light/components/dropdown.d.ts +256 -1
- package/dist/light/components/dropdown.d.ts.map +1 -1
- package/dist/light/components/dropdown.js +103 -0
- package/dist/light/components/input.d.ts +1 -1
- package/dist/light/components/select.d.ts +731 -4
- package/dist/light/components/select.d.ts.map +1 -1
- package/dist/light/components/select.js +24 -1
- package/dist/light/semantic/menu.d.ts +1 -1
- package/dist/light/semantic/status.d.ts +1 -1
- package/dist/light/semantic/status.js +1 -1
- package/dist/light/theme.d.ts +7 -7
- package/dist/tokens/typography.d.ts +7 -7
- package/dist/tokens/typography.js +7 -7
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/light/components/select.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/light/components/select.ts"],"names":[],"mappings":"AA0EA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4MT,CAAC"}
|
|
@@ -6,6 +6,7 @@ import { control } from '../semantic/control.js';
|
|
|
6
6
|
import { focus } from '../semantic/focus.js';
|
|
7
7
|
import { icons } from '../semantic/icons.js';
|
|
8
8
|
import { menu } from '../semantic/menu.js';
|
|
9
|
+
import { shadow } from '../semantic/shadow.js';
|
|
9
10
|
import { status } from '../semantic/status.js';
|
|
10
11
|
import { surface } from '../semantic/surface.js';
|
|
11
12
|
import { text } from '../semantic/text.js';
|
|
@@ -73,6 +74,9 @@ export const select = {
|
|
|
73
74
|
optionHoverBorder: 'transparent',
|
|
74
75
|
optionPressedBg: colors.primary[200],
|
|
75
76
|
optionPressedBorder: 'transparent',
|
|
77
|
+
optionSelectedActiveBg: colors.primary[200],
|
|
78
|
+
optionSelectedHoverBg: colors.primary[200],
|
|
79
|
+
optionSelectedPressedBg: colors.primary[300],
|
|
76
80
|
optionSelectedBg: colors.primary[100],
|
|
77
81
|
}),
|
|
78
82
|
neutral: createSelectPalette(neutral, {
|
|
@@ -82,6 +86,9 @@ export const select = {
|
|
|
82
86
|
optionHoverBorder: 'transparent',
|
|
83
87
|
optionPressedBg: colors.vellira[200],
|
|
84
88
|
optionPressedBorder: 'transparent',
|
|
89
|
+
optionSelectedActiveBg: colors.vellira[250],
|
|
90
|
+
optionSelectedHoverBg: colors.vellira[200],
|
|
91
|
+
optionSelectedPressedBg: colors.vellira[300],
|
|
85
92
|
optionSelectedBg: colors.vellira[150],
|
|
86
93
|
}),
|
|
87
94
|
success: createSelectPalette(success, {
|
|
@@ -91,6 +98,9 @@ export const select = {
|
|
|
91
98
|
optionHoverBorder: 'transparent',
|
|
92
99
|
optionPressedBg: colors.success[200],
|
|
93
100
|
optionPressedBorder: 'transparent',
|
|
101
|
+
optionSelectedActiveBg: colors.success[200],
|
|
102
|
+
optionSelectedHoverBg: colors.success[200],
|
|
103
|
+
optionSelectedPressedBg: colors.success[300],
|
|
94
104
|
optionSelectedBg: colors.success[100],
|
|
95
105
|
}),
|
|
96
106
|
warning: createSelectPalette(warning, {
|
|
@@ -100,6 +110,9 @@ export const select = {
|
|
|
100
110
|
optionHoverBorder: 'transparent',
|
|
101
111
|
optionPressedBg: colors.warning[200],
|
|
102
112
|
optionPressedBorder: 'transparent',
|
|
113
|
+
optionSelectedActiveBg: colors.warning[200],
|
|
114
|
+
optionSelectedHoverBg: colors.warning[200],
|
|
115
|
+
optionSelectedPressedBg: colors.warning[300],
|
|
103
116
|
optionSelectedBg: colors.warning[100],
|
|
104
117
|
}),
|
|
105
118
|
danger: createSelectPalette(danger, {
|
|
@@ -109,6 +122,9 @@ export const select = {
|
|
|
109
122
|
optionHoverBorder: 'transparent',
|
|
110
123
|
optionPressedBg: colors.error[200],
|
|
111
124
|
optionPressedBorder: 'transparent',
|
|
125
|
+
optionSelectedActiveBg: colors.error[200],
|
|
126
|
+
optionSelectedHoverBg: colors.error[200],
|
|
127
|
+
optionSelectedPressedBg: colors.error[300],
|
|
112
128
|
optionSelectedBg: colors.error[100],
|
|
113
129
|
}),
|
|
114
130
|
trigger: {
|
|
@@ -149,7 +165,7 @@ export const select = {
|
|
|
149
165
|
bg: menu.background,
|
|
150
166
|
fg: menu.item.default.fg,
|
|
151
167
|
border: 'transparent',
|
|
152
|
-
shadow:
|
|
168
|
+
shadow: shadow.lg,
|
|
153
169
|
search: {
|
|
154
170
|
bg: surface.default,
|
|
155
171
|
fg: text.primary,
|
|
@@ -167,6 +183,13 @@ export const select = {
|
|
|
167
183
|
bg: border.muted,
|
|
168
184
|
},
|
|
169
185
|
},
|
|
186
|
+
clearButton: {
|
|
187
|
+
fg: icons.muted,
|
|
188
|
+
hoverFg: status.error.fg,
|
|
189
|
+
hoverBg: status.error.bg,
|
|
190
|
+
focusBg: surface.subtle,
|
|
191
|
+
pressedBg: surface.active,
|
|
192
|
+
},
|
|
170
193
|
option: {
|
|
171
194
|
default: {
|
|
172
195
|
...menu.item.default,
|
package/dist/light/theme.d.ts
CHANGED
|
@@ -192,11 +192,11 @@ export declare const lightTheme: {
|
|
|
192
192
|
};
|
|
193
193
|
readonly typography: {
|
|
194
194
|
readonly family: {
|
|
195
|
-
readonly base: "
|
|
196
|
-
readonly extraLight: "
|
|
197
|
-
readonly regular: "
|
|
198
|
-
readonly medium: "
|
|
199
|
-
readonly semibold: "
|
|
195
|
+
readonly base: "VelliraSans, Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif";
|
|
196
|
+
readonly extraLight: "VelliraSans-ExtraLight";
|
|
197
|
+
readonly regular: "VelliraSans-Regular";
|
|
198
|
+
readonly medium: "VelliraSans-Medium";
|
|
199
|
+
readonly semibold: "VelliraSans-SemiBold";
|
|
200
200
|
};
|
|
201
201
|
readonly size: {
|
|
202
202
|
readonly xs: 12;
|
|
@@ -209,8 +209,8 @@ export declare const lightTheme: {
|
|
|
209
209
|
readonly weight: {
|
|
210
210
|
readonly light: "200";
|
|
211
211
|
readonly regular: "400";
|
|
212
|
-
readonly medium: "
|
|
213
|
-
readonly semibold: "
|
|
212
|
+
readonly medium: "500";
|
|
213
|
+
readonly semibold: "600";
|
|
214
214
|
};
|
|
215
215
|
readonly lineHeight: {
|
|
216
216
|
readonly xs: 16;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
export declare const typography: {
|
|
2
2
|
readonly family: {
|
|
3
|
-
readonly base: "
|
|
4
|
-
readonly extraLight: "
|
|
5
|
-
readonly regular: "
|
|
6
|
-
readonly medium: "
|
|
7
|
-
readonly semibold: "
|
|
3
|
+
readonly base: "VelliraSans, Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif";
|
|
4
|
+
readonly extraLight: "VelliraSans-ExtraLight";
|
|
5
|
+
readonly regular: "VelliraSans-Regular";
|
|
6
|
+
readonly medium: "VelliraSans-Medium";
|
|
7
|
+
readonly semibold: "VelliraSans-SemiBold";
|
|
8
8
|
};
|
|
9
9
|
readonly size: {
|
|
10
10
|
readonly xs: 12;
|
|
@@ -17,8 +17,8 @@ export declare const typography: {
|
|
|
17
17
|
readonly weight: {
|
|
18
18
|
readonly light: "200";
|
|
19
19
|
readonly regular: "400";
|
|
20
|
-
readonly medium: "
|
|
21
|
-
readonly semibold: "
|
|
20
|
+
readonly medium: "500";
|
|
21
|
+
readonly semibold: "600";
|
|
22
22
|
};
|
|
23
23
|
readonly lineHeight: {
|
|
24
24
|
readonly xs: 16;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
export const typography = {
|
|
2
2
|
family: {
|
|
3
|
-
base: "
|
|
4
|
-
extraLight: '
|
|
5
|
-
regular: '
|
|
6
|
-
medium: '
|
|
7
|
-
semibold: '
|
|
3
|
+
base: "VelliraSans, Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif",
|
|
4
|
+
extraLight: 'VelliraSans-ExtraLight',
|
|
5
|
+
regular: 'VelliraSans-Regular',
|
|
6
|
+
medium: 'VelliraSans-Medium',
|
|
7
|
+
semibold: 'VelliraSans-SemiBold',
|
|
8
8
|
},
|
|
9
9
|
size: {
|
|
10
10
|
xs: 12,
|
|
@@ -17,8 +17,8 @@ export const typography = {
|
|
|
17
17
|
weight: {
|
|
18
18
|
light: '200',
|
|
19
19
|
regular: '400',
|
|
20
|
-
medium: '
|
|
21
|
-
semibold: '
|
|
20
|
+
medium: '500',
|
|
21
|
+
semibold: '600',
|
|
22
22
|
},
|
|
23
23
|
lineHeight: {
|
|
24
24
|
xs: 16,
|