@salutejs/plasma-new-hope 0.197.0-dev.0 → 0.197.1-dev.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (52) hide show
  1. package/cjs/components/Switch/Switch.css +2 -2
  2. package/cjs/components/Switch/Switch.tokens.js +9 -7
  3. package/cjs/components/Switch/Switch.tokens.js.map +1 -1
  4. package/cjs/components/Switch/_toggleSize/base.js +1 -1
  5. package/cjs/components/Switch/_toggleSize/base.js.map +1 -1
  6. package/cjs/components/Switch/_toggleSize/base_1e2ou53.css +1 -0
  7. package/cjs/components/Switch/_view/base.js +1 -1
  8. package/cjs/components/Switch/_view/{base_15atbyp.css → base_qbpw2g.css} +1 -1
  9. package/cjs/index.css +2 -2
  10. package/emotion/cjs/components/Switch/Switch.tokens.js +9 -7
  11. package/emotion/cjs/components/Switch/_toggleSize/base.js +1 -1
  12. package/emotion/cjs/examples/plasma_b2c/components/Switch/Switch.config.js +8 -8
  13. package/emotion/cjs/examples/plasma_b2c/components/Switch/Switch.outline.config.js +8 -8
  14. package/emotion/cjs/examples/plasma_web/components/Switch/Switch.config.js +8 -8
  15. package/emotion/cjs/examples/plasma_web/components/Switch/Switch.outline.config.js +8 -8
  16. package/emotion/es/components/Switch/Switch.tokens.js +9 -7
  17. package/emotion/es/components/Switch/_toggleSize/base.js +2 -2
  18. package/emotion/es/examples/plasma_b2c/components/Switch/Switch.config.js +8 -8
  19. package/emotion/es/examples/plasma_b2c/components/Switch/Switch.outline.config.js +8 -8
  20. package/emotion/es/examples/plasma_web/components/Switch/Switch.config.js +8 -8
  21. package/emotion/es/examples/plasma_web/components/Switch/Switch.outline.config.js +8 -8
  22. package/es/components/Switch/Switch.css +2 -2
  23. package/es/components/Switch/Switch.tokens.js +9 -7
  24. package/es/components/Switch/Switch.tokens.js.map +1 -1
  25. package/es/components/Switch/_toggleSize/base.js +1 -1
  26. package/es/components/Switch/_toggleSize/base.js.map +1 -1
  27. package/es/components/Switch/_toggleSize/base_1e2ou53.css +1 -0
  28. package/es/components/Switch/_view/base.js +1 -1
  29. package/es/components/Switch/_view/{base_15atbyp.css → base_qbpw2g.css} +1 -1
  30. package/es/index.css +2 -2
  31. package/package.json +2 -2
  32. package/styled-components/cjs/components/Switch/Switch.tokens.js +9 -7
  33. package/styled-components/cjs/components/Switch/_toggleSize/base.js +1 -1
  34. package/styled-components/cjs/examples/plasma_b2c/components/Switch/Switch.config.js +3 -3
  35. package/styled-components/cjs/examples/plasma_b2c/components/Switch/Switch.outline.config.js +3 -3
  36. package/styled-components/cjs/examples/plasma_web/components/Switch/Switch.config.js +3 -3
  37. package/styled-components/cjs/examples/plasma_web/components/Switch/Switch.outline.config.js +3 -3
  38. package/styled-components/es/components/Switch/Switch.tokens.js +9 -7
  39. package/styled-components/es/components/Switch/_toggleSize/base.js +2 -2
  40. package/styled-components/es/examples/plasma_b2c/components/Switch/Switch.config.js +3 -3
  41. package/styled-components/es/examples/plasma_b2c/components/Switch/Switch.outline.config.js +3 -3
  42. package/styled-components/es/examples/plasma_web/components/Switch/Switch.config.js +3 -3
  43. package/styled-components/es/examples/plasma_web/components/Switch/Switch.outline.config.js +3 -3
  44. package/types/components/Switch/Switch.tokens.d.ts +4 -2
  45. package/types/components/Switch/Switch.tokens.d.ts.map +1 -1
  46. package/types/components/Switch/_toggleSize/base.d.ts.map +1 -1
  47. package/types/examples/plasma_b2c/components/Switch/Switch.config.d.ts.map +1 -1
  48. package/types/examples/plasma_b2c/components/Switch/Switch.outline.config.d.ts.map +1 -1
  49. package/types/examples/plasma_web/components/Switch/Switch.config.d.ts.map +1 -1
  50. package/types/examples/plasma_web/components/Switch/Switch.outline.config.d.ts.map +1 -1
  51. package/cjs/components/Switch/_toggleSize/base_1d0b3t4.css +0 -1
  52. package/es/components/Switch/_toggleSize/base_1d0b3t4.css +0 -1
