@salutejs/sdds-dfa 0.321.0-canary.2199.17384366399.0 → 0.321.0-canary.2203.17433640523.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/Calendar/CalendarBase.config.js +12 -8
- package/components/Calendar/CalendarDouble.config.js +12 -8
- package/components/Chip/Chip.config.d.ts +1 -0
- package/components/Chip/Chip.config.js +35 -7
- package/components/Chip/Chip.d.ts +1 -0
- package/components/DatePicker/DatePicker.config.js +12 -8
- package/components/Tabs/TabItem.d.ts +47 -5
- package/components/Tabs/TabItem.js +63 -7
- package/components/Tabs/horizontal/HorizontalIconTabItem.config.d.ts +28 -0
- package/components/Tabs/horizontal/HorizontalIconTabItem.config.js +268 -0
- package/components/Tabs/horizontal/HorizontalTabItem.config.js +27 -18
- package/components/Tabs/index.d.ts +3 -2
- package/components/Tabs/index.js +3 -0
- package/components/Tabs/vertical/VerticalIconTabItem.config.d.ts +20 -0
- package/components/Tabs/vertical/VerticalIconTabItem.config.js +131 -0
- package/components/Tabs/vertical/VerticalTabItem.config.js +12 -8
- package/es/components/Calendar/CalendarBase.config.js +12 -8
- package/es/components/Calendar/CalendarDouble.config.js +12 -8
- package/es/components/Chip/Chip.config.js +35 -7
- package/es/components/DatePicker/DatePicker.config.js +12 -8
- package/es/components/Tabs/TabItem.js +53 -5
- package/es/components/Tabs/horizontal/HorizontalIconTabItem.config.js +258 -0
- package/es/components/Tabs/horizontal/HorizontalTabItem.config.js +27 -18
- package/es/components/Tabs/index.js +1 -1
- package/es/components/Tabs/vertical/VerticalIconTabItem.config.js +121 -0
- package/es/components/Tabs/vertical/VerticalTabItem.config.js +12 -8
- package/package.json +8 -8
|
@@ -1,16 +1,64 @@
|
|
|
1
|
+
function _define_property(obj, key, value) {
|
|
2
|
+
if (key in obj) {
|
|
3
|
+
Object.defineProperty(obj, key, {
|
|
4
|
+
value: value,
|
|
5
|
+
enumerable: true,
|
|
6
|
+
configurable: true,
|
|
7
|
+
writable: true
|
|
8
|
+
});
|
|
9
|
+
} else {
|
|
10
|
+
obj[key] = value;
|
|
11
|
+
}
|
|
12
|
+
return obj;
|
|
13
|
+
}
|
|
14
|
+
function _object_spread(target) {
|
|
15
|
+
for(var i = 1; i < arguments.length; i++){
|
|
16
|
+
var source = arguments[i] != null ? arguments[i] : {};
|
|
17
|
+
var ownKeys = Object.keys(source);
|
|
18
|
+
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
19
|
+
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
20
|
+
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
21
|
+
}));
|
|
22
|
+
}
|
|
23
|
+
ownKeys.forEach(function(key) {
|
|
24
|
+
_define_property(target, key, source[key]);
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
return target;
|
|
28
|
+
}
|
|
1
29
|
import React from 'react';
|
|
2
|
-
import { horizontalTabItemConfig, verticalTabItemConfig, component, mergeConfig } from '@salutejs/plasma-new-hope/styled-components';
|
|
30
|
+
import { horizontalTabItemConfig, horizontalIconTabItemConfig, verticalTabItemConfig, verticalIconTabItemConfig, component, mergeConfig, fixedForwardRef } from '@salutejs/plasma-new-hope/styled-components';
|
|
3
31
|
import { config as horizontalConfig } from './horizontal/HorizontalTabItem.config';
|
|
32
|
+
import { config as horizontalIconConfig } from './horizontal/HorizontalIconTabItem.config';
|
|
4
33
|
import { config as verticalConfig } from './vertical/VerticalTabItem.config';
|
|
34
|
+
import { config as verticalIconConfig } from './vertical/VerticalIconTabItem.config';
|
|
5
35
|
var mergedHorizontalTabItemConfig = mergeConfig(horizontalTabItemConfig, horizontalConfig);
|
|
6
36
|
var HorizontalTabItem = component(mergedHorizontalTabItemConfig);
|
|
37
|
+
var mergedHorizontalIconTabItemConfig = mergeConfig(horizontalIconTabItemConfig, horizontalIconConfig);
|
|
38
|
+
var HorizontalIconTabItem = component(mergedHorizontalIconTabItemConfig);
|
|
7
39
|
var mergedVerticalTabItemConfig = mergeConfig(verticalTabItemConfig, verticalConfig);
|
|
8
40
|
var VerticalTabItem = component(mergedVerticalTabItemConfig);
|
|
41
|
+
var mergedVerticalIconTabItemConfig = mergeConfig(verticalIconTabItemConfig, verticalIconConfig);
|
|
42
|
+
var VerticalIconTabItem = component(mergedVerticalIconTabItemConfig);
|
|
9
43
|
/**
|
|
10
44
|
* Элемент списка, недопустимо использовать вне компонента Tabs.
|
|
11
|
-
*/ export var TabItem = function(props) {
|
|
45
|
+
*/ export var TabItem = fixedForwardRef(function(props, ref) {
|
|
46
|
+
if (props.orientation === 'vertical') {
|
|
47
|
+
return /*#__PURE__*/ React.createElement(VerticalTabItem, _object_spread({
|
|
48
|
+
ref: ref
|
|
49
|
+
}, props));
|
|
50
|
+
}
|
|
51
|
+
return /*#__PURE__*/ React.createElement(HorizontalTabItem, _object_spread({
|
|
52
|
+
ref: ref
|
|
53
|
+
}, props));
|
|
54
|
+
});
|
|
55
|
+
export var IconTabItem = fixedForwardRef(function(props, ref) {
|
|
12
56
|
if (props.orientation === 'vertical') {
|
|
13
|
-
return /*#__PURE__*/ React.createElement(
|
|
57
|
+
return /*#__PURE__*/ React.createElement(VerticalIconTabItem, _object_spread({
|
|
58
|
+
ref: ref
|
|
59
|
+
}, props));
|
|
14
60
|
}
|
|
15
|
-
return /*#__PURE__*/ React.createElement(
|
|
16
|
-
|
|
61
|
+
return /*#__PURE__*/ React.createElement(HorizontalIconTabItem, _object_spread({
|
|
62
|
+
ref: ref
|
|
63
|
+
}, props));
|
|
64
|
+
});
|
|
@@ -0,0 +1,258 @@
|
|
|
1
|
+
function _tagged_template_literal(strings, raw) {
|
|
2
|
+
if (!raw) {
|
|
3
|
+
raw = strings.slice(0);
|
|
4
|
+
}
|
|
5
|
+
return Object.freeze(Object.defineProperties(strings, {
|
|
6
|
+
raw: {
|
|
7
|
+
value: Object.freeze(raw)
|
|
8
|
+
}
|
|
9
|
+
}));
|
|
10
|
+
}
|
|
11
|
+
function _templateObject() {
|
|
12
|
+
var data = _tagged_template_literal([
|
|
13
|
+
"\n ",
|
|
14
|
+
": var(--text-secondary);\n ",
|
|
15
|
+
": transparent;\n ",
|
|
16
|
+
": var(--text-secondary-hover);\n ",
|
|
17
|
+
": var(--text-secondary-active);\n ",
|
|
18
|
+
": transparent;\n ",
|
|
19
|
+
": var(--text-primary);\n ",
|
|
20
|
+
": transparent;\n ",
|
|
21
|
+
": var(--text-primary);\n ",
|
|
22
|
+
": transparent;\n ",
|
|
23
|
+
": background-color 0.3s ease-in-out;\n\n ",
|
|
24
|
+
": var(--surface-accent);\n\n ",
|
|
25
|
+
": 0;\n\n ",
|
|
26
|
+
": pointer;\n "
|
|
27
|
+
]);
|
|
28
|
+
_templateObject = function _templateObject() {
|
|
29
|
+
return data;
|
|
30
|
+
};
|
|
31
|
+
return data;
|
|
32
|
+
}
|
|
33
|
+
function _templateObject1() {
|
|
34
|
+
var data = _tagged_template_literal([
|
|
35
|
+
"\n ",
|
|
36
|
+
": var(--text-primary);\n ",
|
|
37
|
+
": transparent;\n ",
|
|
38
|
+
": var(--text-secondary-hover);\n ",
|
|
39
|
+
": var(--text-secondary-active);\n ",
|
|
40
|
+
": transparent;\n ",
|
|
41
|
+
": var(--text-primary);\n ",
|
|
42
|
+
": var(--surface-solid-card);\n ",
|
|
43
|
+
": var(--text-primary);\n ",
|
|
44
|
+
": var(--surface-solid-card);\n ",
|
|
45
|
+
": background-color 0.3s ease-in-out;\n\n ",
|
|
46
|
+
": 0.125rem;\n\n ",
|
|
47
|
+
": var(--surface-accent);\n\n ",
|
|
48
|
+
": 0;\n\n ",
|
|
49
|
+
": pointer;\n "
|
|
50
|
+
]);
|
|
51
|
+
_templateObject1 = function _templateObject() {
|
|
52
|
+
return data;
|
|
53
|
+
};
|
|
54
|
+
return data;
|
|
55
|
+
}
|
|
56
|
+
function _templateObject2() {
|
|
57
|
+
var data = _tagged_template_literal([
|
|
58
|
+
"\n ",
|
|
59
|
+
": var(--text-secondary);\n ",
|
|
60
|
+
": transparent;\n ",
|
|
61
|
+
": var(--text-secondary-hover);\n ",
|
|
62
|
+
": var(--text-secondary-active);\n ",
|
|
63
|
+
": transparent;\n ",
|
|
64
|
+
": var(--text-primary);\n ",
|
|
65
|
+
": transparent;\n ",
|
|
66
|
+
": var(--text-primary);\n ",
|
|
67
|
+
": transparent;\n ",
|
|
68
|
+
": background-color 0.3s ease-in-out;\n\n ",
|
|
69
|
+
": var(--surface-accent);\n\n ",
|
|
70
|
+
": 0.125rem;\n ",
|
|
71
|
+
": var(--text-primary);\n ",
|
|
72
|
+
": var(--text-primary);\n\n ",
|
|
73
|
+
": pointer;\n "
|
|
74
|
+
]);
|
|
75
|
+
_templateObject2 = function _templateObject() {
|
|
76
|
+
return data;
|
|
77
|
+
};
|
|
78
|
+
return data;
|
|
79
|
+
}
|
|
80
|
+
function _templateObject3() {
|
|
81
|
+
var data = _tagged_template_literal([
|
|
82
|
+
"\n ",
|
|
83
|
+
": var(--text-primary);\n ",
|
|
84
|
+
": transparent;\n ",
|
|
85
|
+
": var(--text-secondary-hover);\n ",
|
|
86
|
+
": var(--text-secondary-active);\n ",
|
|
87
|
+
": transparent;\n ",
|
|
88
|
+
": var(--inverse-text-primary);\n ",
|
|
89
|
+
": var(--surface-solid-default);\n ",
|
|
90
|
+
": var(--inverse-text-primary);\n ",
|
|
91
|
+
": var(--surface-solid-default);\n ",
|
|
92
|
+
": background-color 0.3s ease-in-out;\n\n ",
|
|
93
|
+
": 0.125rem;\n\n ",
|
|
94
|
+
": var(--surface-accent);\n\n ",
|
|
95
|
+
": 0;\n\n ",
|
|
96
|
+
": pointer;\n "
|
|
97
|
+
]);
|
|
98
|
+
_templateObject3 = function _templateObject() {
|
|
99
|
+
return data;
|
|
100
|
+
};
|
|
101
|
+
return data;
|
|
102
|
+
}
|
|
103
|
+
function _templateObject4() {
|
|
104
|
+
var data = _tagged_template_literal([
|
|
105
|
+
"\n ",
|
|
106
|
+
": 0.375rem;\n ",
|
|
107
|
+
": 0.5rem 0.625rem;\n ",
|
|
108
|
+
": 0.25rem;\n\n ",
|
|
109
|
+
": 0;\n "
|
|
110
|
+
]);
|
|
111
|
+
_templateObject4 = function _templateObject() {
|
|
112
|
+
return data;
|
|
113
|
+
};
|
|
114
|
+
return data;
|
|
115
|
+
}
|
|
116
|
+
function _templateObject5() {
|
|
117
|
+
var data = _tagged_template_literal([
|
|
118
|
+
"\n ",
|
|
119
|
+
": 0.5rem;\n ",
|
|
120
|
+
": 0.5rem 0.625rem;\n ",
|
|
121
|
+
": 0.25rem;\n\n ",
|
|
122
|
+
": 0.125rem;\n "
|
|
123
|
+
]);
|
|
124
|
+
_templateObject5 = function _templateObject() {
|
|
125
|
+
return data;
|
|
126
|
+
};
|
|
127
|
+
return data;
|
|
128
|
+
}
|
|
129
|
+
function _templateObject6() {
|
|
130
|
+
var data = _tagged_template_literal([
|
|
131
|
+
"\n ",
|
|
132
|
+
": 0.625rem;\n ",
|
|
133
|
+
": 0.75rem 0.875rem;\n ",
|
|
134
|
+
": 0.375rem;\n\n ",
|
|
135
|
+
": 0.25rem;\n "
|
|
136
|
+
]);
|
|
137
|
+
_templateObject6 = function _templateObject() {
|
|
138
|
+
return data;
|
|
139
|
+
};
|
|
140
|
+
return data;
|
|
141
|
+
}
|
|
142
|
+
function _templateObject7() {
|
|
143
|
+
var data = _tagged_template_literal([
|
|
144
|
+
"\n ",
|
|
145
|
+
": 0.75rem;\n ",
|
|
146
|
+
": 1rem 1.125rem;\n ",
|
|
147
|
+
": 0.5rem;\n\n ",
|
|
148
|
+
": 0.125rem;\n "
|
|
149
|
+
]);
|
|
150
|
+
_templateObject7 = function _templateObject() {
|
|
151
|
+
return data;
|
|
152
|
+
};
|
|
153
|
+
return data;
|
|
154
|
+
}
|
|
155
|
+
function _templateObject8() {
|
|
156
|
+
var data = _tagged_template_literal([
|
|
157
|
+
"\n ",
|
|
158
|
+
": 0.375rem;\n ",
|
|
159
|
+
": 0rem;\n ",
|
|
160
|
+
": 0.625rem;\n\n ",
|
|
161
|
+
": -0.125rem;\n "
|
|
162
|
+
]);
|
|
163
|
+
_templateObject8 = function _templateObject() {
|
|
164
|
+
return data;
|
|
165
|
+
};
|
|
166
|
+
return data;
|
|
167
|
+
}
|
|
168
|
+
function _templateObject9() {
|
|
169
|
+
var data = _tagged_template_literal([
|
|
170
|
+
"\n ",
|
|
171
|
+
": 0.375rem;\n ",
|
|
172
|
+
": 0rem;\n ",
|
|
173
|
+
": 0.625rem;\n\n ",
|
|
174
|
+
": -0.125rem;\n "
|
|
175
|
+
]);
|
|
176
|
+
_templateObject9 = function _templateObject() {
|
|
177
|
+
return data;
|
|
178
|
+
};
|
|
179
|
+
return data;
|
|
180
|
+
}
|
|
181
|
+
function _templateObject10() {
|
|
182
|
+
var data = _tagged_template_literal([
|
|
183
|
+
"\n ",
|
|
184
|
+
": 0.5rem;\n ",
|
|
185
|
+
": 0rem;\n ",
|
|
186
|
+
": 0.75rem;\n\n ",
|
|
187
|
+
": -0.125rem;\n "
|
|
188
|
+
]);
|
|
189
|
+
_templateObject10 = function _templateObject() {
|
|
190
|
+
return data;
|
|
191
|
+
};
|
|
192
|
+
return data;
|
|
193
|
+
}
|
|
194
|
+
function _templateObject11() {
|
|
195
|
+
var data = _tagged_template_literal([
|
|
196
|
+
"\n ",
|
|
197
|
+
": 0.625rem;\n ",
|
|
198
|
+
": 0rem;\n ",
|
|
199
|
+
": 0.875rem;\n\n ",
|
|
200
|
+
": -0.125rem;\n "
|
|
201
|
+
]);
|
|
202
|
+
_templateObject11 = function _templateObject() {
|
|
203
|
+
return data;
|
|
204
|
+
};
|
|
205
|
+
return data;
|
|
206
|
+
}
|
|
207
|
+
function _templateObject12() {
|
|
208
|
+
var data = _tagged_template_literal([
|
|
209
|
+
"\n ",
|
|
210
|
+
": 0.75rem;\n ",
|
|
211
|
+
": 0rem;\n ",
|
|
212
|
+
": 1rem;\n\n ",
|
|
213
|
+
": 0;\n "
|
|
214
|
+
]);
|
|
215
|
+
_templateObject12 = function _templateObject() {
|
|
216
|
+
return data;
|
|
217
|
+
};
|
|
218
|
+
return data;
|
|
219
|
+
}
|
|
220
|
+
function _templateObject13() {
|
|
221
|
+
var data = _tagged_template_literal([
|
|
222
|
+
"\n ",
|
|
223
|
+
": 0.4;\n "
|
|
224
|
+
]);
|
|
225
|
+
_templateObject13 = function _templateObject() {
|
|
226
|
+
return data;
|
|
227
|
+
};
|
|
228
|
+
return data;
|
|
229
|
+
}
|
|
230
|
+
import { css, tabsTokens } from '@salutejs/plasma-new-hope/styled-components';
|
|
231
|
+
export var config = {
|
|
232
|
+
defaults: {
|
|
233
|
+
view: 'default',
|
|
234
|
+
size: 'xs'
|
|
235
|
+
},
|
|
236
|
+
variations: {
|
|
237
|
+
view: {
|
|
238
|
+
clear: css(_templateObject(), tabsTokens.itemColor, tabsTokens.itemBackgroundColor, tabsTokens.itemColorHover, tabsTokens.itemColorActive, tabsTokens.itemBackgroundColorHover, tabsTokens.itemSelectedColor, tabsTokens.itemSelectedBackgroundColor, tabsTokens.itemSelectedColorHover, tabsTokens.itemSelectedBackgroundColorHover, tabsTokens.itemBackgroundTransition, tabsTokens.outlineFocusColor, tabsTokens.itemSelectedDividerHeight, tabsTokens.itemCursor),
|
|
239
|
+
secondary: css(_templateObject1(), tabsTokens.itemColor, tabsTokens.itemBackgroundColor, tabsTokens.itemColorHover, tabsTokens.itemColorActive, tabsTokens.itemBackgroundColorHover, tabsTokens.itemSelectedColor, tabsTokens.itemSelectedBackgroundColor, tabsTokens.itemSelectedColorHover, tabsTokens.itemSelectedBackgroundColorHover, tabsTokens.itemBackgroundTransition, tabsTokens.itemMarginLeftFilled, tabsTokens.outlineFocusColor, tabsTokens.itemSelectedDividerHeight, tabsTokens.itemCursor),
|
|
240
|
+
divider: css(_templateObject2(), tabsTokens.itemColor, tabsTokens.itemBackgroundColor, tabsTokens.itemColorHover, tabsTokens.itemColorActive, tabsTokens.itemBackgroundColorHover, tabsTokens.itemSelectedColor, tabsTokens.itemSelectedBackgroundColor, tabsTokens.itemSelectedColorHover, tabsTokens.itemSelectedBackgroundColorHover, tabsTokens.itemBackgroundTransition, tabsTokens.outlineFocusColor, tabsTokens.itemSelectedDividerHeight, tabsTokens.itemSelectedDividerColor, tabsTokens.itemSelectedDividerColorHover, tabsTokens.itemCursor),
|
|
241
|
+
default: css(_templateObject3(), tabsTokens.itemColor, tabsTokens.itemBackgroundColor, tabsTokens.itemColorHover, tabsTokens.itemColorActive, tabsTokens.itemBackgroundColorHover, tabsTokens.itemSelectedColor, tabsTokens.itemSelectedBackgroundColor, tabsTokens.itemSelectedColorHover, tabsTokens.itemSelectedBackgroundColorHover, tabsTokens.itemBackgroundTransition, tabsTokens.itemMarginLeftFilled, tabsTokens.outlineFocusColor, tabsTokens.itemSelectedDividerHeight, tabsTokens.itemCursor)
|
|
242
|
+
},
|
|
243
|
+
size: {
|
|
244
|
+
xs: css(_templateObject4(), tabsTokens.itemBorderRadius, tabsTokens.itemPadding, tabsTokens.itemContentGap, tabsTokens.actionContentMarginLeft),
|
|
245
|
+
s: css(_templateObject5(), tabsTokens.itemBorderRadius, tabsTokens.itemPadding, tabsTokens.itemContentGap, tabsTokens.actionContentMarginLeft),
|
|
246
|
+
m: css(_templateObject6(), tabsTokens.itemBorderRadius, tabsTokens.itemPadding, tabsTokens.itemContentGap, tabsTokens.actionContentMarginLeft),
|
|
247
|
+
l: css(_templateObject7(), tabsTokens.itemBorderRadius, tabsTokens.itemPadding, tabsTokens.itemContentGap, tabsTokens.actionContentMarginLeft),
|
|
248
|
+
h5: css(_templateObject8(), tabsTokens.itemBorderRadius, tabsTokens.itemPadding, tabsTokens.itemContentGap, tabsTokens.actionContentMarginLeft),
|
|
249
|
+
h4: css(_templateObject9(), tabsTokens.itemBorderRadius, tabsTokens.itemPadding, tabsTokens.itemContentGap, tabsTokens.actionContentMarginLeft),
|
|
250
|
+
h3: css(_templateObject10(), tabsTokens.itemBorderRadius, tabsTokens.itemPadding, tabsTokens.itemContentGap, tabsTokens.actionContentMarginLeft),
|
|
251
|
+
h2: css(_templateObject11(), tabsTokens.itemBorderRadius, tabsTokens.itemPadding, tabsTokens.itemContentGap, tabsTokens.actionContentMarginLeft),
|
|
252
|
+
h1: css(_templateObject12(), tabsTokens.itemBorderRadius, tabsTokens.itemPadding, tabsTokens.itemContentGap, tabsTokens.actionContentMarginLeft)
|
|
253
|
+
},
|
|
254
|
+
disabled: {
|
|
255
|
+
true: css(_templateObject13(), tabsTokens.disabledOpacity)
|
|
256
|
+
}
|
|
257
|
+
}
|
|
258
|
+
};
|
|
@@ -146,7 +146,8 @@ function _templateObject4() {
|
|
|
146
146
|
": var(--plasma-typo-body-xs-font-style);\n ",
|
|
147
147
|
": var(--plasma-typo-body-xs-font-weight);\n ",
|
|
148
148
|
": var(--plasma-typo-body-xs-letter-spacing);\n ",
|
|
149
|
-
": var(--plasma-typo-body-xs-line-height);\n
|
|
149
|
+
": var(--plasma-typo-body-xs-line-height);\n\n ",
|
|
150
|
+
": 0;\n "
|
|
150
151
|
]);
|
|
151
152
|
_templateObject4 = function _templateObject() {
|
|
152
153
|
return data;
|
|
@@ -169,7 +170,8 @@ function _templateObject5() {
|
|
|
169
170
|
": var(--plasma-typo-body-s-font-style);\n ",
|
|
170
171
|
": var(--plasma-typo-body-s-font-weight);\n ",
|
|
171
172
|
": var(--plasma-typo-body-s-letter-spacing);\n ",
|
|
172
|
-
": var(--plasma-typo-body-s-line-height);\n
|
|
173
|
+
": var(--plasma-typo-body-s-line-height);\n\n ",
|
|
174
|
+
": 0.125rem;\n "
|
|
173
175
|
]);
|
|
174
176
|
_templateObject5 = function _templateObject() {
|
|
175
177
|
return data;
|
|
@@ -192,7 +194,8 @@ function _templateObject6() {
|
|
|
192
194
|
": var(--plasma-typo-body-m-font-style);\n ",
|
|
193
195
|
": var(--plasma-typo-body-m-font-weight);\n ",
|
|
194
196
|
": var(--plasma-typo-body-m-letter-spacing);\n ",
|
|
195
|
-
": var(--plasma-typo-body-m-line-height);\n
|
|
197
|
+
": var(--plasma-typo-body-m-line-height);\n\n ",
|
|
198
|
+
": 0.25rem;\n "
|
|
196
199
|
]);
|
|
197
200
|
_templateObject6 = function _templateObject() {
|
|
198
201
|
return data;
|
|
@@ -215,7 +218,8 @@ function _templateObject7() {
|
|
|
215
218
|
": var(--plasma-typo-body-l-font-style);\n ",
|
|
216
219
|
": var(--plasma-typo-body-l-font-weight);\n ",
|
|
217
220
|
": var(--plasma-typo-body-l-letter-spacing);\n ",
|
|
218
|
-
": var(--plasma-typo-body-l-line-height);\n
|
|
221
|
+
": var(--plasma-typo-body-l-line-height);\n\n ",
|
|
222
|
+
": 0.125rem;\n "
|
|
219
223
|
]);
|
|
220
224
|
_templateObject7 = function _templateObject() {
|
|
221
225
|
return data;
|
|
@@ -236,7 +240,8 @@ function _templateObject8() {
|
|
|
236
240
|
": var(--plasma-typo-h5-font-style);\n ",
|
|
237
241
|
": var(--plasma-typo-h5-font-weight);\n ",
|
|
238
242
|
": var(--plasma-typo-h5-letter-spacing);\n ",
|
|
239
|
-
": var(--plasma-typo-h5-line-height);\n
|
|
243
|
+
": var(--plasma-typo-h5-line-height);\n\n ",
|
|
244
|
+
": -0.125rem;\n "
|
|
240
245
|
]);
|
|
241
246
|
_templateObject8 = function _templateObject() {
|
|
242
247
|
return data;
|
|
@@ -257,7 +262,8 @@ function _templateObject9() {
|
|
|
257
262
|
": var(--plasma-typo-h4-font-style);\n ",
|
|
258
263
|
": var(--plasma-typo-h4-font-weight);\n ",
|
|
259
264
|
": var(--plasma-typo-h4-letter-spacing);\n ",
|
|
260
|
-
": var(--plasma-typo-h4-line-height);\n
|
|
265
|
+
": var(--plasma-typo-h4-line-height);\n\n ",
|
|
266
|
+
": -0.125rem;\n "
|
|
261
267
|
]);
|
|
262
268
|
_templateObject9 = function _templateObject() {
|
|
263
269
|
return data;
|
|
@@ -278,7 +284,8 @@ function _templateObject10() {
|
|
|
278
284
|
": var(--plasma-typo-h3-font-style);\n ",
|
|
279
285
|
": var(--plasma-typo-h3-font-weight);\n ",
|
|
280
286
|
": var(--plasma-typo-h3-letter-spacing);\n ",
|
|
281
|
-
": var(--plasma-typo-h3-line-height);\n
|
|
287
|
+
": var(--plasma-typo-h3-line-height);\n\n ",
|
|
288
|
+
": -0.125rem;\n "
|
|
282
289
|
]);
|
|
283
290
|
_templateObject10 = function _templateObject() {
|
|
284
291
|
return data;
|
|
@@ -299,7 +306,8 @@ function _templateObject11() {
|
|
|
299
306
|
": var(--plasma-typo-h2-font-style);\n ",
|
|
300
307
|
": var(--plasma-typo-h2-font-weight);\n ",
|
|
301
308
|
": var(--plasma-typo-h2-letter-spacing);\n ",
|
|
302
|
-
": var(--plasma-typo-h2-line-height);\n
|
|
309
|
+
": var(--plasma-typo-h2-line-height);\n\n ",
|
|
310
|
+
": -0.125rem;\n "
|
|
303
311
|
]);
|
|
304
312
|
_templateObject11 = function _templateObject() {
|
|
305
313
|
return data;
|
|
@@ -320,7 +328,8 @@ function _templateObject12() {
|
|
|
320
328
|
": var(--plasma-typo-h1-font-style);\n ",
|
|
321
329
|
": var(--plasma-typo-h1-font-weight);\n ",
|
|
322
330
|
": var(--plasma-typo-h1-letter-spacing);\n ",
|
|
323
|
-
": var(--plasma-typo-h1-line-height);\n
|
|
331
|
+
": var(--plasma-typo-h1-line-height);\n\n ",
|
|
332
|
+
": 0;\n "
|
|
324
333
|
]);
|
|
325
334
|
_templateObject12 = function _templateObject() {
|
|
326
335
|
return data;
|
|
@@ -370,15 +379,15 @@ export var config = {
|
|
|
370
379
|
default: css(_templateObject3(), tabsTokens.itemColor, tabsTokens.itemValueColor, tabsTokens.itemBackgroundColor, tabsTokens.itemColorHover, tabsTokens.itemValueColorHover, tabsTokens.itemColorActive, tabsTokens.itemValueColorActive, tabsTokens.itemBackgroundColorHover, tabsTokens.itemSelectedColor, tabsTokens.itemSelectedValueColor, tabsTokens.itemSelectedBackgroundColor, tabsTokens.itemSelectedColorHover, tabsTokens.itemSelectedValueColorHover, tabsTokens.itemSelectedBackgroundColorHover, tabsTokens.itemBackgroundTransition, tabsTokens.itemMarginLeftFilled, tabsTokens.outlineFocusColor, tabsTokens.itemSelectedDividerHeight, tabsTokens.itemSelectedDividerColor, tabsTokens.itemSelectedDividerColorHover, tabsTokens.itemCursor)
|
|
371
380
|
},
|
|
372
381
|
size: {
|
|
373
|
-
xs: css(_templateObject4(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight),
|
|
374
|
-
s: css(_templateObject5(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight),
|
|
375
|
-
m: css(_templateObject6(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight),
|
|
376
|
-
l: css(_templateObject7(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight),
|
|
377
|
-
h5: css(_templateObject8(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight),
|
|
378
|
-
h4: css(_templateObject9(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight),
|
|
379
|
-
h3: css(_templateObject10(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight),
|
|
380
|
-
h2: css(_templateObject11(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight),
|
|
381
|
-
h1: css(_templateObject12(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight)
|
|
382
|
+
xs: css(_templateObject4(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight, tabsTokens.actionContentMarginLeft),
|
|
383
|
+
s: css(_templateObject5(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight, tabsTokens.actionContentMarginLeft),
|
|
384
|
+
m: css(_templateObject6(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight, tabsTokens.actionContentMarginLeft),
|
|
385
|
+
l: css(_templateObject7(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight, tabsTokens.actionContentMarginLeft),
|
|
386
|
+
h5: css(_templateObject8(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight, tabsTokens.actionContentMarginLeft),
|
|
387
|
+
h4: css(_templateObject9(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight, tabsTokens.actionContentMarginLeft),
|
|
388
|
+
h3: css(_templateObject10(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight, tabsTokens.actionContentMarginLeft),
|
|
389
|
+
h2: css(_templateObject11(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight, tabsTokens.actionContentMarginLeft),
|
|
390
|
+
h1: css(_templateObject12(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight, tabsTokens.actionContentMarginLeft)
|
|
382
391
|
},
|
|
383
392
|
disabled: {
|
|
384
393
|
true: css(_templateObject13(), tabsTokens.disabledOpacity)
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
function _tagged_template_literal(strings, raw) {
|
|
2
|
+
if (!raw) {
|
|
3
|
+
raw = strings.slice(0);
|
|
4
|
+
}
|
|
5
|
+
return Object.freeze(Object.defineProperties(strings, {
|
|
6
|
+
raw: {
|
|
7
|
+
value: Object.freeze(raw)
|
|
8
|
+
}
|
|
9
|
+
}));
|
|
10
|
+
}
|
|
11
|
+
function _templateObject() {
|
|
12
|
+
var data = _tagged_template_literal([
|
|
13
|
+
"\n ",
|
|
14
|
+
": var(--text-secondary);\n ",
|
|
15
|
+
": transparent;\n ",
|
|
16
|
+
": var(--text-secondary-hover);\n ",
|
|
17
|
+
": var(--text-secondary-active);\n ",
|
|
18
|
+
": transparent;\n ",
|
|
19
|
+
": var(--text-primary);\n ",
|
|
20
|
+
": transparent;\n ",
|
|
21
|
+
": var(--text-primary);\n ",
|
|
22
|
+
": transparent;\n ",
|
|
23
|
+
": background-color 0.3s ease-in-out;\n\n ",
|
|
24
|
+
": var(--surface-accent);\n\n ",
|
|
25
|
+
": 0.125rem;\n ",
|
|
26
|
+
": var(--text-primary);\n ",
|
|
27
|
+
": var(--text-primary);\n\n ",
|
|
28
|
+
": pointer;\n "
|
|
29
|
+
]);
|
|
30
|
+
_templateObject = function _templateObject() {
|
|
31
|
+
return data;
|
|
32
|
+
};
|
|
33
|
+
return data;
|
|
34
|
+
}
|
|
35
|
+
function _templateObject1() {
|
|
36
|
+
var data = _tagged_template_literal([
|
|
37
|
+
"\n ",
|
|
38
|
+
": 0.375rem;\n ",
|
|
39
|
+
": 0.5rem 0.625rem;\n ",
|
|
40
|
+
": 0.25rem;\n ",
|
|
41
|
+
": 0.125rem;\n\n ",
|
|
42
|
+
": 0;\n "
|
|
43
|
+
]);
|
|
44
|
+
_templateObject1 = function _templateObject() {
|
|
45
|
+
return data;
|
|
46
|
+
};
|
|
47
|
+
return data;
|
|
48
|
+
}
|
|
49
|
+
function _templateObject2() {
|
|
50
|
+
var data = _tagged_template_literal([
|
|
51
|
+
"\n ",
|
|
52
|
+
": 0.5rem;\n ",
|
|
53
|
+
": 0.5rem 0.625rem;\n ",
|
|
54
|
+
": 0.25rem;\n ",
|
|
55
|
+
": 0.125rem;\n\n ",
|
|
56
|
+
": 0.25rem;\n "
|
|
57
|
+
]);
|
|
58
|
+
_templateObject2 = function _templateObject() {
|
|
59
|
+
return data;
|
|
60
|
+
};
|
|
61
|
+
return data;
|
|
62
|
+
}
|
|
63
|
+
function _templateObject3() {
|
|
64
|
+
var data = _tagged_template_literal([
|
|
65
|
+
"\n ",
|
|
66
|
+
": 0.625rem;\n ",
|
|
67
|
+
": 0.75rem 0.875rem;\n ",
|
|
68
|
+
": 0.375rem;\n ",
|
|
69
|
+
": 0.125rem;\n\n ",
|
|
70
|
+
": 0.125rem;\n "
|
|
71
|
+
]);
|
|
72
|
+
_templateObject3 = function _templateObject() {
|
|
73
|
+
return data;
|
|
74
|
+
};
|
|
75
|
+
return data;
|
|
76
|
+
}
|
|
77
|
+
function _templateObject4() {
|
|
78
|
+
var data = _tagged_template_literal([
|
|
79
|
+
"\n ",
|
|
80
|
+
": 0.75rem;\n ",
|
|
81
|
+
": 1rem 1.125rem;\n ",
|
|
82
|
+
": 0.5rem;\n ",
|
|
83
|
+
": 0.125rem;\n\n ",
|
|
84
|
+
": 0.125rem;\n "
|
|
85
|
+
]);
|
|
86
|
+
_templateObject4 = function _templateObject() {
|
|
87
|
+
return data;
|
|
88
|
+
};
|
|
89
|
+
return data;
|
|
90
|
+
}
|
|
91
|
+
function _templateObject5() {
|
|
92
|
+
var data = _tagged_template_literal([
|
|
93
|
+
"\n ",
|
|
94
|
+
": 0.4;\n "
|
|
95
|
+
]);
|
|
96
|
+
_templateObject5 = function _templateObject() {
|
|
97
|
+
return data;
|
|
98
|
+
};
|
|
99
|
+
return data;
|
|
100
|
+
}
|
|
101
|
+
import { css, tabsTokens } from '@salutejs/plasma-new-hope/styled-components';
|
|
102
|
+
export var config = {
|
|
103
|
+
defaults: {
|
|
104
|
+
view: 'divider',
|
|
105
|
+
size: 'xs'
|
|
106
|
+
},
|
|
107
|
+
variations: {
|
|
108
|
+
view: {
|
|
109
|
+
divider: css(_templateObject(), tabsTokens.itemColor, tabsTokens.itemBackgroundColor, tabsTokens.itemColorHover, tabsTokens.itemColorActive, tabsTokens.itemBackgroundColorHover, tabsTokens.itemSelectedColor, tabsTokens.itemSelectedBackgroundColor, tabsTokens.itemSelectedColorHover, tabsTokens.itemSelectedBackgroundColorHover, tabsTokens.itemBackgroundTransition, tabsTokens.outlineFocusColor, tabsTokens.itemSelectedDividerWidth, tabsTokens.itemSelectedDividerColor, tabsTokens.itemSelectedDividerColorHover, tabsTokens.itemCursor)
|
|
110
|
+
},
|
|
111
|
+
size: {
|
|
112
|
+
xs: css(_templateObject1(), tabsTokens.itemBorderRadius, tabsTokens.itemPaddingOrientationVertical, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.actionContentMarginLeft),
|
|
113
|
+
s: css(_templateObject2(), tabsTokens.itemBorderRadius, tabsTokens.itemPaddingOrientationVertical, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.actionContentMarginLeft),
|
|
114
|
+
m: css(_templateObject3(), tabsTokens.itemBorderRadius, tabsTokens.itemPaddingOrientationVertical, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.actionContentMarginLeft),
|
|
115
|
+
l: css(_templateObject4(), tabsTokens.itemBorderRadius, tabsTokens.itemPaddingOrientationVertical, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.actionContentMarginLeft)
|
|
116
|
+
},
|
|
117
|
+
disabled: {
|
|
118
|
+
true: css(_templateObject5(), tabsTokens.disabledOpacity)
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
};
|
|
@@ -57,7 +57,8 @@ function _templateObject1() {
|
|
|
57
57
|
": var(--plasma-typo-body-xs-font-style);\n ",
|
|
58
58
|
": var(--plasma-typo-body-xs-font-weight);\n ",
|
|
59
59
|
": var(--plasma-typo-body-xs-letter-spacing);\n ",
|
|
60
|
-
": var(--plasma-typo-body-xs-line-height);\n
|
|
60
|
+
": var(--plasma-typo-body-xs-line-height);\n\n ",
|
|
61
|
+
": 0;\n "
|
|
61
62
|
]);
|
|
62
63
|
_templateObject1 = function _templateObject() {
|
|
63
64
|
return data;
|
|
@@ -81,7 +82,8 @@ function _templateObject2() {
|
|
|
81
82
|
": var(--plasma-typo-body-s-font-style);\n ",
|
|
82
83
|
": var(--plasma-typo-body-s-font-weight);\n ",
|
|
83
84
|
": var(--plasma-typo-body-s-letter-spacing);\n ",
|
|
84
|
-
": var(--plasma-typo-body-s-line-height);\n
|
|
85
|
+
": var(--plasma-typo-body-s-line-height);\n\n ",
|
|
86
|
+
": 0.25rem;\n "
|
|
85
87
|
]);
|
|
86
88
|
_templateObject2 = function _templateObject() {
|
|
87
89
|
return data;
|
|
@@ -105,7 +107,8 @@ function _templateObject3() {
|
|
|
105
107
|
": var(--plasma-typo-body-m-font-style);\n ",
|
|
106
108
|
": var(--plasma-typo-body-m-font-weight);\n ",
|
|
107
109
|
": var(--plasma-typo-body-m-letter-spacing);\n ",
|
|
108
|
-
": var(--plasma-typo-body-m-line-height);\n
|
|
110
|
+
": var(--plasma-typo-body-m-line-height);\n\n ",
|
|
111
|
+
": 0.125rem;\n "
|
|
109
112
|
]);
|
|
110
113
|
_templateObject3 = function _templateObject() {
|
|
111
114
|
return data;
|
|
@@ -129,7 +132,8 @@ function _templateObject4() {
|
|
|
129
132
|
": var(--plasma-typo-body-l-font-style);\n ",
|
|
130
133
|
": var(--plasma-typo-body-l-font-weight);\n ",
|
|
131
134
|
": var(--plasma-typo-body-l-letter-spacing);\n ",
|
|
132
|
-
": var(--plasma-typo-body-l-line-height);\n
|
|
135
|
+
": var(--plasma-typo-body-l-line-height);\n\n ",
|
|
136
|
+
": 0.125rem;\n "
|
|
133
137
|
]);
|
|
134
138
|
_templateObject4 = function _templateObject() {
|
|
135
139
|
return data;
|
|
@@ -166,10 +170,10 @@ export var config = {
|
|
|
166
170
|
divider: css(_templateObject(), tabsTokens.itemColor, tabsTokens.itemValueColor, tabsTokens.itemBackgroundColor, tabsTokens.itemColorHover, tabsTokens.itemValueColorHover, tabsTokens.itemColorActive, tabsTokens.itemValueColorActive, tabsTokens.itemBackgroundColorHover, tabsTokens.itemSelectedColor, tabsTokens.itemSelectedValueColor, tabsTokens.itemSelectedBackgroundColor, tabsTokens.itemSelectedColorHover, tabsTokens.itemSelectedValueColorHover, tabsTokens.itemSelectedBackgroundColorHover, tabsTokens.itemBackgroundTransition, tabsTokens.itemPaddingClear, tabsTokens.itemContentPaddingClear, tabsTokens.outlineFocusColor, tabsTokens.itemSelectedDividerWidth, tabsTokens.itemSelectedDividerHeight, tabsTokens.itemSelectedDividerColor, tabsTokens.itemSelectedDividerColorHover, tabsTokens.itemCursor)
|
|
167
171
|
},
|
|
168
172
|
size: {
|
|
169
|
-
xs: css(_templateObject1(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemPaddingOrientationVertical, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight),
|
|
170
|
-
s: css(_templateObject2(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemPaddingOrientationVertical, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight),
|
|
171
|
-
m: css(_templateObject3(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemPaddingOrientationVertical, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight),
|
|
172
|
-
l: css(_templateObject4(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemPaddingOrientationVertical, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight)
|
|
173
|
+
xs: css(_templateObject1(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemPaddingOrientationVertical, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight, tabsTokens.actionContentMarginLeft),
|
|
174
|
+
s: css(_templateObject2(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemPaddingOrientationVertical, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight, tabsTokens.actionContentMarginLeft),
|
|
175
|
+
m: css(_templateObject3(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemPaddingOrientationVertical, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight, tabsTokens.actionContentMarginLeft),
|
|
176
|
+
l: css(_templateObject4(), tabsTokens.itemBorderRadius, tabsTokens.itemWidth, tabsTokens.itemHeight, tabsTokens.itemPadding, tabsTokens.itemPaddingPilled, tabsTokens.itemPaddingOrientationVertical, tabsTokens.itemMarginLeft, tabsTokens.itemContentGap, tabsTokens.itemContentPadding, tabsTokens.fontFamily, tabsTokens.fontSize, tabsTokens.fontStyle, tabsTokens.fontWeight, tabsTokens.letterSpacing, tabsTokens.lineHeight, tabsTokens.actionContentMarginLeft)
|
|
173
177
|
},
|
|
174
178
|
disabled: {
|
|
175
179
|
true: css(_templateObject5(), tabsTokens.disabledOpacity)
|