@trackunit/css-component-tokens 0.0.4 → 0.0.7
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/index.cjs +106 -34
- package/package.json +2 -2
- package/src/component-tokens/ComponentTokenVariablesByThemeName.d.ts +57 -5
- package/src/component-tokens/ComponentTokens.d.ts +65 -5
- package/src/component-tokens/components/Button.tokens.d.ts +11 -5
- package/src/component-tokens/components/Card.tokens.d.ts +30 -0
- package/src/component-tokens/components/Popover/Popover.tokens.d.ts +13 -0
- package/src/component-tokens/components/Popover/PopoverListItem.tokens.d.ts +13 -0
- package/src/component-tokens/pluginUtilityFunctions.d.ts +2 -2
package/index.cjs
CHANGED
|
@@ -14,6 +14,45 @@ var plugin__default = /*#__PURE__*/_interopDefaultLegacy(plugin);
|
|
|
14
14
|
*/
|
|
15
15
|
const AsComponentTokenDefinition = designTokens => designTokens;
|
|
16
16
|
|
|
17
|
+
/*
|
|
18
|
+
* This file holds the custom design tokens for this component.
|
|
19
|
+
* These will be added to the tailwind configuration.
|
|
20
|
+
*/
|
|
21
|
+
const ButtonTokenDefinition = AsComponentTokenDefinition({
|
|
22
|
+
DEFAULT: {
|
|
23
|
+
"secondary-color": {
|
|
24
|
+
backgroundColor: "rgb(var(--color-secondary-200))",
|
|
25
|
+
color: "rgb(var(--color-secondary-600))"
|
|
26
|
+
},
|
|
27
|
+
border: {
|
|
28
|
+
borderRadius: "var(--border-radius-lg)"
|
|
29
|
+
},
|
|
30
|
+
height: {
|
|
31
|
+
height: "auto"
|
|
32
|
+
},
|
|
33
|
+
width: {
|
|
34
|
+
width: "auto",
|
|
35
|
+
minWidth: "auto"
|
|
36
|
+
}
|
|
37
|
+
},
|
|
38
|
+
"theme-marketing": {
|
|
39
|
+
"secondary-color": {
|
|
40
|
+
backgroundColor: "rgb(var(--color-secondary-600))",
|
|
41
|
+
color: "rgb(var(--color-secondary-50))"
|
|
42
|
+
},
|
|
43
|
+
border: {
|
|
44
|
+
borderRadius: "50px"
|
|
45
|
+
},
|
|
46
|
+
height: {
|
|
47
|
+
height: "55px"
|
|
48
|
+
},
|
|
49
|
+
width: {
|
|
50
|
+
width: "min-content",
|
|
51
|
+
minWidth: "158px"
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
});
|
|
55
|
+
|
|
17
56
|
/*
|
|
18
57
|
* This file holds the custom design tokens for this component.
|
|
19
58
|
* These will be added to the tailwind configuration.
|
|
@@ -24,8 +63,23 @@ const CardTokenDefinition = AsComponentTokenDefinition({
|
|
|
24
63
|
borderColor: "rgb(var(--color-slate-200))",
|
|
25
64
|
borderRadius: "var(--border-radius-DEFAULT)"
|
|
26
65
|
},
|
|
66
|
+
"popover-border": {
|
|
67
|
+
borderRadius: "var(--border-radius-DEFAULT)"
|
|
68
|
+
},
|
|
27
69
|
shadow: {
|
|
28
70
|
boxShadow: "var(--box-shadow-DEFAULT)"
|
|
71
|
+
},
|
|
72
|
+
spacing: {
|
|
73
|
+
gap: "var(--spacing-3)",
|
|
74
|
+
padding: "var(--spacing-3)"
|
|
75
|
+
},
|
|
76
|
+
"spacing-sm": {
|
|
77
|
+
gap: "var(--spacing-4)",
|
|
78
|
+
padding: "var(--spacing-4)"
|
|
79
|
+
},
|
|
80
|
+
"spacing-md": {
|
|
81
|
+
gap: "var(--spacing-4)",
|
|
82
|
+
padding: "var(--spacing-6)"
|
|
29
83
|
}
|
|
30
84
|
},
|
|
31
85
|
"theme-marketing": {
|
|
@@ -33,8 +87,57 @@ const CardTokenDefinition = AsComponentTokenDefinition({
|
|
|
33
87
|
borderColor: "rgba(0, 0, 0, 0)",
|
|
34
88
|
borderRadius: "2rem"
|
|
35
89
|
},
|
|
90
|
+
"popover-border": {
|
|
91
|
+
borderRadius: "1rem"
|
|
92
|
+
},
|
|
36
93
|
shadow: {
|
|
37
94
|
boxShadow: "0px 20px 48px rgba(73, 55, 54, 0.1)"
|
|
95
|
+
},
|
|
96
|
+
spacing: {
|
|
97
|
+
gap: "var(--spacing-1)",
|
|
98
|
+
padding: "var(--spacing-1)"
|
|
99
|
+
},
|
|
100
|
+
"spacing-sm": {
|
|
101
|
+
gap: "var(--spacing-1)",
|
|
102
|
+
padding: "var(--spacing-1)"
|
|
103
|
+
},
|
|
104
|
+
"spacing-md": {
|
|
105
|
+
gap: "var(--spacing-1)",
|
|
106
|
+
padding: "var(--spacing-1)"
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
});
|
|
110
|
+
|
|
111
|
+
/*
|
|
112
|
+
* This file holds the custom design tokens for this component.
|
|
113
|
+
* These will be added to the tailwind configuration.
|
|
114
|
+
*/
|
|
115
|
+
const PopoverTokenDefinition = AsComponentTokenDefinition({
|
|
116
|
+
DEFAULT: {
|
|
117
|
+
border: {
|
|
118
|
+
borderRadius: "var(--border-radius-DEFAULT)"
|
|
119
|
+
}
|
|
120
|
+
},
|
|
121
|
+
"theme-marketing": {
|
|
122
|
+
border: {
|
|
123
|
+
borderRadius: "1rem"
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
});
|
|
127
|
+
|
|
128
|
+
/*
|
|
129
|
+
* This file holds the custom design tokens for this component.
|
|
130
|
+
* These will be added to the tailwind configuration.
|
|
131
|
+
*/
|
|
132
|
+
const PopoverListItemTokenDefinition = AsComponentTokenDefinition({
|
|
133
|
+
DEFAULT: {
|
|
134
|
+
border: {
|
|
135
|
+
borderRadius: "var(--border-radius-DEFAULT)"
|
|
136
|
+
}
|
|
137
|
+
},
|
|
138
|
+
"theme-marketing": {
|
|
139
|
+
border: {
|
|
140
|
+
borderRadius: "1rem"
|
|
38
141
|
}
|
|
39
142
|
}
|
|
40
143
|
});
|
|
@@ -126,43 +229,12 @@ const SearchTokenDefinition = AsComponentTokenDefinition({
|
|
|
126
229
|
}
|
|
127
230
|
});
|
|
128
231
|
|
|
129
|
-
/*
|
|
130
|
-
* This file holds the custom design tokens for this component.
|
|
131
|
-
* These will be added to the tailwind configuration.
|
|
132
|
-
*/
|
|
133
|
-
const ButtonTokenDefinition = AsComponentTokenDefinition({
|
|
134
|
-
DEFAULT: {
|
|
135
|
-
border: {
|
|
136
|
-
borderRadius: "var(--border-radius-lg)"
|
|
137
|
-
},
|
|
138
|
-
height: {
|
|
139
|
-
height: "min-content",
|
|
140
|
-
maxHeight: "32px"
|
|
141
|
-
},
|
|
142
|
-
width: {
|
|
143
|
-
width: "min-content",
|
|
144
|
-
minWidth: "min-content"
|
|
145
|
-
}
|
|
146
|
-
},
|
|
147
|
-
"theme-marketing": {
|
|
148
|
-
border: {
|
|
149
|
-
borderRadius: "50px"
|
|
150
|
-
},
|
|
151
|
-
height: {
|
|
152
|
-
height: "55px",
|
|
153
|
-
maxHeight: ""
|
|
154
|
-
},
|
|
155
|
-
width: {
|
|
156
|
-
width: "min-content",
|
|
157
|
-
minWidth: "158px"
|
|
158
|
-
}
|
|
159
|
-
}
|
|
160
|
-
});
|
|
161
|
-
|
|
162
232
|
const componentTokenDefinitions = {
|
|
163
233
|
card: CardTokenDefinition,
|
|
164
234
|
button: ButtonTokenDefinition,
|
|
165
|
-
search: SearchTokenDefinition
|
|
235
|
+
search: SearchTokenDefinition,
|
|
236
|
+
popover: PopoverTokenDefinition,
|
|
237
|
+
popoverListItem: PopoverListItemTokenDefinition
|
|
166
238
|
};
|
|
167
239
|
|
|
168
240
|
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@trackunit/css-component-tokens",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.7",
|
|
4
4
|
"main": "./index.cjs",
|
|
5
5
|
"repository": "https://github.com/Trackunit/manager",
|
|
6
6
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
"types": "./src/index.d.ts",
|
|
9
9
|
"dependencies": {
|
|
10
10
|
"csstype": "3.1.1",
|
|
11
|
-
"@trackunit/css-tailwind-custom-properties-plugin": "0.0.
|
|
11
|
+
"@trackunit/css-tailwind-custom-properties-plugin": "0.0.4"
|
|
12
12
|
},
|
|
13
13
|
"peerDependencies": {}
|
|
14
14
|
}
|
|
@@ -7,36 +7,72 @@ export declare const getComponentTokenVariablesByThemeName: (theme: ThemeNames,
|
|
|
7
7
|
readonly borderColor: "rgb(var(--color-slate-200))";
|
|
8
8
|
readonly borderRadius: "var(--border-radius-DEFAULT)";
|
|
9
9
|
};
|
|
10
|
+
readonly "popover-border": {
|
|
11
|
+
readonly borderRadius: "var(--border-radius-DEFAULT)";
|
|
12
|
+
};
|
|
10
13
|
readonly shadow: {
|
|
11
14
|
readonly boxShadow: "var(--box-shadow-DEFAULT)";
|
|
12
15
|
};
|
|
16
|
+
readonly spacing: {
|
|
17
|
+
readonly gap: "var(--spacing-3)";
|
|
18
|
+
readonly padding: "var(--spacing-3)";
|
|
19
|
+
};
|
|
20
|
+
readonly "spacing-sm": {
|
|
21
|
+
readonly gap: "var(--spacing-4)";
|
|
22
|
+
readonly padding: "var(--spacing-4)";
|
|
23
|
+
};
|
|
24
|
+
readonly "spacing-md": {
|
|
25
|
+
readonly gap: "var(--spacing-4)";
|
|
26
|
+
readonly padding: "var(--spacing-6)";
|
|
27
|
+
};
|
|
13
28
|
} | {
|
|
14
29
|
readonly border: {
|
|
15
30
|
readonly borderColor: "rgba(0, 0, 0, 0)";
|
|
16
31
|
readonly borderRadius: "2rem";
|
|
17
32
|
};
|
|
33
|
+
readonly "popover-border": {
|
|
34
|
+
readonly borderRadius: "1rem";
|
|
35
|
+
};
|
|
18
36
|
readonly shadow: {
|
|
19
37
|
readonly boxShadow: "0px 20px 48px rgba(73, 55, 54, 0.1)";
|
|
20
38
|
};
|
|
39
|
+
readonly spacing: {
|
|
40
|
+
readonly gap: "var(--spacing-1)";
|
|
41
|
+
readonly padding: "var(--spacing-1)";
|
|
42
|
+
};
|
|
43
|
+
readonly "spacing-sm": {
|
|
44
|
+
readonly gap: "var(--spacing-1)";
|
|
45
|
+
readonly padding: "var(--spacing-1)";
|
|
46
|
+
};
|
|
47
|
+
readonly "spacing-md": {
|
|
48
|
+
readonly gap: "var(--spacing-1)";
|
|
49
|
+
readonly padding: "var(--spacing-1)";
|
|
50
|
+
};
|
|
21
51
|
} | {
|
|
52
|
+
readonly "secondary-color": {
|
|
53
|
+
readonly backgroundColor: "rgb(var(--color-secondary-200))";
|
|
54
|
+
readonly color: "rgb(var(--color-secondary-600))";
|
|
55
|
+
};
|
|
22
56
|
readonly border: {
|
|
23
57
|
readonly borderRadius: "var(--border-radius-lg)";
|
|
24
58
|
};
|
|
25
59
|
readonly height: {
|
|
26
|
-
readonly height: "
|
|
27
|
-
readonly maxHeight: "32px";
|
|
60
|
+
readonly height: "auto";
|
|
28
61
|
};
|
|
29
62
|
readonly width: {
|
|
30
|
-
readonly width: "
|
|
31
|
-
readonly minWidth: "
|
|
63
|
+
readonly width: "auto";
|
|
64
|
+
readonly minWidth: "auto";
|
|
32
65
|
};
|
|
33
66
|
} | {
|
|
67
|
+
readonly "secondary-color": {
|
|
68
|
+
readonly backgroundColor: "rgb(var(--color-secondary-600))";
|
|
69
|
+
readonly color: "rgb(var(--color-secondary-50))";
|
|
70
|
+
};
|
|
34
71
|
readonly border: {
|
|
35
72
|
readonly borderRadius: "50px";
|
|
36
73
|
};
|
|
37
74
|
readonly height: {
|
|
38
75
|
readonly height: "55px";
|
|
39
|
-
readonly maxHeight: "";
|
|
40
76
|
};
|
|
41
77
|
readonly width: {
|
|
42
78
|
readonly width: "min-content";
|
|
@@ -120,5 +156,21 @@ export declare const getComponentTokenVariablesByThemeName: (theme: ThemeNames,
|
|
|
120
156
|
readonly color: "rgb(var(--color-slate-600))";
|
|
121
157
|
readonly cursor: "pointer";
|
|
122
158
|
};
|
|
159
|
+
} | {
|
|
160
|
+
readonly border: {
|
|
161
|
+
readonly borderRadius: "var(--border-radius-DEFAULT)";
|
|
162
|
+
};
|
|
163
|
+
} | {
|
|
164
|
+
readonly border: {
|
|
165
|
+
readonly borderRadius: "1rem";
|
|
166
|
+
};
|
|
167
|
+
} | {
|
|
168
|
+
readonly border: {
|
|
169
|
+
readonly borderRadius: "var(--border-radius-DEFAULT)";
|
|
170
|
+
};
|
|
171
|
+
} | {
|
|
172
|
+
readonly border: {
|
|
173
|
+
readonly borderRadius: "1rem";
|
|
174
|
+
};
|
|
123
175
|
};
|
|
124
176
|
};
|
|
@@ -6,41 +6,77 @@ export declare const componentTokenDefinitions: {
|
|
|
6
6
|
readonly borderColor: "rgb(var(--color-slate-200))";
|
|
7
7
|
readonly borderRadius: "var(--border-radius-DEFAULT)";
|
|
8
8
|
};
|
|
9
|
+
readonly "popover-border": {
|
|
10
|
+
readonly borderRadius: "var(--border-radius-DEFAULT)";
|
|
11
|
+
};
|
|
9
12
|
readonly shadow: {
|
|
10
13
|
readonly boxShadow: "var(--box-shadow-DEFAULT)";
|
|
11
14
|
};
|
|
15
|
+
readonly spacing: {
|
|
16
|
+
readonly gap: "var(--spacing-3)";
|
|
17
|
+
readonly padding: "var(--spacing-3)";
|
|
18
|
+
};
|
|
19
|
+
readonly "spacing-sm": {
|
|
20
|
+
readonly gap: "var(--spacing-4)";
|
|
21
|
+
readonly padding: "var(--spacing-4)";
|
|
22
|
+
};
|
|
23
|
+
readonly "spacing-md": {
|
|
24
|
+
readonly gap: "var(--spacing-4)";
|
|
25
|
+
readonly padding: "var(--spacing-6)";
|
|
26
|
+
};
|
|
12
27
|
};
|
|
13
28
|
readonly "theme-marketing": {
|
|
14
29
|
readonly border: {
|
|
15
30
|
readonly borderColor: "rgba(0, 0, 0, 0)";
|
|
16
31
|
readonly borderRadius: "2rem";
|
|
17
32
|
};
|
|
33
|
+
readonly "popover-border": {
|
|
34
|
+
readonly borderRadius: "1rem";
|
|
35
|
+
};
|
|
18
36
|
readonly shadow: {
|
|
19
37
|
readonly boxShadow: "0px 20px 48px rgba(73, 55, 54, 0.1)";
|
|
20
38
|
};
|
|
39
|
+
readonly spacing: {
|
|
40
|
+
readonly gap: "var(--spacing-1)";
|
|
41
|
+
readonly padding: "var(--spacing-1)";
|
|
42
|
+
};
|
|
43
|
+
readonly "spacing-sm": {
|
|
44
|
+
readonly gap: "var(--spacing-1)";
|
|
45
|
+
readonly padding: "var(--spacing-1)";
|
|
46
|
+
};
|
|
47
|
+
readonly "spacing-md": {
|
|
48
|
+
readonly gap: "var(--spacing-1)";
|
|
49
|
+
readonly padding: "var(--spacing-1)";
|
|
50
|
+
};
|
|
21
51
|
};
|
|
22
52
|
};
|
|
23
53
|
button: {
|
|
24
54
|
readonly DEFAULT: {
|
|
55
|
+
readonly "secondary-color": {
|
|
56
|
+
readonly backgroundColor: "rgb(var(--color-secondary-200))";
|
|
57
|
+
readonly color: "rgb(var(--color-secondary-600))";
|
|
58
|
+
};
|
|
25
59
|
readonly border: {
|
|
26
60
|
readonly borderRadius: "var(--border-radius-lg)";
|
|
27
61
|
};
|
|
28
62
|
readonly height: {
|
|
29
|
-
readonly height: "
|
|
30
|
-
readonly maxHeight: "32px";
|
|
63
|
+
readonly height: "auto";
|
|
31
64
|
};
|
|
32
65
|
readonly width: {
|
|
33
|
-
readonly width: "
|
|
34
|
-
readonly minWidth: "
|
|
66
|
+
readonly width: "auto";
|
|
67
|
+
readonly minWidth: "auto";
|
|
35
68
|
};
|
|
36
69
|
};
|
|
37
70
|
readonly "theme-marketing": {
|
|
71
|
+
readonly "secondary-color": {
|
|
72
|
+
readonly backgroundColor: "rgb(var(--color-secondary-600))";
|
|
73
|
+
readonly color: "rgb(var(--color-secondary-50))";
|
|
74
|
+
};
|
|
38
75
|
readonly border: {
|
|
39
76
|
readonly borderRadius: "50px";
|
|
40
77
|
};
|
|
41
78
|
readonly height: {
|
|
42
79
|
readonly height: "55px";
|
|
43
|
-
readonly maxHeight: "";
|
|
44
80
|
};
|
|
45
81
|
readonly width: {
|
|
46
82
|
readonly width: "min-content";
|
|
@@ -130,6 +166,30 @@ export declare const componentTokenDefinitions: {
|
|
|
130
166
|
};
|
|
131
167
|
};
|
|
132
168
|
};
|
|
169
|
+
popover: {
|
|
170
|
+
readonly DEFAULT: {
|
|
171
|
+
readonly border: {
|
|
172
|
+
readonly borderRadius: "var(--border-radius-DEFAULT)";
|
|
173
|
+
};
|
|
174
|
+
};
|
|
175
|
+
readonly "theme-marketing": {
|
|
176
|
+
readonly border: {
|
|
177
|
+
readonly borderRadius: "1rem";
|
|
178
|
+
};
|
|
179
|
+
};
|
|
180
|
+
};
|
|
181
|
+
popoverListItem: {
|
|
182
|
+
readonly DEFAULT: {
|
|
183
|
+
readonly border: {
|
|
184
|
+
readonly borderRadius: "var(--border-radius-DEFAULT)";
|
|
185
|
+
};
|
|
186
|
+
};
|
|
187
|
+
readonly "theme-marketing": {
|
|
188
|
+
readonly border: {
|
|
189
|
+
readonly borderRadius: "1rem";
|
|
190
|
+
};
|
|
191
|
+
};
|
|
192
|
+
};
|
|
133
193
|
};
|
|
134
194
|
export declare type ComponentTokenDefinitions = typeof componentTokenDefinitions;
|
|
135
195
|
export declare type ComponentNames = keyof typeof componentTokenDefinitions;
|
|
@@ -1,24 +1,30 @@
|
|
|
1
1
|
export declare const ButtonTokenDefinition: {
|
|
2
2
|
readonly DEFAULT: {
|
|
3
|
+
readonly "secondary-color": {
|
|
4
|
+
readonly backgroundColor: "rgb(var(--color-secondary-200))";
|
|
5
|
+
readonly color: "rgb(var(--color-secondary-600))";
|
|
6
|
+
};
|
|
3
7
|
readonly border: {
|
|
4
8
|
readonly borderRadius: "var(--border-radius-lg)";
|
|
5
9
|
};
|
|
6
10
|
readonly height: {
|
|
7
|
-
readonly height: "
|
|
8
|
-
readonly maxHeight: "32px";
|
|
11
|
+
readonly height: "auto";
|
|
9
12
|
};
|
|
10
13
|
readonly width: {
|
|
11
|
-
readonly width: "
|
|
12
|
-
readonly minWidth: "
|
|
14
|
+
readonly width: "auto";
|
|
15
|
+
readonly minWidth: "auto";
|
|
13
16
|
};
|
|
14
17
|
};
|
|
15
18
|
readonly "theme-marketing": {
|
|
19
|
+
readonly "secondary-color": {
|
|
20
|
+
readonly backgroundColor: "rgb(var(--color-secondary-600))";
|
|
21
|
+
readonly color: "rgb(var(--color-secondary-50))";
|
|
22
|
+
};
|
|
16
23
|
readonly border: {
|
|
17
24
|
readonly borderRadius: "50px";
|
|
18
25
|
};
|
|
19
26
|
readonly height: {
|
|
20
27
|
readonly height: "55px";
|
|
21
|
-
readonly maxHeight: "";
|
|
22
28
|
};
|
|
23
29
|
readonly width: {
|
|
24
30
|
readonly width: "min-content";
|
|
@@ -4,18 +4,48 @@ export declare const CardTokenDefinition: {
|
|
|
4
4
|
readonly borderColor: "rgb(var(--color-slate-200))";
|
|
5
5
|
readonly borderRadius: "var(--border-radius-DEFAULT)";
|
|
6
6
|
};
|
|
7
|
+
readonly "popover-border": {
|
|
8
|
+
readonly borderRadius: "var(--border-radius-DEFAULT)";
|
|
9
|
+
};
|
|
7
10
|
readonly shadow: {
|
|
8
11
|
readonly boxShadow: "var(--box-shadow-DEFAULT)";
|
|
9
12
|
};
|
|
13
|
+
readonly spacing: {
|
|
14
|
+
readonly gap: "var(--spacing-3)";
|
|
15
|
+
readonly padding: "var(--spacing-3)";
|
|
16
|
+
};
|
|
17
|
+
readonly "spacing-sm": {
|
|
18
|
+
readonly gap: "var(--spacing-4)";
|
|
19
|
+
readonly padding: "var(--spacing-4)";
|
|
20
|
+
};
|
|
21
|
+
readonly "spacing-md": {
|
|
22
|
+
readonly gap: "var(--spacing-4)";
|
|
23
|
+
readonly padding: "var(--spacing-6)";
|
|
24
|
+
};
|
|
10
25
|
};
|
|
11
26
|
readonly "theme-marketing": {
|
|
12
27
|
readonly border: {
|
|
13
28
|
readonly borderColor: "rgba(0, 0, 0, 0)";
|
|
14
29
|
readonly borderRadius: "2rem";
|
|
15
30
|
};
|
|
31
|
+
readonly "popover-border": {
|
|
32
|
+
readonly borderRadius: "1rem";
|
|
33
|
+
};
|
|
16
34
|
readonly shadow: {
|
|
17
35
|
readonly boxShadow: "0px 20px 48px rgba(73, 55, 54, 0.1)";
|
|
18
36
|
};
|
|
37
|
+
readonly spacing: {
|
|
38
|
+
readonly gap: "var(--spacing-1)";
|
|
39
|
+
readonly padding: "var(--spacing-1)";
|
|
40
|
+
};
|
|
41
|
+
readonly "spacing-sm": {
|
|
42
|
+
readonly gap: "var(--spacing-1)";
|
|
43
|
+
readonly padding: "var(--spacing-1)";
|
|
44
|
+
};
|
|
45
|
+
readonly "spacing-md": {
|
|
46
|
+
readonly gap: "var(--spacing-1)";
|
|
47
|
+
readonly padding: "var(--spacing-1)";
|
|
48
|
+
};
|
|
19
49
|
};
|
|
20
50
|
};
|
|
21
51
|
export default CardTokenDefinition;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
export declare const PopoverTokenDefinition: {
|
|
2
|
+
readonly DEFAULT: {
|
|
3
|
+
readonly border: {
|
|
4
|
+
readonly borderRadius: "var(--border-radius-DEFAULT)";
|
|
5
|
+
};
|
|
6
|
+
};
|
|
7
|
+
readonly "theme-marketing": {
|
|
8
|
+
readonly border: {
|
|
9
|
+
readonly borderRadius: "1rem";
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
export default PopoverTokenDefinition;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
export declare const PopoverListItemTokenDefinition: {
|
|
2
|
+
readonly DEFAULT: {
|
|
3
|
+
readonly border: {
|
|
4
|
+
readonly borderRadius: "var(--border-radius-DEFAULT)";
|
|
5
|
+
};
|
|
6
|
+
};
|
|
7
|
+
readonly "theme-marketing": {
|
|
8
|
+
readonly border: {
|
|
9
|
+
readonly borderRadius: "1rem";
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
export default PopoverListItemTokenDefinition;
|
|
@@ -11,7 +11,7 @@ export declare const PREFIX = "component";
|
|
|
11
11
|
* @param cssProperty The css property on the component-level Token
|
|
12
12
|
* @returns {string} `var(--${PREFIX}-${component}-${token}-${cssProperty})`
|
|
13
13
|
*/
|
|
14
|
-
export declare const componentTokenAsCssVariableString: <Component extends "card" | "button" | "search", Token extends ComponentTokenNames<Component>>(component: Component, token: Token, cssProperty: keyof CSSProperties) => `var(--component-${Component}-${Token}-border)` | `var(--component-${Component}-${Token}-height)` | `var(--component-${Component}-${Token}-width)` | `var(--component-${Component}-${Token}-background)` | `var(--component-${Component}-${Token}-inset)` | `var(--component-${Component}-${Token}-accentColor)` | `var(--component-${Component}-${Token}-alignContent)` | `var(--component-${Component}-${Token}-alignItems)` | `var(--component-${Component}-${Token}-alignSelf)` | `var(--component-${Component}-${Token}-alignTracks)` | `var(--component-${Component}-${Token}-animationComposition)` | `var(--component-${Component}-${Token}-animationDelay)` | `var(--component-${Component}-${Token}-animationDirection)` | `var(--component-${Component}-${Token}-animationDuration)` | `var(--component-${Component}-${Token}-animationFillMode)` | `var(--component-${Component}-${Token}-animationIterationCount)` | `var(--component-${Component}-${Token}-animationName)` | `var(--component-${Component}-${Token}-animationPlayState)` | `var(--component-${Component}-${Token}-animationTimeline)` | `var(--component-${Component}-${Token}-animationTimingFunction)` | `var(--component-${Component}-${Token}-appearance)` | `var(--component-${Component}-${Token}-aspectRatio)` | `var(--component-${Component}-${Token}-backdropFilter)` | `var(--component-${Component}-${Token}-backfaceVisibility)` | `var(--component-${Component}-${Token}-backgroundAttachment)` | `var(--component-${Component}-${Token}-backgroundBlendMode)` | `var(--component-${Component}-${Token}-backgroundClip)` | `var(--component-${Component}-${Token}-backgroundColor)` | `var(--component-${Component}-${Token}-backgroundImage)` | `var(--component-${Component}-${Token}-backgroundOrigin)` | `var(--component-${Component}-${Token}-backgroundPositionX)` | `var(--component-${Component}-${Token}-backgroundPositionY)` | `var(--component-${Component}-${Token}-backgroundRepeat)` | `var(--component-${Component}-${Token}-backgroundSize)` | `var(--component-${Component}-${Token}-blockOverflow)` | `var(--component-${Component}-${Token}-blockSize)` | `var(--component-${Component}-${Token}-borderBlockColor)` | `var(--component-${Component}-${Token}-borderBlockEndColor)` | `var(--component-${Component}-${Token}-borderBlockEndStyle)` | `var(--component-${Component}-${Token}-borderBlockEndWidth)` | `var(--component-${Component}-${Token}-borderBlockStartColor)` | `var(--component-${Component}-${Token}-borderBlockStartStyle)` | `var(--component-${Component}-${Token}-borderBlockStartWidth)` | `var(--component-${Component}-${Token}-borderBlockStyle)` | `var(--component-${Component}-${Token}-borderBlockWidth)` | `var(--component-${Component}-${Token}-borderBottomColor)` | `var(--component-${Component}-${Token}-borderBottomLeftRadius)` | `var(--component-${Component}-${Token}-borderBottomRightRadius)` | `var(--component-${Component}-${Token}-borderBottomStyle)` | `var(--component-${Component}-${Token}-borderBottomWidth)` | `var(--component-${Component}-${Token}-borderCollapse)` | `var(--component-${Component}-${Token}-borderEndEndRadius)` | `var(--component-${Component}-${Token}-borderEndStartRadius)` | `var(--component-${Component}-${Token}-borderImageOutset)` | `var(--component-${Component}-${Token}-borderImageRepeat)` | `var(--component-${Component}-${Token}-borderImageSlice)` | `var(--component-${Component}-${Token}-borderImageSource)` | `var(--component-${Component}-${Token}-borderImageWidth)` | `var(--component-${Component}-${Token}-borderInlineColor)` | `var(--component-${Component}-${Token}-borderInlineEndColor)` | `var(--component-${Component}-${Token}-borderInlineEndStyle)` | `var(--component-${Component}-${Token}-borderInlineEndWidth)` | `var(--component-${Component}-${Token}-borderInlineStartColor)` | `var(--component-${Component}-${Token}-borderInlineStartStyle)` | `var(--component-${Component}-${Token}-borderInlineStartWidth)` | `var(--component-${Component}-${Token}-borderInlineStyle)` | `var(--component-${Component}-${Token}-borderInlineWidth)` | `var(--component-${Component}-${Token}-borderLeftColor)` | `var(--component-${Component}-${Token}-borderLeftStyle)` | `var(--component-${Component}-${Token}-borderLeftWidth)` | `var(--component-${Component}-${Token}-borderRightColor)` | `var(--component-${Component}-${Token}-borderRightStyle)` | `var(--component-${Component}-${Token}-borderRightWidth)` | `var(--component-${Component}-${Token}-borderSpacing)` | `var(--component-${Component}-${Token}-borderStartEndRadius)` | `var(--component-${Component}-${Token}-borderStartStartRadius)` | `var(--component-${Component}-${Token}-borderTopColor)` | `var(--component-${Component}-${Token}-borderTopLeftRadius)` | `var(--component-${Component}-${Token}-borderTopRightRadius)` | `var(--component-${Component}-${Token}-borderTopStyle)` | `var(--component-${Component}-${Token}-borderTopWidth)` | `var(--component-${Component}-${Token}-bottom)` | `var(--component-${Component}-${Token}-boxDecorationBreak)` | `var(--component-${Component}-${Token}-boxShadow)` | `var(--component-${Component}-${Token}-boxSizing)` | `var(--component-${Component}-${Token}-breakAfter)` | `var(--component-${Component}-${Token}-breakBefore)` | `var(--component-${Component}-${Token}-breakInside)` | `var(--component-${Component}-${Token}-captionSide)` | `var(--component-${Component}-${Token}-caretColor)` | `var(--component-${Component}-${Token}-clear)` | `var(--component-${Component}-${Token}-clipPath)` | `var(--component-${Component}-${Token}-color)` | `var(--component-${Component}-${Token}-colorAdjust)` | `var(--component-${Component}-${Token}-colorScheme)` | `var(--component-${Component}-${Token}-columnCount)` | `var(--component-${Component}-${Token}-columnFill)` | `var(--component-${Component}-${Token}-columnGap)` | `var(--component-${Component}-${Token}-columnRuleColor)` | `var(--component-${Component}-${Token}-columnRuleStyle)` | `var(--component-${Component}-${Token}-columnRuleWidth)` | `var(--component-${Component}-${Token}-columnSpan)` | `var(--component-${Component}-${Token}-columnWidth)` | `var(--component-${Component}-${Token}-contain)` | `var(--component-${Component}-${Token}-content)` | `var(--component-${Component}-${Token}-contentVisibility)` | `var(--component-${Component}-${Token}-counterIncrement)` | `var(--component-${Component}-${Token}-counterReset)` | `var(--component-${Component}-${Token}-counterSet)` | `var(--component-${Component}-${Token}-cursor)` | `var(--component-${Component}-${Token}-direction)` | `var(--component-${Component}-${Token}-display)` | `var(--component-${Component}-${Token}-emptyCells)` | `var(--component-${Component}-${Token}-filter)` | `var(--component-${Component}-${Token}-flexBasis)` | `var(--component-${Component}-${Token}-flexDirection)` | `var(--component-${Component}-${Token}-flexGrow)` | `var(--component-${Component}-${Token}-flexShrink)` | `var(--component-${Component}-${Token}-flexWrap)` | `var(--component-${Component}-${Token}-float)` | `var(--component-${Component}-${Token}-fontFamily)` | `var(--component-${Component}-${Token}-fontFeatureSettings)` | `var(--component-${Component}-${Token}-fontKerning)` | `var(--component-${Component}-${Token}-fontLanguageOverride)` | `var(--component-${Component}-${Token}-fontOpticalSizing)` | `var(--component-${Component}-${Token}-fontSize)` | `var(--component-${Component}-${Token}-fontSizeAdjust)` | `var(--component-${Component}-${Token}-fontSmooth)` | `var(--component-${Component}-${Token}-fontStretch)` | `var(--component-${Component}-${Token}-fontStyle)` | `var(--component-${Component}-${Token}-fontSynthesis)` | `var(--component-${Component}-${Token}-fontVariant)` | `var(--component-${Component}-${Token}-fontVariantAlternates)` | `var(--component-${Component}-${Token}-fontVariantCaps)` | `var(--component-${Component}-${Token}-fontVariantEastAsian)` | `var(--component-${Component}-${Token}-fontVariantLigatures)` | `var(--component-${Component}-${Token}-fontVariantNumeric)` | `var(--component-${Component}-${Token}-fontVariantPosition)` | `var(--component-${Component}-${Token}-fontVariationSettings)` | `var(--component-${Component}-${Token}-fontWeight)` | `var(--component-${Component}-${Token}-forcedColorAdjust)` | `var(--component-${Component}-${Token}-gridAutoColumns)` | `var(--component-${Component}-${Token}-gridAutoFlow)` | `var(--component-${Component}-${Token}-gridAutoRows)` | `var(--component-${Component}-${Token}-gridColumnEnd)` | `var(--component-${Component}-${Token}-gridColumnStart)` | `var(--component-${Component}-${Token}-gridRowEnd)` | `var(--component-${Component}-${Token}-gridRowStart)` | `var(--component-${Component}-${Token}-gridTemplateAreas)` | `var(--component-${Component}-${Token}-gridTemplateColumns)` | `var(--component-${Component}-${Token}-gridTemplateRows)` | `var(--component-${Component}-${Token}-hangingPunctuation)` | `var(--component-${Component}-${Token}-hyphenateCharacter)` | `var(--component-${Component}-${Token}-hyphens)` | `var(--component-${Component}-${Token}-imageOrientation)` | `var(--component-${Component}-${Token}-imageRendering)` | `var(--component-${Component}-${Token}-imageResolution)` | `var(--component-${Component}-${Token}-initialLetter)` | `var(--component-${Component}-${Token}-inlineSize)` | `var(--component-${Component}-${Token}-inputSecurity)` | `var(--component-${Component}-${Token}-insetBlock)` | `var(--component-${Component}-${Token}-insetBlockEnd)` | `var(--component-${Component}-${Token}-insetBlockStart)` | `var(--component-${Component}-${Token}-insetInline)` | `var(--component-${Component}-${Token}-insetInlineEnd)` | `var(--component-${Component}-${Token}-insetInlineStart)` | `var(--component-${Component}-${Token}-isolation)` | `var(--component-${Component}-${Token}-justifyContent)` | `var(--component-${Component}-${Token}-justifyItems)` | `var(--component-${Component}-${Token}-justifySelf)` | `var(--component-${Component}-${Token}-justifyTracks)` | `var(--component-${Component}-${Token}-left)` | `var(--component-${Component}-${Token}-letterSpacing)` | `var(--component-${Component}-${Token}-lineBreak)` | `var(--component-${Component}-${Token}-lineHeight)` | `var(--component-${Component}-${Token}-lineHeightStep)` | `var(--component-${Component}-${Token}-listStyleImage)` | `var(--component-${Component}-${Token}-listStylePosition)` | `var(--component-${Component}-${Token}-listStyleType)` | `var(--component-${Component}-${Token}-marginBlock)` | `var(--component-${Component}-${Token}-marginBlockEnd)` | `var(--component-${Component}-${Token}-marginBlockStart)` | `var(--component-${Component}-${Token}-marginBottom)` | `var(--component-${Component}-${Token}-marginInline)` | `var(--component-${Component}-${Token}-marginInlineEnd)` | `var(--component-${Component}-${Token}-marginInlineStart)` | `var(--component-${Component}-${Token}-marginLeft)` | `var(--component-${Component}-${Token}-marginRight)` | `var(--component-${Component}-${Token}-marginTop)` | `var(--component-${Component}-${Token}-maskBorderMode)` | `var(--component-${Component}-${Token}-maskBorderOutset)` | `var(--component-${Component}-${Token}-maskBorderRepeat)` | `var(--component-${Component}-${Token}-maskBorderSlice)` | `var(--component-${Component}-${Token}-maskBorderSource)` | `var(--component-${Component}-${Token}-maskBorderWidth)` | `var(--component-${Component}-${Token}-maskClip)` | `var(--component-${Component}-${Token}-maskComposite)` | `var(--component-${Component}-${Token}-maskImage)` | `var(--component-${Component}-${Token}-maskMode)` | `var(--component-${Component}-${Token}-maskOrigin)` | `var(--component-${Component}-${Token}-maskPosition)` | `var(--component-${Component}-${Token}-maskRepeat)` | `var(--component-${Component}-${Token}-maskSize)` | `var(--component-${Component}-${Token}-maskType)` | `var(--component-${Component}-${Token}-mathDepth)` | `var(--component-${Component}-${Token}-mathShift)` | `var(--component-${Component}-${Token}-mathStyle)` | `var(--component-${Component}-${Token}-maxBlockSize)` | `var(--component-${Component}-${Token}-maxHeight)` | `var(--component-${Component}-${Token}-maxInlineSize)` | `var(--component-${Component}-${Token}-maxLines)` | `var(--component-${Component}-${Token}-maxWidth)` | `var(--component-${Component}-${Token}-minBlockSize)` | `var(--component-${Component}-${Token}-minHeight)` | `var(--component-${Component}-${Token}-minInlineSize)` | `var(--component-${Component}-${Token}-minWidth)` | `var(--component-${Component}-${Token}-mixBlendMode)` | `var(--component-${Component}-${Token}-motionDistance)` | `var(--component-${Component}-${Token}-motionPath)` | `var(--component-${Component}-${Token}-motionRotation)` | `var(--component-${Component}-${Token}-objectFit)` | `var(--component-${Component}-${Token}-objectPosition)` | `var(--component-${Component}-${Token}-offsetAnchor)` | `var(--component-${Component}-${Token}-offsetDistance)` | `var(--component-${Component}-${Token}-offsetPath)` | `var(--component-${Component}-${Token}-offsetRotate)` | `var(--component-${Component}-${Token}-offsetRotation)` | `var(--component-${Component}-${Token}-opacity)` | `var(--component-${Component}-${Token}-order)` | `var(--component-${Component}-${Token}-orphans)` | `var(--component-${Component}-${Token}-outlineColor)` | `var(--component-${Component}-${Token}-outlineOffset)` | `var(--component-${Component}-${Token}-outlineStyle)` | `var(--component-${Component}-${Token}-outlineWidth)` | `var(--component-${Component}-${Token}-overflowAnchor)` | `var(--component-${Component}-${Token}-overflowBlock)` | `var(--component-${Component}-${Token}-overflowClipBox)` | `var(--component-${Component}-${Token}-overflowClipMargin)` | `var(--component-${Component}-${Token}-overflowInline)` | `var(--component-${Component}-${Token}-overflowWrap)` | `var(--component-${Component}-${Token}-overflowX)` | `var(--component-${Component}-${Token}-overflowY)` | `var(--component-${Component}-${Token}-overscrollBehaviorBlock)` | `var(--component-${Component}-${Token}-overscrollBehaviorInline)` | `var(--component-${Component}-${Token}-overscrollBehaviorX)` | `var(--component-${Component}-${Token}-overscrollBehaviorY)` | `var(--component-${Component}-${Token}-paddingBlock)` | `var(--component-${Component}-${Token}-paddingBlockEnd)` | `var(--component-${Component}-${Token}-paddingBlockStart)` | `var(--component-${Component}-${Token}-paddingBottom)` | `var(--component-${Component}-${Token}-paddingInline)` | `var(--component-${Component}-${Token}-paddingInlineEnd)` | `var(--component-${Component}-${Token}-paddingInlineStart)` | `var(--component-${Component}-${Token}-paddingLeft)` | `var(--component-${Component}-${Token}-paddingRight)` | `var(--component-${Component}-${Token}-paddingTop)` | `var(--component-${Component}-${Token}-pageBreakAfter)` | `var(--component-${Component}-${Token}-pageBreakBefore)` | `var(--component-${Component}-${Token}-pageBreakInside)` | `var(--component-${Component}-${Token}-paintOrder)` | `var(--component-${Component}-${Token}-perspective)` | `var(--component-${Component}-${Token}-perspectiveOrigin)` | `var(--component-${Component}-${Token}-placeContent)` | `var(--component-${Component}-${Token}-pointerEvents)` | `var(--component-${Component}-${Token}-position)` | `var(--component-${Component}-${Token}-printColorAdjust)` | `var(--component-${Component}-${Token}-quotes)` | `var(--component-${Component}-${Token}-resize)` | `var(--component-${Component}-${Token}-right)` | `var(--component-${Component}-${Token}-rotate)` | `var(--component-${Component}-${Token}-rowGap)` | `var(--component-${Component}-${Token}-rubyAlign)` | `var(--component-${Component}-${Token}-rubyMerge)` | `var(--component-${Component}-${Token}-rubyPosition)` | `var(--component-${Component}-${Token}-scale)` | `var(--component-${Component}-${Token}-scrollBehavior)` | `var(--component-${Component}-${Token}-scrollMargin)` | `var(--component-${Component}-${Token}-scrollMarginBlock)` | `var(--component-${Component}-${Token}-scrollMarginBlockEnd)` | `var(--component-${Component}-${Token}-scrollMarginBlockStart)` | `var(--component-${Component}-${Token}-scrollMarginBottom)` | `var(--component-${Component}-${Token}-scrollMarginInline)` | `var(--component-${Component}-${Token}-scrollMarginInlineEnd)` | `var(--component-${Component}-${Token}-scrollMarginInlineStart)` | `var(--component-${Component}-${Token}-scrollMarginLeft)` | `var(--component-${Component}-${Token}-scrollMarginRight)` | `var(--component-${Component}-${Token}-scrollMarginTop)` | `var(--component-${Component}-${Token}-scrollPadding)` | `var(--component-${Component}-${Token}-scrollPaddingBlock)` | `var(--component-${Component}-${Token}-scrollPaddingBlockEnd)` | `var(--component-${Component}-${Token}-scrollPaddingBlockStart)` | `var(--component-${Component}-${Token}-scrollPaddingBottom)` | `var(--component-${Component}-${Token}-scrollPaddingInline)` | `var(--component-${Component}-${Token}-scrollPaddingInlineEnd)` | `var(--component-${Component}-${Token}-scrollPaddingInlineStart)` | `var(--component-${Component}-${Token}-scrollPaddingLeft)` | `var(--component-${Component}-${Token}-scrollPaddingRight)` | `var(--component-${Component}-${Token}-scrollPaddingTop)` | `var(--component-${Component}-${Token}-scrollSnapAlign)` | `var(--component-${Component}-${Token}-scrollSnapMargin)` | `var(--component-${Component}-${Token}-scrollSnapMarginBottom)` | `var(--component-${Component}-${Token}-scrollSnapMarginLeft)` | `var(--component-${Component}-${Token}-scrollSnapMarginRight)` | `var(--component-${Component}-${Token}-scrollSnapMarginTop)` | `var(--component-${Component}-${Token}-scrollSnapStop)` | `var(--component-${Component}-${Token}-scrollSnapType)` | `var(--component-${Component}-${Token}-scrollbarColor)` | `var(--component-${Component}-${Token}-scrollbarGutter)` | `var(--component-${Component}-${Token}-scrollbarWidth)` | `var(--component-${Component}-${Token}-shapeImageThreshold)` | `var(--component-${Component}-${Token}-shapeMargin)` | `var(--component-${Component}-${Token}-shapeOutside)` | `var(--component-${Component}-${Token}-tabSize)` | `var(--component-${Component}-${Token}-tableLayout)` | `var(--component-${Component}-${Token}-textAlign)` | `var(--component-${Component}-${Token}-textAlignLast)` | `var(--component-${Component}-${Token}-textCombineUpright)` | `var(--component-${Component}-${Token}-textDecorationColor)` | `var(--component-${Component}-${Token}-textDecorationLine)` | `var(--component-${Component}-${Token}-textDecorationSkip)` | `var(--component-${Component}-${Token}-textDecorationSkipInk)` | `var(--component-${Component}-${Token}-textDecorationStyle)` | `var(--component-${Component}-${Token}-textDecorationThickness)` | `var(--component-${Component}-${Token}-textEmphasisColor)` | `var(--component-${Component}-${Token}-textEmphasisPosition)` | `var(--component-${Component}-${Token}-textEmphasisStyle)` | `var(--component-${Component}-${Token}-textIndent)` | `var(--component-${Component}-${Token}-textJustify)` | `var(--component-${Component}-${Token}-textOrientation)` | `var(--component-${Component}-${Token}-textOverflow)` | `var(--component-${Component}-${Token}-textRendering)` | `var(--component-${Component}-${Token}-textShadow)` | `var(--component-${Component}-${Token}-textSizeAdjust)` | `var(--component-${Component}-${Token}-textTransform)` | `var(--component-${Component}-${Token}-textUnderlineOffset)` | `var(--component-${Component}-${Token}-textUnderlinePosition)` | `var(--component-${Component}-${Token}-top)` | `var(--component-${Component}-${Token}-touchAction)` | `var(--component-${Component}-${Token}-transform)` | `var(--component-${Component}-${Token}-transformBox)` | `var(--component-${Component}-${Token}-transformOrigin)` | `var(--component-${Component}-${Token}-transformStyle)` | `var(--component-${Component}-${Token}-transitionDelay)` | `var(--component-${Component}-${Token}-transitionDuration)` | `var(--component-${Component}-${Token}-transitionProperty)` | `var(--component-${Component}-${Token}-transitionTimingFunction)` | `var(--component-${Component}-${Token}-translate)` | `var(--component-${Component}-${Token}-unicodeBidi)` | `var(--component-${Component}-${Token}-userSelect)` | `var(--component-${Component}-${Token}-verticalAlign)` | `var(--component-${Component}-${Token}-visibility)` | `var(--component-${Component}-${Token}-whiteSpace)` | `var(--component-${Component}-${Token}-widows)` | `var(--component-${Component}-${Token}-willChange)` | `var(--component-${Component}-${Token}-wordBreak)` | `var(--component-${Component}-${Token}-wordSpacing)` | `var(--component-${Component}-${Token}-wordWrap)` | `var(--component-${Component}-${Token}-writingMode)` | `var(--component-${Component}-${Token}-zIndex)` | `var(--component-${Component}-${Token}-zoom)` | `var(--component-${Component}-${Token}-all)` | `var(--component-${Component}-${Token}-animation)` | `var(--component-${Component}-${Token}-backgroundPosition)` | `var(--component-${Component}-${Token}-borderBlock)` | `var(--component-${Component}-${Token}-borderBlockEnd)` | `var(--component-${Component}-${Token}-borderBlockStart)` | `var(--component-${Component}-${Token}-borderBottom)` | `var(--component-${Component}-${Token}-borderColor)` | `var(--component-${Component}-${Token}-borderImage)` | `var(--component-${Component}-${Token}-borderInline)` | `var(--component-${Component}-${Token}-borderInlineEnd)` | `var(--component-${Component}-${Token}-borderInlineStart)` | `var(--component-${Component}-${Token}-borderLeft)` | `var(--component-${Component}-${Token}-borderRadius)` | `var(--component-${Component}-${Token}-borderRight)` | `var(--component-${Component}-${Token}-borderStyle)` | `var(--component-${Component}-${Token}-borderTop)` | `var(--component-${Component}-${Token}-borderWidth)` | `var(--component-${Component}-${Token}-columnRule)` | `var(--component-${Component}-${Token}-columns)` | `var(--component-${Component}-${Token}-flex)` | `var(--component-${Component}-${Token}-flexFlow)` | `var(--component-${Component}-${Token}-font)` | `var(--component-${Component}-${Token}-gap)` | `var(--component-${Component}-${Token}-grid)` | `var(--component-${Component}-${Token}-gridArea)` | `var(--component-${Component}-${Token}-gridColumn)` | `var(--component-${Component}-${Token}-gridRow)` | `var(--component-${Component}-${Token}-gridTemplate)` | `var(--component-${Component}-${Token}-lineClamp)` | `var(--component-${Component}-${Token}-listStyle)` | `var(--component-${Component}-${Token}-margin)` | `var(--component-${Component}-${Token}-mask)` | `var(--component-${Component}-${Token}-maskBorder)` | `var(--component-${Component}-${Token}-motion)` | `var(--component-${Component}-${Token}-offset)` | `var(--component-${Component}-${Token}-outline)` | `var(--component-${Component}-${Token}-overflow)` | `var(--component-${Component}-${Token}-overscrollBehavior)` | `var(--component-${Component}-${Token}-padding)` | `var(--component-${Component}-${Token}-placeItems)` | `var(--component-${Component}-${Token}-placeSelf)` | `var(--component-${Component}-${Token}-textDecoration)` | `var(--component-${Component}-${Token}-textEmphasis)` | `var(--component-${Component}-${Token}-transition)` | `var(--component-${Component}-${Token}-MozAnimationDelay)` | `var(--component-${Component}-${Token}-MozAnimationDirection)` | `var(--component-${Component}-${Token}-MozAnimationDuration)` | `var(--component-${Component}-${Token}-MozAnimationFillMode)` | `var(--component-${Component}-${Token}-MozAnimationIterationCount)` | `var(--component-${Component}-${Token}-MozAnimationName)` | `var(--component-${Component}-${Token}-MozAnimationPlayState)` | `var(--component-${Component}-${Token}-MozAnimationTimingFunction)` | `var(--component-${Component}-${Token}-MozAppearance)` | `var(--component-${Component}-${Token}-MozBackfaceVisibility)` | `var(--component-${Component}-${Token}-MozBorderBottomColors)` | `var(--component-${Component}-${Token}-MozBorderEndColor)` | `var(--component-${Component}-${Token}-MozBorderEndStyle)` | `var(--component-${Component}-${Token}-MozBorderEndWidth)` | `var(--component-${Component}-${Token}-MozBorderLeftColors)` | `var(--component-${Component}-${Token}-MozBorderRightColors)` | `var(--component-${Component}-${Token}-MozBorderStartColor)` | `var(--component-${Component}-${Token}-MozBorderStartStyle)` | `var(--component-${Component}-${Token}-MozBorderTopColors)` | `var(--component-${Component}-${Token}-MozBoxSizing)` | `var(--component-${Component}-${Token}-MozColumnCount)` | `var(--component-${Component}-${Token}-MozColumnFill)` | `var(--component-${Component}-${Token}-MozColumnRuleColor)` | `var(--component-${Component}-${Token}-MozColumnRuleStyle)` | `var(--component-${Component}-${Token}-MozColumnRuleWidth)` | `var(--component-${Component}-${Token}-MozColumnWidth)` | `var(--component-${Component}-${Token}-MozContextProperties)` | `var(--component-${Component}-${Token}-MozFontFeatureSettings)` | `var(--component-${Component}-${Token}-MozFontLanguageOverride)` | `var(--component-${Component}-${Token}-MozHyphens)` | `var(--component-${Component}-${Token}-MozImageRegion)` | `var(--component-${Component}-${Token}-MozMarginEnd)` | `var(--component-${Component}-${Token}-MozMarginStart)` | `var(--component-${Component}-${Token}-MozOrient)` | `var(--component-${Component}-${Token}-MozOsxFontSmoothing)` | `var(--component-${Component}-${Token}-MozPaddingEnd)` | `var(--component-${Component}-${Token}-MozPaddingStart)` | `var(--component-${Component}-${Token}-MozPerspective)` | `var(--component-${Component}-${Token}-MozPerspectiveOrigin)` | `var(--component-${Component}-${Token}-MozStackSizing)` | `var(--component-${Component}-${Token}-MozTabSize)` | `var(--component-${Component}-${Token}-MozTextBlink)` | `var(--component-${Component}-${Token}-MozTextSizeAdjust)` | `var(--component-${Component}-${Token}-MozTransformOrigin)` | `var(--component-${Component}-${Token}-MozTransformStyle)` | `var(--component-${Component}-${Token}-MozTransitionDelay)` | `var(--component-${Component}-${Token}-MozTransitionDuration)` | `var(--component-${Component}-${Token}-MozTransitionProperty)` | `var(--component-${Component}-${Token}-MozTransitionTimingFunction)` | `var(--component-${Component}-${Token}-MozUserFocus)` | `var(--component-${Component}-${Token}-MozUserModify)` | `var(--component-${Component}-${Token}-MozUserSelect)` | `var(--component-${Component}-${Token}-MozWindowDragging)` | `var(--component-${Component}-${Token}-MozWindowShadow)` | `var(--component-${Component}-${Token}-msAccelerator)` | `var(--component-${Component}-${Token}-msBlockProgression)` | `var(--component-${Component}-${Token}-msContentZoomChaining)` | `var(--component-${Component}-${Token}-msContentZoomLimitMax)` | `var(--component-${Component}-${Token}-msContentZoomLimitMin)` | `var(--component-${Component}-${Token}-msContentZoomSnapPoints)` | `var(--component-${Component}-${Token}-msContentZoomSnapType)` | `var(--component-${Component}-${Token}-msContentZooming)` | `var(--component-${Component}-${Token}-msFilter)` | `var(--component-${Component}-${Token}-msFlexDirection)` | `var(--component-${Component}-${Token}-msFlexPositive)` | `var(--component-${Component}-${Token}-msFlowFrom)` | `var(--component-${Component}-${Token}-msFlowInto)` | `var(--component-${Component}-${Token}-msGridColumns)` | `var(--component-${Component}-${Token}-msGridRows)` | `var(--component-${Component}-${Token}-msHighContrastAdjust)` | `var(--component-${Component}-${Token}-msHyphenateLimitChars)` | `var(--component-${Component}-${Token}-msHyphenateLimitLines)` | `var(--component-${Component}-${Token}-msHyphenateLimitZone)` | `var(--component-${Component}-${Token}-msHyphens)` | `var(--component-${Component}-${Token}-msImeAlign)` | `var(--component-${Component}-${Token}-msLineBreak)` | `var(--component-${Component}-${Token}-msOrder)` | `var(--component-${Component}-${Token}-msOverflowStyle)` | `var(--component-${Component}-${Token}-msOverflowX)` | `var(--component-${Component}-${Token}-msOverflowY)` | `var(--component-${Component}-${Token}-msScrollChaining)` | `var(--component-${Component}-${Token}-msScrollLimitXMax)` | `var(--component-${Component}-${Token}-msScrollLimitXMin)` | `var(--component-${Component}-${Token}-msScrollLimitYMax)` | `var(--component-${Component}-${Token}-msScrollLimitYMin)` | `var(--component-${Component}-${Token}-msScrollRails)` | `var(--component-${Component}-${Token}-msScrollSnapPointsX)` | `var(--component-${Component}-${Token}-msScrollSnapPointsY)` | `var(--component-${Component}-${Token}-msScrollSnapType)` | `var(--component-${Component}-${Token}-msScrollTranslation)` | `var(--component-${Component}-${Token}-msScrollbar3dlightColor)` | `var(--component-${Component}-${Token}-msScrollbarArrowColor)` | `var(--component-${Component}-${Token}-msScrollbarBaseColor)` | `var(--component-${Component}-${Token}-msScrollbarDarkshadowColor)` | `var(--component-${Component}-${Token}-msScrollbarFaceColor)` | `var(--component-${Component}-${Token}-msScrollbarHighlightColor)` | `var(--component-${Component}-${Token}-msScrollbarShadowColor)` | `var(--component-${Component}-${Token}-msScrollbarTrackColor)` | `var(--component-${Component}-${Token}-msTextAutospace)` | `var(--component-${Component}-${Token}-msTextCombineHorizontal)` | `var(--component-${Component}-${Token}-msTextOverflow)` | `var(--component-${Component}-${Token}-msTouchAction)` | `var(--component-${Component}-${Token}-msTouchSelect)` | `var(--component-${Component}-${Token}-msTransform)` | `var(--component-${Component}-${Token}-msTransformOrigin)` | `var(--component-${Component}-${Token}-msTransitionDelay)` | `var(--component-${Component}-${Token}-msTransitionDuration)` | `var(--component-${Component}-${Token}-msTransitionProperty)` | `var(--component-${Component}-${Token}-msTransitionTimingFunction)` | `var(--component-${Component}-${Token}-msUserSelect)` | `var(--component-${Component}-${Token}-msWordBreak)` | `var(--component-${Component}-${Token}-msWrapFlow)` | `var(--component-${Component}-${Token}-msWrapMargin)` | `var(--component-${Component}-${Token}-msWrapThrough)` | `var(--component-${Component}-${Token}-msWritingMode)` | `var(--component-${Component}-${Token}-WebkitAlignContent)` | `var(--component-${Component}-${Token}-WebkitAlignItems)` | `var(--component-${Component}-${Token}-WebkitAlignSelf)` | `var(--component-${Component}-${Token}-WebkitAnimationDelay)` | `var(--component-${Component}-${Token}-WebkitAnimationDirection)` | `var(--component-${Component}-${Token}-WebkitAnimationDuration)` | `var(--component-${Component}-${Token}-WebkitAnimationFillMode)` | `var(--component-${Component}-${Token}-WebkitAnimationIterationCount)` | `var(--component-${Component}-${Token}-WebkitAnimationName)` | `var(--component-${Component}-${Token}-WebkitAnimationPlayState)` | `var(--component-${Component}-${Token}-WebkitAnimationTimingFunction)` | `var(--component-${Component}-${Token}-WebkitAppearance)` | `var(--component-${Component}-${Token}-WebkitBackdropFilter)` | `var(--component-${Component}-${Token}-WebkitBackfaceVisibility)` | `var(--component-${Component}-${Token}-WebkitBackgroundClip)` | `var(--component-${Component}-${Token}-WebkitBackgroundOrigin)` | `var(--component-${Component}-${Token}-WebkitBackgroundSize)` | `var(--component-${Component}-${Token}-WebkitBorderBeforeColor)` | `var(--component-${Component}-${Token}-WebkitBorderBeforeStyle)` | `var(--component-${Component}-${Token}-WebkitBorderBeforeWidth)` | `var(--component-${Component}-${Token}-WebkitBorderBottomLeftRadius)` | `var(--component-${Component}-${Token}-WebkitBorderBottomRightRadius)` | `var(--component-${Component}-${Token}-WebkitBorderImageSlice)` | `var(--component-${Component}-${Token}-WebkitBorderTopLeftRadius)` | `var(--component-${Component}-${Token}-WebkitBorderTopRightRadius)` | `var(--component-${Component}-${Token}-WebkitBoxDecorationBreak)` | `var(--component-${Component}-${Token}-WebkitBoxReflect)` | `var(--component-${Component}-${Token}-WebkitBoxShadow)` | `var(--component-${Component}-${Token}-WebkitBoxSizing)` | `var(--component-${Component}-${Token}-WebkitClipPath)` | `var(--component-${Component}-${Token}-WebkitColumnCount)` | `var(--component-${Component}-${Token}-WebkitColumnFill)` | `var(--component-${Component}-${Token}-WebkitColumnRuleColor)` | `var(--component-${Component}-${Token}-WebkitColumnRuleStyle)` | `var(--component-${Component}-${Token}-WebkitColumnRuleWidth)` | `var(--component-${Component}-${Token}-WebkitColumnSpan)` | `var(--component-${Component}-${Token}-WebkitColumnWidth)` | `var(--component-${Component}-${Token}-WebkitFilter)` | `var(--component-${Component}-${Token}-WebkitFlexBasis)` | `var(--component-${Component}-${Token}-WebkitFlexDirection)` | `var(--component-${Component}-${Token}-WebkitFlexGrow)` | `var(--component-${Component}-${Token}-WebkitFlexShrink)` | `var(--component-${Component}-${Token}-WebkitFlexWrap)` | `var(--component-${Component}-${Token}-WebkitFontFeatureSettings)` | `var(--component-${Component}-${Token}-WebkitFontKerning)` | `var(--component-${Component}-${Token}-WebkitFontSmoothing)` | `var(--component-${Component}-${Token}-WebkitFontVariantLigatures)` | `var(--component-${Component}-${Token}-WebkitHyphenateCharacter)` | `var(--component-${Component}-${Token}-WebkitHyphens)` | `var(--component-${Component}-${Token}-WebkitInitialLetter)` | `var(--component-${Component}-${Token}-WebkitJustifyContent)` | `var(--component-${Component}-${Token}-WebkitLineBreak)` | `var(--component-${Component}-${Token}-WebkitLineClamp)` | `var(--component-${Component}-${Token}-WebkitMarginEnd)` | `var(--component-${Component}-${Token}-WebkitMarginStart)` | `var(--component-${Component}-${Token}-WebkitMaskAttachment)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageOutset)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageRepeat)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageSlice)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageSource)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageWidth)` | `var(--component-${Component}-${Token}-WebkitMaskClip)` | `var(--component-${Component}-${Token}-WebkitMaskComposite)` | `var(--component-${Component}-${Token}-WebkitMaskImage)` | `var(--component-${Component}-${Token}-WebkitMaskOrigin)` | `var(--component-${Component}-${Token}-WebkitMaskPosition)` | `var(--component-${Component}-${Token}-WebkitMaskPositionX)` | `var(--component-${Component}-${Token}-WebkitMaskPositionY)` | `var(--component-${Component}-${Token}-WebkitMaskRepeat)` | `var(--component-${Component}-${Token}-WebkitMaskRepeatX)` | `var(--component-${Component}-${Token}-WebkitMaskRepeatY)` | `var(--component-${Component}-${Token}-WebkitMaskSize)` | `var(--component-${Component}-${Token}-WebkitMaxInlineSize)` | `var(--component-${Component}-${Token}-WebkitOrder)` | `var(--component-${Component}-${Token}-WebkitOverflowScrolling)` | `var(--component-${Component}-${Token}-WebkitPaddingEnd)` | `var(--component-${Component}-${Token}-WebkitPaddingStart)` | `var(--component-${Component}-${Token}-WebkitPerspective)` | `var(--component-${Component}-${Token}-WebkitPerspectiveOrigin)` | `var(--component-${Component}-${Token}-WebkitPrintColorAdjust)` | `var(--component-${Component}-${Token}-WebkitRubyPosition)` | `var(--component-${Component}-${Token}-WebkitScrollSnapType)` | `var(--component-${Component}-${Token}-WebkitShapeMargin)` | `var(--component-${Component}-${Token}-WebkitTapHighlightColor)` | `var(--component-${Component}-${Token}-WebkitTextCombine)` | `var(--component-${Component}-${Token}-WebkitTextDecorationColor)` | `var(--component-${Component}-${Token}-WebkitTextDecorationLine)` | `var(--component-${Component}-${Token}-WebkitTextDecorationSkip)` | `var(--component-${Component}-${Token}-WebkitTextDecorationStyle)` | `var(--component-${Component}-${Token}-WebkitTextEmphasisColor)` | `var(--component-${Component}-${Token}-WebkitTextEmphasisPosition)` | `var(--component-${Component}-${Token}-WebkitTextEmphasisStyle)` | `var(--component-${Component}-${Token}-WebkitTextFillColor)` | `var(--component-${Component}-${Token}-WebkitTextOrientation)` | `var(--component-${Component}-${Token}-WebkitTextSizeAdjust)` | `var(--component-${Component}-${Token}-WebkitTextStrokeColor)` | `var(--component-${Component}-${Token}-WebkitTextStrokeWidth)` | `var(--component-${Component}-${Token}-WebkitTextUnderlinePosition)` | `var(--component-${Component}-${Token}-WebkitTouchCallout)` | `var(--component-${Component}-${Token}-WebkitTransform)` | `var(--component-${Component}-${Token}-WebkitTransformOrigin)` | `var(--component-${Component}-${Token}-WebkitTransformStyle)` | `var(--component-${Component}-${Token}-WebkitTransitionDelay)` | `var(--component-${Component}-${Token}-WebkitTransitionDuration)` | `var(--component-${Component}-${Token}-WebkitTransitionProperty)` | `var(--component-${Component}-${Token}-WebkitTransitionTimingFunction)` | `var(--component-${Component}-${Token}-WebkitUserModify)` | `var(--component-${Component}-${Token}-WebkitUserSelect)` | `var(--component-${Component}-${Token}-WebkitWritingMode)` | `var(--component-${Component}-${Token}-MozAnimation)` | `var(--component-${Component}-${Token}-MozBorderImage)` | `var(--component-${Component}-${Token}-MozColumnRule)` | `var(--component-${Component}-${Token}-MozColumns)` | `var(--component-${Component}-${Token}-MozTransition)` | `var(--component-${Component}-${Token}-msContentZoomLimit)` | `var(--component-${Component}-${Token}-msContentZoomSnap)` | `var(--component-${Component}-${Token}-msFlex)` | `var(--component-${Component}-${Token}-msScrollLimit)` | `var(--component-${Component}-${Token}-msScrollSnapX)` | `var(--component-${Component}-${Token}-msScrollSnapY)` | `var(--component-${Component}-${Token}-msTransition)` | `var(--component-${Component}-${Token}-WebkitAnimation)` | `var(--component-${Component}-${Token}-WebkitBorderBefore)` | `var(--component-${Component}-${Token}-WebkitBorderImage)` | `var(--component-${Component}-${Token}-WebkitBorderRadius)` | `var(--component-${Component}-${Token}-WebkitColumnRule)` | `var(--component-${Component}-${Token}-WebkitColumns)` | `var(--component-${Component}-${Token}-WebkitFlex)` | `var(--component-${Component}-${Token}-WebkitFlexFlow)` | `var(--component-${Component}-${Token}-WebkitMask)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImage)` | `var(--component-${Component}-${Token}-WebkitTextEmphasis)` | `var(--component-${Component}-${Token}-WebkitTextStroke)` | `var(--component-${Component}-${Token}-WebkitTransition)` | `var(--component-${Component}-${Token}-azimuth)` | `var(--component-${Component}-${Token}-boxAlign)` | `var(--component-${Component}-${Token}-boxDirection)` | `var(--component-${Component}-${Token}-boxFlex)` | `var(--component-${Component}-${Token}-boxFlexGroup)` | `var(--component-${Component}-${Token}-boxLines)` | `var(--component-${Component}-${Token}-boxOrdinalGroup)` | `var(--component-${Component}-${Token}-boxOrient)` | `var(--component-${Component}-${Token}-boxPack)` | `var(--component-${Component}-${Token}-clip)` | `var(--component-${Component}-${Token}-gridColumnGap)` | `var(--component-${Component}-${Token}-gridGap)` | `var(--component-${Component}-${Token}-gridRowGap)` | `var(--component-${Component}-${Token}-imeMode)` | `var(--component-${Component}-${Token}-offsetBlock)` | `var(--component-${Component}-${Token}-offsetBlockEnd)` | `var(--component-${Component}-${Token}-offsetBlockStart)` | `var(--component-${Component}-${Token}-offsetInline)` | `var(--component-${Component}-${Token}-offsetInlineEnd)` | `var(--component-${Component}-${Token}-offsetInlineStart)` | `var(--component-${Component}-${Token}-scrollSnapCoordinate)` | `var(--component-${Component}-${Token}-scrollSnapDestination)` | `var(--component-${Component}-${Token}-scrollSnapPointsX)` | `var(--component-${Component}-${Token}-scrollSnapPointsY)` | `var(--component-${Component}-${Token}-scrollSnapTypeX)` | `var(--component-${Component}-${Token}-scrollSnapTypeY)` | `var(--component-${Component}-${Token}-KhtmlBoxAlign)` | `var(--component-${Component}-${Token}-KhtmlBoxDirection)` | `var(--component-${Component}-${Token}-KhtmlBoxFlex)` | `var(--component-${Component}-${Token}-KhtmlBoxFlexGroup)` | `var(--component-${Component}-${Token}-KhtmlBoxLines)` | `var(--component-${Component}-${Token}-KhtmlBoxOrdinalGroup)` | `var(--component-${Component}-${Token}-KhtmlBoxOrient)` | `var(--component-${Component}-${Token}-KhtmlBoxPack)` | `var(--component-${Component}-${Token}-KhtmlLineBreak)` | `var(--component-${Component}-${Token}-KhtmlOpacity)` | `var(--component-${Component}-${Token}-KhtmlUserSelect)` | `var(--component-${Component}-${Token}-MozBackgroundClip)` | `var(--component-${Component}-${Token}-MozBackgroundInlinePolicy)` | `var(--component-${Component}-${Token}-MozBackgroundOrigin)` | `var(--component-${Component}-${Token}-MozBackgroundSize)` | `var(--component-${Component}-${Token}-MozBinding)` | `var(--component-${Component}-${Token}-MozBorderRadius)` | `var(--component-${Component}-${Token}-MozBorderRadiusBottomleft)` | `var(--component-${Component}-${Token}-MozBorderRadiusBottomright)` | `var(--component-${Component}-${Token}-MozBorderRadiusTopleft)` | `var(--component-${Component}-${Token}-MozBorderRadiusTopright)` | `var(--component-${Component}-${Token}-MozBoxAlign)` | `var(--component-${Component}-${Token}-MozBoxDirection)` | `var(--component-${Component}-${Token}-MozBoxFlex)` | `var(--component-${Component}-${Token}-MozBoxOrdinalGroup)` | `var(--component-${Component}-${Token}-MozBoxOrient)` | `var(--component-${Component}-${Token}-MozBoxPack)` | `var(--component-${Component}-${Token}-MozBoxShadow)` | `var(--component-${Component}-${Token}-MozFloatEdge)` | `var(--component-${Component}-${Token}-MozForceBrokenImageIcon)` | `var(--component-${Component}-${Token}-MozOpacity)` | `var(--component-${Component}-${Token}-MozOutline)` | `var(--component-${Component}-${Token}-MozOutlineColor)` | `var(--component-${Component}-${Token}-MozOutlineRadius)` | `var(--component-${Component}-${Token}-MozOutlineRadiusBottomleft)` | `var(--component-${Component}-${Token}-MozOutlineRadiusBottomright)` | `var(--component-${Component}-${Token}-MozOutlineRadiusTopleft)` | `var(--component-${Component}-${Token}-MozOutlineRadiusTopright)` | `var(--component-${Component}-${Token}-MozOutlineStyle)` | `var(--component-${Component}-${Token}-MozOutlineWidth)` | `var(--component-${Component}-${Token}-MozTextAlignLast)` | `var(--component-${Component}-${Token}-MozTextDecorationColor)` | `var(--component-${Component}-${Token}-MozTextDecorationLine)` | `var(--component-${Component}-${Token}-MozTextDecorationStyle)` | `var(--component-${Component}-${Token}-MozUserInput)` | `var(--component-${Component}-${Token}-msImeMode)` | `var(--component-${Component}-${Token}-OAnimation)` | `var(--component-${Component}-${Token}-OAnimationDelay)` | `var(--component-${Component}-${Token}-OAnimationDirection)` | `var(--component-${Component}-${Token}-OAnimationDuration)` | `var(--component-${Component}-${Token}-OAnimationFillMode)` | `var(--component-${Component}-${Token}-OAnimationIterationCount)` | `var(--component-${Component}-${Token}-OAnimationName)` | `var(--component-${Component}-${Token}-OAnimationPlayState)` | `var(--component-${Component}-${Token}-OAnimationTimingFunction)` | `var(--component-${Component}-${Token}-OBackgroundSize)` | `var(--component-${Component}-${Token}-OBorderImage)` | `var(--component-${Component}-${Token}-OObjectFit)` | `var(--component-${Component}-${Token}-OObjectPosition)` | `var(--component-${Component}-${Token}-OTabSize)` | `var(--component-${Component}-${Token}-OTextOverflow)` | `var(--component-${Component}-${Token}-OTransform)` | `var(--component-${Component}-${Token}-OTransformOrigin)` | `var(--component-${Component}-${Token}-OTransition)` | `var(--component-${Component}-${Token}-OTransitionDelay)` | `var(--component-${Component}-${Token}-OTransitionDuration)` | `var(--component-${Component}-${Token}-OTransitionProperty)` | `var(--component-${Component}-${Token}-OTransitionTimingFunction)` | `var(--component-${Component}-${Token}-WebkitBoxAlign)` | `var(--component-${Component}-${Token}-WebkitBoxDirection)` | `var(--component-${Component}-${Token}-WebkitBoxFlex)` | `var(--component-${Component}-${Token}-WebkitBoxFlexGroup)` | `var(--component-${Component}-${Token}-WebkitBoxLines)` | `var(--component-${Component}-${Token}-WebkitBoxOrdinalGroup)` | `var(--component-${Component}-${Token}-WebkitBoxOrient)` | `var(--component-${Component}-${Token}-WebkitBoxPack)` | `var(--component-${Component}-${Token}-WebkitScrollSnapPointsX)` | `var(--component-${Component}-${Token}-WebkitScrollSnapPointsY)` | `var(--component-${Component}-${Token}-alignmentBaseline)` | `var(--component-${Component}-${Token}-baselineShift)` | `var(--component-${Component}-${Token}-clipRule)` | `var(--component-${Component}-${Token}-colorInterpolation)` | `var(--component-${Component}-${Token}-colorRendering)` | `var(--component-${Component}-${Token}-dominantBaseline)` | `var(--component-${Component}-${Token}-fill)` | `var(--component-${Component}-${Token}-fillOpacity)` | `var(--component-${Component}-${Token}-fillRule)` | `var(--component-${Component}-${Token}-floodColor)` | `var(--component-${Component}-${Token}-floodOpacity)` | `var(--component-${Component}-${Token}-glyphOrientationVertical)` | `var(--component-${Component}-${Token}-lightingColor)` | `var(--component-${Component}-${Token}-marker)` | `var(--component-${Component}-${Token}-markerEnd)` | `var(--component-${Component}-${Token}-markerMid)` | `var(--component-${Component}-${Token}-markerStart)` | `var(--component-${Component}-${Token}-shapeRendering)` | `var(--component-${Component}-${Token}-stopColor)` | `var(--component-${Component}-${Token}-stopOpacity)` | `var(--component-${Component}-${Token}-stroke)` | `var(--component-${Component}-${Token}-strokeDasharray)` | `var(--component-${Component}-${Token}-strokeDashoffset)` | `var(--component-${Component}-${Token}-strokeLinecap)` | `var(--component-${Component}-${Token}-strokeLinejoin)` | `var(--component-${Component}-${Token}-strokeMiterlimit)` | `var(--component-${Component}-${Token}-strokeOpacity)` | `var(--component-${Component}-${Token}-strokeWidth)` | `var(--component-${Component}-${Token}-textAnchor)` | `var(--component-${Component}-${Token}-vectorEffect)`;
|
|
14
|
+
export declare const componentTokenAsCssVariableString: <Component extends "card" | "button" | "search" | "popover" | "popoverListItem", Token extends ComponentTokenNames<Component>>(component: Component, token: Token, cssProperty: keyof CSSProperties) => `var(--component-${Component}-${Token}-border)` | `var(--component-${Component}-${Token}-height)` | `var(--component-${Component}-${Token}-width)` | `var(--component-${Component}-${Token}-background)` | `var(--component-${Component}-${Token}-inset)` | `var(--component-${Component}-${Token}-accentColor)` | `var(--component-${Component}-${Token}-alignContent)` | `var(--component-${Component}-${Token}-alignItems)` | `var(--component-${Component}-${Token}-alignSelf)` | `var(--component-${Component}-${Token}-alignTracks)` | `var(--component-${Component}-${Token}-animationComposition)` | `var(--component-${Component}-${Token}-animationDelay)` | `var(--component-${Component}-${Token}-animationDirection)` | `var(--component-${Component}-${Token}-animationDuration)` | `var(--component-${Component}-${Token}-animationFillMode)` | `var(--component-${Component}-${Token}-animationIterationCount)` | `var(--component-${Component}-${Token}-animationName)` | `var(--component-${Component}-${Token}-animationPlayState)` | `var(--component-${Component}-${Token}-animationTimeline)` | `var(--component-${Component}-${Token}-animationTimingFunction)` | `var(--component-${Component}-${Token}-appearance)` | `var(--component-${Component}-${Token}-aspectRatio)` | `var(--component-${Component}-${Token}-backdropFilter)` | `var(--component-${Component}-${Token}-backfaceVisibility)` | `var(--component-${Component}-${Token}-backgroundAttachment)` | `var(--component-${Component}-${Token}-backgroundBlendMode)` | `var(--component-${Component}-${Token}-backgroundClip)` | `var(--component-${Component}-${Token}-backgroundColor)` | `var(--component-${Component}-${Token}-backgroundImage)` | `var(--component-${Component}-${Token}-backgroundOrigin)` | `var(--component-${Component}-${Token}-backgroundPositionX)` | `var(--component-${Component}-${Token}-backgroundPositionY)` | `var(--component-${Component}-${Token}-backgroundRepeat)` | `var(--component-${Component}-${Token}-backgroundSize)` | `var(--component-${Component}-${Token}-blockOverflow)` | `var(--component-${Component}-${Token}-blockSize)` | `var(--component-${Component}-${Token}-borderBlockColor)` | `var(--component-${Component}-${Token}-borderBlockEndColor)` | `var(--component-${Component}-${Token}-borderBlockEndStyle)` | `var(--component-${Component}-${Token}-borderBlockEndWidth)` | `var(--component-${Component}-${Token}-borderBlockStartColor)` | `var(--component-${Component}-${Token}-borderBlockStartStyle)` | `var(--component-${Component}-${Token}-borderBlockStartWidth)` | `var(--component-${Component}-${Token}-borderBlockStyle)` | `var(--component-${Component}-${Token}-borderBlockWidth)` | `var(--component-${Component}-${Token}-borderBottomColor)` | `var(--component-${Component}-${Token}-borderBottomLeftRadius)` | `var(--component-${Component}-${Token}-borderBottomRightRadius)` | `var(--component-${Component}-${Token}-borderBottomStyle)` | `var(--component-${Component}-${Token}-borderBottomWidth)` | `var(--component-${Component}-${Token}-borderCollapse)` | `var(--component-${Component}-${Token}-borderEndEndRadius)` | `var(--component-${Component}-${Token}-borderEndStartRadius)` | `var(--component-${Component}-${Token}-borderImageOutset)` | `var(--component-${Component}-${Token}-borderImageRepeat)` | `var(--component-${Component}-${Token}-borderImageSlice)` | `var(--component-${Component}-${Token}-borderImageSource)` | `var(--component-${Component}-${Token}-borderImageWidth)` | `var(--component-${Component}-${Token}-borderInlineColor)` | `var(--component-${Component}-${Token}-borderInlineEndColor)` | `var(--component-${Component}-${Token}-borderInlineEndStyle)` | `var(--component-${Component}-${Token}-borderInlineEndWidth)` | `var(--component-${Component}-${Token}-borderInlineStartColor)` | `var(--component-${Component}-${Token}-borderInlineStartStyle)` | `var(--component-${Component}-${Token}-borderInlineStartWidth)` | `var(--component-${Component}-${Token}-borderInlineStyle)` | `var(--component-${Component}-${Token}-borderInlineWidth)` | `var(--component-${Component}-${Token}-borderLeftColor)` | `var(--component-${Component}-${Token}-borderLeftStyle)` | `var(--component-${Component}-${Token}-borderLeftWidth)` | `var(--component-${Component}-${Token}-borderRightColor)` | `var(--component-${Component}-${Token}-borderRightStyle)` | `var(--component-${Component}-${Token}-borderRightWidth)` | `var(--component-${Component}-${Token}-borderSpacing)` | `var(--component-${Component}-${Token}-borderStartEndRadius)` | `var(--component-${Component}-${Token}-borderStartStartRadius)` | `var(--component-${Component}-${Token}-borderTopColor)` | `var(--component-${Component}-${Token}-borderTopLeftRadius)` | `var(--component-${Component}-${Token}-borderTopRightRadius)` | `var(--component-${Component}-${Token}-borderTopStyle)` | `var(--component-${Component}-${Token}-borderTopWidth)` | `var(--component-${Component}-${Token}-bottom)` | `var(--component-${Component}-${Token}-boxDecorationBreak)` | `var(--component-${Component}-${Token}-boxShadow)` | `var(--component-${Component}-${Token}-boxSizing)` | `var(--component-${Component}-${Token}-breakAfter)` | `var(--component-${Component}-${Token}-breakBefore)` | `var(--component-${Component}-${Token}-breakInside)` | `var(--component-${Component}-${Token}-captionSide)` | `var(--component-${Component}-${Token}-caretColor)` | `var(--component-${Component}-${Token}-clear)` | `var(--component-${Component}-${Token}-clipPath)` | `var(--component-${Component}-${Token}-color)` | `var(--component-${Component}-${Token}-colorAdjust)` | `var(--component-${Component}-${Token}-colorScheme)` | `var(--component-${Component}-${Token}-columnCount)` | `var(--component-${Component}-${Token}-columnFill)` | `var(--component-${Component}-${Token}-columnGap)` | `var(--component-${Component}-${Token}-columnRuleColor)` | `var(--component-${Component}-${Token}-columnRuleStyle)` | `var(--component-${Component}-${Token}-columnRuleWidth)` | `var(--component-${Component}-${Token}-columnSpan)` | `var(--component-${Component}-${Token}-columnWidth)` | `var(--component-${Component}-${Token}-contain)` | `var(--component-${Component}-${Token}-content)` | `var(--component-${Component}-${Token}-contentVisibility)` | `var(--component-${Component}-${Token}-counterIncrement)` | `var(--component-${Component}-${Token}-counterReset)` | `var(--component-${Component}-${Token}-counterSet)` | `var(--component-${Component}-${Token}-cursor)` | `var(--component-${Component}-${Token}-direction)` | `var(--component-${Component}-${Token}-display)` | `var(--component-${Component}-${Token}-emptyCells)` | `var(--component-${Component}-${Token}-filter)` | `var(--component-${Component}-${Token}-flexBasis)` | `var(--component-${Component}-${Token}-flexDirection)` | `var(--component-${Component}-${Token}-flexGrow)` | `var(--component-${Component}-${Token}-flexShrink)` | `var(--component-${Component}-${Token}-flexWrap)` | `var(--component-${Component}-${Token}-float)` | `var(--component-${Component}-${Token}-fontFamily)` | `var(--component-${Component}-${Token}-fontFeatureSettings)` | `var(--component-${Component}-${Token}-fontKerning)` | `var(--component-${Component}-${Token}-fontLanguageOverride)` | `var(--component-${Component}-${Token}-fontOpticalSizing)` | `var(--component-${Component}-${Token}-fontSize)` | `var(--component-${Component}-${Token}-fontSizeAdjust)` | `var(--component-${Component}-${Token}-fontSmooth)` | `var(--component-${Component}-${Token}-fontStretch)` | `var(--component-${Component}-${Token}-fontStyle)` | `var(--component-${Component}-${Token}-fontSynthesis)` | `var(--component-${Component}-${Token}-fontVariant)` | `var(--component-${Component}-${Token}-fontVariantAlternates)` | `var(--component-${Component}-${Token}-fontVariantCaps)` | `var(--component-${Component}-${Token}-fontVariantEastAsian)` | `var(--component-${Component}-${Token}-fontVariantLigatures)` | `var(--component-${Component}-${Token}-fontVariantNumeric)` | `var(--component-${Component}-${Token}-fontVariantPosition)` | `var(--component-${Component}-${Token}-fontVariationSettings)` | `var(--component-${Component}-${Token}-fontWeight)` | `var(--component-${Component}-${Token}-forcedColorAdjust)` | `var(--component-${Component}-${Token}-gridAutoColumns)` | `var(--component-${Component}-${Token}-gridAutoFlow)` | `var(--component-${Component}-${Token}-gridAutoRows)` | `var(--component-${Component}-${Token}-gridColumnEnd)` | `var(--component-${Component}-${Token}-gridColumnStart)` | `var(--component-${Component}-${Token}-gridRowEnd)` | `var(--component-${Component}-${Token}-gridRowStart)` | `var(--component-${Component}-${Token}-gridTemplateAreas)` | `var(--component-${Component}-${Token}-gridTemplateColumns)` | `var(--component-${Component}-${Token}-gridTemplateRows)` | `var(--component-${Component}-${Token}-hangingPunctuation)` | `var(--component-${Component}-${Token}-hyphenateCharacter)` | `var(--component-${Component}-${Token}-hyphens)` | `var(--component-${Component}-${Token}-imageOrientation)` | `var(--component-${Component}-${Token}-imageRendering)` | `var(--component-${Component}-${Token}-imageResolution)` | `var(--component-${Component}-${Token}-initialLetter)` | `var(--component-${Component}-${Token}-inlineSize)` | `var(--component-${Component}-${Token}-inputSecurity)` | `var(--component-${Component}-${Token}-insetBlock)` | `var(--component-${Component}-${Token}-insetBlockEnd)` | `var(--component-${Component}-${Token}-insetBlockStart)` | `var(--component-${Component}-${Token}-insetInline)` | `var(--component-${Component}-${Token}-insetInlineEnd)` | `var(--component-${Component}-${Token}-insetInlineStart)` | `var(--component-${Component}-${Token}-isolation)` | `var(--component-${Component}-${Token}-justifyContent)` | `var(--component-${Component}-${Token}-justifyItems)` | `var(--component-${Component}-${Token}-justifySelf)` | `var(--component-${Component}-${Token}-justifyTracks)` | `var(--component-${Component}-${Token}-left)` | `var(--component-${Component}-${Token}-letterSpacing)` | `var(--component-${Component}-${Token}-lineBreak)` | `var(--component-${Component}-${Token}-lineHeight)` | `var(--component-${Component}-${Token}-lineHeightStep)` | `var(--component-${Component}-${Token}-listStyleImage)` | `var(--component-${Component}-${Token}-listStylePosition)` | `var(--component-${Component}-${Token}-listStyleType)` | `var(--component-${Component}-${Token}-marginBlock)` | `var(--component-${Component}-${Token}-marginBlockEnd)` | `var(--component-${Component}-${Token}-marginBlockStart)` | `var(--component-${Component}-${Token}-marginBottom)` | `var(--component-${Component}-${Token}-marginInline)` | `var(--component-${Component}-${Token}-marginInlineEnd)` | `var(--component-${Component}-${Token}-marginInlineStart)` | `var(--component-${Component}-${Token}-marginLeft)` | `var(--component-${Component}-${Token}-marginRight)` | `var(--component-${Component}-${Token}-marginTop)` | `var(--component-${Component}-${Token}-maskBorderMode)` | `var(--component-${Component}-${Token}-maskBorderOutset)` | `var(--component-${Component}-${Token}-maskBorderRepeat)` | `var(--component-${Component}-${Token}-maskBorderSlice)` | `var(--component-${Component}-${Token}-maskBorderSource)` | `var(--component-${Component}-${Token}-maskBorderWidth)` | `var(--component-${Component}-${Token}-maskClip)` | `var(--component-${Component}-${Token}-maskComposite)` | `var(--component-${Component}-${Token}-maskImage)` | `var(--component-${Component}-${Token}-maskMode)` | `var(--component-${Component}-${Token}-maskOrigin)` | `var(--component-${Component}-${Token}-maskPosition)` | `var(--component-${Component}-${Token}-maskRepeat)` | `var(--component-${Component}-${Token}-maskSize)` | `var(--component-${Component}-${Token}-maskType)` | `var(--component-${Component}-${Token}-mathDepth)` | `var(--component-${Component}-${Token}-mathShift)` | `var(--component-${Component}-${Token}-mathStyle)` | `var(--component-${Component}-${Token}-maxBlockSize)` | `var(--component-${Component}-${Token}-maxHeight)` | `var(--component-${Component}-${Token}-maxInlineSize)` | `var(--component-${Component}-${Token}-maxLines)` | `var(--component-${Component}-${Token}-maxWidth)` | `var(--component-${Component}-${Token}-minBlockSize)` | `var(--component-${Component}-${Token}-minHeight)` | `var(--component-${Component}-${Token}-minInlineSize)` | `var(--component-${Component}-${Token}-minWidth)` | `var(--component-${Component}-${Token}-mixBlendMode)` | `var(--component-${Component}-${Token}-motionDistance)` | `var(--component-${Component}-${Token}-motionPath)` | `var(--component-${Component}-${Token}-motionRotation)` | `var(--component-${Component}-${Token}-objectFit)` | `var(--component-${Component}-${Token}-objectPosition)` | `var(--component-${Component}-${Token}-offsetAnchor)` | `var(--component-${Component}-${Token}-offsetDistance)` | `var(--component-${Component}-${Token}-offsetPath)` | `var(--component-${Component}-${Token}-offsetRotate)` | `var(--component-${Component}-${Token}-offsetRotation)` | `var(--component-${Component}-${Token}-opacity)` | `var(--component-${Component}-${Token}-order)` | `var(--component-${Component}-${Token}-orphans)` | `var(--component-${Component}-${Token}-outlineColor)` | `var(--component-${Component}-${Token}-outlineOffset)` | `var(--component-${Component}-${Token}-outlineStyle)` | `var(--component-${Component}-${Token}-outlineWidth)` | `var(--component-${Component}-${Token}-overflowAnchor)` | `var(--component-${Component}-${Token}-overflowBlock)` | `var(--component-${Component}-${Token}-overflowClipBox)` | `var(--component-${Component}-${Token}-overflowClipMargin)` | `var(--component-${Component}-${Token}-overflowInline)` | `var(--component-${Component}-${Token}-overflowWrap)` | `var(--component-${Component}-${Token}-overflowX)` | `var(--component-${Component}-${Token}-overflowY)` | `var(--component-${Component}-${Token}-overscrollBehaviorBlock)` | `var(--component-${Component}-${Token}-overscrollBehaviorInline)` | `var(--component-${Component}-${Token}-overscrollBehaviorX)` | `var(--component-${Component}-${Token}-overscrollBehaviorY)` | `var(--component-${Component}-${Token}-paddingBlock)` | `var(--component-${Component}-${Token}-paddingBlockEnd)` | `var(--component-${Component}-${Token}-paddingBlockStart)` | `var(--component-${Component}-${Token}-paddingBottom)` | `var(--component-${Component}-${Token}-paddingInline)` | `var(--component-${Component}-${Token}-paddingInlineEnd)` | `var(--component-${Component}-${Token}-paddingInlineStart)` | `var(--component-${Component}-${Token}-paddingLeft)` | `var(--component-${Component}-${Token}-paddingRight)` | `var(--component-${Component}-${Token}-paddingTop)` | `var(--component-${Component}-${Token}-pageBreakAfter)` | `var(--component-${Component}-${Token}-pageBreakBefore)` | `var(--component-${Component}-${Token}-pageBreakInside)` | `var(--component-${Component}-${Token}-paintOrder)` | `var(--component-${Component}-${Token}-perspective)` | `var(--component-${Component}-${Token}-perspectiveOrigin)` | `var(--component-${Component}-${Token}-placeContent)` | `var(--component-${Component}-${Token}-pointerEvents)` | `var(--component-${Component}-${Token}-position)` | `var(--component-${Component}-${Token}-printColorAdjust)` | `var(--component-${Component}-${Token}-quotes)` | `var(--component-${Component}-${Token}-resize)` | `var(--component-${Component}-${Token}-right)` | `var(--component-${Component}-${Token}-rotate)` | `var(--component-${Component}-${Token}-rowGap)` | `var(--component-${Component}-${Token}-rubyAlign)` | `var(--component-${Component}-${Token}-rubyMerge)` | `var(--component-${Component}-${Token}-rubyPosition)` | `var(--component-${Component}-${Token}-scale)` | `var(--component-${Component}-${Token}-scrollBehavior)` | `var(--component-${Component}-${Token}-scrollMargin)` | `var(--component-${Component}-${Token}-scrollMarginBlock)` | `var(--component-${Component}-${Token}-scrollMarginBlockEnd)` | `var(--component-${Component}-${Token}-scrollMarginBlockStart)` | `var(--component-${Component}-${Token}-scrollMarginBottom)` | `var(--component-${Component}-${Token}-scrollMarginInline)` | `var(--component-${Component}-${Token}-scrollMarginInlineEnd)` | `var(--component-${Component}-${Token}-scrollMarginInlineStart)` | `var(--component-${Component}-${Token}-scrollMarginLeft)` | `var(--component-${Component}-${Token}-scrollMarginRight)` | `var(--component-${Component}-${Token}-scrollMarginTop)` | `var(--component-${Component}-${Token}-scrollPadding)` | `var(--component-${Component}-${Token}-scrollPaddingBlock)` | `var(--component-${Component}-${Token}-scrollPaddingBlockEnd)` | `var(--component-${Component}-${Token}-scrollPaddingBlockStart)` | `var(--component-${Component}-${Token}-scrollPaddingBottom)` | `var(--component-${Component}-${Token}-scrollPaddingInline)` | `var(--component-${Component}-${Token}-scrollPaddingInlineEnd)` | `var(--component-${Component}-${Token}-scrollPaddingInlineStart)` | `var(--component-${Component}-${Token}-scrollPaddingLeft)` | `var(--component-${Component}-${Token}-scrollPaddingRight)` | `var(--component-${Component}-${Token}-scrollPaddingTop)` | `var(--component-${Component}-${Token}-scrollSnapAlign)` | `var(--component-${Component}-${Token}-scrollSnapMargin)` | `var(--component-${Component}-${Token}-scrollSnapMarginBottom)` | `var(--component-${Component}-${Token}-scrollSnapMarginLeft)` | `var(--component-${Component}-${Token}-scrollSnapMarginRight)` | `var(--component-${Component}-${Token}-scrollSnapMarginTop)` | `var(--component-${Component}-${Token}-scrollSnapStop)` | `var(--component-${Component}-${Token}-scrollSnapType)` | `var(--component-${Component}-${Token}-scrollbarColor)` | `var(--component-${Component}-${Token}-scrollbarGutter)` | `var(--component-${Component}-${Token}-scrollbarWidth)` | `var(--component-${Component}-${Token}-shapeImageThreshold)` | `var(--component-${Component}-${Token}-shapeMargin)` | `var(--component-${Component}-${Token}-shapeOutside)` | `var(--component-${Component}-${Token}-tabSize)` | `var(--component-${Component}-${Token}-tableLayout)` | `var(--component-${Component}-${Token}-textAlign)` | `var(--component-${Component}-${Token}-textAlignLast)` | `var(--component-${Component}-${Token}-textCombineUpright)` | `var(--component-${Component}-${Token}-textDecorationColor)` | `var(--component-${Component}-${Token}-textDecorationLine)` | `var(--component-${Component}-${Token}-textDecorationSkip)` | `var(--component-${Component}-${Token}-textDecorationSkipInk)` | `var(--component-${Component}-${Token}-textDecorationStyle)` | `var(--component-${Component}-${Token}-textDecorationThickness)` | `var(--component-${Component}-${Token}-textEmphasisColor)` | `var(--component-${Component}-${Token}-textEmphasisPosition)` | `var(--component-${Component}-${Token}-textEmphasisStyle)` | `var(--component-${Component}-${Token}-textIndent)` | `var(--component-${Component}-${Token}-textJustify)` | `var(--component-${Component}-${Token}-textOrientation)` | `var(--component-${Component}-${Token}-textOverflow)` | `var(--component-${Component}-${Token}-textRendering)` | `var(--component-${Component}-${Token}-textShadow)` | `var(--component-${Component}-${Token}-textSizeAdjust)` | `var(--component-${Component}-${Token}-textTransform)` | `var(--component-${Component}-${Token}-textUnderlineOffset)` | `var(--component-${Component}-${Token}-textUnderlinePosition)` | `var(--component-${Component}-${Token}-top)` | `var(--component-${Component}-${Token}-touchAction)` | `var(--component-${Component}-${Token}-transform)` | `var(--component-${Component}-${Token}-transformBox)` | `var(--component-${Component}-${Token}-transformOrigin)` | `var(--component-${Component}-${Token}-transformStyle)` | `var(--component-${Component}-${Token}-transitionDelay)` | `var(--component-${Component}-${Token}-transitionDuration)` | `var(--component-${Component}-${Token}-transitionProperty)` | `var(--component-${Component}-${Token}-transitionTimingFunction)` | `var(--component-${Component}-${Token}-translate)` | `var(--component-${Component}-${Token}-unicodeBidi)` | `var(--component-${Component}-${Token}-userSelect)` | `var(--component-${Component}-${Token}-verticalAlign)` | `var(--component-${Component}-${Token}-visibility)` | `var(--component-${Component}-${Token}-whiteSpace)` | `var(--component-${Component}-${Token}-widows)` | `var(--component-${Component}-${Token}-willChange)` | `var(--component-${Component}-${Token}-wordBreak)` | `var(--component-${Component}-${Token}-wordSpacing)` | `var(--component-${Component}-${Token}-wordWrap)` | `var(--component-${Component}-${Token}-writingMode)` | `var(--component-${Component}-${Token}-zIndex)` | `var(--component-${Component}-${Token}-zoom)` | `var(--component-${Component}-${Token}-all)` | `var(--component-${Component}-${Token}-animation)` | `var(--component-${Component}-${Token}-backgroundPosition)` | `var(--component-${Component}-${Token}-borderBlock)` | `var(--component-${Component}-${Token}-borderBlockEnd)` | `var(--component-${Component}-${Token}-borderBlockStart)` | `var(--component-${Component}-${Token}-borderBottom)` | `var(--component-${Component}-${Token}-borderColor)` | `var(--component-${Component}-${Token}-borderImage)` | `var(--component-${Component}-${Token}-borderInline)` | `var(--component-${Component}-${Token}-borderInlineEnd)` | `var(--component-${Component}-${Token}-borderInlineStart)` | `var(--component-${Component}-${Token}-borderLeft)` | `var(--component-${Component}-${Token}-borderRadius)` | `var(--component-${Component}-${Token}-borderRight)` | `var(--component-${Component}-${Token}-borderStyle)` | `var(--component-${Component}-${Token}-borderTop)` | `var(--component-${Component}-${Token}-borderWidth)` | `var(--component-${Component}-${Token}-columnRule)` | `var(--component-${Component}-${Token}-columns)` | `var(--component-${Component}-${Token}-flex)` | `var(--component-${Component}-${Token}-flexFlow)` | `var(--component-${Component}-${Token}-font)` | `var(--component-${Component}-${Token}-gap)` | `var(--component-${Component}-${Token}-grid)` | `var(--component-${Component}-${Token}-gridArea)` | `var(--component-${Component}-${Token}-gridColumn)` | `var(--component-${Component}-${Token}-gridRow)` | `var(--component-${Component}-${Token}-gridTemplate)` | `var(--component-${Component}-${Token}-lineClamp)` | `var(--component-${Component}-${Token}-listStyle)` | `var(--component-${Component}-${Token}-margin)` | `var(--component-${Component}-${Token}-mask)` | `var(--component-${Component}-${Token}-maskBorder)` | `var(--component-${Component}-${Token}-motion)` | `var(--component-${Component}-${Token}-offset)` | `var(--component-${Component}-${Token}-outline)` | `var(--component-${Component}-${Token}-overflow)` | `var(--component-${Component}-${Token}-overscrollBehavior)` | `var(--component-${Component}-${Token}-padding)` | `var(--component-${Component}-${Token}-placeItems)` | `var(--component-${Component}-${Token}-placeSelf)` | `var(--component-${Component}-${Token}-textDecoration)` | `var(--component-${Component}-${Token}-textEmphasis)` | `var(--component-${Component}-${Token}-transition)` | `var(--component-${Component}-${Token}-MozAnimationDelay)` | `var(--component-${Component}-${Token}-MozAnimationDirection)` | `var(--component-${Component}-${Token}-MozAnimationDuration)` | `var(--component-${Component}-${Token}-MozAnimationFillMode)` | `var(--component-${Component}-${Token}-MozAnimationIterationCount)` | `var(--component-${Component}-${Token}-MozAnimationName)` | `var(--component-${Component}-${Token}-MozAnimationPlayState)` | `var(--component-${Component}-${Token}-MozAnimationTimingFunction)` | `var(--component-${Component}-${Token}-MozAppearance)` | `var(--component-${Component}-${Token}-MozBackfaceVisibility)` | `var(--component-${Component}-${Token}-MozBorderBottomColors)` | `var(--component-${Component}-${Token}-MozBorderEndColor)` | `var(--component-${Component}-${Token}-MozBorderEndStyle)` | `var(--component-${Component}-${Token}-MozBorderEndWidth)` | `var(--component-${Component}-${Token}-MozBorderLeftColors)` | `var(--component-${Component}-${Token}-MozBorderRightColors)` | `var(--component-${Component}-${Token}-MozBorderStartColor)` | `var(--component-${Component}-${Token}-MozBorderStartStyle)` | `var(--component-${Component}-${Token}-MozBorderTopColors)` | `var(--component-${Component}-${Token}-MozBoxSizing)` | `var(--component-${Component}-${Token}-MozColumnCount)` | `var(--component-${Component}-${Token}-MozColumnFill)` | `var(--component-${Component}-${Token}-MozColumnRuleColor)` | `var(--component-${Component}-${Token}-MozColumnRuleStyle)` | `var(--component-${Component}-${Token}-MozColumnRuleWidth)` | `var(--component-${Component}-${Token}-MozColumnWidth)` | `var(--component-${Component}-${Token}-MozContextProperties)` | `var(--component-${Component}-${Token}-MozFontFeatureSettings)` | `var(--component-${Component}-${Token}-MozFontLanguageOverride)` | `var(--component-${Component}-${Token}-MozHyphens)` | `var(--component-${Component}-${Token}-MozImageRegion)` | `var(--component-${Component}-${Token}-MozMarginEnd)` | `var(--component-${Component}-${Token}-MozMarginStart)` | `var(--component-${Component}-${Token}-MozOrient)` | `var(--component-${Component}-${Token}-MozOsxFontSmoothing)` | `var(--component-${Component}-${Token}-MozPaddingEnd)` | `var(--component-${Component}-${Token}-MozPaddingStart)` | `var(--component-${Component}-${Token}-MozPerspective)` | `var(--component-${Component}-${Token}-MozPerspectiveOrigin)` | `var(--component-${Component}-${Token}-MozStackSizing)` | `var(--component-${Component}-${Token}-MozTabSize)` | `var(--component-${Component}-${Token}-MozTextBlink)` | `var(--component-${Component}-${Token}-MozTextSizeAdjust)` | `var(--component-${Component}-${Token}-MozTransformOrigin)` | `var(--component-${Component}-${Token}-MozTransformStyle)` | `var(--component-${Component}-${Token}-MozTransitionDelay)` | `var(--component-${Component}-${Token}-MozTransitionDuration)` | `var(--component-${Component}-${Token}-MozTransitionProperty)` | `var(--component-${Component}-${Token}-MozTransitionTimingFunction)` | `var(--component-${Component}-${Token}-MozUserFocus)` | `var(--component-${Component}-${Token}-MozUserModify)` | `var(--component-${Component}-${Token}-MozUserSelect)` | `var(--component-${Component}-${Token}-MozWindowDragging)` | `var(--component-${Component}-${Token}-MozWindowShadow)` | `var(--component-${Component}-${Token}-msAccelerator)` | `var(--component-${Component}-${Token}-msBlockProgression)` | `var(--component-${Component}-${Token}-msContentZoomChaining)` | `var(--component-${Component}-${Token}-msContentZoomLimitMax)` | `var(--component-${Component}-${Token}-msContentZoomLimitMin)` | `var(--component-${Component}-${Token}-msContentZoomSnapPoints)` | `var(--component-${Component}-${Token}-msContentZoomSnapType)` | `var(--component-${Component}-${Token}-msContentZooming)` | `var(--component-${Component}-${Token}-msFilter)` | `var(--component-${Component}-${Token}-msFlexDirection)` | `var(--component-${Component}-${Token}-msFlexPositive)` | `var(--component-${Component}-${Token}-msFlowFrom)` | `var(--component-${Component}-${Token}-msFlowInto)` | `var(--component-${Component}-${Token}-msGridColumns)` | `var(--component-${Component}-${Token}-msGridRows)` | `var(--component-${Component}-${Token}-msHighContrastAdjust)` | `var(--component-${Component}-${Token}-msHyphenateLimitChars)` | `var(--component-${Component}-${Token}-msHyphenateLimitLines)` | `var(--component-${Component}-${Token}-msHyphenateLimitZone)` | `var(--component-${Component}-${Token}-msHyphens)` | `var(--component-${Component}-${Token}-msImeAlign)` | `var(--component-${Component}-${Token}-msLineBreak)` | `var(--component-${Component}-${Token}-msOrder)` | `var(--component-${Component}-${Token}-msOverflowStyle)` | `var(--component-${Component}-${Token}-msOverflowX)` | `var(--component-${Component}-${Token}-msOverflowY)` | `var(--component-${Component}-${Token}-msScrollChaining)` | `var(--component-${Component}-${Token}-msScrollLimitXMax)` | `var(--component-${Component}-${Token}-msScrollLimitXMin)` | `var(--component-${Component}-${Token}-msScrollLimitYMax)` | `var(--component-${Component}-${Token}-msScrollLimitYMin)` | `var(--component-${Component}-${Token}-msScrollRails)` | `var(--component-${Component}-${Token}-msScrollSnapPointsX)` | `var(--component-${Component}-${Token}-msScrollSnapPointsY)` | `var(--component-${Component}-${Token}-msScrollSnapType)` | `var(--component-${Component}-${Token}-msScrollTranslation)` | `var(--component-${Component}-${Token}-msScrollbar3dlightColor)` | `var(--component-${Component}-${Token}-msScrollbarArrowColor)` | `var(--component-${Component}-${Token}-msScrollbarBaseColor)` | `var(--component-${Component}-${Token}-msScrollbarDarkshadowColor)` | `var(--component-${Component}-${Token}-msScrollbarFaceColor)` | `var(--component-${Component}-${Token}-msScrollbarHighlightColor)` | `var(--component-${Component}-${Token}-msScrollbarShadowColor)` | `var(--component-${Component}-${Token}-msScrollbarTrackColor)` | `var(--component-${Component}-${Token}-msTextAutospace)` | `var(--component-${Component}-${Token}-msTextCombineHorizontal)` | `var(--component-${Component}-${Token}-msTextOverflow)` | `var(--component-${Component}-${Token}-msTouchAction)` | `var(--component-${Component}-${Token}-msTouchSelect)` | `var(--component-${Component}-${Token}-msTransform)` | `var(--component-${Component}-${Token}-msTransformOrigin)` | `var(--component-${Component}-${Token}-msTransitionDelay)` | `var(--component-${Component}-${Token}-msTransitionDuration)` | `var(--component-${Component}-${Token}-msTransitionProperty)` | `var(--component-${Component}-${Token}-msTransitionTimingFunction)` | `var(--component-${Component}-${Token}-msUserSelect)` | `var(--component-${Component}-${Token}-msWordBreak)` | `var(--component-${Component}-${Token}-msWrapFlow)` | `var(--component-${Component}-${Token}-msWrapMargin)` | `var(--component-${Component}-${Token}-msWrapThrough)` | `var(--component-${Component}-${Token}-msWritingMode)` | `var(--component-${Component}-${Token}-WebkitAlignContent)` | `var(--component-${Component}-${Token}-WebkitAlignItems)` | `var(--component-${Component}-${Token}-WebkitAlignSelf)` | `var(--component-${Component}-${Token}-WebkitAnimationDelay)` | `var(--component-${Component}-${Token}-WebkitAnimationDirection)` | `var(--component-${Component}-${Token}-WebkitAnimationDuration)` | `var(--component-${Component}-${Token}-WebkitAnimationFillMode)` | `var(--component-${Component}-${Token}-WebkitAnimationIterationCount)` | `var(--component-${Component}-${Token}-WebkitAnimationName)` | `var(--component-${Component}-${Token}-WebkitAnimationPlayState)` | `var(--component-${Component}-${Token}-WebkitAnimationTimingFunction)` | `var(--component-${Component}-${Token}-WebkitAppearance)` | `var(--component-${Component}-${Token}-WebkitBackdropFilter)` | `var(--component-${Component}-${Token}-WebkitBackfaceVisibility)` | `var(--component-${Component}-${Token}-WebkitBackgroundClip)` | `var(--component-${Component}-${Token}-WebkitBackgroundOrigin)` | `var(--component-${Component}-${Token}-WebkitBackgroundSize)` | `var(--component-${Component}-${Token}-WebkitBorderBeforeColor)` | `var(--component-${Component}-${Token}-WebkitBorderBeforeStyle)` | `var(--component-${Component}-${Token}-WebkitBorderBeforeWidth)` | `var(--component-${Component}-${Token}-WebkitBorderBottomLeftRadius)` | `var(--component-${Component}-${Token}-WebkitBorderBottomRightRadius)` | `var(--component-${Component}-${Token}-WebkitBorderImageSlice)` | `var(--component-${Component}-${Token}-WebkitBorderTopLeftRadius)` | `var(--component-${Component}-${Token}-WebkitBorderTopRightRadius)` | `var(--component-${Component}-${Token}-WebkitBoxDecorationBreak)` | `var(--component-${Component}-${Token}-WebkitBoxReflect)` | `var(--component-${Component}-${Token}-WebkitBoxShadow)` | `var(--component-${Component}-${Token}-WebkitBoxSizing)` | `var(--component-${Component}-${Token}-WebkitClipPath)` | `var(--component-${Component}-${Token}-WebkitColumnCount)` | `var(--component-${Component}-${Token}-WebkitColumnFill)` | `var(--component-${Component}-${Token}-WebkitColumnRuleColor)` | `var(--component-${Component}-${Token}-WebkitColumnRuleStyle)` | `var(--component-${Component}-${Token}-WebkitColumnRuleWidth)` | `var(--component-${Component}-${Token}-WebkitColumnSpan)` | `var(--component-${Component}-${Token}-WebkitColumnWidth)` | `var(--component-${Component}-${Token}-WebkitFilter)` | `var(--component-${Component}-${Token}-WebkitFlexBasis)` | `var(--component-${Component}-${Token}-WebkitFlexDirection)` | `var(--component-${Component}-${Token}-WebkitFlexGrow)` | `var(--component-${Component}-${Token}-WebkitFlexShrink)` | `var(--component-${Component}-${Token}-WebkitFlexWrap)` | `var(--component-${Component}-${Token}-WebkitFontFeatureSettings)` | `var(--component-${Component}-${Token}-WebkitFontKerning)` | `var(--component-${Component}-${Token}-WebkitFontSmoothing)` | `var(--component-${Component}-${Token}-WebkitFontVariantLigatures)` | `var(--component-${Component}-${Token}-WebkitHyphenateCharacter)` | `var(--component-${Component}-${Token}-WebkitHyphens)` | `var(--component-${Component}-${Token}-WebkitInitialLetter)` | `var(--component-${Component}-${Token}-WebkitJustifyContent)` | `var(--component-${Component}-${Token}-WebkitLineBreak)` | `var(--component-${Component}-${Token}-WebkitLineClamp)` | `var(--component-${Component}-${Token}-WebkitMarginEnd)` | `var(--component-${Component}-${Token}-WebkitMarginStart)` | `var(--component-${Component}-${Token}-WebkitMaskAttachment)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageOutset)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageRepeat)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageSlice)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageSource)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageWidth)` | `var(--component-${Component}-${Token}-WebkitMaskClip)` | `var(--component-${Component}-${Token}-WebkitMaskComposite)` | `var(--component-${Component}-${Token}-WebkitMaskImage)` | `var(--component-${Component}-${Token}-WebkitMaskOrigin)` | `var(--component-${Component}-${Token}-WebkitMaskPosition)` | `var(--component-${Component}-${Token}-WebkitMaskPositionX)` | `var(--component-${Component}-${Token}-WebkitMaskPositionY)` | `var(--component-${Component}-${Token}-WebkitMaskRepeat)` | `var(--component-${Component}-${Token}-WebkitMaskRepeatX)` | `var(--component-${Component}-${Token}-WebkitMaskRepeatY)` | `var(--component-${Component}-${Token}-WebkitMaskSize)` | `var(--component-${Component}-${Token}-WebkitMaxInlineSize)` | `var(--component-${Component}-${Token}-WebkitOrder)` | `var(--component-${Component}-${Token}-WebkitOverflowScrolling)` | `var(--component-${Component}-${Token}-WebkitPaddingEnd)` | `var(--component-${Component}-${Token}-WebkitPaddingStart)` | `var(--component-${Component}-${Token}-WebkitPerspective)` | `var(--component-${Component}-${Token}-WebkitPerspectiveOrigin)` | `var(--component-${Component}-${Token}-WebkitPrintColorAdjust)` | `var(--component-${Component}-${Token}-WebkitRubyPosition)` | `var(--component-${Component}-${Token}-WebkitScrollSnapType)` | `var(--component-${Component}-${Token}-WebkitShapeMargin)` | `var(--component-${Component}-${Token}-WebkitTapHighlightColor)` | `var(--component-${Component}-${Token}-WebkitTextCombine)` | `var(--component-${Component}-${Token}-WebkitTextDecorationColor)` | `var(--component-${Component}-${Token}-WebkitTextDecorationLine)` | `var(--component-${Component}-${Token}-WebkitTextDecorationSkip)` | `var(--component-${Component}-${Token}-WebkitTextDecorationStyle)` | `var(--component-${Component}-${Token}-WebkitTextEmphasisColor)` | `var(--component-${Component}-${Token}-WebkitTextEmphasisPosition)` | `var(--component-${Component}-${Token}-WebkitTextEmphasisStyle)` | `var(--component-${Component}-${Token}-WebkitTextFillColor)` | `var(--component-${Component}-${Token}-WebkitTextOrientation)` | `var(--component-${Component}-${Token}-WebkitTextSizeAdjust)` | `var(--component-${Component}-${Token}-WebkitTextStrokeColor)` | `var(--component-${Component}-${Token}-WebkitTextStrokeWidth)` | `var(--component-${Component}-${Token}-WebkitTextUnderlinePosition)` | `var(--component-${Component}-${Token}-WebkitTouchCallout)` | `var(--component-${Component}-${Token}-WebkitTransform)` | `var(--component-${Component}-${Token}-WebkitTransformOrigin)` | `var(--component-${Component}-${Token}-WebkitTransformStyle)` | `var(--component-${Component}-${Token}-WebkitTransitionDelay)` | `var(--component-${Component}-${Token}-WebkitTransitionDuration)` | `var(--component-${Component}-${Token}-WebkitTransitionProperty)` | `var(--component-${Component}-${Token}-WebkitTransitionTimingFunction)` | `var(--component-${Component}-${Token}-WebkitUserModify)` | `var(--component-${Component}-${Token}-WebkitUserSelect)` | `var(--component-${Component}-${Token}-WebkitWritingMode)` | `var(--component-${Component}-${Token}-MozAnimation)` | `var(--component-${Component}-${Token}-MozBorderImage)` | `var(--component-${Component}-${Token}-MozColumnRule)` | `var(--component-${Component}-${Token}-MozColumns)` | `var(--component-${Component}-${Token}-MozTransition)` | `var(--component-${Component}-${Token}-msContentZoomLimit)` | `var(--component-${Component}-${Token}-msContentZoomSnap)` | `var(--component-${Component}-${Token}-msFlex)` | `var(--component-${Component}-${Token}-msScrollLimit)` | `var(--component-${Component}-${Token}-msScrollSnapX)` | `var(--component-${Component}-${Token}-msScrollSnapY)` | `var(--component-${Component}-${Token}-msTransition)` | `var(--component-${Component}-${Token}-WebkitAnimation)` | `var(--component-${Component}-${Token}-WebkitBorderBefore)` | `var(--component-${Component}-${Token}-WebkitBorderImage)` | `var(--component-${Component}-${Token}-WebkitBorderRadius)` | `var(--component-${Component}-${Token}-WebkitColumnRule)` | `var(--component-${Component}-${Token}-WebkitColumns)` | `var(--component-${Component}-${Token}-WebkitFlex)` | `var(--component-${Component}-${Token}-WebkitFlexFlow)` | `var(--component-${Component}-${Token}-WebkitMask)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImage)` | `var(--component-${Component}-${Token}-WebkitTextEmphasis)` | `var(--component-${Component}-${Token}-WebkitTextStroke)` | `var(--component-${Component}-${Token}-WebkitTransition)` | `var(--component-${Component}-${Token}-azimuth)` | `var(--component-${Component}-${Token}-boxAlign)` | `var(--component-${Component}-${Token}-boxDirection)` | `var(--component-${Component}-${Token}-boxFlex)` | `var(--component-${Component}-${Token}-boxFlexGroup)` | `var(--component-${Component}-${Token}-boxLines)` | `var(--component-${Component}-${Token}-boxOrdinalGroup)` | `var(--component-${Component}-${Token}-boxOrient)` | `var(--component-${Component}-${Token}-boxPack)` | `var(--component-${Component}-${Token}-clip)` | `var(--component-${Component}-${Token}-gridColumnGap)` | `var(--component-${Component}-${Token}-gridGap)` | `var(--component-${Component}-${Token}-gridRowGap)` | `var(--component-${Component}-${Token}-imeMode)` | `var(--component-${Component}-${Token}-offsetBlock)` | `var(--component-${Component}-${Token}-offsetBlockEnd)` | `var(--component-${Component}-${Token}-offsetBlockStart)` | `var(--component-${Component}-${Token}-offsetInline)` | `var(--component-${Component}-${Token}-offsetInlineEnd)` | `var(--component-${Component}-${Token}-offsetInlineStart)` | `var(--component-${Component}-${Token}-scrollSnapCoordinate)` | `var(--component-${Component}-${Token}-scrollSnapDestination)` | `var(--component-${Component}-${Token}-scrollSnapPointsX)` | `var(--component-${Component}-${Token}-scrollSnapPointsY)` | `var(--component-${Component}-${Token}-scrollSnapTypeX)` | `var(--component-${Component}-${Token}-scrollSnapTypeY)` | `var(--component-${Component}-${Token}-KhtmlBoxAlign)` | `var(--component-${Component}-${Token}-KhtmlBoxDirection)` | `var(--component-${Component}-${Token}-KhtmlBoxFlex)` | `var(--component-${Component}-${Token}-KhtmlBoxFlexGroup)` | `var(--component-${Component}-${Token}-KhtmlBoxLines)` | `var(--component-${Component}-${Token}-KhtmlBoxOrdinalGroup)` | `var(--component-${Component}-${Token}-KhtmlBoxOrient)` | `var(--component-${Component}-${Token}-KhtmlBoxPack)` | `var(--component-${Component}-${Token}-KhtmlLineBreak)` | `var(--component-${Component}-${Token}-KhtmlOpacity)` | `var(--component-${Component}-${Token}-KhtmlUserSelect)` | `var(--component-${Component}-${Token}-MozBackgroundClip)` | `var(--component-${Component}-${Token}-MozBackgroundInlinePolicy)` | `var(--component-${Component}-${Token}-MozBackgroundOrigin)` | `var(--component-${Component}-${Token}-MozBackgroundSize)` | `var(--component-${Component}-${Token}-MozBinding)` | `var(--component-${Component}-${Token}-MozBorderRadius)` | `var(--component-${Component}-${Token}-MozBorderRadiusBottomleft)` | `var(--component-${Component}-${Token}-MozBorderRadiusBottomright)` | `var(--component-${Component}-${Token}-MozBorderRadiusTopleft)` | `var(--component-${Component}-${Token}-MozBorderRadiusTopright)` | `var(--component-${Component}-${Token}-MozBoxAlign)` | `var(--component-${Component}-${Token}-MozBoxDirection)` | `var(--component-${Component}-${Token}-MozBoxFlex)` | `var(--component-${Component}-${Token}-MozBoxOrdinalGroup)` | `var(--component-${Component}-${Token}-MozBoxOrient)` | `var(--component-${Component}-${Token}-MozBoxPack)` | `var(--component-${Component}-${Token}-MozBoxShadow)` | `var(--component-${Component}-${Token}-MozFloatEdge)` | `var(--component-${Component}-${Token}-MozForceBrokenImageIcon)` | `var(--component-${Component}-${Token}-MozOpacity)` | `var(--component-${Component}-${Token}-MozOutline)` | `var(--component-${Component}-${Token}-MozOutlineColor)` | `var(--component-${Component}-${Token}-MozOutlineRadius)` | `var(--component-${Component}-${Token}-MozOutlineRadiusBottomleft)` | `var(--component-${Component}-${Token}-MozOutlineRadiusBottomright)` | `var(--component-${Component}-${Token}-MozOutlineRadiusTopleft)` | `var(--component-${Component}-${Token}-MozOutlineRadiusTopright)` | `var(--component-${Component}-${Token}-MozOutlineStyle)` | `var(--component-${Component}-${Token}-MozOutlineWidth)` | `var(--component-${Component}-${Token}-MozTextAlignLast)` | `var(--component-${Component}-${Token}-MozTextDecorationColor)` | `var(--component-${Component}-${Token}-MozTextDecorationLine)` | `var(--component-${Component}-${Token}-MozTextDecorationStyle)` | `var(--component-${Component}-${Token}-MozUserInput)` | `var(--component-${Component}-${Token}-msImeMode)` | `var(--component-${Component}-${Token}-OAnimation)` | `var(--component-${Component}-${Token}-OAnimationDelay)` | `var(--component-${Component}-${Token}-OAnimationDirection)` | `var(--component-${Component}-${Token}-OAnimationDuration)` | `var(--component-${Component}-${Token}-OAnimationFillMode)` | `var(--component-${Component}-${Token}-OAnimationIterationCount)` | `var(--component-${Component}-${Token}-OAnimationName)` | `var(--component-${Component}-${Token}-OAnimationPlayState)` | `var(--component-${Component}-${Token}-OAnimationTimingFunction)` | `var(--component-${Component}-${Token}-OBackgroundSize)` | `var(--component-${Component}-${Token}-OBorderImage)` | `var(--component-${Component}-${Token}-OObjectFit)` | `var(--component-${Component}-${Token}-OObjectPosition)` | `var(--component-${Component}-${Token}-OTabSize)` | `var(--component-${Component}-${Token}-OTextOverflow)` | `var(--component-${Component}-${Token}-OTransform)` | `var(--component-${Component}-${Token}-OTransformOrigin)` | `var(--component-${Component}-${Token}-OTransition)` | `var(--component-${Component}-${Token}-OTransitionDelay)` | `var(--component-${Component}-${Token}-OTransitionDuration)` | `var(--component-${Component}-${Token}-OTransitionProperty)` | `var(--component-${Component}-${Token}-OTransitionTimingFunction)` | `var(--component-${Component}-${Token}-WebkitBoxAlign)` | `var(--component-${Component}-${Token}-WebkitBoxDirection)` | `var(--component-${Component}-${Token}-WebkitBoxFlex)` | `var(--component-${Component}-${Token}-WebkitBoxFlexGroup)` | `var(--component-${Component}-${Token}-WebkitBoxLines)` | `var(--component-${Component}-${Token}-WebkitBoxOrdinalGroup)` | `var(--component-${Component}-${Token}-WebkitBoxOrient)` | `var(--component-${Component}-${Token}-WebkitBoxPack)` | `var(--component-${Component}-${Token}-WebkitScrollSnapPointsX)` | `var(--component-${Component}-${Token}-WebkitScrollSnapPointsY)` | `var(--component-${Component}-${Token}-alignmentBaseline)` | `var(--component-${Component}-${Token}-baselineShift)` | `var(--component-${Component}-${Token}-clipRule)` | `var(--component-${Component}-${Token}-colorInterpolation)` | `var(--component-${Component}-${Token}-colorRendering)` | `var(--component-${Component}-${Token}-dominantBaseline)` | `var(--component-${Component}-${Token}-fill)` | `var(--component-${Component}-${Token}-fillOpacity)` | `var(--component-${Component}-${Token}-fillRule)` | `var(--component-${Component}-${Token}-floodColor)` | `var(--component-${Component}-${Token}-floodOpacity)` | `var(--component-${Component}-${Token}-glyphOrientationVertical)` | `var(--component-${Component}-${Token}-lightingColor)` | `var(--component-${Component}-${Token}-marker)` | `var(--component-${Component}-${Token}-markerEnd)` | `var(--component-${Component}-${Token}-markerMid)` | `var(--component-${Component}-${Token}-markerStart)` | `var(--component-${Component}-${Token}-shapeRendering)` | `var(--component-${Component}-${Token}-stopColor)` | `var(--component-${Component}-${Token}-stopOpacity)` | `var(--component-${Component}-${Token}-stroke)` | `var(--component-${Component}-${Token}-strokeDasharray)` | `var(--component-${Component}-${Token}-strokeDashoffset)` | `var(--component-${Component}-${Token}-strokeLinecap)` | `var(--component-${Component}-${Token}-strokeLinejoin)` | `var(--component-${Component}-${Token}-strokeMiterlimit)` | `var(--component-${Component}-${Token}-strokeOpacity)` | `var(--component-${Component}-${Token}-strokeWidth)` | `var(--component-${Component}-${Token}-textAnchor)` | `var(--component-${Component}-${Token}-vectorEffect)`;
|
|
15
15
|
/**
|
|
16
16
|
* Get the full CSSProperties for a component token.
|
|
17
17
|
* Replaces the css values from the ComponentTokenDefinition with the corresponding css variable.
|
|
@@ -21,7 +21,7 @@ export declare const componentTokenAsCssVariableString: <Component extends "card
|
|
|
21
21
|
* @param {CSSProperties} tokenObject The CSSProperties for the component token
|
|
22
22
|
* @returns {*} {CSSProperties} CSSProperties converted to use the css variable for the correstonding token
|
|
23
23
|
*/
|
|
24
|
-
export declare const componentTokenToCSSProperties: <Component extends "card" | "button" | "search", Token extends ComponentTokenNames<Component>>(component: Component, token: Token, tokenObject: CSSProperties) => {
|
|
24
|
+
export declare const componentTokenToCSSProperties: <Component extends "card" | "button" | "search" | "popover" | "popoverListItem", Token extends ComponentTokenNames<Component>>(component: Component, token: Token, tokenObject: CSSProperties) => {
|
|
25
25
|
[k: string]: `var(--component-${Component}-${Token}-border)` | `var(--component-${Component}-${Token}-height)` | `var(--component-${Component}-${Token}-width)` | `var(--component-${Component}-${Token}-background)` | `var(--component-${Component}-${Token}-inset)` | `var(--component-${Component}-${Token}-accentColor)` | `var(--component-${Component}-${Token}-alignContent)` | `var(--component-${Component}-${Token}-alignItems)` | `var(--component-${Component}-${Token}-alignSelf)` | `var(--component-${Component}-${Token}-alignTracks)` | `var(--component-${Component}-${Token}-animationComposition)` | `var(--component-${Component}-${Token}-animationDelay)` | `var(--component-${Component}-${Token}-animationDirection)` | `var(--component-${Component}-${Token}-animationDuration)` | `var(--component-${Component}-${Token}-animationFillMode)` | `var(--component-${Component}-${Token}-animationIterationCount)` | `var(--component-${Component}-${Token}-animationName)` | `var(--component-${Component}-${Token}-animationPlayState)` | `var(--component-${Component}-${Token}-animationTimeline)` | `var(--component-${Component}-${Token}-animationTimingFunction)` | `var(--component-${Component}-${Token}-appearance)` | `var(--component-${Component}-${Token}-aspectRatio)` | `var(--component-${Component}-${Token}-backdropFilter)` | `var(--component-${Component}-${Token}-backfaceVisibility)` | `var(--component-${Component}-${Token}-backgroundAttachment)` | `var(--component-${Component}-${Token}-backgroundBlendMode)` | `var(--component-${Component}-${Token}-backgroundClip)` | `var(--component-${Component}-${Token}-backgroundColor)` | `var(--component-${Component}-${Token}-backgroundImage)` | `var(--component-${Component}-${Token}-backgroundOrigin)` | `var(--component-${Component}-${Token}-backgroundPositionX)` | `var(--component-${Component}-${Token}-backgroundPositionY)` | `var(--component-${Component}-${Token}-backgroundRepeat)` | `var(--component-${Component}-${Token}-backgroundSize)` | `var(--component-${Component}-${Token}-blockOverflow)` | `var(--component-${Component}-${Token}-blockSize)` | `var(--component-${Component}-${Token}-borderBlockColor)` | `var(--component-${Component}-${Token}-borderBlockEndColor)` | `var(--component-${Component}-${Token}-borderBlockEndStyle)` | `var(--component-${Component}-${Token}-borderBlockEndWidth)` | `var(--component-${Component}-${Token}-borderBlockStartColor)` | `var(--component-${Component}-${Token}-borderBlockStartStyle)` | `var(--component-${Component}-${Token}-borderBlockStartWidth)` | `var(--component-${Component}-${Token}-borderBlockStyle)` | `var(--component-${Component}-${Token}-borderBlockWidth)` | `var(--component-${Component}-${Token}-borderBottomColor)` | `var(--component-${Component}-${Token}-borderBottomLeftRadius)` | `var(--component-${Component}-${Token}-borderBottomRightRadius)` | `var(--component-${Component}-${Token}-borderBottomStyle)` | `var(--component-${Component}-${Token}-borderBottomWidth)` | `var(--component-${Component}-${Token}-borderCollapse)` | `var(--component-${Component}-${Token}-borderEndEndRadius)` | `var(--component-${Component}-${Token}-borderEndStartRadius)` | `var(--component-${Component}-${Token}-borderImageOutset)` | `var(--component-${Component}-${Token}-borderImageRepeat)` | `var(--component-${Component}-${Token}-borderImageSlice)` | `var(--component-${Component}-${Token}-borderImageSource)` | `var(--component-${Component}-${Token}-borderImageWidth)` | `var(--component-${Component}-${Token}-borderInlineColor)` | `var(--component-${Component}-${Token}-borderInlineEndColor)` | `var(--component-${Component}-${Token}-borderInlineEndStyle)` | `var(--component-${Component}-${Token}-borderInlineEndWidth)` | `var(--component-${Component}-${Token}-borderInlineStartColor)` | `var(--component-${Component}-${Token}-borderInlineStartStyle)` | `var(--component-${Component}-${Token}-borderInlineStartWidth)` | `var(--component-${Component}-${Token}-borderInlineStyle)` | `var(--component-${Component}-${Token}-borderInlineWidth)` | `var(--component-${Component}-${Token}-borderLeftColor)` | `var(--component-${Component}-${Token}-borderLeftStyle)` | `var(--component-${Component}-${Token}-borderLeftWidth)` | `var(--component-${Component}-${Token}-borderRightColor)` | `var(--component-${Component}-${Token}-borderRightStyle)` | `var(--component-${Component}-${Token}-borderRightWidth)` | `var(--component-${Component}-${Token}-borderSpacing)` | `var(--component-${Component}-${Token}-borderStartEndRadius)` | `var(--component-${Component}-${Token}-borderStartStartRadius)` | `var(--component-${Component}-${Token}-borderTopColor)` | `var(--component-${Component}-${Token}-borderTopLeftRadius)` | `var(--component-${Component}-${Token}-borderTopRightRadius)` | `var(--component-${Component}-${Token}-borderTopStyle)` | `var(--component-${Component}-${Token}-borderTopWidth)` | `var(--component-${Component}-${Token}-bottom)` | `var(--component-${Component}-${Token}-boxDecorationBreak)` | `var(--component-${Component}-${Token}-boxShadow)` | `var(--component-${Component}-${Token}-boxSizing)` | `var(--component-${Component}-${Token}-breakAfter)` | `var(--component-${Component}-${Token}-breakBefore)` | `var(--component-${Component}-${Token}-breakInside)` | `var(--component-${Component}-${Token}-captionSide)` | `var(--component-${Component}-${Token}-caretColor)` | `var(--component-${Component}-${Token}-clear)` | `var(--component-${Component}-${Token}-clipPath)` | `var(--component-${Component}-${Token}-color)` | `var(--component-${Component}-${Token}-colorAdjust)` | `var(--component-${Component}-${Token}-colorScheme)` | `var(--component-${Component}-${Token}-columnCount)` | `var(--component-${Component}-${Token}-columnFill)` | `var(--component-${Component}-${Token}-columnGap)` | `var(--component-${Component}-${Token}-columnRuleColor)` | `var(--component-${Component}-${Token}-columnRuleStyle)` | `var(--component-${Component}-${Token}-columnRuleWidth)` | `var(--component-${Component}-${Token}-columnSpan)` | `var(--component-${Component}-${Token}-columnWidth)` | `var(--component-${Component}-${Token}-contain)` | `var(--component-${Component}-${Token}-content)` | `var(--component-${Component}-${Token}-contentVisibility)` | `var(--component-${Component}-${Token}-counterIncrement)` | `var(--component-${Component}-${Token}-counterReset)` | `var(--component-${Component}-${Token}-counterSet)` | `var(--component-${Component}-${Token}-cursor)` | `var(--component-${Component}-${Token}-direction)` | `var(--component-${Component}-${Token}-display)` | `var(--component-${Component}-${Token}-emptyCells)` | `var(--component-${Component}-${Token}-filter)` | `var(--component-${Component}-${Token}-flexBasis)` | `var(--component-${Component}-${Token}-flexDirection)` | `var(--component-${Component}-${Token}-flexGrow)` | `var(--component-${Component}-${Token}-flexShrink)` | `var(--component-${Component}-${Token}-flexWrap)` | `var(--component-${Component}-${Token}-float)` | `var(--component-${Component}-${Token}-fontFamily)` | `var(--component-${Component}-${Token}-fontFeatureSettings)` | `var(--component-${Component}-${Token}-fontKerning)` | `var(--component-${Component}-${Token}-fontLanguageOverride)` | `var(--component-${Component}-${Token}-fontOpticalSizing)` | `var(--component-${Component}-${Token}-fontSize)` | `var(--component-${Component}-${Token}-fontSizeAdjust)` | `var(--component-${Component}-${Token}-fontSmooth)` | `var(--component-${Component}-${Token}-fontStretch)` | `var(--component-${Component}-${Token}-fontStyle)` | `var(--component-${Component}-${Token}-fontSynthesis)` | `var(--component-${Component}-${Token}-fontVariant)` | `var(--component-${Component}-${Token}-fontVariantAlternates)` | `var(--component-${Component}-${Token}-fontVariantCaps)` | `var(--component-${Component}-${Token}-fontVariantEastAsian)` | `var(--component-${Component}-${Token}-fontVariantLigatures)` | `var(--component-${Component}-${Token}-fontVariantNumeric)` | `var(--component-${Component}-${Token}-fontVariantPosition)` | `var(--component-${Component}-${Token}-fontVariationSettings)` | `var(--component-${Component}-${Token}-fontWeight)` | `var(--component-${Component}-${Token}-forcedColorAdjust)` | `var(--component-${Component}-${Token}-gridAutoColumns)` | `var(--component-${Component}-${Token}-gridAutoFlow)` | `var(--component-${Component}-${Token}-gridAutoRows)` | `var(--component-${Component}-${Token}-gridColumnEnd)` | `var(--component-${Component}-${Token}-gridColumnStart)` | `var(--component-${Component}-${Token}-gridRowEnd)` | `var(--component-${Component}-${Token}-gridRowStart)` | `var(--component-${Component}-${Token}-gridTemplateAreas)` | `var(--component-${Component}-${Token}-gridTemplateColumns)` | `var(--component-${Component}-${Token}-gridTemplateRows)` | `var(--component-${Component}-${Token}-hangingPunctuation)` | `var(--component-${Component}-${Token}-hyphenateCharacter)` | `var(--component-${Component}-${Token}-hyphens)` | `var(--component-${Component}-${Token}-imageOrientation)` | `var(--component-${Component}-${Token}-imageRendering)` | `var(--component-${Component}-${Token}-imageResolution)` | `var(--component-${Component}-${Token}-initialLetter)` | `var(--component-${Component}-${Token}-inlineSize)` | `var(--component-${Component}-${Token}-inputSecurity)` | `var(--component-${Component}-${Token}-insetBlock)` | `var(--component-${Component}-${Token}-insetBlockEnd)` | `var(--component-${Component}-${Token}-insetBlockStart)` | `var(--component-${Component}-${Token}-insetInline)` | `var(--component-${Component}-${Token}-insetInlineEnd)` | `var(--component-${Component}-${Token}-insetInlineStart)` | `var(--component-${Component}-${Token}-isolation)` | `var(--component-${Component}-${Token}-justifyContent)` | `var(--component-${Component}-${Token}-justifyItems)` | `var(--component-${Component}-${Token}-justifySelf)` | `var(--component-${Component}-${Token}-justifyTracks)` | `var(--component-${Component}-${Token}-left)` | `var(--component-${Component}-${Token}-letterSpacing)` | `var(--component-${Component}-${Token}-lineBreak)` | `var(--component-${Component}-${Token}-lineHeight)` | `var(--component-${Component}-${Token}-lineHeightStep)` | `var(--component-${Component}-${Token}-listStyleImage)` | `var(--component-${Component}-${Token}-listStylePosition)` | `var(--component-${Component}-${Token}-listStyleType)` | `var(--component-${Component}-${Token}-marginBlock)` | `var(--component-${Component}-${Token}-marginBlockEnd)` | `var(--component-${Component}-${Token}-marginBlockStart)` | `var(--component-${Component}-${Token}-marginBottom)` | `var(--component-${Component}-${Token}-marginInline)` | `var(--component-${Component}-${Token}-marginInlineEnd)` | `var(--component-${Component}-${Token}-marginInlineStart)` | `var(--component-${Component}-${Token}-marginLeft)` | `var(--component-${Component}-${Token}-marginRight)` | `var(--component-${Component}-${Token}-marginTop)` | `var(--component-${Component}-${Token}-maskBorderMode)` | `var(--component-${Component}-${Token}-maskBorderOutset)` | `var(--component-${Component}-${Token}-maskBorderRepeat)` | `var(--component-${Component}-${Token}-maskBorderSlice)` | `var(--component-${Component}-${Token}-maskBorderSource)` | `var(--component-${Component}-${Token}-maskBorderWidth)` | `var(--component-${Component}-${Token}-maskClip)` | `var(--component-${Component}-${Token}-maskComposite)` | `var(--component-${Component}-${Token}-maskImage)` | `var(--component-${Component}-${Token}-maskMode)` | `var(--component-${Component}-${Token}-maskOrigin)` | `var(--component-${Component}-${Token}-maskPosition)` | `var(--component-${Component}-${Token}-maskRepeat)` | `var(--component-${Component}-${Token}-maskSize)` | `var(--component-${Component}-${Token}-maskType)` | `var(--component-${Component}-${Token}-mathDepth)` | `var(--component-${Component}-${Token}-mathShift)` | `var(--component-${Component}-${Token}-mathStyle)` | `var(--component-${Component}-${Token}-maxBlockSize)` | `var(--component-${Component}-${Token}-maxHeight)` | `var(--component-${Component}-${Token}-maxInlineSize)` | `var(--component-${Component}-${Token}-maxLines)` | `var(--component-${Component}-${Token}-maxWidth)` | `var(--component-${Component}-${Token}-minBlockSize)` | `var(--component-${Component}-${Token}-minHeight)` | `var(--component-${Component}-${Token}-minInlineSize)` | `var(--component-${Component}-${Token}-minWidth)` | `var(--component-${Component}-${Token}-mixBlendMode)` | `var(--component-${Component}-${Token}-motionDistance)` | `var(--component-${Component}-${Token}-motionPath)` | `var(--component-${Component}-${Token}-motionRotation)` | `var(--component-${Component}-${Token}-objectFit)` | `var(--component-${Component}-${Token}-objectPosition)` | `var(--component-${Component}-${Token}-offsetAnchor)` | `var(--component-${Component}-${Token}-offsetDistance)` | `var(--component-${Component}-${Token}-offsetPath)` | `var(--component-${Component}-${Token}-offsetRotate)` | `var(--component-${Component}-${Token}-offsetRotation)` | `var(--component-${Component}-${Token}-opacity)` | `var(--component-${Component}-${Token}-order)` | `var(--component-${Component}-${Token}-orphans)` | `var(--component-${Component}-${Token}-outlineColor)` | `var(--component-${Component}-${Token}-outlineOffset)` | `var(--component-${Component}-${Token}-outlineStyle)` | `var(--component-${Component}-${Token}-outlineWidth)` | `var(--component-${Component}-${Token}-overflowAnchor)` | `var(--component-${Component}-${Token}-overflowBlock)` | `var(--component-${Component}-${Token}-overflowClipBox)` | `var(--component-${Component}-${Token}-overflowClipMargin)` | `var(--component-${Component}-${Token}-overflowInline)` | `var(--component-${Component}-${Token}-overflowWrap)` | `var(--component-${Component}-${Token}-overflowX)` | `var(--component-${Component}-${Token}-overflowY)` | `var(--component-${Component}-${Token}-overscrollBehaviorBlock)` | `var(--component-${Component}-${Token}-overscrollBehaviorInline)` | `var(--component-${Component}-${Token}-overscrollBehaviorX)` | `var(--component-${Component}-${Token}-overscrollBehaviorY)` | `var(--component-${Component}-${Token}-paddingBlock)` | `var(--component-${Component}-${Token}-paddingBlockEnd)` | `var(--component-${Component}-${Token}-paddingBlockStart)` | `var(--component-${Component}-${Token}-paddingBottom)` | `var(--component-${Component}-${Token}-paddingInline)` | `var(--component-${Component}-${Token}-paddingInlineEnd)` | `var(--component-${Component}-${Token}-paddingInlineStart)` | `var(--component-${Component}-${Token}-paddingLeft)` | `var(--component-${Component}-${Token}-paddingRight)` | `var(--component-${Component}-${Token}-paddingTop)` | `var(--component-${Component}-${Token}-pageBreakAfter)` | `var(--component-${Component}-${Token}-pageBreakBefore)` | `var(--component-${Component}-${Token}-pageBreakInside)` | `var(--component-${Component}-${Token}-paintOrder)` | `var(--component-${Component}-${Token}-perspective)` | `var(--component-${Component}-${Token}-perspectiveOrigin)` | `var(--component-${Component}-${Token}-placeContent)` | `var(--component-${Component}-${Token}-pointerEvents)` | `var(--component-${Component}-${Token}-position)` | `var(--component-${Component}-${Token}-printColorAdjust)` | `var(--component-${Component}-${Token}-quotes)` | `var(--component-${Component}-${Token}-resize)` | `var(--component-${Component}-${Token}-right)` | `var(--component-${Component}-${Token}-rotate)` | `var(--component-${Component}-${Token}-rowGap)` | `var(--component-${Component}-${Token}-rubyAlign)` | `var(--component-${Component}-${Token}-rubyMerge)` | `var(--component-${Component}-${Token}-rubyPosition)` | `var(--component-${Component}-${Token}-scale)` | `var(--component-${Component}-${Token}-scrollBehavior)` | `var(--component-${Component}-${Token}-scrollMargin)` | `var(--component-${Component}-${Token}-scrollMarginBlock)` | `var(--component-${Component}-${Token}-scrollMarginBlockEnd)` | `var(--component-${Component}-${Token}-scrollMarginBlockStart)` | `var(--component-${Component}-${Token}-scrollMarginBottom)` | `var(--component-${Component}-${Token}-scrollMarginInline)` | `var(--component-${Component}-${Token}-scrollMarginInlineEnd)` | `var(--component-${Component}-${Token}-scrollMarginInlineStart)` | `var(--component-${Component}-${Token}-scrollMarginLeft)` | `var(--component-${Component}-${Token}-scrollMarginRight)` | `var(--component-${Component}-${Token}-scrollMarginTop)` | `var(--component-${Component}-${Token}-scrollPadding)` | `var(--component-${Component}-${Token}-scrollPaddingBlock)` | `var(--component-${Component}-${Token}-scrollPaddingBlockEnd)` | `var(--component-${Component}-${Token}-scrollPaddingBlockStart)` | `var(--component-${Component}-${Token}-scrollPaddingBottom)` | `var(--component-${Component}-${Token}-scrollPaddingInline)` | `var(--component-${Component}-${Token}-scrollPaddingInlineEnd)` | `var(--component-${Component}-${Token}-scrollPaddingInlineStart)` | `var(--component-${Component}-${Token}-scrollPaddingLeft)` | `var(--component-${Component}-${Token}-scrollPaddingRight)` | `var(--component-${Component}-${Token}-scrollPaddingTop)` | `var(--component-${Component}-${Token}-scrollSnapAlign)` | `var(--component-${Component}-${Token}-scrollSnapMargin)` | `var(--component-${Component}-${Token}-scrollSnapMarginBottom)` | `var(--component-${Component}-${Token}-scrollSnapMarginLeft)` | `var(--component-${Component}-${Token}-scrollSnapMarginRight)` | `var(--component-${Component}-${Token}-scrollSnapMarginTop)` | `var(--component-${Component}-${Token}-scrollSnapStop)` | `var(--component-${Component}-${Token}-scrollSnapType)` | `var(--component-${Component}-${Token}-scrollbarColor)` | `var(--component-${Component}-${Token}-scrollbarGutter)` | `var(--component-${Component}-${Token}-scrollbarWidth)` | `var(--component-${Component}-${Token}-shapeImageThreshold)` | `var(--component-${Component}-${Token}-shapeMargin)` | `var(--component-${Component}-${Token}-shapeOutside)` | `var(--component-${Component}-${Token}-tabSize)` | `var(--component-${Component}-${Token}-tableLayout)` | `var(--component-${Component}-${Token}-textAlign)` | `var(--component-${Component}-${Token}-textAlignLast)` | `var(--component-${Component}-${Token}-textCombineUpright)` | `var(--component-${Component}-${Token}-textDecorationColor)` | `var(--component-${Component}-${Token}-textDecorationLine)` | `var(--component-${Component}-${Token}-textDecorationSkip)` | `var(--component-${Component}-${Token}-textDecorationSkipInk)` | `var(--component-${Component}-${Token}-textDecorationStyle)` | `var(--component-${Component}-${Token}-textDecorationThickness)` | `var(--component-${Component}-${Token}-textEmphasisColor)` | `var(--component-${Component}-${Token}-textEmphasisPosition)` | `var(--component-${Component}-${Token}-textEmphasisStyle)` | `var(--component-${Component}-${Token}-textIndent)` | `var(--component-${Component}-${Token}-textJustify)` | `var(--component-${Component}-${Token}-textOrientation)` | `var(--component-${Component}-${Token}-textOverflow)` | `var(--component-${Component}-${Token}-textRendering)` | `var(--component-${Component}-${Token}-textShadow)` | `var(--component-${Component}-${Token}-textSizeAdjust)` | `var(--component-${Component}-${Token}-textTransform)` | `var(--component-${Component}-${Token}-textUnderlineOffset)` | `var(--component-${Component}-${Token}-textUnderlinePosition)` | `var(--component-${Component}-${Token}-top)` | `var(--component-${Component}-${Token}-touchAction)` | `var(--component-${Component}-${Token}-transform)` | `var(--component-${Component}-${Token}-transformBox)` | `var(--component-${Component}-${Token}-transformOrigin)` | `var(--component-${Component}-${Token}-transformStyle)` | `var(--component-${Component}-${Token}-transitionDelay)` | `var(--component-${Component}-${Token}-transitionDuration)` | `var(--component-${Component}-${Token}-transitionProperty)` | `var(--component-${Component}-${Token}-transitionTimingFunction)` | `var(--component-${Component}-${Token}-translate)` | `var(--component-${Component}-${Token}-unicodeBidi)` | `var(--component-${Component}-${Token}-userSelect)` | `var(--component-${Component}-${Token}-verticalAlign)` | `var(--component-${Component}-${Token}-visibility)` | `var(--component-${Component}-${Token}-whiteSpace)` | `var(--component-${Component}-${Token}-widows)` | `var(--component-${Component}-${Token}-willChange)` | `var(--component-${Component}-${Token}-wordBreak)` | `var(--component-${Component}-${Token}-wordSpacing)` | `var(--component-${Component}-${Token}-wordWrap)` | `var(--component-${Component}-${Token}-writingMode)` | `var(--component-${Component}-${Token}-zIndex)` | `var(--component-${Component}-${Token}-zoom)` | `var(--component-${Component}-${Token}-all)` | `var(--component-${Component}-${Token}-animation)` | `var(--component-${Component}-${Token}-backgroundPosition)` | `var(--component-${Component}-${Token}-borderBlock)` | `var(--component-${Component}-${Token}-borderBlockEnd)` | `var(--component-${Component}-${Token}-borderBlockStart)` | `var(--component-${Component}-${Token}-borderBottom)` | `var(--component-${Component}-${Token}-borderColor)` | `var(--component-${Component}-${Token}-borderImage)` | `var(--component-${Component}-${Token}-borderInline)` | `var(--component-${Component}-${Token}-borderInlineEnd)` | `var(--component-${Component}-${Token}-borderInlineStart)` | `var(--component-${Component}-${Token}-borderLeft)` | `var(--component-${Component}-${Token}-borderRadius)` | `var(--component-${Component}-${Token}-borderRight)` | `var(--component-${Component}-${Token}-borderStyle)` | `var(--component-${Component}-${Token}-borderTop)` | `var(--component-${Component}-${Token}-borderWidth)` | `var(--component-${Component}-${Token}-columnRule)` | `var(--component-${Component}-${Token}-columns)` | `var(--component-${Component}-${Token}-flex)` | `var(--component-${Component}-${Token}-flexFlow)` | `var(--component-${Component}-${Token}-font)` | `var(--component-${Component}-${Token}-gap)` | `var(--component-${Component}-${Token}-grid)` | `var(--component-${Component}-${Token}-gridArea)` | `var(--component-${Component}-${Token}-gridColumn)` | `var(--component-${Component}-${Token}-gridRow)` | `var(--component-${Component}-${Token}-gridTemplate)` | `var(--component-${Component}-${Token}-lineClamp)` | `var(--component-${Component}-${Token}-listStyle)` | `var(--component-${Component}-${Token}-margin)` | `var(--component-${Component}-${Token}-mask)` | `var(--component-${Component}-${Token}-maskBorder)` | `var(--component-${Component}-${Token}-motion)` | `var(--component-${Component}-${Token}-offset)` | `var(--component-${Component}-${Token}-outline)` | `var(--component-${Component}-${Token}-overflow)` | `var(--component-${Component}-${Token}-overscrollBehavior)` | `var(--component-${Component}-${Token}-padding)` | `var(--component-${Component}-${Token}-placeItems)` | `var(--component-${Component}-${Token}-placeSelf)` | `var(--component-${Component}-${Token}-textDecoration)` | `var(--component-${Component}-${Token}-textEmphasis)` | `var(--component-${Component}-${Token}-transition)` | `var(--component-${Component}-${Token}-MozAnimationDelay)` | `var(--component-${Component}-${Token}-MozAnimationDirection)` | `var(--component-${Component}-${Token}-MozAnimationDuration)` | `var(--component-${Component}-${Token}-MozAnimationFillMode)` | `var(--component-${Component}-${Token}-MozAnimationIterationCount)` | `var(--component-${Component}-${Token}-MozAnimationName)` | `var(--component-${Component}-${Token}-MozAnimationPlayState)` | `var(--component-${Component}-${Token}-MozAnimationTimingFunction)` | `var(--component-${Component}-${Token}-MozAppearance)` | `var(--component-${Component}-${Token}-MozBackfaceVisibility)` | `var(--component-${Component}-${Token}-MozBorderBottomColors)` | `var(--component-${Component}-${Token}-MozBorderEndColor)` | `var(--component-${Component}-${Token}-MozBorderEndStyle)` | `var(--component-${Component}-${Token}-MozBorderEndWidth)` | `var(--component-${Component}-${Token}-MozBorderLeftColors)` | `var(--component-${Component}-${Token}-MozBorderRightColors)` | `var(--component-${Component}-${Token}-MozBorderStartColor)` | `var(--component-${Component}-${Token}-MozBorderStartStyle)` | `var(--component-${Component}-${Token}-MozBorderTopColors)` | `var(--component-${Component}-${Token}-MozBoxSizing)` | `var(--component-${Component}-${Token}-MozColumnCount)` | `var(--component-${Component}-${Token}-MozColumnFill)` | `var(--component-${Component}-${Token}-MozColumnRuleColor)` | `var(--component-${Component}-${Token}-MozColumnRuleStyle)` | `var(--component-${Component}-${Token}-MozColumnRuleWidth)` | `var(--component-${Component}-${Token}-MozColumnWidth)` | `var(--component-${Component}-${Token}-MozContextProperties)` | `var(--component-${Component}-${Token}-MozFontFeatureSettings)` | `var(--component-${Component}-${Token}-MozFontLanguageOverride)` | `var(--component-${Component}-${Token}-MozHyphens)` | `var(--component-${Component}-${Token}-MozImageRegion)` | `var(--component-${Component}-${Token}-MozMarginEnd)` | `var(--component-${Component}-${Token}-MozMarginStart)` | `var(--component-${Component}-${Token}-MozOrient)` | `var(--component-${Component}-${Token}-MozOsxFontSmoothing)` | `var(--component-${Component}-${Token}-MozPaddingEnd)` | `var(--component-${Component}-${Token}-MozPaddingStart)` | `var(--component-${Component}-${Token}-MozPerspective)` | `var(--component-${Component}-${Token}-MozPerspectiveOrigin)` | `var(--component-${Component}-${Token}-MozStackSizing)` | `var(--component-${Component}-${Token}-MozTabSize)` | `var(--component-${Component}-${Token}-MozTextBlink)` | `var(--component-${Component}-${Token}-MozTextSizeAdjust)` | `var(--component-${Component}-${Token}-MozTransformOrigin)` | `var(--component-${Component}-${Token}-MozTransformStyle)` | `var(--component-${Component}-${Token}-MozTransitionDelay)` | `var(--component-${Component}-${Token}-MozTransitionDuration)` | `var(--component-${Component}-${Token}-MozTransitionProperty)` | `var(--component-${Component}-${Token}-MozTransitionTimingFunction)` | `var(--component-${Component}-${Token}-MozUserFocus)` | `var(--component-${Component}-${Token}-MozUserModify)` | `var(--component-${Component}-${Token}-MozUserSelect)` | `var(--component-${Component}-${Token}-MozWindowDragging)` | `var(--component-${Component}-${Token}-MozWindowShadow)` | `var(--component-${Component}-${Token}-msAccelerator)` | `var(--component-${Component}-${Token}-msBlockProgression)` | `var(--component-${Component}-${Token}-msContentZoomChaining)` | `var(--component-${Component}-${Token}-msContentZoomLimitMax)` | `var(--component-${Component}-${Token}-msContentZoomLimitMin)` | `var(--component-${Component}-${Token}-msContentZoomSnapPoints)` | `var(--component-${Component}-${Token}-msContentZoomSnapType)` | `var(--component-${Component}-${Token}-msContentZooming)` | `var(--component-${Component}-${Token}-msFilter)` | `var(--component-${Component}-${Token}-msFlexDirection)` | `var(--component-${Component}-${Token}-msFlexPositive)` | `var(--component-${Component}-${Token}-msFlowFrom)` | `var(--component-${Component}-${Token}-msFlowInto)` | `var(--component-${Component}-${Token}-msGridColumns)` | `var(--component-${Component}-${Token}-msGridRows)` | `var(--component-${Component}-${Token}-msHighContrastAdjust)` | `var(--component-${Component}-${Token}-msHyphenateLimitChars)` | `var(--component-${Component}-${Token}-msHyphenateLimitLines)` | `var(--component-${Component}-${Token}-msHyphenateLimitZone)` | `var(--component-${Component}-${Token}-msHyphens)` | `var(--component-${Component}-${Token}-msImeAlign)` | `var(--component-${Component}-${Token}-msLineBreak)` | `var(--component-${Component}-${Token}-msOrder)` | `var(--component-${Component}-${Token}-msOverflowStyle)` | `var(--component-${Component}-${Token}-msOverflowX)` | `var(--component-${Component}-${Token}-msOverflowY)` | `var(--component-${Component}-${Token}-msScrollChaining)` | `var(--component-${Component}-${Token}-msScrollLimitXMax)` | `var(--component-${Component}-${Token}-msScrollLimitXMin)` | `var(--component-${Component}-${Token}-msScrollLimitYMax)` | `var(--component-${Component}-${Token}-msScrollLimitYMin)` | `var(--component-${Component}-${Token}-msScrollRails)` | `var(--component-${Component}-${Token}-msScrollSnapPointsX)` | `var(--component-${Component}-${Token}-msScrollSnapPointsY)` | `var(--component-${Component}-${Token}-msScrollSnapType)` | `var(--component-${Component}-${Token}-msScrollTranslation)` | `var(--component-${Component}-${Token}-msScrollbar3dlightColor)` | `var(--component-${Component}-${Token}-msScrollbarArrowColor)` | `var(--component-${Component}-${Token}-msScrollbarBaseColor)` | `var(--component-${Component}-${Token}-msScrollbarDarkshadowColor)` | `var(--component-${Component}-${Token}-msScrollbarFaceColor)` | `var(--component-${Component}-${Token}-msScrollbarHighlightColor)` | `var(--component-${Component}-${Token}-msScrollbarShadowColor)` | `var(--component-${Component}-${Token}-msScrollbarTrackColor)` | `var(--component-${Component}-${Token}-msTextAutospace)` | `var(--component-${Component}-${Token}-msTextCombineHorizontal)` | `var(--component-${Component}-${Token}-msTextOverflow)` | `var(--component-${Component}-${Token}-msTouchAction)` | `var(--component-${Component}-${Token}-msTouchSelect)` | `var(--component-${Component}-${Token}-msTransform)` | `var(--component-${Component}-${Token}-msTransformOrigin)` | `var(--component-${Component}-${Token}-msTransitionDelay)` | `var(--component-${Component}-${Token}-msTransitionDuration)` | `var(--component-${Component}-${Token}-msTransitionProperty)` | `var(--component-${Component}-${Token}-msTransitionTimingFunction)` | `var(--component-${Component}-${Token}-msUserSelect)` | `var(--component-${Component}-${Token}-msWordBreak)` | `var(--component-${Component}-${Token}-msWrapFlow)` | `var(--component-${Component}-${Token}-msWrapMargin)` | `var(--component-${Component}-${Token}-msWrapThrough)` | `var(--component-${Component}-${Token}-msWritingMode)` | `var(--component-${Component}-${Token}-WebkitAlignContent)` | `var(--component-${Component}-${Token}-WebkitAlignItems)` | `var(--component-${Component}-${Token}-WebkitAlignSelf)` | `var(--component-${Component}-${Token}-WebkitAnimationDelay)` | `var(--component-${Component}-${Token}-WebkitAnimationDirection)` | `var(--component-${Component}-${Token}-WebkitAnimationDuration)` | `var(--component-${Component}-${Token}-WebkitAnimationFillMode)` | `var(--component-${Component}-${Token}-WebkitAnimationIterationCount)` | `var(--component-${Component}-${Token}-WebkitAnimationName)` | `var(--component-${Component}-${Token}-WebkitAnimationPlayState)` | `var(--component-${Component}-${Token}-WebkitAnimationTimingFunction)` | `var(--component-${Component}-${Token}-WebkitAppearance)` | `var(--component-${Component}-${Token}-WebkitBackdropFilter)` | `var(--component-${Component}-${Token}-WebkitBackfaceVisibility)` | `var(--component-${Component}-${Token}-WebkitBackgroundClip)` | `var(--component-${Component}-${Token}-WebkitBackgroundOrigin)` | `var(--component-${Component}-${Token}-WebkitBackgroundSize)` | `var(--component-${Component}-${Token}-WebkitBorderBeforeColor)` | `var(--component-${Component}-${Token}-WebkitBorderBeforeStyle)` | `var(--component-${Component}-${Token}-WebkitBorderBeforeWidth)` | `var(--component-${Component}-${Token}-WebkitBorderBottomLeftRadius)` | `var(--component-${Component}-${Token}-WebkitBorderBottomRightRadius)` | `var(--component-${Component}-${Token}-WebkitBorderImageSlice)` | `var(--component-${Component}-${Token}-WebkitBorderTopLeftRadius)` | `var(--component-${Component}-${Token}-WebkitBorderTopRightRadius)` | `var(--component-${Component}-${Token}-WebkitBoxDecorationBreak)` | `var(--component-${Component}-${Token}-WebkitBoxReflect)` | `var(--component-${Component}-${Token}-WebkitBoxShadow)` | `var(--component-${Component}-${Token}-WebkitBoxSizing)` | `var(--component-${Component}-${Token}-WebkitClipPath)` | `var(--component-${Component}-${Token}-WebkitColumnCount)` | `var(--component-${Component}-${Token}-WebkitColumnFill)` | `var(--component-${Component}-${Token}-WebkitColumnRuleColor)` | `var(--component-${Component}-${Token}-WebkitColumnRuleStyle)` | `var(--component-${Component}-${Token}-WebkitColumnRuleWidth)` | `var(--component-${Component}-${Token}-WebkitColumnSpan)` | `var(--component-${Component}-${Token}-WebkitColumnWidth)` | `var(--component-${Component}-${Token}-WebkitFilter)` | `var(--component-${Component}-${Token}-WebkitFlexBasis)` | `var(--component-${Component}-${Token}-WebkitFlexDirection)` | `var(--component-${Component}-${Token}-WebkitFlexGrow)` | `var(--component-${Component}-${Token}-WebkitFlexShrink)` | `var(--component-${Component}-${Token}-WebkitFlexWrap)` | `var(--component-${Component}-${Token}-WebkitFontFeatureSettings)` | `var(--component-${Component}-${Token}-WebkitFontKerning)` | `var(--component-${Component}-${Token}-WebkitFontSmoothing)` | `var(--component-${Component}-${Token}-WebkitFontVariantLigatures)` | `var(--component-${Component}-${Token}-WebkitHyphenateCharacter)` | `var(--component-${Component}-${Token}-WebkitHyphens)` | `var(--component-${Component}-${Token}-WebkitInitialLetter)` | `var(--component-${Component}-${Token}-WebkitJustifyContent)` | `var(--component-${Component}-${Token}-WebkitLineBreak)` | `var(--component-${Component}-${Token}-WebkitLineClamp)` | `var(--component-${Component}-${Token}-WebkitMarginEnd)` | `var(--component-${Component}-${Token}-WebkitMarginStart)` | `var(--component-${Component}-${Token}-WebkitMaskAttachment)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageOutset)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageRepeat)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageSlice)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageSource)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImageWidth)` | `var(--component-${Component}-${Token}-WebkitMaskClip)` | `var(--component-${Component}-${Token}-WebkitMaskComposite)` | `var(--component-${Component}-${Token}-WebkitMaskImage)` | `var(--component-${Component}-${Token}-WebkitMaskOrigin)` | `var(--component-${Component}-${Token}-WebkitMaskPosition)` | `var(--component-${Component}-${Token}-WebkitMaskPositionX)` | `var(--component-${Component}-${Token}-WebkitMaskPositionY)` | `var(--component-${Component}-${Token}-WebkitMaskRepeat)` | `var(--component-${Component}-${Token}-WebkitMaskRepeatX)` | `var(--component-${Component}-${Token}-WebkitMaskRepeatY)` | `var(--component-${Component}-${Token}-WebkitMaskSize)` | `var(--component-${Component}-${Token}-WebkitMaxInlineSize)` | `var(--component-${Component}-${Token}-WebkitOrder)` | `var(--component-${Component}-${Token}-WebkitOverflowScrolling)` | `var(--component-${Component}-${Token}-WebkitPaddingEnd)` | `var(--component-${Component}-${Token}-WebkitPaddingStart)` | `var(--component-${Component}-${Token}-WebkitPerspective)` | `var(--component-${Component}-${Token}-WebkitPerspectiveOrigin)` | `var(--component-${Component}-${Token}-WebkitPrintColorAdjust)` | `var(--component-${Component}-${Token}-WebkitRubyPosition)` | `var(--component-${Component}-${Token}-WebkitScrollSnapType)` | `var(--component-${Component}-${Token}-WebkitShapeMargin)` | `var(--component-${Component}-${Token}-WebkitTapHighlightColor)` | `var(--component-${Component}-${Token}-WebkitTextCombine)` | `var(--component-${Component}-${Token}-WebkitTextDecorationColor)` | `var(--component-${Component}-${Token}-WebkitTextDecorationLine)` | `var(--component-${Component}-${Token}-WebkitTextDecorationSkip)` | `var(--component-${Component}-${Token}-WebkitTextDecorationStyle)` | `var(--component-${Component}-${Token}-WebkitTextEmphasisColor)` | `var(--component-${Component}-${Token}-WebkitTextEmphasisPosition)` | `var(--component-${Component}-${Token}-WebkitTextEmphasisStyle)` | `var(--component-${Component}-${Token}-WebkitTextFillColor)` | `var(--component-${Component}-${Token}-WebkitTextOrientation)` | `var(--component-${Component}-${Token}-WebkitTextSizeAdjust)` | `var(--component-${Component}-${Token}-WebkitTextStrokeColor)` | `var(--component-${Component}-${Token}-WebkitTextStrokeWidth)` | `var(--component-${Component}-${Token}-WebkitTextUnderlinePosition)` | `var(--component-${Component}-${Token}-WebkitTouchCallout)` | `var(--component-${Component}-${Token}-WebkitTransform)` | `var(--component-${Component}-${Token}-WebkitTransformOrigin)` | `var(--component-${Component}-${Token}-WebkitTransformStyle)` | `var(--component-${Component}-${Token}-WebkitTransitionDelay)` | `var(--component-${Component}-${Token}-WebkitTransitionDuration)` | `var(--component-${Component}-${Token}-WebkitTransitionProperty)` | `var(--component-${Component}-${Token}-WebkitTransitionTimingFunction)` | `var(--component-${Component}-${Token}-WebkitUserModify)` | `var(--component-${Component}-${Token}-WebkitUserSelect)` | `var(--component-${Component}-${Token}-WebkitWritingMode)` | `var(--component-${Component}-${Token}-MozAnimation)` | `var(--component-${Component}-${Token}-MozBorderImage)` | `var(--component-${Component}-${Token}-MozColumnRule)` | `var(--component-${Component}-${Token}-MozColumns)` | `var(--component-${Component}-${Token}-MozTransition)` | `var(--component-${Component}-${Token}-msContentZoomLimit)` | `var(--component-${Component}-${Token}-msContentZoomSnap)` | `var(--component-${Component}-${Token}-msFlex)` | `var(--component-${Component}-${Token}-msScrollLimit)` | `var(--component-${Component}-${Token}-msScrollSnapX)` | `var(--component-${Component}-${Token}-msScrollSnapY)` | `var(--component-${Component}-${Token}-msTransition)` | `var(--component-${Component}-${Token}-WebkitAnimation)` | `var(--component-${Component}-${Token}-WebkitBorderBefore)` | `var(--component-${Component}-${Token}-WebkitBorderImage)` | `var(--component-${Component}-${Token}-WebkitBorderRadius)` | `var(--component-${Component}-${Token}-WebkitColumnRule)` | `var(--component-${Component}-${Token}-WebkitColumns)` | `var(--component-${Component}-${Token}-WebkitFlex)` | `var(--component-${Component}-${Token}-WebkitFlexFlow)` | `var(--component-${Component}-${Token}-WebkitMask)` | `var(--component-${Component}-${Token}-WebkitMaskBoxImage)` | `var(--component-${Component}-${Token}-WebkitTextEmphasis)` | `var(--component-${Component}-${Token}-WebkitTextStroke)` | `var(--component-${Component}-${Token}-WebkitTransition)` | `var(--component-${Component}-${Token}-azimuth)` | `var(--component-${Component}-${Token}-boxAlign)` | `var(--component-${Component}-${Token}-boxDirection)` | `var(--component-${Component}-${Token}-boxFlex)` | `var(--component-${Component}-${Token}-boxFlexGroup)` | `var(--component-${Component}-${Token}-boxLines)` | `var(--component-${Component}-${Token}-boxOrdinalGroup)` | `var(--component-${Component}-${Token}-boxOrient)` | `var(--component-${Component}-${Token}-boxPack)` | `var(--component-${Component}-${Token}-clip)` | `var(--component-${Component}-${Token}-gridColumnGap)` | `var(--component-${Component}-${Token}-gridGap)` | `var(--component-${Component}-${Token}-gridRowGap)` | `var(--component-${Component}-${Token}-imeMode)` | `var(--component-${Component}-${Token}-offsetBlock)` | `var(--component-${Component}-${Token}-offsetBlockEnd)` | `var(--component-${Component}-${Token}-offsetBlockStart)` | `var(--component-${Component}-${Token}-offsetInline)` | `var(--component-${Component}-${Token}-offsetInlineEnd)` | `var(--component-${Component}-${Token}-offsetInlineStart)` | `var(--component-${Component}-${Token}-scrollSnapCoordinate)` | `var(--component-${Component}-${Token}-scrollSnapDestination)` | `var(--component-${Component}-${Token}-scrollSnapPointsX)` | `var(--component-${Component}-${Token}-scrollSnapPointsY)` | `var(--component-${Component}-${Token}-scrollSnapTypeX)` | `var(--component-${Component}-${Token}-scrollSnapTypeY)` | `var(--component-${Component}-${Token}-KhtmlBoxAlign)` | `var(--component-${Component}-${Token}-KhtmlBoxDirection)` | `var(--component-${Component}-${Token}-KhtmlBoxFlex)` | `var(--component-${Component}-${Token}-KhtmlBoxFlexGroup)` | `var(--component-${Component}-${Token}-KhtmlBoxLines)` | `var(--component-${Component}-${Token}-KhtmlBoxOrdinalGroup)` | `var(--component-${Component}-${Token}-KhtmlBoxOrient)` | `var(--component-${Component}-${Token}-KhtmlBoxPack)` | `var(--component-${Component}-${Token}-KhtmlLineBreak)` | `var(--component-${Component}-${Token}-KhtmlOpacity)` | `var(--component-${Component}-${Token}-KhtmlUserSelect)` | `var(--component-${Component}-${Token}-MozBackgroundClip)` | `var(--component-${Component}-${Token}-MozBackgroundInlinePolicy)` | `var(--component-${Component}-${Token}-MozBackgroundOrigin)` | `var(--component-${Component}-${Token}-MozBackgroundSize)` | `var(--component-${Component}-${Token}-MozBinding)` | `var(--component-${Component}-${Token}-MozBorderRadius)` | `var(--component-${Component}-${Token}-MozBorderRadiusBottomleft)` | `var(--component-${Component}-${Token}-MozBorderRadiusBottomright)` | `var(--component-${Component}-${Token}-MozBorderRadiusTopleft)` | `var(--component-${Component}-${Token}-MozBorderRadiusTopright)` | `var(--component-${Component}-${Token}-MozBoxAlign)` | `var(--component-${Component}-${Token}-MozBoxDirection)` | `var(--component-${Component}-${Token}-MozBoxFlex)` | `var(--component-${Component}-${Token}-MozBoxOrdinalGroup)` | `var(--component-${Component}-${Token}-MozBoxOrient)` | `var(--component-${Component}-${Token}-MozBoxPack)` | `var(--component-${Component}-${Token}-MozBoxShadow)` | `var(--component-${Component}-${Token}-MozFloatEdge)` | `var(--component-${Component}-${Token}-MozForceBrokenImageIcon)` | `var(--component-${Component}-${Token}-MozOpacity)` | `var(--component-${Component}-${Token}-MozOutline)` | `var(--component-${Component}-${Token}-MozOutlineColor)` | `var(--component-${Component}-${Token}-MozOutlineRadius)` | `var(--component-${Component}-${Token}-MozOutlineRadiusBottomleft)` | `var(--component-${Component}-${Token}-MozOutlineRadiusBottomright)` | `var(--component-${Component}-${Token}-MozOutlineRadiusTopleft)` | `var(--component-${Component}-${Token}-MozOutlineRadiusTopright)` | `var(--component-${Component}-${Token}-MozOutlineStyle)` | `var(--component-${Component}-${Token}-MozOutlineWidth)` | `var(--component-${Component}-${Token}-MozTextAlignLast)` | `var(--component-${Component}-${Token}-MozTextDecorationColor)` | `var(--component-${Component}-${Token}-MozTextDecorationLine)` | `var(--component-${Component}-${Token}-MozTextDecorationStyle)` | `var(--component-${Component}-${Token}-MozUserInput)` | `var(--component-${Component}-${Token}-msImeMode)` | `var(--component-${Component}-${Token}-OAnimation)` | `var(--component-${Component}-${Token}-OAnimationDelay)` | `var(--component-${Component}-${Token}-OAnimationDirection)` | `var(--component-${Component}-${Token}-OAnimationDuration)` | `var(--component-${Component}-${Token}-OAnimationFillMode)` | `var(--component-${Component}-${Token}-OAnimationIterationCount)` | `var(--component-${Component}-${Token}-OAnimationName)` | `var(--component-${Component}-${Token}-OAnimationPlayState)` | `var(--component-${Component}-${Token}-OAnimationTimingFunction)` | `var(--component-${Component}-${Token}-OBackgroundSize)` | `var(--component-${Component}-${Token}-OBorderImage)` | `var(--component-${Component}-${Token}-OObjectFit)` | `var(--component-${Component}-${Token}-OObjectPosition)` | `var(--component-${Component}-${Token}-OTabSize)` | `var(--component-${Component}-${Token}-OTextOverflow)` | `var(--component-${Component}-${Token}-OTransform)` | `var(--component-${Component}-${Token}-OTransformOrigin)` | `var(--component-${Component}-${Token}-OTransition)` | `var(--component-${Component}-${Token}-OTransitionDelay)` | `var(--component-${Component}-${Token}-OTransitionDuration)` | `var(--component-${Component}-${Token}-OTransitionProperty)` | `var(--component-${Component}-${Token}-OTransitionTimingFunction)` | `var(--component-${Component}-${Token}-WebkitBoxAlign)` | `var(--component-${Component}-${Token}-WebkitBoxDirection)` | `var(--component-${Component}-${Token}-WebkitBoxFlex)` | `var(--component-${Component}-${Token}-WebkitBoxFlexGroup)` | `var(--component-${Component}-${Token}-WebkitBoxLines)` | `var(--component-${Component}-${Token}-WebkitBoxOrdinalGroup)` | `var(--component-${Component}-${Token}-WebkitBoxOrient)` | `var(--component-${Component}-${Token}-WebkitBoxPack)` | `var(--component-${Component}-${Token}-WebkitScrollSnapPointsX)` | `var(--component-${Component}-${Token}-WebkitScrollSnapPointsY)` | `var(--component-${Component}-${Token}-alignmentBaseline)` | `var(--component-${Component}-${Token}-baselineShift)` | `var(--component-${Component}-${Token}-clipRule)` | `var(--component-${Component}-${Token}-colorInterpolation)` | `var(--component-${Component}-${Token}-colorRendering)` | `var(--component-${Component}-${Token}-dominantBaseline)` | `var(--component-${Component}-${Token}-fill)` | `var(--component-${Component}-${Token}-fillOpacity)` | `var(--component-${Component}-${Token}-fillRule)` | `var(--component-${Component}-${Token}-floodColor)` | `var(--component-${Component}-${Token}-floodOpacity)` | `var(--component-${Component}-${Token}-glyphOrientationVertical)` | `var(--component-${Component}-${Token}-lightingColor)` | `var(--component-${Component}-${Token}-marker)` | `var(--component-${Component}-${Token}-markerEnd)` | `var(--component-${Component}-${Token}-markerMid)` | `var(--component-${Component}-${Token}-markerStart)` | `var(--component-${Component}-${Token}-shapeRendering)` | `var(--component-${Component}-${Token}-stopColor)` | `var(--component-${Component}-${Token}-stopOpacity)` | `var(--component-${Component}-${Token}-stroke)` | `var(--component-${Component}-${Token}-strokeDasharray)` | `var(--component-${Component}-${Token}-strokeDashoffset)` | `var(--component-${Component}-${Token}-strokeLinecap)` | `var(--component-${Component}-${Token}-strokeLinejoin)` | `var(--component-${Component}-${Token}-strokeMiterlimit)` | `var(--component-${Component}-${Token}-strokeOpacity)` | `var(--component-${Component}-${Token}-strokeWidth)` | `var(--component-${Component}-${Token}-textAnchor)` | `var(--component-${Component}-${Token}-vectorEffect)`;
|
|
26
26
|
};
|
|
27
27
|
/**
|