package/styled-components/cjs/components/Switch/Switch.tokens.js CHANGED
@@ -29,11 +29,12 @@ var tokens = exports.tokens = {
29
29
  verticalGap: '--plasma-switch-vertical-gap',
30
30
  trackWidth: '--plasma-switch__track-width',
31
31
  trackHeight: '--plasma-switch__track-height',
32
- trackBorderWidth: '--plasma-switch__track-border',
33
- trackBorderColorOn: '--plasma-switch__track-checked_true-border-color',
34
- trackBorderColorOnHover: '--plasma-switch__track-checked_true_hovered_true-border-color',
35
- trackBorderColorOff: '--plasma-switch__track-checked_false-border-color',
36
- trackBorderColorOffHover: '--plasma-switch__track-checked_false_hovered_true-border-color',
32
+ trackBorderWidthOn: '--plasma-switch__track_checked_true-border-width',
33
+ trackBorderWidthOff: '--plasma-switch__track_checked_false-border-width',
34
+ trackBorderColorOn: '--plasma-switch__track_checked_true-border-color',
35
+ trackBorderColorOnHover: '--plasma-switch__track_checked_true_hovered_true-border-color',
36
+ trackBorderColorOff: '--plasma-switch__track_checked_false-border-color',
37
+ trackBorderColorOffHover: '--plasma-switch__track_checked_false_hovered_true-border-color',
37
38
  trackBorderRadius: '--plasma-switch__track-border-radius',
38
39
  // NOTE: could be intersection with checked
39
40
  trackBackgroundColorOn: '--plasma-switch__track_checked_true-bg-color',
@@ -42,11 +43,12 @@ var tokens = exports.tokens = {
42
43
  trackBackgroundColorOffHover: '--plasma-switch__track_checked_false_hovered_true-bg-color',
43
44
  trackFocusColor: '--plasma-switch__track-focus-color',
44
45
  thumbSize: '--plasma-switch__thumb-size',
45
- thumbOffset: '--plasma-switch__thumb-offset',
46
+ thumbOffsetOn: '--plasma-switch__thumb_checked_true-offset',
47
+ thumbOffsetOff: '--plasma-switch__thumb_checked_false-offset',
46
48
  thumbBorderRadius: '--plasma-switch__thumb-border-radius',
47
49
  thumbPressScale: '--plasma-switch__thumb-scale',
48
50
  thumbBackgroundColorOn: '--plasma-switch__thumb_checked_true-bg-color',
49
- thumbBackgroundColorOff: '--plasma-switch__thumb-checked_false-bg-color',
51
+ thumbBackgroundColorOff: '--plasma-switch__thumb_checked_false-bg-color',
50
52
  thumbBoxShadow: '--plasma-switch__thumb-box-shadow',
51
53
  thumbBoxShadowOn: '--plasma-switch__thumb-box-shadow_checked_true',
52
54
  labelOffsetPrivate: '--plasma_private-switch__label-offset'
package/styled-components/cjs/components/Switch/_toggleSize/base.js CHANGED
@@ -7,4 +7,4 @@ exports.base = void 0;
7
7
  var _styledComponents = /*#__PURE__*/require("styled-components");
8
8
  var _Switch = /*#__PURE__*/require("../Switch.tokens");
9
9
  var _Switch2 = /*#__PURE__*/require("../Switch.styles");
10
- var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", "{box-sizing:border-box;flex:0 0 var(", ");border-style:solid;border-width:var(", ");border-radius:var(", ");width:var(", ");height:var(", ");&::after{width:var(", ");height:var(", ");border-radius:var(", ");margin:auto var(", ");}}:active:not([disabled]) ", "::after{width:calc(var(", ") * var(", ",1));}"], _Switch2.StyledTrigger, _Switch.tokens.trackWidth, _Switch.tokens.trackBorderWidth, _Switch.tokens.trackBorderRadius, _Switch.tokens.trackWidth, _Switch.tokens.trackHeight, _Switch.tokens.thumbSize, _Switch.tokens.thumbSize, _Switch.tokens.thumbBorderRadius, _Switch.tokens.thumbOffset, _Switch2.StyledTrigger, _Switch.tokens.thumbSize, _Switch.tokens.thumbPressScale);
10
+ var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", "{box-sizing:border-box;flex:0 0 var(", ");border-style:solid;border-width:var(", ");border-radius:var(", ");width:var(", ");height:var(", ");&::after{width:var(", ");height:var(", ");border-radius:var(", ");margin:auto var(", ");}}", ":checked ~ ", "{border-width:var(", ",var(", "));&::after{margin:auto var(", ");}}:active:not([disabled]) ", "::after{width:calc(var(", ") * var(", ",1));}"], _Switch2.StyledTrigger, _Switch.tokens.trackWidth, _Switch.tokens.trackBorderWidthOff, _Switch.tokens.trackBorderRadius, _Switch.tokens.trackWidth, _Switch.tokens.trackHeight, _Switch.tokens.thumbSize, _Switch.tokens.thumbSize, _Switch.tokens.thumbBorderRadius, _Switch.tokens.thumbOffsetOff, _Switch2.StyledInput, _Switch2.StyledTrigger, _Switch.tokens.trackBorderWidthOn, _Switch.tokens.trackBorderWidthOff, _Switch.tokens.thumbOffsetOn, _Switch2.StyledTrigger, _Switch.tokens.thumbSize, _Switch.tokens.thumbPressScale);
package/styled-components/cjs/examples/plasma_b2c/components/Switch/Switch.config.js CHANGED
@@ -21,11 +21,11 @@ var config = exports.config = {
21
21
  l: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-xs-letter-spacing);", ":0.25rem;", ":0.75rem;"], _Switch.switchTokens.fontFamily, _Switch.switchTokens.fontStyle, _Switch.switchTokens.fontWeight, _Switch.switchTokens.lineHeight, _Switch.switchTokens.fontSize, _Switch.switchTokens.letterSpacing, _Switch.switchTokens.descriptionFontFamily, _Switch.switchTokens.descriptionFontStyle, _Switch.switchTokens.descriptionFontWeight, _Switch.switchTokens.descriptionLineHeight, _Switch.switchTokens.descriptionFontSize, _Switch.switchTokens.descriptionLetterSpacing, _Switch.switchTokens.verticalGap, _Switch.switchTokens.labelOffset)
22
22
  },
23
23
  toggleSize: {
24
- l: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.5rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffset, _Switch.switchTokens.thumbPressScale),
25
- s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":1rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffset, _Switch.switchTokens.thumbPressScale)
24
+ l: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.5rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffsetOn, _Switch.switchTokens.thumbOffsetOff, _Switch.switchTokens.thumbPressScale),
25
+ s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":1rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffsetOn, _Switch.switchTokens.thumbOffsetOff, _Switch.switchTokens.thumbPressScale)
26
26
  },
