@salutejs/plasma-new-hope 0.321.1-canary.1943.14662029036.0 → 0.321.1-canary.1946.14663041744.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/cjs/components/Tabs/tokens.js +0 -1
- package/cjs/components/Tabs/tokens.js.map +1 -1
- package/cjs/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.css +5 -5
- package/cjs/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.styles.js +1 -1
- package/cjs/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.styles.js.map +1 -1
- package/cjs/components/Tabs/ui/horizontal/HorizontalTabItem/{HorizontalTabItem.styles_1rvmyae.css → HorizontalTabItem.styles_1yi1gll.css} +1 -1
- package/cjs/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.css +5 -5
- package/cjs/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.js +1 -1
- package/cjs/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.js.map +1 -1
- package/cjs/components/Tabs/ui/vertical/VerticalTabItem/{VerticalTabItem.styles_y2x2qv.css → VerticalTabItem.styles_17vv6lq.css} +1 -1
- package/cjs/index.css +10 -10
- package/emotion/cjs/components/Tabs/tokens.js +0 -1
- package/emotion/cjs/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.styles.js +6 -6
- package/emotion/cjs/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.js +6 -6
- package/emotion/cjs/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabItem.config.js +16 -16
- package/emotion/cjs/examples/plasma_b2c/components/Tabs/vertical/VerticalTabItem.config.js +7 -7
- package/emotion/cjs/examples/plasma_web/components/Tabs/horizontal/HorizontalTabItem.config.js +16 -16
- package/emotion/cjs/examples/plasma_web/components/Tabs/vertical/VerticalTabItem.config.js +7 -7
- package/emotion/es/components/Tabs/tokens.js +0 -1
- package/emotion/es/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.styles.js +6 -6
- package/emotion/es/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.js +6 -6
- package/emotion/es/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabItem.config.js +16 -16
- package/emotion/es/examples/plasma_b2c/components/Tabs/vertical/VerticalTabItem.config.js +7 -7
- package/emotion/es/examples/plasma_web/components/Tabs/horizontal/HorizontalTabItem.config.js +16 -16
- package/emotion/es/examples/plasma_web/components/Tabs/vertical/VerticalTabItem.config.js +7 -7
- package/es/components/Tabs/tokens.js +0 -1
- package/es/components/Tabs/tokens.js.map +1 -1
- package/es/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.css +5 -5
- package/es/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.styles.js +1 -1
- package/es/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.styles.js.map +1 -1
- package/es/components/Tabs/ui/horizontal/HorizontalTabItem/{HorizontalTabItem.styles_1rvmyae.css → HorizontalTabItem.styles_1yi1gll.css} +1 -1
- package/es/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.css +5 -5
- package/es/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.js +1 -1
- package/es/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.js.map +1 -1
- package/es/components/Tabs/ui/vertical/VerticalTabItem/{VerticalTabItem.styles_y2x2qv.css → VerticalTabItem.styles_17vv6lq.css} +1 -1
- package/es/index.css +10 -10
- package/package.json +4 -4
- package/styled-components/cjs/components/Tabs/tokens.js +0 -1
- package/styled-components/cjs/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.styles.js +1 -1
- package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.js +1 -1
- package/styled-components/cjs/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabItem.config.js +4 -4
- package/styled-components/cjs/examples/plasma_b2c/components/Tabs/vertical/VerticalTabItem.config.js +1 -1
- package/styled-components/cjs/examples/plasma_web/components/Tabs/horizontal/HorizontalTabItem.config.js +4 -4
- package/styled-components/cjs/examples/plasma_web/components/Tabs/vertical/VerticalTabItem.config.js +1 -1
- package/styled-components/es/components/Tabs/tokens.js +0 -1
- package/styled-components/es/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.styles.js +1 -1
- package/styled-components/es/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.js +1 -1
- package/styled-components/es/examples/plasma_b2c/components/Tabs/horizontal/HorizontalTabItem.config.js +4 -4
- package/styled-components/es/examples/plasma_b2c/components/Tabs/vertical/VerticalTabItem.config.js +1 -1
- package/styled-components/es/examples/plasma_web/components/Tabs/horizontal/HorizontalTabItem.config.js +4 -4
- package/styled-components/es/examples/plasma_web/components/Tabs/vertical/VerticalTabItem.config.js +1 -1
- package/types/components/Tabs/tokens.d.ts +0 -1
- package/types/components/Tabs/tokens.d.ts.map +1 -1
- package/types/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.styles.d.ts.map +1 -1
- package/types/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.d.ts.map +1 -1
package/es/index.css
CHANGED
|
@@ -269,11 +269,11 @@
|
|
|
269
269
|
|
|
270
270
|
.base_1ogr2cm_bt431lh__e8119f61[disabled]{cursor:not-allowed;}.base_1ogr2cm_bt431lh__e8119f61[disabled]:hover{color:var(--plasma-tab-item-color);background-color:var(--plasma-tab-item-background-color);}.base_1ogr2cm_bt431lh__e8119f61[disabled].base_1ogr2cm_selectedTabsItem__e8119f61:hover{color:var(--plasma-tab-item-selected-color);background-color:var(--plasma-tab-item-selected-background-color);}
|
|
271
271
|
|
|
272
|
-
.
|
|
273
|
-
.
|
|
274
|
-
.
|
|
275
|
-
.
|
|
276
|
-
.
|
|
272
|
+
.HorizontalTabItem_styles_1yi1gll_skuum0w__dcc7bfa0{display:inline-block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;padding:0 var(--plasma-tab-item-content-padding-clear,var(--plasma-tab-item-content-padding));}
|
|
273
|
+
.HorizontalTabItem_styles_1yi1gll_t1l5e9z0__dcc7bfa0{color:var(--plasma-tab-item-value-color);font-family:var(--plasma-tab-item-value-font-family,var(--plasma-tab-item-font-family));font-size:var(--plasma-tab-item-value-font-size,var(--plasma-tab-item-font-size));font-style:var(--plasma-tab-item-value-font-style,var(--plasma-tab-item-font-style));font-weight:var(--plasma-tab-item-value-font-weight,var(--plasma-tab-item-font-weight));-webkit-letter-spacing:var(--plasma-tab-item-value-letter-spacing,var(--plasma-tab-item-letter-spacing));-moz-letter-spacing:var(--plasma-tab-item-value-letter-spacing,var(--plasma-tab-item-letter-spacing));-ms-letter-spacing:var(--plasma-tab-item-value-letter-spacing,var(--plasma-tab-item-letter-spacing));letter-spacing:var(--plasma-tab-item-value-letter-spacing,var(--plasma-tab-item-letter-spacing));line-height:var(--plasma-tab-item-value-lineheight,var(--plasma-tab-item-lineheight));}
|
|
274
|
+
.HorizontalTabItem_styles_1yi1gll_r1nh4m12__dcc7bfa0{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;color:inherit;}.HorizontalTabItem_styles_1yi1gll_r1nh4m12__dcc7bfa0:hover{color:inherit;}
|
|
275
|
+
.HorizontalTabItem_styles_1yi1gll_l13nweg3__dcc7bfa0{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;color:inherit;}.HorizontalTabItem_styles_1yi1gll_l13nweg3__dcc7bfa0:hover{color:inherit;}
|
|
276
|
+
.HorizontalTabItem_styles_1yi1gll_b1iip2sx__dcc7bfa0{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;box-sizing:border-box;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;white-space:nowrap;gap:var(--plasma-tab-item-content-gap);padding:var(--plasma-tab-item-padding-clear,var(--plasma-tab-item-padding));-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;outline:none;cursor:pointer;-webkit-tap-highlight-color:transparent;position:relative;}.HorizontalTabItem_styles_1yi1gll_b1iip2sx__dcc7bfa0:first-child{margin-left:0;}.HorizontalTabItem_styles_1yi1gll_b1iip2sx__dcc7bfa0::before{content:'';position:absolute;top:-0.125rem;left:-0.125rem;right:-0.125rem;bottom:-0.125rem;z-index:1;display:block;box-sizing:content-box;border:0.063rem solid transparent;border-radius:calc(var(--plasma_private-outline-radius) + 0.063rem);-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.HorizontalTabItem_styles_1yi1gll_b1iip2sx__dcc7bfa0.HorizontalTabItem_styles_1yi1gll_focusVisible__dcc7bfa0:focus::before,.HorizontalTabItem_styles_1yi1gll_b1iip2sx__dcc7bfa0[data-focus-visible-added]::before{z-index:1;outline:none;box-shadow:0 0 0 0.063rem var(--plasma-tabs-outline-focus-color);}.HorizontalTabItem_styles_1yi1gll_b1iip2sx__dcc7bfa0.HorizontalTabItem_styles_1yi1gll_tabsTruncate__dcc7bfa0 .HorizontalTabItem_styles_1yi1gll_skuum0w__dcc7bfa0{overflow:hidden;text-overflow:ellipsis;}.HorizontalTabItem_styles_1yi1gll_b1iip2sx__dcc7bfa0.HorizontalTabItem_styles_1yi1gll_tabsTruncate__dcc7bfa0 .HorizontalTabItem_styles_1yi1gll_t1l5e9z0__dcc7bfa0{overflow:hidden;text-overflow:ellipsis;}
|
|
277
277
|
|
|
278
278
|
.VerticalTabs_styles_1egpt45_b2r261u__2941d0b4{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:0.125rem;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
|
|
279
279
|
.VerticalTabs_styles_1egpt45_s1tfgc53__2941d0b4{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:start;-webkit-box-align:start;-ms-flex-align:start;align-items:start;}
|
|
@@ -286,11 +286,11 @@
|
|
|
286
286
|
|
|
287
287
|
.base_do8935_b1vdpmya__377ce78c{opacity:var(--plasma-tabs-disabled-opacity);}
|
|
288
288
|
|
|
289
|
-
.
|
|
290
|
-
.
|
|
291
|
-
.
|
|
292
|
-
.
|
|
293
|
-
.
|
|
289
|
+
.VerticalTabItem_styles_17vv6lq_s1vnvg8i__4094188b{display:inline-block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;padding:0 var(--plasma-tab-item-content-padding-clear,var(--plasma-tab-item-content-padding));}
|
|
290
|
+
.VerticalTabItem_styles_17vv6lq_t4s0t81__4094188b{white-space:nowrap;color:var(--plasma-tab-item-value-color);font-family:var(--plasma-tab-item-value-font-family,var(--plasma-tab-item-font-family));font-size:var(--plasma-tab-item-value-font-size,var(--plasma-tab-item-font-size));font-style:var(--plasma-tab-item-value-font-style,var(--plasma-tab-item-font-style));font-weight:var(--plasma-tab-item-value-font-weight,var(--plasma-tab-item-font-weight));-webkit-letter-spacing:var(--plasma-tab-item-value-letter-spacing,var(--plasma-tab-item-letter-spacing));-moz-letter-spacing:var(--plasma-tab-item-value-letter-spacing,var(--plasma-tab-item-letter-spacing));-ms-letter-spacing:var(--plasma-tab-item-value-letter-spacing,var(--plasma-tab-item-letter-spacing));letter-spacing:var(--plasma-tab-item-value-letter-spacing,var(--plasma-tab-item-letter-spacing));line-height:var(--plasma-tab-item-value-lineheight,var(--plasma-tab-item-lineheight));}
|
|
291
|
+
.VerticalTabItem_styles_17vv6lq_rur46hh__4094188b{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;color:inherit;}.VerticalTabItem_styles_17vv6lq_rur46hh__4094188b:hover{color:inherit;}
|
|
292
|
+
.VerticalTabItem_styles_17vv6lq_l1ms3p4x__4094188b{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;color:inherit;}.VerticalTabItem_styles_17vv6lq_l1ms3p4x__4094188b:hover{color:inherit;}
|
|
293
|
+
.VerticalTabItem_styles_17vv6lq_b1yz2xa4__4094188b{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start;box-sizing:border-box;white-space:nowrap;gap:var(--plasma-tab-item-content-gap);padding:var(--plasma-tab-item-padding-orientation-vertical);-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;outline:none;cursor:pointer;-webkit-tap-highlight-color:transparent;position:relative;}.VerticalTabItem_styles_17vv6lq_b1yz2xa4__4094188b::before{content:'';position:absolute;top:-0.125rem;left:-0.125rem;right:-0.125rem;bottom:-0.125rem;z-index:1;display:block;box-sizing:content-box;border:0.063rem solid transparent;border-radius:calc(var(--plasma_private-outline-radius) + 0.063rem);-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.VerticalTabItem_styles_17vv6lq_b1yz2xa4__4094188b.VerticalTabItem_styles_17vv6lq_focusVisible__4094188b:focus::before,.VerticalTabItem_styles_17vv6lq_b1yz2xa4__4094188b[data-focus-visible-added]::before{z-index:1;outline:none;box-shadow:0 0 0 0.063rem var(--plasma-tabs-outline-focus-color);}.VerticalTabItem_styles_17vv6lq_b1yz2xa4__4094188b.VerticalTabItem_styles_17vv6lq_tabsTruncate__4094188b .VerticalTabItem_styles_17vv6lq_s1vnvg8i__4094188b{overflow:hidden;text-overflow:ellipsis;}.VerticalTabItem_styles_17vv6lq_b1yz2xa4__4094188b.VerticalTabItem_styles_17vv6lq_tabsTruncate__4094188b .VerticalTabItem_styles_17vv6lq_t4s0t81__4094188b{overflow:hidden;text-overflow:ellipsis;}
|
|
294
294
|
|
|
295
295
|
.base_12fk3xi_byyhn69__7e2c76ac{color:var(--plasma-tab-item-color);background-color:var(--plasma-tab-item-background-color);}.base_12fk3xi_byyhn69__7e2c76ac:hover{color:var(--plasma-tab-item-color-hover);background-color:var(--plasma-tab-item-background-color-hover);}.base_12fk3xi_byyhn69__7e2c76ac:hover .base_12fk3xi_t4s0t81__7e2c76ac{color:var(--plasma-tab-item-value-color-hover);}.base_12fk3xi_byyhn69__7e2c76ac:active{color:var(--plasma-tab-item-color-active);}.base_12fk3xi_byyhn69__7e2c76ac:active .base_12fk3xi_t4s0t81__7e2c76ac{color:var(--plasma-tab-item-value-color-active);}.base_12fk3xi_byyhn69__7e2c76ac.base_12fk3xi_tabItemAnimated__7e2c76ac{-webkit-transition:var(--plasma-tab-item-background-transition);transition:var(--plasma-tab-item-background-transition);}.base_12fk3xi_byyhn69__7e2c76ac.base_12fk3xi_selectedTabsItem__7e2c76ac{color:var(--plasma-tab-item-selected-color);background-color:var(--plasma-tab-item-selected-background-color);}.base_12fk3xi_byyhn69__7e2c76ac.base_12fk3xi_selectedTabsItem__7e2c76ac:hover{color:var(--plasma-tab-item-selected-color-hover);background-color:var(--plasma-tab-item-selected-background-color-hover);}.base_12fk3xi_byyhn69__7e2c76ac.base_12fk3xi_selectedTabsItem__7e2c76ac:hover::after{background:var(--plasma-tab-item-selected-hover-divider-color);}.base_12fk3xi_byyhn69__7e2c76ac.base_12fk3xi_selectedTabsItem__7e2c76ac .base_12fk3xi_t4s0t81__7e2c76ac{color:var(--plasma-tab-item-selected-value-color-hover);}.base_12fk3xi_byyhn69__7e2c76ac.base_12fk3xi_selectedTabsItem__7e2c76ac .base_12fk3xi_t4s0t81__7e2c76ac:hover{color:var(--plasma-tab-item-selected-value-color-hover);}.base_12fk3xi_byyhn69__7e2c76ac.base_12fk3xi_selectedTabsItem__7e2c76ac::after{content:'';position:absolute;top:0;left:0;bottom:0;background:var(--plasma-tab-item-selected-divider-color);width:var(--plasma-tab-item-selected-divider-width);border-radius:0.063rem;}
|
|
296
296
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@salutejs/plasma-new-hope",
|
|
3
|
-
"version": "0.321.1-canary.
|
|
3
|
+
"version": "0.321.1-canary.1946.14663041744.0",
|
|
4
4
|
"description": "Salute Design System blueprint",
|
|
5
5
|
"main": "cjs/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -80,8 +80,8 @@
|
|
|
80
80
|
"@rollup/plugin-babel": "^6.0.4",
|
|
81
81
|
"@rollup/plugin-commonjs": "^25.0.4",
|
|
82
82
|
"@rollup/plugin-node-resolve": "^15.1.0",
|
|
83
|
-
"@salutejs/plasma-sb-utils": "0.196.1-canary.
|
|
84
|
-
"@salutejs/plasma-themes": "0.32.1-canary.
|
|
83
|
+
"@salutejs/plasma-sb-utils": "0.196.1-canary.1946.14663041744.0",
|
|
84
|
+
"@salutejs/plasma-themes": "0.32.1-canary.1946.14663041744.0",
|
|
85
85
|
"@storybook/addon-docs": "8.6.12",
|
|
86
86
|
"@storybook/addon-essentials": "8.6.12",
|
|
87
87
|
"@storybook/manager-api": "8.6.12",
|
|
@@ -137,5 +137,5 @@
|
|
|
137
137
|
"sideEffects": [
|
|
138
138
|
"*.css"
|
|
139
139
|
],
|
|
140
|
-
"gitHead": "
|
|
140
|
+
"gitHead": "914bf248093b4dd5db4c6d422cd663942234d9f1"
|
|
141
141
|
}
|
|
@@ -73,7 +73,6 @@ var tokens = exports.tokens = {
|
|
|
73
73
|
itemColorActive: '--plasma-tab-item-color-active',
|
|
74
74
|
itemValueColorActive: '--plasma-tab-item-value-color-active',
|
|
75
75
|
itemBackgroundColorHover: '--plasma-tab-item-background-color-hover',
|
|
76
|
-
itemCursor: '--plasma-tab-item-cursor',
|
|
77
76
|
itemSelectedColor: '--plasma-tab-item-selected-color',
|
|
78
77
|
itemSelectedValueColor: '--plasma-tab-item-selected-value-color',
|
|
79
78
|
itemSelectedBackgroundColor: '--plasma-tab-item-selected-background-color',
|
|
@@ -22,7 +22,7 @@ var RightContent = exports.RightContent = /*#__PURE__*/_styledComponents["defaul
|
|
|
22
22
|
var LeftContent = exports.LeftContent = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
|
23
23
|
componentId: "plasma-new-hope__sc-lremls-3"
|
|
24
24
|
})(["display:flex;color:inherit;&:hover{color:inherit;}"]);
|
|
25
|
-
var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["position:relative;display:flex;align-items:center;justify-content:center;gap:var(", ");padding:var(", ",var(", "));appearance:none;border:none;outline:none;cursor:
|
|
25
|
+
var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;align-items:center;white-space:nowrap;gap:var(", ");padding:var(", ",var(", "));appearance:none;border:none;outline:none;cursor:pointer;-webkit-tap-highlight-color:transparent;&:first-child{margin-left:0;}", ";&.", "{", "{overflow:hidden;text-overflow:ellipsis;}", "{overflow:hidden;text-overflow:ellipsis;}}"], _tokens.tokens.itemContentGap, _tokens.tokens.itemPaddingClear, _tokens.tokens.itemPadding, /*#__PURE__*/(0, _mixins.addFocus)({
|
|
26
26
|
outlineSize: '0.063rem',
|
|
27
27
|
outlineOffset: '-0.125rem',
|
|
28
28
|
outlineColor: /*#__PURE__*/"var(".concat(_tokens.tokens.outlineFocusColor, ")"),
|
package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.js
CHANGED
|
@@ -24,7 +24,7 @@ var RightContent = exports.RightContent = /*#__PURE__*/_styledComponents["defaul
|
|
|
24
24
|
var LeftContent = exports.LeftContent = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
|
25
25
|
componentId: "plasma-new-hope__sc-1pflgj8-3"
|
|
26
26
|
})(["display:flex;color:inherit;&:hover{color:inherit;}"]);
|
|
27
|
-
var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n position: relative;\n
|
|
27
|
+
var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n position: relative;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n box-sizing: border-box;\n white-space: nowrap;\n\n gap: var(", ");\n padding: var(", ");\n\n appearance: none;\n border: none;\n outline: none;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n\n ", ";\n\n &.", " {\n ", " {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n ", " {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])), _tokens.tokens.itemContentGap, _tokens.tokens.itemPaddingOrientationVertical, /*#__PURE__*/(0, _mixins.addFocus)({
|
|
28
28
|
outlineSize: '0.063rem',
|
|
29
29
|
outlineOffset: '-0.125rem',
|
|
30
30
|
outlineColor: /*#__PURE__*/"var(".concat(_tokens.tokens.outlineFocusColor, ")"),
|
|
@@ -13,10 +13,10 @@ var config = exports.config = {
|
|
|
13
13
|
},
|
|
14
14
|
variations: {
|
|
15
15
|
view: {
|
|
16
|
-
clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
17
|
-
secondary: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
18
|
-
divider: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
19
|
-
"default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
16
|
+
clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.itemPaddingClear, _Tabs.tabsTokens.itemContentPaddingClear, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover),
|
|
17
|
+
secondary: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.itemMarginLeftFilled, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover),
|
|
18
|
+
divider: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.itemPaddingClear, _Tabs.tabsTokens.itemContentPaddingClear, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover),
|
|
19
|
+
"default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.itemMarginLeftFilled, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover)
|
|
20
20
|
},
|
|
21
21
|
size: {
|
|
22
22
|
xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.375rem;", ":auto;", ":2rem;", ":0 0.5rem;", ":0 0.375rem;", ":1.75rem;", ":0.25rem;", ":0.125rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
|
package/styled-components/cjs/examples/plasma_b2c/components/Tabs/vertical/VerticalTabItem.config.js
CHANGED
|
@@ -13,7 +13,7 @@ var config = exports.config = {
|
|
|
13
13
|
},
|
|
14
14
|
variations: {
|
|
15
15
|
view: {
|
|
16
|
-
divider: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
16
|
+
divider: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.itemPaddingClear, _Tabs.tabsTokens.itemContentPaddingClear, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerWidth, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover)
|
|
17
17
|
},
|
|
18
18
|
size: {
|
|
19
19
|
xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.375rem;", ":auto;", ":2rem;", ":0 0.5rem;", ":0 0.375rem;", ":0.5rem 0.625rem;", ":0.625rem;", ":0.25rem;", ":0.125rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
|
|
@@ -13,10 +13,10 @@ var config = exports.config = {
|
|
|
13
13
|
},
|
|
14
14
|
variations: {
|
|
15
15
|
view: {
|
|
16
|
-
clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
17
|
-
secondary: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
18
|
-
divider: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
19
|
-
"default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
16
|
+
clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.itemPaddingClear, _Tabs.tabsTokens.itemContentPaddingClear, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover),
|
|
17
|
+
secondary: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.itemMarginLeftFilled, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover),
|
|
18
|
+
divider: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.itemPaddingClear, _Tabs.tabsTokens.itemContentPaddingClear, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover),
|
|
19
|
+
"default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.itemMarginLeftFilled, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover)
|
|
20
20
|
},
|
|
21
21
|
size: {
|
|
22
22
|
xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.375rem;", ":auto;", ":2rem;", ":0 0.5rem;", ":0 0.375rem;", ":1.75rem;", ":0.25rem;", ":0.125rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
|
package/styled-components/cjs/examples/plasma_web/components/Tabs/vertical/VerticalTabItem.config.js
CHANGED
|
@@ -13,7 +13,7 @@ var config = exports.config = {
|
|
|
13
13
|
},
|
|
14
14
|
variations: {
|
|
15
15
|
view: {
|
|
16
|
-
divider: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
16
|
+
divider: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.itemPaddingClear, _Tabs.tabsTokens.itemContentPaddingClear, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerWidth, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover)
|
|
17
17
|
},
|
|
18
18
|
size: {
|
|
19
19
|
xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.375rem;", ":auto;", ":2rem;", ":0 0.5rem;", ":0 0.375rem;", ":0.5rem 0.625rem;", ":0.625rem;", ":0.25rem;", ":0.125rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
|
|
@@ -67,7 +67,6 @@ export var tokens = {
|
|
|
67
67
|
itemColorActive: '--plasma-tab-item-color-active',
|
|
68
68
|
itemValueColorActive: '--plasma-tab-item-value-color-active',
|
|
69
69
|
itemBackgroundColorHover: '--plasma-tab-item-background-color-hover',
|
|
70
|
-
itemCursor: '--plasma-tab-item-cursor',
|
|
71
70
|
itemSelectedColor: '--plasma-tab-item-selected-color',
|
|
72
71
|
itemSelectedValueColor: '--plasma-tab-item-selected-value-color',
|
|
73
72
|
itemSelectedBackgroundColor: '--plasma-tab-item-selected-background-color',
|
|
@@ -14,7 +14,7 @@ export var RightContent = /*#__PURE__*/styled.div.withConfig({
|
|
|
14
14
|
export var LeftContent = /*#__PURE__*/styled.div.withConfig({
|
|
15
15
|
componentId: "plasma-new-hope__sc-lremls-3"
|
|
16
16
|
})(["display:flex;color:inherit;&:hover{color:inherit;}"]);
|
|
17
|
-
export var base = /*#__PURE__*/css(["position:relative;display:flex;align-items:center;justify-content:center;gap:var(", ");padding:var(", ",var(", "));appearance:none;border:none;outline:none;cursor:
|
|
17
|
+
export var base = /*#__PURE__*/css(["position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;align-items:center;white-space:nowrap;gap:var(", ");padding:var(", ",var(", "));appearance:none;border:none;outline:none;cursor:pointer;-webkit-tap-highlight-color:transparent;&:first-child{margin-left:0;}", ";&.", "{", "{overflow:hidden;text-overflow:ellipsis;}", "{overflow:hidden;text-overflow:ellipsis;}}"], tokens.itemContentGap, tokens.itemPaddingClear, tokens.itemPadding, /*#__PURE__*/addFocus({
|
|
18
18
|
outlineSize: '0.063rem',
|
|
19
19
|
outlineOffset: '-0.125rem',
|
|
20
20
|
outlineColor: /*#__PURE__*/"var(".concat(tokens.outlineFocusColor, ")"),
|
package/styled-components/es/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.js
CHANGED
|
@@ -16,7 +16,7 @@ export var RightContent = /*#__PURE__*/styled.div.withConfig({
|
|
|
16
16
|
export var LeftContent = /*#__PURE__*/styled.div.withConfig({
|
|
17
17
|
componentId: "plasma-new-hope__sc-1pflgj8-3"
|
|
18
18
|
})(["display:flex;color:inherit;&:hover{color:inherit;}"]);
|
|
19
|
-
export var base = /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n position: relative;\n
|
|
19
|
+
export var base = /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n position: relative;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n box-sizing: border-box;\n white-space: nowrap;\n\n gap: var(", ");\n padding: var(", ");\n\n appearance: none;\n border: none;\n outline: none;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n\n ", ";\n\n &.", " {\n ", " {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n ", " {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])), tokens.itemContentGap, tokens.itemPaddingOrientationVertical, /*#__PURE__*/addFocus({
|
|
20
20
|
outlineSize: '0.063rem',
|
|
21
21
|
outlineOffset: '-0.125rem',
|
|
22
22
|
outlineColor: /*#__PURE__*/"var(".concat(tokens.outlineFocusColor, ")"),
|
|
@@ -7,10 +7,10 @@ export var config = {
|
|
|
7
7
|
},
|
|
8
8
|
variations: {
|
|
9
9
|
view: {
|
|
10
|
-
clear: /*#__PURE__*/css(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
11
|
-
secondary: /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
12
|
-
divider: /*#__PURE__*/css(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
13
|
-
"default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
10
|
+
clear: /*#__PURE__*/css(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"], 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.itemSelectedDividerHeight, tabsTokens.itemSelectedDividerColor, tabsTokens.itemSelectedDividerColorHover),
|
|
11
|
+
secondary: /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"], 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),
|
|
12
|
+
divider: /*#__PURE__*/css(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"], 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.itemSelectedDividerHeight, tabsTokens.itemSelectedDividerColor, tabsTokens.itemSelectedDividerColorHover),
|
|
13
|
+
"default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"], 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)
|
|
14
14
|
},
|
|
15
15
|
size: {
|
|
16
16
|
xs: /*#__PURE__*/css(["", ":0.375rem;", ":auto;", ":2rem;", ":0 0.5rem;", ":0 0.375rem;", ":1.75rem;", ":0.25rem;", ":0.125rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], 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),
|
package/styled-components/es/examples/plasma_b2c/components/Tabs/vertical/VerticalTabItem.config.js
CHANGED
|
@@ -7,7 +7,7 @@ export var config = {
|
|
|
7
7
|
},
|
|
8
8
|
variations: {
|
|
9
9
|
view: {
|
|
10
|
-
divider: /*#__PURE__*/css(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
10
|
+
divider: /*#__PURE__*/css(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"], 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)
|
|
11
11
|
},
|
|
12
12
|
size: {
|
|
13
13
|
xs: /*#__PURE__*/css(["", ":0.375rem;", ":auto;", ":2rem;", ":0 0.5rem;", ":0 0.375rem;", ":0.5rem 0.625rem;", ":0.625rem;", ":0.25rem;", ":0.125rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], 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),
|
|
@@ -7,10 +7,10 @@ export var config = {
|
|
|
7
7
|
},
|
|
8
8
|
variations: {
|
|
9
9
|
view: {
|
|
10
|
-
clear: /*#__PURE__*/css(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
11
|
-
secondary: /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
12
|
-
divider: /*#__PURE__*/css(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
13
|
-
"default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
10
|
+
clear: /*#__PURE__*/css(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"], 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.itemSelectedDividerHeight, tabsTokens.itemSelectedDividerColor, tabsTokens.itemSelectedDividerColorHover),
|
|
11
|
+
secondary: /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-solid-card);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"], 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),
|
|
12
|
+
divider: /*#__PURE__*/css(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"], 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.itemSelectedDividerHeight, tabsTokens.itemSelectedDividerColor, tabsTokens.itemSelectedDividerColorHover),
|
|
13
|
+
"default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":background-color 0.3s ease-in-out;", ":0.125rem;", ":var(--surface-accent);", ":0rem;", ":var(--text-primary);", ":var(--text-primary);"], 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)
|
|
14
14
|
},
|
|
15
15
|
size: {
|
|
16
16
|
xs: /*#__PURE__*/css(["", ":0.375rem;", ":auto;", ":2rem;", ":0 0.5rem;", ":0 0.375rem;", ":1.75rem;", ":0.25rem;", ":0.125rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], 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),
|
package/styled-components/es/examples/plasma_web/components/Tabs/vertical/VerticalTabItem.config.js
CHANGED
|
@@ -7,7 +7,7 @@ export var config = {
|
|
|
7
7
|
},
|
|
8
8
|
variations: {
|
|
9
9
|
view: {
|
|
10
|
-
divider: /*#__PURE__*/css(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"
|
|
10
|
+
divider: /*#__PURE__*/css(["", ":var(--text-secondary);", ":var(--text-tertiary);", ":transparent;", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-active);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;", ":background-color 0.3s ease-in-out;", ":0;", ":0;", ":var(--surface-accent);", ":0.125rem;", ":0.125rem;", ":var(--text-primary);", ":var(--text-primary);"], 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)
|
|
11
11
|
},
|
|
12
12
|
size: {
|
|
13
13
|
xs: /*#__PURE__*/css(["", ":0.375rem;", ":auto;", ":2rem;", ":0 0.5rem;", ":0 0.375rem;", ":0.5rem 0.625rem;", ":0.625rem;", ":0.25rem;", ":0.125rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], 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),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;CAkBnB,CAAC;AAEF,eAAO,MAAM,MAAM
|
|
1
|
+
{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;CAkBnB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiFlB,CAAC"}
|
package/types/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.styles.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HorizontalTabItem.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.styles.ts"],"names":[],"mappings":";AAMA,eAAO,MAAM,aAAa,qKAKzB,CAAC;AAEF,eAAO,MAAM,YAAY,uKASxB,CAAC;AAEF,eAAO,MAAM,YAAY,qKAOxB,CAAC;AAEF,eAAO,MAAM,WAAW,qKAOvB,CAAC;AAEF,eAAO,MAAM,IAAI,
|
|
1
|
+
{"version":3,"file":"HorizontalTabItem.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.styles.ts"],"names":[],"mappings":";AAMA,eAAO,MAAM,aAAa,qKAKzB,CAAC;AAEF,eAAO,MAAM,YAAY,uKASxB,CAAC;AAEF,eAAO,MAAM,YAAY,qKAOxB,CAAC;AAEF,eAAO,MAAM,WAAW,qKAOvB,CAAC;AAEF,eAAO,MAAM,IAAI,0CAkDhB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VerticalTabItem.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.ts"],"names":[],"mappings":";AAMA,eAAO,MAAM,aAAa,qKAKzB,CAAC;AAEF,eAAO,MAAM,YAAY,uKAUxB,CAAC;AAEF,eAAO,MAAM,YAAY,qKAOxB,CAAC;AAEF,eAAO,MAAM,WAAW,qKAOvB,CAAC;AAEF,eAAO,MAAM,IAAI,
|
|
1
|
+
{"version":3,"file":"VerticalTabItem.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.ts"],"names":[],"mappings":";AAMA,eAAO,MAAM,aAAa,qKAKzB,CAAC;AAEF,eAAO,MAAM,YAAY,uKAUxB,CAAC;AAEF,eAAO,MAAM,YAAY,qKAOxB,CAAC;AAEF,eAAO,MAAM,WAAW,qKAOvB,CAAC;AAEF,eAAO,MAAM,IAAI,0CA6ChB,CAAC"}
|