27
27
  view: {
28
- "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":0rem;", ":var(--on-dark-surface-solid-default);", ":var(--on-dark-surface-solid-default);", ":0 1px 1px rgba(0,0,0,0.11);"], _Switch.switchTokens.labelColor, _Switch.switchTokens.descriptionColor, _Switch.switchTokens.trackBackgroundColorOn, _Switch.switchTokens.trackBackgroundColorOnHover, _Switch.switchTokens.trackBackgroundColorOff, _Switch.switchTokens.trackBackgroundColorOffHover, _Switch.switchTokens.trackBorderWidth, _Switch.switchTokens.thumbBackgroundColorOff, _Switch.switchTokens.thumbBackgroundColorOn, _Switch.switchTokens.thumbBoxShadow)
28
+ "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":0;", ":0;", ":var(--on-dark-surface-solid-default);", ":var(--on-dark-surface-solid-default);", ":0 1px 1px rgba(0,0,0,0.11);"], _Switch.switchTokens.labelColor, _Switch.switchTokens.descriptionColor, _Switch.switchTokens.trackBackgroundColorOn, _Switch.switchTokens.trackBackgroundColorOnHover, _Switch.switchTokens.trackBackgroundColorOff, _Switch.switchTokens.trackBackgroundColorOffHover, _Switch.switchTokens.trackBorderWidthOn, _Switch.switchTokens.trackBorderWidthOff, _Switch.switchTokens.thumbBackgroundColorOn, _Switch.switchTokens.thumbBackgroundColorOff, _Switch.switchTokens.thumbBoxShadow)
29
29
  },
30
30
  disabled: {
31
31
  "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;"], _Switch.switchTokens.disabledOpacity)
package/styled-components/cjs/examples/plasma_b2c/components/Switch/Switch.outline.config.js CHANGED
@@ -21,11 +21,11 @@ var config = exports.config = {
21
21
  l: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-xs-letter-spacing);", ":0.25rem;", ":0.75rem;"], _Switch.switchTokens.fontFamily, _Switch.switchTokens.fontStyle, _Switch.switchTokens.fontWeight, _Switch.switchTokens.lineHeight, _Switch.switchTokens.fontSize, _Switch.switchTokens.letterSpacing, _Switch.switchTokens.descriptionFontFamily, _Switch.switchTokens.descriptionFontStyle, _Switch.switchTokens.descriptionFontWeight, _Switch.switchTokens.descriptionLineHeight, _Switch.switchTokens.descriptionFontSize, _Switch.switchTokens.descriptionLetterSpacing, _Switch.switchTokens.verticalGap, _Switch.switchTokens.labelOffset)
22
22
  },
23
23
  toggleSize: {
24
- l: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.375rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffset, _Switch.switchTokens.thumbPressScale),
25
- s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":0.875rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffset, _Switch.switchTokens.thumbPressScale)
24
+ l: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.375rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffsetOn, _Switch.switchTokens.thumbOffsetOff, _Switch.switchTokens.thumbPressScale),
25
+ s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":0.875rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffsetOn, _Switch.switchTokens.thumbOffsetOff, _Switch.switchTokens.thumbPressScale)
26
26
  },
27
27
  view: {
28
- "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":0.0625rem;", ":var(--outline-secondary);", ":var(--outline-secondary-hover);", ":var(--outline-accent);", ":var(--outline-accent-hover);", ":var(--text-tertiary);", ":var(--text-accent);", ":0 1px 1px rgba(0,0,0,0.11);"], _Switch.switchTokens.labelColor, _Switch.switchTokens.descriptionColor, _Switch.switchTokens.trackBorderWidth, _Switch.switchTokens.trackBorderColorOff, _Switch.switchTokens.trackBorderColorOffHover, _Switch.switchTokens.trackBorderColorOn, _Switch.switchTokens.trackBorderColorOnHover, _Switch.switchTokens.thumbBackgroundColorOff, _Switch.switchTokens.thumbBackgroundColorOn, _Switch.switchTokens.thumbBoxShadow)
28
+ "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":0.0625rem;", ":0.0625rem;", ":var(--outline-accent);", ":var(--outline-accent-hover);", ":var(--outline-secondary);", ":var(--outline-secondary-hover);", ":var(--text-accent);", ":var(--text-tertiary);", ":0 1px 1px rgba(0,0,0,0.11);"], _Switch.switchTokens.labelColor, _Switch.switchTokens.descriptionColor, _Switch.switchTokens.trackBorderWidthOn, _Switch.switchTokens.trackBorderWidthOff, _Switch.switchTokens.trackBorderColorOn, _Switch.switchTokens.trackBorderColorOnHover, _Switch.switchTokens.trackBorderColorOff, _Switch.switchTokens.trackBorderColorOffHover, _Switch.switchTokens.thumbBackgroundColorOn, _Switch.switchTokens.thumbBackgroundColorOff, _Switch.switchTokens.thumbBoxShadow)
29
29
  },
30
30
  disabled: {
31
31
  "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;"], _Switch.switchTokens.disabledOpacity)
package/styled-components/cjs/examples/plasma_web/components/Switch/Switch.config.js CHANGED
@@ -21,11 +21,11 @@ var config = exports.config = {
21
21
  l: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-xs-letter-spacing);", ":0.25rem;", ":0.75rem;"], _Switch.switchTokens.fontFamily, _Switch.switchTokens.fontStyle, _Switch.switchTokens.fontWeight, _Switch.switchTokens.lineHeight, _Switch.switchTokens.fontSize, _Switch.switchTokens.letterSpacing, _Switch.switchTokens.descriptionFontFamily, _Switch.switchTokens.descriptionFontStyle, _Switch.switchTokens.descriptionFontWeight, _Switch.switchTokens.descriptionLineHeight, _Switch.switchTokens.descriptionFontSize, _Switch.switchTokens.descriptionLetterSpacing, _Switch.switchTokens.verticalGap, _Switch.switchTokens.labelOffset)
22
22
  },
23
23
  toggleSize: {
24
- l: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.5rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffset, _Switch.switchTokens.thumbPressScale),
25
- s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":1rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffset, _Switch.switchTokens.thumbPressScale)
24
+ l: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.5rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffsetOn, _Switch.switchTokens.thumbOffsetOff, _Switch.switchTokens.thumbPressScale),
25
+ s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":1rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffsetOn, _Switch.switchTokens.thumbOffsetOff, _Switch.switchTokens.thumbPressScale)
26
26
  },
27
27
  view: {
28
- "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":0rem;", ":var(--on-dark-surface-solid-default);", ":var(--on-dark-surface-solid-default);", ":0 1px 1px rgba(0,0,0,0.11);"], _Switch.switchTokens.labelColor, _Switch.switchTokens.descriptionColor, _Switch.switchTokens.trackBackgroundColorOn, _Switch.switchTokens.trackBackgroundColorOnHover, _Switch.switchTokens.trackBackgroundColorOff, _Switch.switchTokens.trackBackgroundColorOffHover, _Switch.switchTokens.trackBorderWidth, _Switch.switchTokens.thumbBackgroundColorOff, _Switch.switchTokens.thumbBackgroundColorOn, _Switch.switchTokens.thumbBoxShadow)
28
+ "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":0;", ":0;", ":var(--on-dark-surface-solid-default);", ":var(--on-dark-surface-solid-default);", ":0 1px 1px rgba(0,0,0,0.11);"], _Switch.switchTokens.labelColor, _Switch.switchTokens.descriptionColor, _Switch.switchTokens.trackBackgroundColorOn, _Switch.switchTokens.trackBackgroundColorOnHover, _Switch.switchTokens.trackBackgroundColorOff, _Switch.switchTokens.trackBackgroundColorOffHover, _Switch.switchTokens.trackBorderWidthOn, _Switch.switchTokens.trackBorderWidthOff, _Switch.switchTokens.thumbBackgroundColorOn, _Switch.switchTokens.thumbBackgroundColorOff, _Switch.switchTokens.thumbBoxShadow)
29
29
  },
30
30
  disabled: {
31
31
  "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;"], _Switch.switchTokens.disabledOpacity)
package/styled-components/cjs/examples/plasma_web/components/Switch/Switch.outline.config.js CHANGED
@@ -21,11 +21,11 @@ var config = exports.config = {
21
21
  l: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-xs-letter-spacing);", ":0.25rem;", ":0.75rem;"], _Switch.switchTokens.fontFamily, _Switch.switchTokens.fontStyle, _Switch.switchTokens.fontWeight, _Switch.switchTokens.lineHeight, _Switch.switchTokens.fontSize, _Switch.switchTokens.letterSpacing, _Switch.switchTokens.descriptionFontFamily, _Switch.switchTokens.descriptionFontStyle, _Switch.switchTokens.descriptionFontWeight, _Switch.switchTokens.descriptionLineHeight, _Switch.switchTokens.descriptionFontSize, _Switch.switchTokens.descriptionLetterSpacing, _Switch.switchTokens.verticalGap, _Switch.switchTokens.labelOffset)
22
22
  },
23
23
  toggleSize: {
24
- l: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.375rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffset, _Switch.switchTokens.thumbPressScale),
25
- s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":0.875rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffset, _Switch.switchTokens.thumbPressScale)
24
+ l: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.375rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffsetOn, _Switch.switchTokens.thumbOffsetOff, _Switch.switchTokens.thumbPressScale),
25
+ s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":0.875rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffsetOn, _Switch.switchTokens.thumbOffsetOff, _Switch.switchTokens.thumbPressScale)
26
26
  },
27
27
  view: {
28
- "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":0.0625rem;", ":var(--outline-secondary);", ":var(--outline-secondary-hover);", ":var(--outline-accent);", ":var(--outline-accent-hover);", ":var(--text-tertiary);", ":var(--text-accent);", ":0 1px 1px rgba(0,0,0,0.11);"], _Switch.switchTokens.labelColor, _Switch.switchTokens.descriptionColor, _Switch.switchTokens.trackBorderWidth, _Switch.switchTokens.trackBorderColorOff, _Switch.switchTokens.trackBorderColorOffHover, _Switch.switchTokens.trackBorderColorOn, _Switch.switchTokens.trackBorderColorOnHover, _Switch.switchTokens.thumbBackgroundColorOff, _Switch.switchTokens.thumbBackgroundColorOn, _Switch.switchTokens.thumbBoxShadow)
28
+ "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":0.0625rem;", ":0.0625rem;", ":var(--outline-accent);", ":var(--outline-accent-hover);", ":var(--outline-secondary);", ":var(--outline-secondary-hover);", ":var(--text-accent);", ":var(--text-tertiary);", ":0 1px 1px rgba(0,0,0,0.11);"], _Switch.switchTokens.labelColor, _Switch.switchTokens.descriptionColor, _Switch.switchTokens.trackBorderWidthOn, _Switch.switchTokens.trackBorderWidthOff, _Switch.switchTokens.trackBorderColorOn, _Switch.switchTokens.trackBorderColorOnHover, _Switch.switchTokens.trackBorderColorOff, _Switch.switchTokens.trackBorderColorOffHover, _Switch.switchTokens.thumbBackgroundColorOn, _Switch.switchTokens.thumbBackgroundColorOff, _Switch.switchTokens.thumbBoxShadow)
29
29
  },
30
30
  disabled: {
31
31
  "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;"], _Switch.switchTokens.disabledOpacity)
package/styled-components/es/components/Switch/Switch.tokens.js CHANGED
@@ -23,11 +23,12 @@ export var tokens = {
23
23
  verticalGap: '--plasma-switch-vertical-gap',
24
24
  trackWidth: '--plasma-switch__track-width',
25
25
  trackHeight: '--plasma-switch__track-height',
26
- trackBorderWidth: '--plasma-switch__track-border',
27
- trackBorderColorOn: '--plasma-switch__track-checked_true-border-color',
28
- trackBorderColorOnHover: '--plasma-switch__track-checked_true_hovered_true-border-color',
29
- trackBorderColorOff: '--plasma-switch__track-checked_false-border-color',
30
- trackBorderColorOffHover: '--plasma-switch__track-checked_false_hovered_true-border-color',
26
+ trackBorderWidthOn: '--plasma-switch__track_checked_true-border-width',
27
+ trackBorderWidthOff: '--plasma-switch__track_checked_false-border-width',
28
+ trackBorderColorOn: '--plasma-switch__track_checked_true-border-color',
29
+ trackBorderColorOnHover: '--plasma-switch__track_checked_true_hovered_true-border-color',
30
+ trackBorderColorOff: '--plasma-switch__track_checked_false-border-color',
31
+ trackBorderColorOffHover: '--plasma-switch__track_checked_false_hovered_true-border-color',
31
32
  trackBorderRadius: '--plasma-switch__track-border-radius',
32
33
  // NOTE: could be intersection with checked
33
34
  trackBackgroundColorOn: '--plasma-switch__track_checked_true-bg-color',
@@ -36,11 +37,12 @@ export var tokens = {
36
37
  trackBackgroundColorOffHover: '--plasma-switch__track_checked_false_hovered_true-bg-color',
37
38
  trackFocusColor: '--plasma-switch__track-focus-color',
38
39
  thumbSize: '--plasma-switch__thumb-size',
39
- thumbOffset: '--plasma-switch__thumb-offset',
40
+ thumbOffsetOn: '--plasma-switch__thumb_checked_true-offset',
41
+ thumbOffsetOff: '--plasma-switch__thumb_checked_false-offset',
40
42
  thumbBorderRadius: '--plasma-switch__thumb-border-radius',
41
43
  thumbPressScale: '--plasma-switch__thumb-scale',
42
44
  thumbBackgroundColorOn: '--plasma-switch__thumb_checked_true-bg-color',
43
- thumbBackgroundColorOff: '--plasma-switch__thumb-checked_false-bg-color',
45
+ thumbBackgroundColorOff: '--plasma-switch__thumb_checked_false-bg-color',
44
46
  thumbBoxShadow: '--plasma-switch__thumb-box-shadow',
45
47
  thumbBoxShadowOn: '--plasma-switch__thumb-box-shadow_checked_true',
46
48
  labelOffsetPrivate: '--plasma_private-switch__label-offset'
package/styled-components/es/components/Switch/_toggleSize/base.js CHANGED
@@ -1,4 +1,4 @@
1
1
  import { css } from 'styled-components';
2
2
  import { tokens } from '../Switch.tokens';
3
- import { StyledTrigger } from '../Switch.styles';
4
- export var base = /*#__PURE__*/css(["", "{box-sizing:border-box;flex:0 0 var(", ");border-style:solid;border-width:var(", ");border-radius:var(", ");width:var(", ");height:var(", ");&::after{width:var(", ");height:var(", ");border-radius:var(", ");margin:auto var(", ");}}:active:not([disabled]) ", "::after{width:calc(var(", ") * var(", ",1));}"], StyledTrigger, tokens.trackWidth, tokens.trackBorderWidth, tokens.trackBorderRadius, tokens.trackWidth, tokens.trackHeight, tokens.thumbSize, tokens.thumbSize, tokens.thumbBorderRadius, tokens.thumbOffset, StyledTrigger, tokens.thumbSize, tokens.thumbPressScale);
3
+ import { StyledInput, StyledTrigger } from '../Switch.styles';
4
+ export var base = /*#__PURE__*/css(["", "{box-sizing:border-box;flex:0 0 var(", ");border-style:solid;border-width:var(", ");border-radius:var(", ");width:var(", ");height:var(", ");&::after{width:var(", ");height:var(", ");border-radius:var(", ");margin:auto var(", ");}}", ":checked ~ ", "{border-width:var(", ",var(", "));&::after{margin:auto var(", ");}}:active:not([disabled]) ", "::after{width:calc(var(", ") * var(", ",1));}"], StyledTrigger, tokens.trackWidth, tokens.trackBorderWidthOff, tokens.trackBorderRadius, tokens.trackWidth, tokens.trackHeight, tokens.thumbSize, tokens.thumbSize, tokens.thumbBorderRadius, tokens.thumbOffsetOff, StyledInput, StyledTrigger, tokens.trackBorderWidthOn, tokens.trackBorderWidthOff, tokens.thumbOffsetOn, StyledTrigger, tokens.thumbSize, tokens.thumbPressScale);
package/styled-components/es/examples/plasma_b2c/components/Switch/Switch.config.js CHANGED
@@ -15,11 +15,11 @@ export var config = {
15
15
  l: /*#__PURE__*/css(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-xs-letter-spacing);", ":0.25rem;", ":0.75rem;"], switchTokens.fontFamily, switchTokens.fontStyle, switchTokens.fontWeight, switchTokens.lineHeight, switchTokens.fontSize, switchTokens.letterSpacing, switchTokens.descriptionFontFamily, switchTokens.descriptionFontStyle, switchTokens.descriptionFontWeight, switchTokens.descriptionLineHeight, switchTokens.descriptionFontSize, switchTokens.descriptionLetterSpacing, switchTokens.verticalGap, switchTokens.labelOffset)
16
16
  },
17
17
  toggleSize: {
18
- l: /*#__PURE__*/css(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.5rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffset, switchTokens.thumbPressScale),
19
- s: /*#__PURE__*/css(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":1rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffset, switchTokens.thumbPressScale)
18
+ l: /*#__PURE__*/css(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.5rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffsetOn, switchTokens.thumbOffsetOff, switchTokens.thumbPressScale),
19
+ s: /*#__PURE__*/css(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":1rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffsetOn, switchTokens.thumbOffsetOff, switchTokens.thumbPressScale)
20
20
  },
21
21
  view: {
22
- "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":0rem;", ":var(--on-dark-surface-solid-default);", ":var(--on-dark-surface-solid-default);", ":0 1px 1px rgba(0,0,0,0.11);"], switchTokens.labelColor, switchTokens.descriptionColor, switchTokens.trackBackgroundColorOn, switchTokens.trackBackgroundColorOnHover, switchTokens.trackBackgroundColorOff, switchTokens.trackBackgroundColorOffHover, switchTokens.trackBorderWidth, switchTokens.thumbBackgroundColorOff, switchTokens.thumbBackgroundColorOn, switchTokens.thumbBoxShadow)
22
+ "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":0;", ":0;", ":var(--on-dark-surface-solid-default);", ":var(--on-dark-surface-solid-default);", ":0 1px 1px rgba(0,0,0,0.11);"], switchTokens.labelColor, switchTokens.descriptionColor, switchTokens.trackBackgroundColorOn, switchTokens.trackBackgroundColorOnHover, switchTokens.trackBackgroundColorOff, switchTokens.trackBackgroundColorOffHover, switchTokens.trackBorderWidthOn, switchTokens.trackBorderWidthOff, switchTokens.thumbBackgroundColorOn, switchTokens.thumbBackgroundColorOff, switchTokens.thumbBoxShadow)
23
23
  },
24
24
  disabled: {
25
25
  "true": /*#__PURE__*/css(["", ":0.4;"], switchTokens.disabledOpacity)
package/styled-components/es/examples/plasma_b2c/components/Switch/Switch.outline.config.js CHANGED
@@ -15,11 +15,11 @@ export var config = {
15
15
  l: /*#__PURE__*/css(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-xs-letter-spacing);", ":0.25rem;", ":0.75rem;"], switchTokens.fontFamily, switchTokens.fontStyle, switchTokens.fontWeight, switchTokens.lineHeight, switchTokens.fontSize, switchTokens.letterSpacing, switchTokens.descriptionFontFamily, switchTokens.descriptionFontStyle, switchTokens.descriptionFontWeight, switchTokens.descriptionLineHeight, switchTokens.descriptionFontSize, switchTokens.descriptionLetterSpacing, switchTokens.verticalGap, switchTokens.labelOffset)
16
16
  },
17
17
  toggleSize: {
18
- l: /*#__PURE__*/css(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.375rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffset, switchTokens.thumbPressScale),
19
- s: /*#__PURE__*/css(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":0.875rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffset, switchTokens.thumbPressScale)
18
+ l: /*#__PURE__*/css(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.375rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffsetOn, switchTokens.thumbOffsetOff, switchTokens.thumbPressScale),
19
+ s: /*#__PURE__*/css(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":0.875rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffsetOn, switchTokens.thumbOffsetOff, switchTokens.thumbPressScale)
20
20
  },
21
21
  view: {
22
- "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":0.0625rem;", ":var(--outline-secondary);", ":var(--outline-secondary-hover);", ":var(--outline-accent);", ":var(--outline-accent-hover);", ":var(--text-tertiary);", ":var(--text-accent);", ":0 1px 1px rgba(0,0,0,0.11);"], switchTokens.labelColor, switchTokens.descriptionColor, switchTokens.trackBorderWidth, switchTokens.trackBorderColorOff, switchTokens.trackBorderColorOffHover, switchTokens.trackBorderColorOn, switchTokens.trackBorderColorOnHover, switchTokens.thumbBackgroundColorOff, switchTokens.thumbBackgroundColorOn, switchTokens.thumbBoxShadow)
22
+ "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":0.0625rem;", ":0.0625rem;", ":var(--outline-accent);", ":var(--outline-accent-hover);", ":var(--outline-secondary);", ":var(--outline-secondary-hover);", ":var(--text-accent);", ":var(--text-tertiary);", ":0 1px 1px rgba(0,0,0,0.11);"], switchTokens.labelColor, switchTokens.descriptionColor, switchTokens.trackBorderWidthOn, switchTokens.trackBorderWidthOff, switchTokens.trackBorderColorOn, switchTokens.trackBorderColorOnHover, switchTokens.trackBorderColorOff, switchTokens.trackBorderColorOffHover, switchTokens.thumbBackgroundColorOn, switchTokens.thumbBackgroundColorOff, switchTokens.thumbBoxShadow)
23
23
  },
24
24
  disabled: {
25
25
  "true": /*#__PURE__*/css(["", ":0.4;"], switchTokens.disabledOpacity)
package/styled-components/es/examples/plasma_web/components/Switch/Switch.config.js CHANGED
@@ -15,11 +15,11 @@ export var config = {
15
15
  l: /*#__PURE__*/css(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-xs-letter-spacing);", ":0.25rem;", ":0.75rem;"], switchTokens.fontFamily, switchTokens.fontStyle, switchTokens.fontWeight, switchTokens.lineHeight, switchTokens.fontSize, switchTokens.letterSpacing, switchTokens.descriptionFontFamily, switchTokens.descriptionFontStyle, switchTokens.descriptionFontWeight, switchTokens.descriptionLineHeight, switchTokens.descriptionFontSize, switchTokens.descriptionLetterSpacing, switchTokens.verticalGap, switchTokens.labelOffset)
16
16
  },
17
17
  toggleSize: {
18
- l: /*#__PURE__*/css(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.5rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffset, switchTokens.thumbPressScale),
19
- s: /*#__PURE__*/css(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":1rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffset, switchTokens.thumbPressScale)
18
+ l: /*#__PURE__*/css(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.5rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffsetOn, switchTokens.thumbOffsetOff, switchTokens.thumbPressScale),
19
+ s: /*#__PURE__*/css(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":1rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffsetOn, switchTokens.thumbOffsetOff, switchTokens.thumbPressScale)
20
20
  },
21
21
  view: {
22
- "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":0rem;", ":var(--on-dark-surface-solid-default);", ":var(--on-dark-surface-solid-default);", ":0 1px 1px rgba(0,0,0,0.11);"], switchTokens.labelColor, switchTokens.descriptionColor, switchTokens.trackBackgroundColorOn, switchTokens.trackBackgroundColorOnHover, switchTokens.trackBackgroundColorOff, switchTokens.trackBackgroundColorOffHover, switchTokens.trackBorderWidth, switchTokens.thumbBackgroundColorOff, switchTokens.thumbBackgroundColorOn, switchTokens.thumbBoxShadow)
22
+ "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":0;", ":0;", ":var(--on-dark-surface-solid-default);", ":var(--on-dark-surface-solid-default);", ":0 1px 1px rgba(0,0,0,0.11);"], switchTokens.labelColor, switchTokens.descriptionColor, switchTokens.trackBackgroundColorOn, switchTokens.trackBackgroundColorOnHover, switchTokens.trackBackgroundColorOff, switchTokens.trackBackgroundColorOffHover, switchTokens.trackBorderWidthOn, switchTokens.trackBorderWidthOff, switchTokens.thumbBackgroundColorOn, switchTokens.thumbBackgroundColorOff, switchTokens.thumbBoxShadow)
23
23
  },
24
24
  disabled: {
25
25
  "true": /*#__PURE__*/css(["", ":0.4;"], switchTokens.disabledOpacity)
package/styled-components/es/examples/plasma_web/components/Switch/Switch.outline.config.js CHANGED
@@ -15,11 +15,11 @@ export var config = {
15
15
  l: /*#__PURE__*/css(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-xs-letter-spacing);", ":0.25rem;", ":0.75rem;"], switchTokens.fontFamily, switchTokens.fontStyle, switchTokens.fontWeight, switchTokens.lineHeight, switchTokens.fontSize, switchTokens.letterSpacing, switchTokens.descriptionFontFamily, switchTokens.descriptionFontStyle, switchTokens.descriptionFontWeight, switchTokens.descriptionLineHeight, switchTokens.descriptionFontSize, switchTokens.descriptionLetterSpacing, switchTokens.verticalGap, switchTokens.labelOffset)
16
16
  },
17
17
  toggleSize: {
18
- l: /*#__PURE__*/css(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.375rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffset, switchTokens.thumbPressScale),
19
- s: /*#__PURE__*/css(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":0.875rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffset, switchTokens.thumbPressScale)
18
+ l: /*#__PURE__*/css(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.375rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffsetOn, switchTokens.thumbOffsetOff, switchTokens.thumbPressScale),
19
+ s: /*#__PURE__*/css(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":0.875rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":0.125rem;", ":1.25;"], switchTokens.trackWidth, switchTokens.trackHeight, switchTokens.trackBorderRadius, switchTokens.trackHeight, switchTokens.thumbSize, switchTokens.thumbBorderRadius, switchTokens.thumbSize, switchTokens.thumbOffsetOn, switchTokens.thumbOffsetOff, switchTokens.thumbPressScale)
20
20
  },
21
21
  view: {
22
- "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":0.0625rem;", ":var(--outline-secondary);", ":var(--outline-secondary-hover);", ":var(--outline-accent);", ":var(--outline-accent-hover);", ":var(--text-tertiary);", ":var(--text-accent);", ":0 1px 1px rgba(0,0,0,0.11);"], switchTokens.labelColor, switchTokens.descriptionColor, switchTokens.trackBorderWidth, switchTokens.trackBorderColorOff, switchTokens.trackBorderColorOffHover, switchTokens.trackBorderColorOn, switchTokens.trackBorderColorOnHover, switchTokens.thumbBackgroundColorOff, switchTokens.thumbBackgroundColorOn, switchTokens.thumbBoxShadow)
22
+ "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-secondary);", ":0.0625rem;", ":0.0625rem;", ":var(--outline-accent);", ":var(--outline-accent-hover);", ":var(--outline-secondary);", ":var(--outline-secondary-hover);", ":var(--text-accent);", ":var(--text-tertiary);", ":0 1px 1px rgba(0,0,0,0.11);"], switchTokens.labelColor, switchTokens.descriptionColor, switchTokens.trackBorderWidthOn, switchTokens.trackBorderWidthOff, switchTokens.trackBorderColorOn, switchTokens.trackBorderColorOnHover, switchTokens.trackBorderColorOff, switchTokens.trackBorderColorOffHover, switchTokens.thumbBackgroundColorOn, switchTokens.thumbBackgroundColorOff, switchTokens.thumbBoxShadow)
23
23
  },
24
24
  disabled: {
25
25
  "true": /*#__PURE__*/css(["", ":0.4;"], switchTokens.disabledOpacity)
package/types/components/Switch/Switch.tokens.d.ts CHANGED
@@ -20,7 +20,8 @@ export declare const tokens: {
20
20
  verticalGap: string;
21
21
  trackWidth: string;
22
22
  trackHeight: string;
23
- trackBorderWidth: string;
23
+ trackBorderWidthOn: string;
24
+ trackBorderWidthOff: string;
24
25
  trackBorderColorOn: string;
25
26
  trackBorderColorOnHover: string;
26
27
  trackBorderColorOff: string;
@@ -32,7 +33,8 @@ export declare const tokens: {
32
33
  trackBackgroundColorOffHover: string;
33
34
  trackFocusColor: string;
34
35
  thumbSize: string;
35
- thumbOffset: string;
36
+ thumbOffsetOn: string;
37
+ thumbOffsetOff: string;
36
38
  thumbBorderRadius: string;
37
39
  thumbPressScale: string;
38
40
  thumbBackgroundColorOn: string;
package/types/components/Switch/Switch.tokens.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/Switch/Switch.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;IAwBf,6DAA6D;;;;;;;;;;;;;;;;;;;;;;;;;CAiChE,CAAC;AAEF,eAAO,MAAM,OAAO;;;CAGnB,CAAC"}
1
+ {"version":3,"file":"Switch.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/Switch/Switch.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;IAwBf,6DAA6D;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmChE,CAAC;AAEF,eAAO,MAAM,OAAO;;;CAGnB,CAAC"}
package/types/components/Switch/_toggleSize/base.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../src/components/Switch/_toggleSize/base.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,IAAI,0CAuBhB,CAAC"}
1
+ {"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../src/components/Switch/_toggleSize/base.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,IAAI,0CA+BhB,CAAC"}
package/types/examples/plasma_b2c/components/Switch/Switch.config.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.config.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_b2c/components/Switch/Switch.config.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwGlB,CAAC"}
1
+ {"version":3,"file":"Switch.config.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_b2c/components/Switch/Switch.config.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2GlB,CAAC"}
package/types/examples/plasma_b2c/components/Switch/Switch.outline.config.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.outline.config.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_b2c/components/Switch/Switch.outline.config.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwGlB,CAAC"}
1
+ {"version":3,"file":"Switch.outline.config.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_b2c/components/Switch/Switch.outline.config.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2GlB,CAAC"}
package/types/examples/plasma_web/components/Switch/Switch.config.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.config.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_web/components/Switch/Switch.config.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwGlB,CAAC"}
1
+ {"version":3,"file":"Switch.config.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_web/components/Switch/Switch.config.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2GlB,CAAC"}
package/types/examples/plasma_web/components/Switch/Switch.outline.config.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.outline.config.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_web/components/Switch/Switch.outline.config.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwGlB,CAAC"}
1
+ {"version":3,"file":"Switch.outline.config.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_web/components/Switch/Switch.outline.config.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2GlB,CAAC"}
package/cjs/components/Switch/_toggleSize/base_1d0b3t4.css DELETED
@@ -1 +0,0 @@
1
- .b1wld3h3 .s2cs3kf{box-sizing:border-box;-webkit-flex:0 0 var(--plasma-switch__track-width);-ms-flex:0 0 var(--plasma-switch__track-width);flex:0 0 var(--plasma-switch__track-width);border-style:solid;border-width:var(--plasma-switch__track-border);border-radius:var(--plasma-switch__track-border-radius);width:var(--plasma-switch__track-width);height:var(--plasma-switch__track-height);}.b1wld3h3 .s2cs3kf::after{width:var(--plasma-switch__thumb-size);height:var(--plasma-switch__thumb-size);border-radius:var(--plasma-switch__thumb-border-radius);margin:auto var(--plasma-switch__thumb-offset);}.b1wld3h3:active:not([disabled]) .s2cs3kf::after{width:calc(var(--plasma-switch__thumb-size) * var(--plasma-switch__thumb-scale,1));}
package/es/components/Switch/_toggleSize/base_1d0b3t4.css DELETED
@@ -1 +0,0 @@
1
- .b1wld3h3 .s2cs3kf{box-sizing:border-box;-webkit-flex:0 0 var(--plasma-switch__track-width);-ms-flex:0 0 var(--plasma-switch__track-width);flex:0 0 var(--plasma-switch__track-width);border-style:solid;border-width:var(--plasma-switch__track-border);border-radius:var(--plasma-switch__track-border-radius);width:var(--plasma-switch__track-width);height:var(--plasma-switch__track-height);}.b1wld3h3 .s2cs3kf::after{width:var(--plasma-switch__thumb-size);height:var(--plasma-switch__thumb-size);border-radius:var(--plasma-switch__thumb-border-radius);margin:auto var(--plasma-switch__thumb-offset);}.b1wld3h3:active:not([disabled]) .s2cs3kf::after{width:calc(var(--plasma-switch__thumb-size) * var(--plasma-switch__thumb-scale,1));}