@salutejs/sdds-cs 0.313.1-canary.1946.14663041744.0 → 0.313.1-canary.1948.14708113539.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.
Files changed (30) hide show
  1. package/components/Chip/Chip.config.d.ts +6 -0
  2. package/components/Chip/Chip.config.js +10 -4
  3. package/components/Chip/Chip.d.ts +6 -0
  4. package/components/DatePicker/DatePicker.config.js +1 -1
  5. package/components/DatePicker/DatePicker.d.ts +6 -4
  6. package/components/Tabs/horizontal/HorizontalTabItem.config.js +4 -4
  7. package/components/Tabs/vertical/VerticalTabItem.config.js +1 -1
  8. package/components/Tree/Tree.config.js +1 -1
  9. package/emotion/cjs/components/Chip/Chip.config.js +10 -4
  10. package/emotion/cjs/components/Chip/Chip.stories.tsx +5 -26
  11. package/emotion/cjs/components/DatePicker/DatePicker.config.js +1 -1
  12. package/emotion/cjs/components/DatePicker/DatePicker.stories.tsx +7 -10
  13. package/emotion/cjs/components/Select/Select.stories.tsx +1 -0
  14. package/emotion/cjs/components/Tabs/horizontal/HorizontalTabItem.config.js +4 -4
  15. package/emotion/cjs/components/Tabs/vertical/VerticalTabItem.config.js +1 -1
  16. package/emotion/cjs/components/Tree/Tree.config.js +1 -1
  17. package/emotion/es/components/Chip/Chip.config.js +10 -4
  18. package/emotion/es/components/Chip/Chip.stories.tsx +5 -26
  19. package/emotion/es/components/DatePicker/DatePicker.config.js +1 -1
  20. package/emotion/es/components/DatePicker/DatePicker.stories.tsx +7 -10
  21. package/emotion/es/components/Select/Select.stories.tsx +1 -0
  22. package/emotion/es/components/Tabs/horizontal/HorizontalTabItem.config.js +4 -4
  23. package/emotion/es/components/Tabs/vertical/VerticalTabItem.config.js +1 -1
  24. package/emotion/es/components/Tree/Tree.config.js +1 -1
  25. package/es/components/Chip/Chip.config.js +10 -4
  26. package/es/components/DatePicker/DatePicker.config.js +1 -1
  27. package/es/components/Tabs/horizontal/HorizontalTabItem.config.js +4 -4
  28. package/es/components/Tabs/vertical/VerticalTabItem.config.js +1 -1
  29. package/es/components/Tree/Tree.config.js +1 -1
  30. package/package.json +5 -5
package/components/Chip/Chip.config.d.ts CHANGED
@@ -14,8 +14,14 @@ export declare const config: {
14
14
  s: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
15
15
  xs: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
16
16
  };
17
+ disabled: {
18
+ true: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
19
+ };
17
20
  focused: {
18
21
  true: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
19
22
  };
23
+ pilled: {
24
+ true: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
25
+ };
20
26
  };
21
27
  };
package/components/Chip/Chip.config.js CHANGED
@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.config = void 0;
7
7
  var _styledComponents = /*#__PURE__*/require("@salutejs/plasma-new-hope/styled-components");
8
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
8
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
9
9
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
10
10
  var config = exports.config = {
11
11
  defaults: {
@@ -15,16 +15,22 @@ var config = exports.config = {
15
15
  },
16
16
  variations: {
17
17
  view: {
18
- "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--surface-solid-card);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-card);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-card);\n ", ": var(--surface-solid-card);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-card);\n ", ": var(--text-primary);\n ", ": var(--text-accent);\n "])), _styledComponents.chipTokens.color, _styledComponents.chipTokens.background, _styledComponents.chipTokens.colorHover, _styledComponents.chipTokens.backgroundHover, _styledComponents.chipTokens.colorActive, _styledComponents.chipTokens.backgroundActive, _styledComponents.chipTokens.backgroundReadOnly, _styledComponents.chipTokens.colorReadOnly, _styledComponents.chipTokens.backgroundReadOnlyHover, _styledComponents.chipTokens.colorReadOnlyHover, _styledComponents.chipTokens.closeIconColor),
19
- secondary: /*#__PURE__*/(0, _styledComponents.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--surface-solid-secondary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-secondary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-secondary);\n ", ": var(--surface-solid-primary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--text-primary);\n ", ": var(--text-accent);\n "])), _styledComponents.chipTokens.color, _styledComponents.chipTokens.background, _styledComponents.chipTokens.colorHover, _styledComponents.chipTokens.backgroundHover, _styledComponents.chipTokens.colorActive, _styledComponents.chipTokens.backgroundActive, _styledComponents.chipTokens.backgroundReadOnly, _styledComponents.chipTokens.colorReadOnly, _styledComponents.chipTokens.backgroundReadOnlyHover, _styledComponents.chipTokens.colorReadOnlyHover, _styledComponents.chipTokens.closeIconColor),
18
+ "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-solid-default);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-solid-default);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-solid-default);\n ", ": var(--surface-solid-default);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-solid-default);\n ", ": var(--inverse-text-primary);\n "])), _styledComponents.chipTokens.color, _styledComponents.chipTokens.background, _styledComponents.chipTokens.colorHover, _styledComponents.chipTokens.backgroundHover, _styledComponents.chipTokens.colorActive, _styledComponents.chipTokens.backgroundActive, _styledComponents.chipTokens.backgroundReadOnly, _styledComponents.chipTokens.colorReadOnly, _styledComponents.chipTokens.backgroundReadOnlyHover, _styledComponents.chipTokens.colorReadOnlyHover),
19
+ secondary: /*#__PURE__*/(0, _styledComponents.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--text-primary);\n ", ": var(--text-accent);\n "])), _styledComponents.chipTokens.color, _styledComponents.chipTokens.background, _styledComponents.chipTokens.colorHover, _styledComponents.chipTokens.backgroundHover, _styledComponents.chipTokens.colorActive, _styledComponents.chipTokens.backgroundActive, _styledComponents.chipTokens.backgroundReadOnly, _styledComponents.chipTokens.colorReadOnly, _styledComponents.chipTokens.backgroundReadOnlyHover, _styledComponents.chipTokens.colorReadOnlyHover, _styledComponents.chipTokens.closeIconColor),
20
20
  accent: /*#__PURE__*/(0, _styledComponents.css)(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--on-dark-text-primary);\n ", ": var(--surface-accent);\n ", ": var(--on-dark-text-primary);\n ", ": var(--surface-accent);\n ", ": var(--on-dark-text-primary);\n ", ": var(--surface-accent);\n ", ": var(--surface-accent);\n ", ": var(--on-dark-text-primary);\n ", ": var(--surface-accent);\n ", ": var(--on-dark-text-primary);\n "])), _styledComponents.chipTokens.color, _styledComponents.chipTokens.background, _styledComponents.chipTokens.colorHover, _styledComponents.chipTokens.backgroundHover, _styledComponents.chipTokens.colorActive, _styledComponents.chipTokens.backgroundActive, _styledComponents.chipTokens.backgroundReadOnly, _styledComponents.chipTokens.colorReadOnly, _styledComponents.chipTokens.backgroundReadOnlyHover, _styledComponents.chipTokens.colorReadOnlyHover)
21
21
  },
22
22
  size: {
23
23
  s: /*#__PURE__*/(0, _styledComponents.css)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.5rem;\n ", ": 1rem;\n ", ": auto;\n ", ": 2.5rem;\n ", ": 0 1rem;\n\n ", ": var(--plasma-typo-body-m-font-family);\n ", ": var(--plasma-typo-body-m-font-size);\n ", ": var(--plasma-typo-body-m-font-style);\n ", ": var(--plasma-typo-body-m-font-weight);\n ", ": var(--plasma-typo-body-m-letter-spacing);\n ", ": var(--plasma-typo-body-m-line-height);\n\n ", ": -0.25rem;\n ", ": 0.25rem;\n ", ": 0.5rem;\n ", ": -0.5rem;\n\n ", ": 1.02;\n ", ": 0.98;\n\n ", ": 1.5rem;\n "])), _styledComponents.chipTokens.borderRadius, _styledComponents.chipTokens.pilledBorderRadius, _styledComponents.chipTokens.width, _styledComponents.chipTokens.height, _styledComponents.chipTokens.padding, _styledComponents.chipTokens.fontFamily, _styledComponents.chipTokens.fontSize, _styledComponents.chipTokens.fontStyle, _styledComponents.chipTokens.fontWeight, _styledComponents.chipTokens.letterSpacing, _styledComponents.chipTokens.lineHeight, _styledComponents.chipTokens.leftContentMarginLeft, _styledComponents.chipTokens.leftContentMarginRight, _styledComponents.chipTokens.clearContentMarginLeft, _styledComponents.chipTokens.clearContentMarginRight, _styledComponents.chipTokens.scaleHover, _styledComponents.chipTokens.scaleActive, _styledComponents.chipTokens.closeIconSize),
24
24
  xs: /*#__PURE__*/(0, _styledComponents.css)(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.38rem;\n ", ": 0.75rem;\n ", ": auto;\n ", ": 1.5rem;\n ", ": 0.125rem 0.5rem;\n\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n\n ", ": 0;\n ", ": 0.25rem;\n ", ": 0.25rem;\n ", ": -0.25rem;\n\n ", ": 1.02;\n ", ": 0.98;\n\n ", ": 1rem;\n "])), _styledComponents.chipTokens.borderRadius, _styledComponents.chipTokens.pilledBorderRadius, _styledComponents.chipTokens.width, _styledComponents.chipTokens.height, _styledComponents.chipTokens.padding, _styledComponents.chipTokens.fontFamily, _styledComponents.chipTokens.fontSize, _styledComponents.chipTokens.fontStyle, _styledComponents.chipTokens.fontWeight, _styledComponents.chipTokens.letterSpacing, _styledComponents.chipTokens.lineHeight, _styledComponents.chipTokens.leftContentMarginLeft, _styledComponents.chipTokens.leftContentMarginRight, _styledComponents.chipTokens.clearContentMarginLeft, _styledComponents.chipTokens.clearContentMarginRight, _styledComponents.chipTokens.scaleHover, _styledComponents.chipTokens.scaleActive, _styledComponents.chipTokens.closeIconSize)
25
25
  },
26
+ disabled: {
27
+ "true": /*#__PURE__*/(0, _styledComponents.css)(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.4;\n "])), _styledComponents.chipTokens.disabledOpacity)
28
+ },
26
29
  focused: {
27
- "true": /*#__PURE__*/(0, _styledComponents.css)(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-accent);\n "])), _styledComponents.chipTokens.focusColor)
30
+ "true": /*#__PURE__*/(0, _styledComponents.css)(_templateObject7 || (_templateObject7 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-accent);\n "])), _styledComponents.chipTokens.focusColor)
31
+ },
32
+ pilled: {
33
+ "true": /*#__PURE__*/(0, _styledComponents.css)(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteral([""])))
28
34
  }
29
35
  }
30
36
  };
package/components/Chip/Chip.d.ts CHANGED
@@ -12,7 +12,13 @@ export declare const Chip: import("react").FunctionComponent<import("@salutejs/p
12
12
  s: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
13
13
  xs: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
14
14
  };
15
+ disabled: {
16
+ true: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
17
+ };
15
18
  focused: {
16
19
  true: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
17
20
  };
21
+ pilled: {
22
+ true: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
23
+ };
18
24
  }> & import("@salutejs/plasma-new-hope/styled-components").ChipProps & import("react").RefAttributes<HTMLButtonElement>>;
package/components/DatePicker/DatePicker.config.js CHANGED
@@ -14,7 +14,7 @@ var config = exports.config = {
14
14
  },
15
15
  variations: {
16
16
  view: {
17
- "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--surface-solid-card);\n ", ": var(--outline-solid-primary);\n ", ": var(--outline-solid-primary-hover);\n ", ": var(--outline-accent);\n ", ": var(--outline-negative);\n ", ": var(--outline-accent);\n\n ", ": var(--text-primary);\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--text-negative);\n ", ": var(--text-positive);\n\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--text-tertiary);\n ", ": var(--text-accent);\n\n ", ": var(--plasma-typo-body-xs-font-family);\n ", ": var(--plasma-typo-body-xs-font-size);\n ", ": var(--plasma-typo-body-xs-font-style);\n ", ": var(--plasma-typo-body-xs-font-weight);\n ", ": var(--plasma-typo-body-xs-letter-spacing);\n ", ": var(--plasma-typo-body-xs-line-height);\n\n ", ": var(--surface-negative);\n\n ", ": var(--outline-solid-primary);\n ", ": var(--outline-solid-primary-hover);\n ", ": var(--outline-accent);\n ", ": var(--outline-negative);\n ", ": var(--outline-negative);\n ", ": var(--outline-accent);\n ", ": var(--outline-accent);\n ", ": var(--surface-solid-card);\n ", ": var(--text-secondary);\n\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n\n ", ": var(--text-accent);\n\n ", ": var(--shadow-down-soft-s);\n ", ": var(--surface-transparent-secondary);\n ", ": var(--surface-solid-card);\n ", ": var(--surface-accent);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-transparent-accent);\n ", ": var(--inverse-outline-solid-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--surface-transparent-accent);\n ", ": var(--surface-accent);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-accent);\n ", ": var(--text-primary);\n ", ": var(--surface-transparent-accent);\n ", ": var(--surface-accent);\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n ", ": var(--text-accent);\n ", ": var(--outline-solid-primary);\n ", ": var(--text-secondary);\n\n ", ": var(--text-accent);\n ", ": var(--surface-clear);\n ", ": var(--text-primary-hover);\n ", ": var(--surface-clear);\n ", ": var(--text-primary-hover);\n ", ": var(--surface-clear);\n ", ": var(--surface-accent);\n\n ", ": var(--text-accent);\n ", ": #1A9E32;\n "])), _styledComponents.datePickerTokens.background, _styledComponents.datePickerTokens.borderColor, _styledComponents.datePickerTokens.borderColorHover, _styledComponents.datePickerTokens.borderColorFocus, _styledComponents.datePickerTokens.borderColorError, _styledComponents.datePickerTokens.borderColorSuccess, _styledComponents.datePickerTokens.dividerColor, _styledComponents.datePickerTokens.labelColor, _styledComponents.datePickerTokens.leftHelperColor, _styledComponents.datePickerTokens.leftHelperColorError, _styledComponents.datePickerTokens.leftHelperColorSuccess, _styledComponents.datePickerTokens.textFieldColor, _styledComponents.datePickerTokens.textFieldPlaceholderColor, _styledComponents.datePickerTokens.textFieldPlaceholderColorFocus, _styledComponents.datePickerTokens.textFieldCaretColor, _styledComponents.datePickerTokens.labelInnerFontFamily, _styledComponents.datePickerTokens.labelInnerFontSize, _styledComponents.datePickerTokens.labelInnerFontStyle, _styledComponents.datePickerTokens.labelInnerFontWeight, _styledComponents.datePickerTokens.labelInnerLetterSpacing, _styledComponents.datePickerTokens.labelInnerLineHeight, _styledComponents.datePickerTokens.indicatorColor, _styledComponents.datePickerTokens.textFieldBorderColor, _styledComponents.datePickerTokens.textFieldBorderColorHover, _styledComponents.datePickerTokens.textFieldBorderColorFocus, _styledComponents.datePickerTokens.textFieldBorderColorError, _styledComponents.datePickerTokens.textFieldBorderColorErrorFocus, _styledComponents.datePickerTokens.textFieldBorderColorSuccess, _styledComponents.datePickerTokens.textFieldBorderColorSuccessFocus, _styledComponents.datePickerTokens.textFieldBackgroundColor, _styledComponents.datePickerTokens.textFieldContentSlotColor, _styledComponents.datePickerTokens.textFieldTextBeforeColor, _styledComponents.datePickerTokens.textFieldTextAfterColor, _styledComponents.datePickerTokens.focusColor, _styledComponents.datePickerTokens.calendarShadow, _styledComponents.datePickerTokens.calendarSeparatorBackground, _styledComponents.datePickerTokens.calendarBackgroundColor, _styledComponents.datePickerTokens.calendarSelectedItemBackground, _styledComponents.datePickerTokens.calendarSelectedItemColor, _styledComponents.datePickerTokens.calendarSelectableItemBackgroundHover, _styledComponents.datePickerTokens.calendarCurrentItemBorderColor, _styledComponents.datePickerTokens.calendarCurrentItemBackgroundHover, _styledComponents.datePickerTokens.calendarCurrentItemColorHover, _styledComponents.datePickerTokens.calendarCurrentItemChildBackgroundHover, _styledComponents.datePickerTokens.calendarActiveItemBackground, _styledComponents.datePickerTokens.calendarActiveItemColor, _styledComponents.datePickerTokens.calendarHoveredItemBackground, _styledComponents.datePickerTokens.calendarHoveredItemColor, _styledComponents.datePickerTokens.calendarRangeBackground, _styledComponents.datePickerTokens.calendarOutlineFocusColor, _styledComponents.datePickerTokens.calendarContentPrimaryColor, _styledComponents.datePickerTokens.calendarContentSecondaryColor, _styledComponents.datePickerTokens.calendarContentPrimaryDisabledColor, _styledComponents.datePickerTokens.calendarContentSecondaryDisabledColor, _styledComponents.datePickerTokens.calendarHeaderArrowColor, _styledComponents.datePickerTokens.calendarBorderColor, _styledComponents.datePickerTokens.calendarDayOfWeekColor, _styledComponents.datePickerTokens.iconButtonColor, _styledComponents.datePickerTokens.iconButtonBackgroundColor, _styledComponents.datePickerTokens.iconButtonColorHover, _styledComponents.datePickerTokens.iconButtonBackgroundColorHover, _styledComponents.datePickerTokens.iconButtonColorActive, _styledComponents.datePickerTokens.iconButtonBackgroundColorActive, _styledComponents.datePickerTokens.iconButtonFocusColor, _styledComponents.datePickerTokens.textFieldContentRightSlotColor, _styledComponents.datePickerTokens.textFieldContentRightSlotColorHover)
17
+ "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--surface-solid-card);\n ", ": var(--outline-solid-primary);\n ", ": var(--outline-solid-primary-hover);\n ", ": var(--outline-accent);\n ", ": var(--outline-negative);\n ", ": var(--outline-accent);\n\n ", ": var(--text-primary);\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--text-negative);\n ", ": var(--text-positive);\n\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--text-tertiary);\n ", ": var(--text-accent);\n\n ", ": var(--plasma-typo-body-xs-font-family);\n ", ": var(--plasma-typo-body-xs-font-size);\n ", ": var(--plasma-typo-body-xs-font-style);\n ", ": var(--plasma-typo-body-xs-font-weight);\n ", ": var(--plasma-typo-body-xs-letter-spacing);\n ", ": var(--plasma-typo-body-xs-line-height);\n\n ", ": var(--surface-negative);\n\n ", ": var(--outline-solid-primary);\n ", ": var(--outline-solid-primary-hover);\n ", ": var(--outline-accent);\n ", ": var(--outline-negative);\n ", ": var(--outline-negative);\n ", ": var(--outline-accent);\n ", ": var(--outline-accent);\n ", ": var(--surface-solid-card);\n ", ": var(--text-secondary);\n\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n\n ", ": var(--text-accent);\n\n ", ": var(--shadow-down-soft-s);\n ", ": var(--surface-transparent-secondary);\n ", ": var(--surface-solid-card);\n ", ": var(--surface-accent);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-transparent-accent);\n ", ": var(--inverse-outline-solid-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--surface-transparent-accent);\n ", ": var(--surface-accent);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-accent);\n ", ": var(--text-primary);\n ", ": var(--surface-transparent-accent);\n ", ": var(--surface-accent);\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n ", ": var(--text-accent);\n ", ": var(--outline-solid-primary);\n ", ": var(--text-secondary);\n ", ": 0.4;\n\n ", ": var(--text-accent);\n ", ": var(--surface-clear);\n ", ": var(--text-primary-hover);\n ", ": var(--surface-clear);\n ", ": var(--text-primary-hover);\n ", ": var(--surface-clear);\n ", ": var(--surface-accent);\n\n ", ": var(--text-accent);\n ", ": #1A9E32;\n "])), _styledComponents.datePickerTokens.background, _styledComponents.datePickerTokens.borderColor, _styledComponents.datePickerTokens.borderColorHover, _styledComponents.datePickerTokens.borderColorFocus, _styledComponents.datePickerTokens.borderColorError, _styledComponents.datePickerTokens.borderColorSuccess, _styledComponents.datePickerTokens.dividerColor, _styledComponents.datePickerTokens.labelColor, _styledComponents.datePickerTokens.leftHelperColor, _styledComponents.datePickerTokens.leftHelperColorError, _styledComponents.datePickerTokens.leftHelperColorSuccess, _styledComponents.datePickerTokens.textFieldColor, _styledComponents.datePickerTokens.textFieldPlaceholderColor, _styledComponents.datePickerTokens.textFieldPlaceholderColorFocus, _styledComponents.datePickerTokens.textFieldCaretColor, _styledComponents.datePickerTokens.labelInnerFontFamily, _styledComponents.datePickerTokens.labelInnerFontSize, _styledComponents.datePickerTokens.labelInnerFontStyle, _styledComponents.datePickerTokens.labelInnerFontWeight, _styledComponents.datePickerTokens.labelInnerLetterSpacing, _styledComponents.datePickerTokens.labelInnerLineHeight, _styledComponents.datePickerTokens.indicatorColor, _styledComponents.datePickerTokens.textFieldBorderColor, _styledComponents.datePickerTokens.textFieldBorderColorHover, _styledComponents.datePickerTokens.textFieldBorderColorFocus, _styledComponents.datePickerTokens.textFieldBorderColorError, _styledComponents.datePickerTokens.textFieldBorderColorErrorFocus, _styledComponents.datePickerTokens.textFieldBorderColorSuccess, _styledComponents.datePickerTokens.textFieldBorderColorSuccessFocus, _styledComponents.datePickerTokens.textFieldBackgroundColor, _styledComponents.datePickerTokens.textFieldContentSlotColor, _styledComponents.datePickerTokens.textFieldTextBeforeColor, _styledComponents.datePickerTokens.textFieldTextAfterColor, _styledComponents.datePickerTokens.focusColor, _styledComponents.datePickerTokens.calendarShadow, _styledComponents.datePickerTokens.calendarSeparatorBackground, _styledComponents.datePickerTokens.calendarBackgroundColor, _styledComponents.datePickerTokens.calendarSelectedItemBackground, _styledComponents.datePickerTokens.calendarSelectedItemColor, _styledComponents.datePickerTokens.calendarSelectableItemBackgroundHover, _styledComponents.datePickerTokens.calendarCurrentItemBorderColor, _styledComponents.datePickerTokens.calendarCurrentItemBackgroundHover, _styledComponents.datePickerTokens.calendarCurrentItemColorHover, _styledComponents.datePickerTokens.calendarCurrentItemChildBackgroundHover, _styledComponents.datePickerTokens.calendarActiveItemBackground, _styledComponents.datePickerTokens.calendarActiveItemColor, _styledComponents.datePickerTokens.calendarHoveredItemBackground, _styledComponents.datePickerTokens.calendarHoveredItemColor, _styledComponents.datePickerTokens.calendarRangeBackground, _styledComponents.datePickerTokens.calendarOutlineFocusColor, _styledComponents.datePickerTokens.calendarContentPrimaryColor, _styledComponents.datePickerTokens.calendarContentSecondaryColor, _styledComponents.datePickerTokens.calendarContentPrimaryDisabledColor, _styledComponents.datePickerTokens.calendarContentSecondaryDisabledColor, _styledComponents.datePickerTokens.calendarHeaderArrowColor, _styledComponents.datePickerTokens.calendarBorderColor, _styledComponents.datePickerTokens.calendarDayOfWeekColor, _styledComponents.datePickerTokens.calendarDisabledOpacity, _styledComponents.datePickerTokens.iconButtonColor, _styledComponents.datePickerTokens.iconButtonBackgroundColor, _styledComponents.datePickerTokens.iconButtonColorHover, _styledComponents.datePickerTokens.iconButtonBackgroundColorHover, _styledComponents.datePickerTokens.iconButtonColorActive, _styledComponents.datePickerTokens.iconButtonBackgroundColorActive, _styledComponents.datePickerTokens.iconButtonFocusColor, _styledComponents.datePickerTokens.textFieldContentRightSlotColor, _styledComponents.datePickerTokens.textFieldContentRightSlotColorHover)
18
18
  },
19
19
  size: {
20
20
  s: /*#__PURE__*/(0, _styledComponents.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 19.5rem;\n ", ": 0.625rem;\n ", ": 0.125rem;\n\n ", ": 0 0.375rem;\n ", ": var(--plasma-typo-body-m-font-family);\n ", ": var(--plasma-typo-body-m-font-style);\n ", ": var(--plasma-typo-body-m-font-size);\n ", ": var(--plasma-typo-body-m-font-weight);\n ", ": var(--plasma-typo-body-m-letter-spacing);\n ", ": var(--plasma-typo-body-m-line-height);\n\n ", ": 0 0 0 0.75rem;\n ", ": 0;\n\n ", ": 0.5rem;\n ", ": 0.3125rem 0 0 0;\n ", ": 1.0625rem 0 0.3125rem 0;\n\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n\n ", ": 0.375rem;\n ", ": 0.375rem;\n ", ": 0 0 0 0;\n ", ": 0.3125rem auto auto -0.6875rem;\n ", ": 0 0 auto auto;\n ", ": 0.25rem -0.625rem auto auto;\n\n ", ": 2.5rem;\n ", ": 0.625rem;\n ", ": 0.125rem;\n ", ": 0.6875rem 0.75rem 0.6875rem 0.75rem;\n ", ": var(--plasma-typo-body-m-font-family);\n ", ": var(--plasma-typo-body-m-font-style);\n ", ": var(--plasma-typo-body-m-font-size);\n ", ": var(--plasma-typo-body-m-font-weight);\n ", ": var(--plasma-typo-body-m-letter-spacing);\n ", ": var(--plasma-typo-body-m-line-height);\n\n ", ": 0.25rem 0 0 0;\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n\n ", ": -0.1875rem 0.25rem -0.1875rem -0.125rem;\n ", ": -0.1875rem -0.125rem -0.1875rem 0.75rem;\n ", ": 0 0.25rem 0 0;\n ", ": 0 0 0 0.25rem;\n\n ", ": 0.125rem;\n ", ": 19.5rem;\n ", ": 0.875rem;\n\n ", ": 0.5rem 1rem 0.875rem 1rem;\n ", ": 0.5rem;\n ", ": 5.5rem;\n ", ": 3.5rem;\n\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-bold-font-weight);\n\n ", ": 0.5rem 0.5rem 0 0.5rem;\n ", ": 0.5rem;\n ", ": 8.25rem;\n ", ": 7rem;\n\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-bold-font-weight);\n\n ", ": 0.5rem 1rem 0.875rem 1rem;\n ", ": 0.5rem;\n ", ": 5.5rem;\n ", ": 3.5rem;\n\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-bold-font-weight);\n\n ", ": 0.5rem 1rem 0.875rem 1rem;\n ", ": 0.5rem;\n ", ": 2.5rem;\n ", ": 2rem;\n\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-bold-font-weight);\n\n ", ": 0.125rem;\n\n ", ": 0.75rem 1rem 0 1rem;\n ", ": 0.5rem;\n\n ", ": 0 0 0 0.5rem;\n ", ": 0.25rem;\n\n ", ": var(--plasma-typo-body-m-bold-font-family);\n ", ": var(--plasma-typo-body-m-bold-font-size);\n ", ": var(--plasma-typo-body-m-bold-font-style);\n ", ": var(--plasma-typo-body-m-bold-letter-spacing);\n ", ": var(--plasma-typo-body-m-bold-line-height);\n ", ": var(--plasma-typo-body-m-bold-font-weight);\n ", ": var(--plasma-typo-body-m-bold-font-weight);\n\n ", ": 2rem;\n ", ": 2rem;\n ", ": 0.75rem;\n ", ": 0.5rem;\n "])), _styledComponents.datePickerTokens.width, _styledComponents.datePickerTokens.borderRadius, _styledComponents.datePickerTokens.borderWidth, _styledComponents.datePickerTokens.dividerPadding, _styledComponents.datePickerTokens.dividerFontFamily, _styledComponents.datePickerTokens.dividerFontStyle, _styledComponents.datePickerTokens.dividerFontSize, _styledComponents.datePickerTokens.dividerFontWeight, _styledComponents.datePickerTokens.dividerLetterSpacing, _styledComponents.datePickerTokens.dividerLineHeight, _styledComponents.datePickerTokens.leftContentMargin, _styledComponents.datePickerTokens.rightContentMargin, _styledComponents.datePickerTokens.labelOffset, _styledComponents.datePickerTokens.labelInnerPadding, _styledComponents.datePickerTokens.contentLabelInnerPadding, _styledComponents.datePickerTokens.labelFontFamily, _styledComponents.datePickerTokens.labelFontStyle, _styledComponents.datePickerTokens.labelFontSize, _styledComponents.datePickerTokens.labelFontWeight, _styledComponents.datePickerTokens.labelLetterSpacing, _styledComponents.datePickerTokens.labelLineHeight, _styledComponents.datePickerTokens.indicatorSize, _styledComponents.datePickerTokens.indicatorSizeOuter, _styledComponents.datePickerTokens.indicatorPlacement, _styledComponents.datePickerTokens.indicatorOuterPlacement, _styledComponents.datePickerTokens.indicatorPlacementRight, _styledComponents.datePickerTokens.indicatorOuterPlacementRight, _styledComponents.datePickerTokens.textFieldHeight, _styledComponents.datePickerTokens.textFieldBorderRadius, _styledComponents.datePickerTokens.textFieldBorderWidth, _styledComponents.datePickerTokens.textFieldPadding, _styledComponents.datePickerTokens.textFieldFontFamily, _styledComponents.datePickerTokens.textFieldFontStyle, _styledComponents.datePickerTokens.textFieldFontSize, _styledComponents.datePickerTokens.textFieldFontWeight, _styledComponents.datePickerTokens.textFieldLetterSpacing, _styledComponents.datePickerTokens.textFieldLineHeight, _styledComponents.datePickerTokens.leftHelperOffset, _styledComponents.datePickerTokens.leftHelperFontFamily, _styledComponents.datePickerTokens.leftHelperFontStyle, _styledComponents.datePickerTokens.leftHelperFontSize, _styledComponents.datePickerTokens.leftHelperFontWeight, _styledComponents.datePickerTokens.leftHelperLetterSpacing, _styledComponents.datePickerTokens.leftHelperLineHeight, _styledComponents.datePickerTokens.textFieldLeftContentMargin, _styledComponents.datePickerTokens.textFieldRightContentMargin, _styledComponents.datePickerTokens.textFieldTextBeforeMargin, _styledComponents.datePickerTokens.textFieldTextAfterMargin, _styledComponents.datePickerTokens.calendarBorderWidth, _styledComponents.datePickerTokens.calendarWidth, _styledComponents.datePickerTokens.calendarBorderRadius, _styledComponents.datePickerTokens.calendarYearsPadding, _styledComponents.datePickerTokens.calendarYearItemBorderRadius, _styledComponents.datePickerTokens.calendarYearItemWidth, _styledComponents.datePickerTokens.calendarYearItemHeight, _styledComponents.datePickerTokens.calendarYearFontFamily, _styledComponents.datePickerTokens.calendarYearFontSize, _styledComponents.datePickerTokens.calendarYearFontStyle, _styledComponents.datePickerTokens.calendarYearFontLetterSpacing, _styledComponents.datePickerTokens.calendarYearFontLineHeight, _styledComponents.datePickerTokens.calendarYearFontWeight, _styledComponents.datePickerTokens.calendarYearSelectedFontWeight, _styledComponents.datePickerTokens.calendarQuartersPadding, _styledComponents.datePickerTokens.calendarQuarterItemBorderRadius, _styledComponents.datePickerTokens.calendarQuarterItemWidth, _styledComponents.datePickerTokens.calendarQuarterItemHeight, _styledComponents.datePickerTokens.calendarQuarterFontFamily, _styledComponents.datePickerTokens.calendarQuarterFontSize, _styledComponents.datePickerTokens.calendarQuarterFontStyle, _styledComponents.datePickerTokens.calendarQuarterFontLetterSpacing, _styledComponents.datePickerTokens.calendarQuarterFontLineHeight, _styledComponents.datePickerTokens.calendarQuarterFontWeight, _styledComponents.datePickerTokens.calendarQuarterSelectedFontWeight, _styledComponents.datePickerTokens.calendarMonthsPadding, _styledComponents.datePickerTokens.calendarMonthItemBorderRadius, _styledComponents.datePickerTokens.calendarMonthItemWidth, _styledComponents.datePickerTokens.calendarMonthItemHeight, _styledComponents.datePickerTokens.calendarMonthFontFamily, _styledComponents.datePickerTokens.calendarMonthFontSize, _styledComponents.datePickerTokens.calendarMonthFontStyle, _styledComponents.datePickerTokens.calendarMonthFontLetterSpacing, _styledComponents.datePickerTokens.calendarMonthFontLineHeight, _styledComponents.datePickerTokens.calendarMonthFontWeight, _styledComponents.datePickerTokens.calendarMonthSelectedFontWeight, _styledComponents.datePickerTokens.calendarDaysPadding, _styledComponents.datePickerTokens.calendarDayItemBorderRadius, _styledComponents.datePickerTokens.calendarDayItemWidth, _styledComponents.datePickerTokens.calendarDayItemHeight, _styledComponents.datePickerTokens.calendarDayFontFamily, _styledComponents.datePickerTokens.calendarDayFontSize, _styledComponents.datePickerTokens.calendarDayFontStyle, _styledComponents.datePickerTokens.calendarDayFontLetterSpacing, _styledComponents.datePickerTokens.calendarDayFontLineHeight, _styledComponents.datePickerTokens.calendarDayFontWeight, _styledComponents.datePickerTokens.calendarDaySelectedFontWeight, _styledComponents.datePickerTokens.calendarCurrentItemBorderWidth, _styledComponents.datePickerTokens.calendarHeaderWrapperPadding, _styledComponents.datePickerTokens.calendarHeaderArrowGap, _styledComponents.datePickerTokens.calendarHeaderPadding, _styledComponents.datePickerTokens.calendarHeaderDateGap, _styledComponents.datePickerTokens.calendarHeaderFontFamily, _styledComponents.datePickerTokens.calendarHeaderFontSize, _styledComponents.datePickerTokens.calendarHeaderFontStyle, _styledComponents.datePickerTokens.calendarHeaderFontLetterSpacing, _styledComponents.datePickerTokens.calendarHeaderFontLineHeight, _styledComponents.datePickerTokens.calendarHeaderFontWeight, _styledComponents.datePickerTokens.calendarHeaderFontWeightBold, _styledComponents.datePickerTokens.iconButtonHeight, _styledComponents.datePickerTokens.iconButtonWidth, _styledComponents.datePickerTokens.iconButtonPadding, _styledComponents.datePickerTokens.iconButtonRadius)
package/components/DatePicker/DatePicker.d.ts CHANGED
@@ -27,15 +27,17 @@ export declare const DatePicker: import("react").FunctionComponent<import("@salu
27
27
  contentRight?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
28
28
  textBefore?: string | undefined;
29
29
  textAfter?: string | undefined;
30
- onCommitDate?: ((value: string | Date, error?: boolean | undefined, success?: boolean | undefined, dateInfo?: import("@salutejs/plasma-new-hope/types/components/Calendar/Calendar.types").DateInfo | undefined) => void) | undefined;
31
- onChangeValue?: ((event: import("react").SyntheticEvent<HTMLInputElement, Event> | null, value?: string | undefined) => void) | undefined;
30
+ autoComplete?: string | undefined;
31
+ onCommitDate?: ((value: string | Date, error?: boolean | undefined, success?: boolean | undefined, dateInfo?: any, originalDate?: Date | undefined, isoDate?: string | undefined) => void) | undefined;
32
+ onChangeValue?: ((event: import("react").SyntheticEvent<HTMLInputElement, Event> | null, value?: string | undefined, originalDate?: any, isoDate?: string | undefined) => void) | undefined;
32
33
  onChange?: ((event: {
33
34
  target: {
34
35
  value?: string | undefined;
35
36
  name?: string | undefined;
37
+ originalDate?: any;
38
+ isoDate?: string | undefined;
36
39
  };
37
40
  }) => void) | undefined;
38
- autoComplete?: string | undefined;
39
41
  } & import("@salutejs/plasma-new-hope/types/components/TextField/TextField.types").LabelProps & import("@salutejs/plasma-new-hope/types/components/DatePicker/DatePickerBase.types").DatePickerCalendarProps & import("@salutejs/plasma-new-hope/types/components/DatePicker/SingleDate/SingleDate.types").DatePickerPopoverProps & Omit<import("react").HTMLAttributes<HTMLDivElement>, "defaultValue"> & import("react").RefAttributes<HTMLInputElement>>;
40
42
  export declare const DatePickerRange: import("react").FunctionComponent<import("@salutejs/plasma-new-hope/types/engines/types").PropsType<{
41
43
  view: {
@@ -54,7 +56,7 @@ export declare const DatePickerRange: import("react").FunctionComponent<import("
54
56
  requiredPlacement?: "left" | "right" | undefined;
55
57
  required?: boolean | undefined;
56
58
  hasRequiredIndicator?: boolean | undefined;
57
- value?: [Date | null | undefined, Date | null | undefined] | undefined;
59
+ value?: [string | import("@salutejs/plasma-new-hope/types/components/Calendar/Calendar.types").DateType, string | import("@salutejs/plasma-new-hope/types/components/Calendar/Calendar.types").DateType] | undefined;
58
60
  defaultFirstDate?: Date | undefined;
59
61
  defaultSecondDate?: Date | undefined;
60
62
  name?: string | undefined;
package/components/Tabs/horizontal/HorizontalTabItem.config.js CHANGED
@@ -14,10 +14,10 @@ var config = exports.config = {
14
14
  },
15
15
  variations: {
16
16
  view: {
17
- clear: /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-secondary);\n ", ": var(--text-tertiary);\n ", ": transparent;\n ", ": var(--text-secondary-hover);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary-active);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": background-color 0.3s ease-in-out;\n\n ", ": 0;\n ", ": 0;\n\n ", ": var(--surface-accent);\n\n ", ": 0rem;\n ", ": var(--surface-solid-default);\n ", ": var(--surface-solid-default-hover);\n "])), _styledComponents.tabsTokens.itemColor, _styledComponents.tabsTokens.itemValueColor, _styledComponents.tabsTokens.itemBackgroundColor, _styledComponents.tabsTokens.itemColorHover, _styledComponents.tabsTokens.itemValueColorHover, _styledComponents.tabsTokens.itemColorActive, _styledComponents.tabsTokens.itemValueColorActive, _styledComponents.tabsTokens.itemBackgroundColorHover, _styledComponents.tabsTokens.itemSelectedColor, _styledComponents.tabsTokens.itemSelectedValueColor, _styledComponents.tabsTokens.itemSelectedBackgroundColor, _styledComponents.tabsTokens.itemSelectedColorHover, _styledComponents.tabsTokens.itemSelectedValueColorHover, _styledComponents.tabsTokens.itemSelectedBackgroundColorHover, _styledComponents.tabsTokens.itemBackgroundTransition, _styledComponents.tabsTokens.itemPaddingClear, _styledComponents.tabsTokens.itemContentPaddingClear, _styledComponents.tabsTokens.outlineFocusColor, _styledComponents.tabsTokens.itemSelectedDividerHeight, _styledComponents.tabsTokens.itemSelectedDividerColor, _styledComponents.tabsTokens.itemSelectedDividerColorHover),
18
- secondary: /*#__PURE__*/(0, _styledComponents.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-secondary-hover);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary-active);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--surface-transparent-card);\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--surface-transparent-card);\n ", ": background-color 0.3s ease-in-out;\n\n ", ": 0.125rem;\n\n ", ": var(--surface-accent);\n\n ", ": 0rem;\n ", ": var(--surface-solid-default);\n ", ": var(--surface-solid-default-hover);\n "])), _styledComponents.tabsTokens.itemColor, _styledComponents.tabsTokens.itemValueColor, _styledComponents.tabsTokens.itemBackgroundColor, _styledComponents.tabsTokens.itemColorHover, _styledComponents.tabsTokens.itemValueColorHover, _styledComponents.tabsTokens.itemColorActive, _styledComponents.tabsTokens.itemValueColorActive, _styledComponents.tabsTokens.itemBackgroundColorHover, _styledComponents.tabsTokens.itemSelectedColor, _styledComponents.tabsTokens.itemSelectedValueColor, _styledComponents.tabsTokens.itemSelectedBackgroundColor, _styledComponents.tabsTokens.itemSelectedColorHover, _styledComponents.tabsTokens.itemSelectedValueColorHover, _styledComponents.tabsTokens.itemSelectedBackgroundColorHover, _styledComponents.tabsTokens.itemBackgroundTransition, _styledComponents.tabsTokens.itemMarginLeftFilled, _styledComponents.tabsTokens.outlineFocusColor, _styledComponents.tabsTokens.itemSelectedDividerHeight, _styledComponents.tabsTokens.itemSelectedDividerColor, _styledComponents.tabsTokens.itemSelectedDividerColorHover),
19
- divider: /*#__PURE__*/(0, _styledComponents.css)(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-accent);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": #1A9E32;\n ", ": var(--text-secondary);\n ", ": var(--text-accent-active);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": background-color 0.3s ease-in-out;\n\n ", ": 0;\n ", ": 0;\n\n ", ": var(--surface-accent);\n\n ", ": 0.125rem;\n ", ": var(--surface-solid-default);\n ", ": var(--surface-solid-default-hover);\n "])), _styledComponents.tabsTokens.itemColor, _styledComponents.tabsTokens.itemValueColor, _styledComponents.tabsTokens.itemBackgroundColor, _styledComponents.tabsTokens.itemColorHover, _styledComponents.tabsTokens.itemValueColorHover, _styledComponents.tabsTokens.itemColorActive, _styledComponents.tabsTokens.itemValueColorActive, _styledComponents.tabsTokens.itemBackgroundColorHover, _styledComponents.tabsTokens.itemSelectedColor, _styledComponents.tabsTokens.itemSelectedValueColor, _styledComponents.tabsTokens.itemSelectedBackgroundColor, _styledComponents.tabsTokens.itemSelectedColorHover, _styledComponents.tabsTokens.itemSelectedValueColorHover, _styledComponents.tabsTokens.itemSelectedBackgroundColorHover, _styledComponents.tabsTokens.itemBackgroundTransition, _styledComponents.tabsTokens.itemPaddingClear, _styledComponents.tabsTokens.itemContentPaddingClear, _styledComponents.tabsTokens.outlineFocusColor, _styledComponents.tabsTokens.itemSelectedDividerHeight, _styledComponents.tabsTokens.itemSelectedDividerColor, _styledComponents.tabsTokens.itemSelectedDividerColorHover),
20
- "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-secondary-hover);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary-active);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--inverse-text-primary);\n ", ": var(--on-dark-text-secondary);\n ", ": var(--surface-solid-default);\n ", ": var(--inverse-text-primary);\n ", ": var(--on-dark-text-secondary);\n ", ": var(--surface-solid-default);\n ", ": background-color 0.3s ease-in-out;\n\n ", ": 0.125rem;\n\n ", ": var(--surface-accent);\n\n ", ": 0rem;\n ", ": var(--surface-solid-default);\n ", ": var(--surface-solid-default-hover);\n "])), _styledComponents.tabsTokens.itemColor, _styledComponents.tabsTokens.itemValueColor, _styledComponents.tabsTokens.itemBackgroundColor, _styledComponents.tabsTokens.itemColorHover, _styledComponents.tabsTokens.itemValueColorHover, _styledComponents.tabsTokens.itemColorActive, _styledComponents.tabsTokens.itemValueColorActive, _styledComponents.tabsTokens.itemBackgroundColorHover, _styledComponents.tabsTokens.itemSelectedColor, _styledComponents.tabsTokens.itemSelectedValueColor, _styledComponents.tabsTokens.itemSelectedBackgroundColor, _styledComponents.tabsTokens.itemSelectedColorHover, _styledComponents.tabsTokens.itemSelectedValueColorHover, _styledComponents.tabsTokens.itemSelectedBackgroundColorHover, _styledComponents.tabsTokens.itemBackgroundTransition, _styledComponents.tabsTokens.itemMarginLeftFilled, _styledComponents.tabsTokens.outlineFocusColor, _styledComponents.tabsTokens.itemSelectedDividerHeight, _styledComponents.tabsTokens.itemSelectedDividerColor, _styledComponents.tabsTokens.itemSelectedDividerColorHover)
17
+ clear: /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-secondary);\n ", ": var(--text-tertiary);\n ", ": transparent;\n ", ": var(--text-secondary-hover);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary-active);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": background-color 0.3s ease-in-out;\n\n ", ": 0;\n ", ": 0;\n\n ", ": var(--surface-accent);\n\n ", ": 0rem;\n ", ": var(--surface-solid-default);\n ", ": var(--surface-solid-default-hover);\n\n ", ": default;\n "])), _styledComponents.tabsTokens.itemColor, _styledComponents.tabsTokens.itemValueColor, _styledComponents.tabsTokens.itemBackgroundColor, _styledComponents.tabsTokens.itemColorHover, _styledComponents.tabsTokens.itemValueColorHover, _styledComponents.tabsTokens.itemColorActive, _styledComponents.tabsTokens.itemValueColorActive, _styledComponents.tabsTokens.itemBackgroundColorHover, _styledComponents.tabsTokens.itemSelectedColor, _styledComponents.tabsTokens.itemSelectedValueColor, _styledComponents.tabsTokens.itemSelectedBackgroundColor, _styledComponents.tabsTokens.itemSelectedColorHover, _styledComponents.tabsTokens.itemSelectedValueColorHover, _styledComponents.tabsTokens.itemSelectedBackgroundColorHover, _styledComponents.tabsTokens.itemBackgroundTransition, _styledComponents.tabsTokens.itemPaddingClear, _styledComponents.tabsTokens.itemContentPaddingClear, _styledComponents.tabsTokens.outlineFocusColor, _styledComponents.tabsTokens.itemSelectedDividerHeight, _styledComponents.tabsTokens.itemSelectedDividerColor, _styledComponents.tabsTokens.itemSelectedDividerColorHover, _styledComponents.tabsTokens.itemCursor),
18
+ secondary: /*#__PURE__*/(0, _styledComponents.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-secondary-hover);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary-active);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--surface-transparent-card);\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--surface-transparent-card);\n ", ": background-color 0.3s ease-in-out;\n\n ", ": 0.125rem;\n\n ", ": var(--surface-accent);\n\n ", ": 0rem;\n ", ": var(--surface-solid-default);\n ", ": var(--surface-solid-default-hover);\n\n ", ": default;\n "])), _styledComponents.tabsTokens.itemColor, _styledComponents.tabsTokens.itemValueColor, _styledComponents.tabsTokens.itemBackgroundColor, _styledComponents.tabsTokens.itemColorHover, _styledComponents.tabsTokens.itemValueColorHover, _styledComponents.tabsTokens.itemColorActive, _styledComponents.tabsTokens.itemValueColorActive, _styledComponents.tabsTokens.itemBackgroundColorHover, _styledComponents.tabsTokens.itemSelectedColor, _styledComponents.tabsTokens.itemSelectedValueColor, _styledComponents.tabsTokens.itemSelectedBackgroundColor, _styledComponents.tabsTokens.itemSelectedColorHover, _styledComponents.tabsTokens.itemSelectedValueColorHover, _styledComponents.tabsTokens.itemSelectedBackgroundColorHover, _styledComponents.tabsTokens.itemBackgroundTransition, _styledComponents.tabsTokens.itemMarginLeftFilled, _styledComponents.tabsTokens.outlineFocusColor, _styledComponents.tabsTokens.itemSelectedDividerHeight, _styledComponents.tabsTokens.itemSelectedDividerColor, _styledComponents.tabsTokens.itemSelectedDividerColorHover, _styledComponents.tabsTokens.itemCursor),
19
+ divider: /*#__PURE__*/(0, _styledComponents.css)(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-accent);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": #1A9E32;\n ", ": var(--text-secondary);\n ", ": var(--text-accent-active);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": background-color 0.3s ease-in-out;\n\n ", ": 0;\n ", ": 0;\n\n ", ": var(--surface-accent);\n\n ", ": 0.125rem;\n ", ": var(--surface-solid-default);\n ", ": var(--surface-solid-default-hover);\n\n ", ": default;\n "])), _styledComponents.tabsTokens.itemColor, _styledComponents.tabsTokens.itemValueColor, _styledComponents.tabsTokens.itemBackgroundColor, _styledComponents.tabsTokens.itemColorHover, _styledComponents.tabsTokens.itemValueColorHover, _styledComponents.tabsTokens.itemColorActive, _styledComponents.tabsTokens.itemValueColorActive, _styledComponents.tabsTokens.itemBackgroundColorHover, _styledComponents.tabsTokens.itemSelectedColor, _styledComponents.tabsTokens.itemSelectedValueColor, _styledComponents.tabsTokens.itemSelectedBackgroundColor, _styledComponents.tabsTokens.itemSelectedColorHover, _styledComponents.tabsTokens.itemSelectedValueColorHover, _styledComponents.tabsTokens.itemSelectedBackgroundColorHover, _styledComponents.tabsTokens.itemBackgroundTransition, _styledComponents.tabsTokens.itemPaddingClear, _styledComponents.tabsTokens.itemContentPaddingClear, _styledComponents.tabsTokens.outlineFocusColor, _styledComponents.tabsTokens.itemSelectedDividerHeight, _styledComponents.tabsTokens.itemSelectedDividerColor, _styledComponents.tabsTokens.itemSelectedDividerColorHover, _styledComponents.tabsTokens.itemCursor),
20
+ "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-secondary-hover);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary-active);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--inverse-text-primary);\n ", ": var(--on-dark-text-secondary);\n ", ": var(--surface-solid-default);\n ", ": var(--inverse-text-primary);\n ", ": var(--on-dark-text-secondary);\n ", ": var(--surface-solid-default);\n ", ": background-color 0.3s ease-in-out;\n\n ", ": 0.125rem;\n\n ", ": var(--surface-accent);\n\n ", ": 0rem;\n ", ": var(--surface-solid-default);\n ", ": var(--surface-solid-default-hover);\n\n ", ": default;\n "])), _styledComponents.tabsTokens.itemColor, _styledComponents.tabsTokens.itemValueColor, _styledComponents.tabsTokens.itemBackgroundColor, _styledComponents.tabsTokens.itemColorHover, _styledComponents.tabsTokens.itemValueColorHover, _styledComponents.tabsTokens.itemColorActive, _styledComponents.tabsTokens.itemValueColorActive, _styledComponents.tabsTokens.itemBackgroundColorHover, _styledComponents.tabsTokens.itemSelectedColor, _styledComponents.tabsTokens.itemSelectedValueColor, _styledComponents.tabsTokens.itemSelectedBackgroundColor, _styledComponents.tabsTokens.itemSelectedColorHover, _styledComponents.tabsTokens.itemSelectedValueColorHover, _styledComponents.tabsTokens.itemSelectedBackgroundColorHover, _styledComponents.tabsTokens.itemBackgroundTransition, _styledComponents.tabsTokens.itemMarginLeftFilled, _styledComponents.tabsTokens.outlineFocusColor, _styledComponents.tabsTokens.itemSelectedDividerHeight, _styledComponents.tabsTokens.itemSelectedDividerColor, _styledComponents.tabsTokens.itemSelectedDividerColorHover, _styledComponents.tabsTokens.itemCursor)
21
21
  },
22
22
  size: {
23
23
  s: /*#__PURE__*/(0, _styledComponents.css)(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.5rem;\n ", ": auto;\n ", ": 2.5rem;\n ", ": 0 0.625rem;\n ", ": 0 0.5rem;\n ", ": 1.75rem;\n ", ": 0.25rem;\n ", ": 0.125rem;\n\n ", ": var(--plasma-typo-body-m-bold-font-family);\n ", ": var(--plasma-typo-body-m-bold-font-size);\n ", ": var(--plasma-typo-body-m-bold-font-style);\n ", ": var(--plasma-typo-body-m-bold-font-weight);\n ", ": var(--plasma-typo-body-m-bold-letter-spacing);\n ", ": var(--plasma-typo-body-m-bold-line-height);\n\n ", ": var(--plasma-typo-body-m-font-family);\n ", ": var(--plasma-typo-body-m-font-size);\n ", ": var(--plasma-typo-body-m-font-style);\n ", ": var(--plasma-typo-body-m-font-weight);\n ", ": var(--plasma-typo-body-m-letter-spacing);\n ", ": var(--plasma-typo-body-m-line-height);\n "])), _styledComponents.tabsTokens.itemBorderRadius, _styledComponents.tabsTokens.itemWidth, _styledComponents.tabsTokens.itemHeight, _styledComponents.tabsTokens.itemPadding, _styledComponents.tabsTokens.itemPaddingPilled, _styledComponents.tabsTokens.itemMarginLeft, _styledComponents.tabsTokens.itemContentGap, _styledComponents.tabsTokens.itemContentPadding, _styledComponents.tabsTokens.fontFamily, _styledComponents.tabsTokens.fontSize, _styledComponents.tabsTokens.fontStyle, _styledComponents.tabsTokens.fontWeight, _styledComponents.tabsTokens.letterSpacing, _styledComponents.tabsTokens.lineHeight, _styledComponents.tabsTokens.valueFontFamily, _styledComponents.tabsTokens.valueFontSize, _styledComponents.tabsTokens.valueFontStyle, _styledComponents.tabsTokens.valueFontWeight, _styledComponents.tabsTokens.valueLetterSpacing, _styledComponents.tabsTokens.valueLineHeight)
package/components/Tabs/vertical/VerticalTabItem.config.js CHANGED
@@ -14,7 +14,7 @@ var config = exports.config = {
14
14
  },
15
15
  variations: {
16
16
  view: {
17
- divider: /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-accent);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": #1A9E32;\n ", ": var(--text-secondary);\n ", ": var(--text-accent-active);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": background-color 0.3s ease-in-out;\n\n ", ": 0;\n ", ": 0;\n\n ", ": var(--surface-accent);\n\n ", ": 0.125rem;\n ", ": 0.125rem;\n ", ": var(--surface-solid-default);\n ", ": var(--text-primary);\n "])), _styledComponents.tabsTokens.itemColor, _styledComponents.tabsTokens.itemValueColor, _styledComponents.tabsTokens.itemBackgroundColor, _styledComponents.tabsTokens.itemColorHover, _styledComponents.tabsTokens.itemValueColorHover, _styledComponents.tabsTokens.itemColorActive, _styledComponents.tabsTokens.itemValueColorActive, _styledComponents.tabsTokens.itemBackgroundColorHover, _styledComponents.tabsTokens.itemSelectedColor, _styledComponents.tabsTokens.itemSelectedValueColor, _styledComponents.tabsTokens.itemSelectedBackgroundColor, _styledComponents.tabsTokens.itemSelectedColorHover, _styledComponents.tabsTokens.itemSelectedValueColorHover, _styledComponents.tabsTokens.itemSelectedBackgroundColorHover, _styledComponents.tabsTokens.itemBackgroundTransition, _styledComponents.tabsTokens.itemPaddingClear, _styledComponents.tabsTokens.itemContentPaddingClear, _styledComponents.tabsTokens.outlineFocusColor, _styledComponents.tabsTokens.itemSelectedDividerWidth, _styledComponents.tabsTokens.itemSelectedDividerHeight, _styledComponents.tabsTokens.itemSelectedDividerColor, _styledComponents.tabsTokens.itemSelectedDividerColorHover)
17
+ divider: /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-accent);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": #1A9E32;\n ", ": var(--text-secondary);\n ", ": var(--text-accent-active);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": transparent;\n ", ": background-color 0.3s ease-in-out;\n\n ", ": 0;\n ", ": 0;\n\n ", ": var(--surface-accent);\n\n ", ": 0.125rem;\n ", ": 0.125rem;\n ", ": var(--surface-solid-default);\n ", ": var(--text-primary);\n\n ", ": default;\n "])), _styledComponents.tabsTokens.itemColor, _styledComponents.tabsTokens.itemValueColor, _styledComponents.tabsTokens.itemBackgroundColor, _styledComponents.tabsTokens.itemColorHover, _styledComponents.tabsTokens.itemValueColorHover, _styledComponents.tabsTokens.itemColorActive, _styledComponents.tabsTokens.itemValueColorActive, _styledComponents.tabsTokens.itemBackgroundColorHover, _styledComponents.tabsTokens.itemSelectedColor, _styledComponents.tabsTokens.itemSelectedValueColor, _styledComponents.tabsTokens.itemSelectedBackgroundColor, _styledComponents.tabsTokens.itemSelectedColorHover, _styledComponents.tabsTokens.itemSelectedValueColorHover, _styledComponents.tabsTokens.itemSelectedBackgroundColorHover, _styledComponents.tabsTokens.itemBackgroundTransition, _styledComponents.tabsTokens.itemPaddingClear, _styledComponents.tabsTokens.itemContentPaddingClear, _styledComponents.tabsTokens.outlineFocusColor, _styledComponents.tabsTokens.itemSelectedDividerWidth, _styledComponents.tabsTokens.itemSelectedDividerHeight, _styledComponents.tabsTokens.itemSelectedDividerColor, _styledComponents.tabsTokens.itemSelectedDividerColorHover, _styledComponents.tabsTokens.itemCursor)
18
18
  },
19
19
  size: {
20
20
  s: /*#__PURE__*/(0, _styledComponents.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.5rem;\n ", ": auto;\n ", ": 2.5rem;\n ", ": 0 0.625rem;\n ", ": 0 0.5rem;\n ", ": 0.5rem 1rem;\n ", ": 0.75rem;\n ", ": 0.25rem;\n ", ": 0.125rem;\n\n ", ": var(--plasma-typo-body-m-bold-font-family);\n ", ": var(--plasma-typo-body-m-bold-font-size);\n ", ": var(--plasma-typo-body-m-bold-font-style);\n ", ": var(--plasma-typo-body-m-bold-font-weight);\n ", ": var(--plasma-typo-body-m-bold-letter-spacing);\n ", ": var(--plasma-typo-body-m-bold-line-height);\n\n ", ": var(--plasma-typo-body-m-font-family);\n ", ": var(--plasma-typo-body-m-font-size);\n ", ": var(--plasma-typo-body-m-font-style);\n ", ": var(--plasma-typo-body-m-font-weight);\n ", ": var(--plasma-typo-body-m-letter-spacing);\n ", ": var(--plasma-typo-body-m-line-height);\n "])), _styledComponents.tabsTokens.itemBorderRadius, _styledComponents.tabsTokens.itemWidth, _styledComponents.tabsTokens.itemHeight, _styledComponents.tabsTokens.itemPadding, _styledComponents.tabsTokens.itemPaddingPilled, _styledComponents.tabsTokens.itemPaddingOrientationVertical, _styledComponents.tabsTokens.itemMarginLeft, _styledComponents.tabsTokens.itemContentGap, _styledComponents.tabsTokens.itemContentPadding, _styledComponents.tabsTokens.fontFamily, _styledComponents.tabsTokens.fontSize, _styledComponents.tabsTokens.fontStyle, _styledComponents.tabsTokens.fontWeight, _styledComponents.tabsTokens.letterSpacing, _styledComponents.tabsTokens.lineHeight, _styledComponents.tabsTokens.valueFontFamily, _styledComponents.tabsTokens.valueFontSize, _styledComponents.tabsTokens.valueFontStyle, _styledComponents.tabsTokens.valueFontWeight, _styledComponents.tabsTokens.valueLetterSpacing, _styledComponents.tabsTokens.valueLineHeight)
package/components/Tree/Tree.config.js CHANGED
@@ -14,7 +14,7 @@ var config = exports.config = {
14
14
  },
15
15
  variations: {
16
16
  view: {
17
- "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--text-accent);\n ", ": var(--text-accent-hover);\n ", ": var(--text-accent-active);\n ", ": var(--text-primary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--surface-transparent-accent-hover);\n ", ": var(--surface-solid-primary-active);\n ", ": var(--text-accent);\n ", ": var(--text-accent);\n ", ": 1;\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n "])), _styledComponents.treeTokens.iconFolderColor, _styledComponents.treeTokens.arrowColor, _styledComponents.treeTokens.arrowColorHover, _styledComponents.treeTokens.arrowColorActive, _styledComponents.treeTokens.color, _styledComponents.treeTokens.colorSelected, _styledComponents.treeTokens.itemBackgroundColor, _styledComponents.treeTokens.itemBackgroundColorHover, _styledComponents.treeTokens.itemBackgroundColorActive, _styledComponents.treeTokens.checkboxBorderColor, _styledComponents.treeTokens.checkboxBackgroundColor, _styledComponents.treeTokens.itemDisabledOpacity, _styledComponents.treeTokens.itemDisabledBorderColor, _styledComponents.treeTokens.itemDisabledColor)
17
+ "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--text-accent);\n ", ": var(--text-accent-hover);\n ", ": var(--text-accent-active);\n ", ": var(--text-primary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--surface-transparent-accent);\n ", ": var(--surface-solid-primary-active);\n ", ": var(--text-accent);\n ", ": var(--text-accent);\n ", ": 1;\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n "])), _styledComponents.treeTokens.iconFolderColor, _styledComponents.treeTokens.arrowColor, _styledComponents.treeTokens.arrowColorHover, _styledComponents.treeTokens.arrowColorActive, _styledComponents.treeTokens.color, _styledComponents.treeTokens.colorSelected, _styledComponents.treeTokens.itemBackgroundColor, _styledComponents.treeTokens.itemBackgroundColorHover, _styledComponents.treeTokens.itemBackgroundColorActive, _styledComponents.treeTokens.checkboxBorderColor, _styledComponents.treeTokens.checkboxBackgroundColor, _styledComponents.treeTokens.itemDisabledOpacity, _styledComponents.treeTokens.itemDisabledBorderColor, _styledComponents.treeTokens.itemDisabledColor)
18
18
  },
19
19
  size: {
20
20
  s: /*#__PURE__*/(0, _styledComponents.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 2.5rem;\n ", ": 0.75rem;\n ", ": 0.25rem;\n ", ": 1.875rem;\n ", ": 0.5rem;\n ", ": 0rem;\n ", ": 0rem;\n ", ": 0 0.375rem 0 0.5rem;\n ", ": 0 0 0 0;\n ", ": 0 0 0 0;\n ", ": 1.5rem;\n ", ": 0 0 0 0.5rem;\n ", ": 1.5rem;\n ", ": 1.25rem;\n ", ": 0.375rem;\n\n ", ": var(--plasma-typo-body-m-font-family);\n ", ": var(--plasma-typo-body-m-font-size);\n ", ": var(--plasma-typo-body-m-font-style);\n ", ": var(--plasma-typo-body-m-font-weight);\n ", ": var(--plasma-typo-body-m-letter-spacing);\n ", ": var(--plasma-typo-body-m-line-height);\n "])), _styledComponents.treeTokens.itemHeight, _styledComponents.treeTokens.itemPadding, _styledComponents.treeTokens.itemPaddingTight, _styledComponents.treeTokens.itemIndent, _styledComponents.treeTokens.itemBorderRadius, _styledComponents.treeTokens.itemTop, _styledComponents.treeTokens.itemBottom, _styledComponents.treeTokens.iconFolderMargin, _styledComponents.treeTokens.switcherMargin, _styledComponents.treeTokens.switcherMarginInverted, _styledComponents.treeTokens.switcherSize, _styledComponents.treeTokens.checkboxMargin, _styledComponents.treeTokens.checkboxSize, _styledComponents.treeTokens.checkboxInnerSize, _styledComponents.treeTokens.checkboxBorderRadius, _styledComponents.treeTokens.fontFamily, _styledComponents.treeTokens.fontSize, _styledComponents.treeTokens.fontStyle, _styledComponents.treeTokens.fontWeight, _styledComponents.treeTokens.letterSpacing, _styledComponents.treeTokens.lineHeight)
package/emotion/cjs/components/Chip/Chip.config.js CHANGED
@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.config = void 0;
7
7
  var _emotion = /*#__PURE__*/require("@salutejs/plasma-new-hope/emotion");
8
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
8
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
9
9
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
10
10
  var config = exports.config = {
11
11
  defaults: {
@@ -15,16 +15,22 @@ var config = exports.config = {
15
15
  },
16
16
  variations: {
17
17
  view: {
18
- "default": /*#__PURE__*/(0, _emotion.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--surface-solid-card);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-card);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-card);\n ", ": var(--surface-solid-card);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-card);\n ", ": var(--text-primary);\n ", ": var(--text-accent);\n "])), _emotion.chipTokens.color, _emotion.chipTokens.background, _emotion.chipTokens.colorHover, _emotion.chipTokens.backgroundHover, _emotion.chipTokens.colorActive, _emotion.chipTokens.backgroundActive, _emotion.chipTokens.backgroundReadOnly, _emotion.chipTokens.colorReadOnly, _emotion.chipTokens.backgroundReadOnlyHover, _emotion.chipTokens.colorReadOnlyHover, _emotion.chipTokens.closeIconColor),
19
- secondary: /*#__PURE__*/(0, _emotion.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--surface-solid-secondary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-secondary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-secondary);\n ", ": var(--surface-solid-primary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--text-primary);\n ", ": var(--text-accent);\n "])), _emotion.chipTokens.color, _emotion.chipTokens.background, _emotion.chipTokens.colorHover, _emotion.chipTokens.backgroundHover, _emotion.chipTokens.colorActive, _emotion.chipTokens.backgroundActive, _emotion.chipTokens.backgroundReadOnly, _emotion.chipTokens.colorReadOnly, _emotion.chipTokens.backgroundReadOnlyHover, _emotion.chipTokens.colorReadOnlyHover, _emotion.chipTokens.closeIconColor),
18
+ "default": /*#__PURE__*/(0, _emotion.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-solid-default);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-solid-default);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-solid-default);\n ", ": var(--surface-solid-default);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-solid-default);\n ", ": var(--inverse-text-primary);\n "])), _emotion.chipTokens.color, _emotion.chipTokens.background, _emotion.chipTokens.colorHover, _emotion.chipTokens.backgroundHover, _emotion.chipTokens.colorActive, _emotion.chipTokens.backgroundActive, _emotion.chipTokens.backgroundReadOnly, _emotion.chipTokens.colorReadOnly, _emotion.chipTokens.backgroundReadOnlyHover, _emotion.chipTokens.colorReadOnlyHover),
19
+ secondary: /*#__PURE__*/(0, _emotion.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--text-primary);\n ", ": var(--surface-solid-primary);\n ", ": var(--text-primary);\n ", ": var(--text-accent);\n "])), _emotion.chipTokens.color, _emotion.chipTokens.background, _emotion.chipTokens.colorHover, _emotion.chipTokens.backgroundHover, _emotion.chipTokens.colorActive, _emotion.chipTokens.backgroundActive, _emotion.chipTokens.backgroundReadOnly, _emotion.chipTokens.colorReadOnly, _emotion.chipTokens.backgroundReadOnlyHover, _emotion.chipTokens.colorReadOnlyHover, _emotion.chipTokens.closeIconColor),
20
20
  accent: /*#__PURE__*/(0, _emotion.css)(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--on-dark-text-primary);\n ", ": var(--surface-accent);\n ", ": var(--on-dark-text-primary);\n ", ": var(--surface-accent);\n ", ": var(--on-dark-text-primary);\n ", ": var(--surface-accent);\n ", ": var(--surface-accent);\n ", ": var(--on-dark-text-primary);\n ", ": var(--surface-accent);\n ", ": var(--on-dark-text-primary);\n "])), _emotion.chipTokens.color, _emotion.chipTokens.background, _emotion.chipTokens.colorHover, _emotion.chipTokens.backgroundHover, _emotion.chipTokens.colorActive, _emotion.chipTokens.backgroundActive, _emotion.chipTokens.backgroundReadOnly, _emotion.chipTokens.colorReadOnly, _emotion.chipTokens.backgroundReadOnlyHover, _emotion.chipTokens.colorReadOnlyHover)
21
21
  },
22
22
  size: {
23
23
  s: /*#__PURE__*/(0, _emotion.css)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.5rem;\n ", ": 1rem;\n ", ": auto;\n ", ": 2.5rem;\n ", ": 0 1rem;\n\n ", ": var(--plasma-typo-body-m-font-family);\n ", ": var(--plasma-typo-body-m-font-size);\n ", ": var(--plasma-typo-body-m-font-style);\n ", ": var(--plasma-typo-body-m-font-weight);\n ", ": var(--plasma-typo-body-m-letter-spacing);\n ", ": var(--plasma-typo-body-m-line-height);\n\n ", ": -0.25rem;\n ", ": 0.25rem;\n ", ": 0.5rem;\n ", ": -0.5rem;\n\n ", ": 1.02;\n ", ": 0.98;\n\n ", ": 1.5rem;\n "])), _emotion.chipTokens.borderRadius, _emotion.chipTokens.pilledBorderRadius, _emotion.chipTokens.width, _emotion.chipTokens.height, _emotion.chipTokens.padding, _emotion.chipTokens.fontFamily, _emotion.chipTokens.fontSize, _emotion.chipTokens.fontStyle, _emotion.chipTokens.fontWeight, _emotion.chipTokens.letterSpacing, _emotion.chipTokens.lineHeight, _emotion.chipTokens.leftContentMarginLeft, _emotion.chipTokens.leftContentMarginRight, _emotion.chipTokens.clearContentMarginLeft, _emotion.chipTokens.clearContentMarginRight, _emotion.chipTokens.scaleHover, _emotion.chipTokens.scaleActive, _emotion.chipTokens.closeIconSize),
24
24
  xs: /*#__PURE__*/(0, _emotion.css)(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.38rem;\n ", ": 0.75rem;\n ", ": auto;\n ", ": 1.5rem;\n ", ": 0.125rem 0.5rem;\n\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n\n ", ": 0;\n ", ": 0.25rem;\n ", ": 0.25rem;\n ", ": -0.25rem;\n\n ", ": 1.02;\n ", ": 0.98;\n\n ", ": 1rem;\n "])), _emotion.chipTokens.borderRadius, _emotion.chipTokens.pilledBorderRadius, _emotion.chipTokens.width, _emotion.chipTokens.height, _emotion.chipTokens.padding, _emotion.chipTokens.fontFamily, _emotion.chipTokens.fontSize, _emotion.chipTokens.fontStyle, _emotion.chipTokens.fontWeight, _emotion.chipTokens.letterSpacing, _emotion.chipTokens.lineHeight, _emotion.chipTokens.leftContentMarginLeft, _emotion.chipTokens.leftContentMarginRight, _emotion.chipTokens.clearContentMarginLeft, _emotion.chipTokens.clearContentMarginRight, _emotion.chipTokens.scaleHover, _emotion.chipTokens.scaleActive, _emotion.chipTokens.closeIconSize)
25
25
  },
26
+ disabled: {
27
+ "true": /*#__PURE__*/(0, _emotion.css)(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.4;\n "])), _emotion.chipTokens.disabledOpacity)
28
+ },
26
29
  focused: {
27
- "true": /*#__PURE__*/(0, _emotion.css)(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-accent);\n "])), _emotion.chipTokens.focusColor)
30
+ "true": /*#__PURE__*/(0, _emotion.css)(_templateObject7 || (_templateObject7 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-accent);\n "])), _emotion.chipTokens.focusColor)
31
+ },
32
+ pilled: {
33
+ "true": /*#__PURE__*/(0, _emotion.css)(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteral([""])))
28
34
  }
29
35
  }
30
36
  };
package/emotion/cjs/components/Chip/Chip.stories.tsx CHANGED
@@ -27,16 +27,7 @@ const meta: Meta<typeof Chip> = {
27
27
  type: 'select',
28
28
  },
29
29
  },
30
- ...disableProps([
31
- 'readOnly',
32
- 'onClear',
33
- 'contentLeft',
34
- 'contentRight',
35
- 'contentClearButton',
36
- 'text',
37
- 'disabled',
38
- 'pilled',
39
- ]),
30
+ ...disableProps(['readOnly', 'onClear', 'contentLeft', 'contentRight', 'contentClearButton', 'text']),
40
31
  },
41
32
  };
42
33
 
@@ -50,7 +41,7 @@ const TrashIcon = (props) => (
50
41
  fillRule="evenodd"
51
42
  clipRule="evenodd"
52
43
  d="M8 5.5A2.5 2.5 0 0110.5 3h3A2.5 2.5 0 0116 5.5V6h-2v-.5a.5.5 0 00-.5-.5h-3a.5.5 0 00-.5.5V6H8v-.5zM4 8a1 1 0 011-1h14a1 1 0 110 2h-1v9.5a2.5 2.5 0 01-2.5 2.5h-7A2.5 2.5 0 016 18.5V9H5a1 1 0 01-1-1z"
53
- fill={props.color}
44
+ fill="currentColor"
54
45
  />
55
46
  </svg>
56
47
  );
@@ -61,7 +52,9 @@ export const Default: Story = {
61
52
  view: 'default',
62
53
  size: 's',
63
54
  hasClear: true,
55
+ disabled: false,
64
56
  focused: true,
57
+ pilled: false,
65
58
  onClear,
66
59
  },
67
60
  };
@@ -75,23 +68,9 @@ export const WithIcon: Story = {
75
68
  };
76
69
  const iconSize = args.size || 's';
77
70
 
78
- const getColor = (view) => {
79
- if (view !== 'accent') {
80
- return 'var(--text-accent)';
81
- }
82
-
83
- return 'currentColor';
84
- };
85
-
86
71
  return (
87
72
  <Chip
88
- contentLeft={
89
- <TrashIcon
90
- width={iconSizeMapper[iconSize]}
91
- height={iconSizeMapper[iconSize]}
92
- color={getColor(args.view)}
93
- />
94
- }
73
+ contentLeft={<TrashIcon width={iconSizeMapper[iconSize]} height={iconSizeMapper[iconSize]} />}
95
74
  {...args}
96
75
  />
97
76
  );
package/emotion/cjs/components/DatePicker/DatePicker.config.js CHANGED
@@ -14,7 +14,7 @@ var config = exports.config = {
14
14
  },
15
15
  variations: {
16
16
  view: {
17
- "default": /*#__PURE__*/(0, _emotion.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--surface-solid-card);\n ", ": var(--outline-solid-primary);\n ", ": var(--outline-solid-primary-hover);\n ", ": var(--outline-accent);\n ", ": var(--outline-negative);\n ", ": var(--outline-accent);\n\n ", ": var(--text-primary);\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--text-negative);\n ", ": var(--text-positive);\n\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--text-tertiary);\n ", ": var(--text-accent);\n\n ", ": var(--plasma-typo-body-xs-font-family);\n ", ": var(--plasma-typo-body-xs-font-size);\n ", ": var(--plasma-typo-body-xs-font-style);\n ", ": var(--plasma-typo-body-xs-font-weight);\n ", ": var(--plasma-typo-body-xs-letter-spacing);\n ", ": var(--plasma-typo-body-xs-line-height);\n\n ", ": var(--surface-negative);\n\n ", ": var(--outline-solid-primary);\n ", ": var(--outline-solid-primary-hover);\n ", ": var(--outline-accent);\n ", ": var(--outline-negative);\n ", ": var(--outline-negative);\n ", ": var(--outline-accent);\n ", ": var(--outline-accent);\n ", ": var(--surface-solid-card);\n ", ": var(--text-secondary);\n\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n\n ", ": var(--text-accent);\n\n ", ": var(--shadow-down-soft-s);\n ", ": var(--surface-transparent-secondary);\n ", ": var(--surface-solid-card);\n ", ": var(--surface-accent);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-transparent-accent);\n ", ": var(--inverse-outline-solid-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--surface-transparent-accent);\n ", ": var(--surface-accent);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-accent);\n ", ": var(--text-primary);\n ", ": var(--surface-transparent-accent);\n ", ": var(--surface-accent);\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n ", ": var(--text-accent);\n ", ": var(--outline-solid-primary);\n ", ": var(--text-secondary);\n\n ", ": var(--text-accent);\n ", ": var(--surface-clear);\n ", ": var(--text-primary-hover);\n ", ": var(--surface-clear);\n ", ": var(--text-primary-hover);\n ", ": var(--surface-clear);\n ", ": var(--surface-accent);\n\n ", ": var(--text-accent);\n ", ": #1A9E32;\n "])), _emotion.datePickerTokens.background, _emotion.datePickerTokens.borderColor, _emotion.datePickerTokens.borderColorHover, _emotion.datePickerTokens.borderColorFocus, _emotion.datePickerTokens.borderColorError, _emotion.datePickerTokens.borderColorSuccess, _emotion.datePickerTokens.dividerColor, _emotion.datePickerTokens.labelColor, _emotion.datePickerTokens.leftHelperColor, _emotion.datePickerTokens.leftHelperColorError, _emotion.datePickerTokens.leftHelperColorSuccess, _emotion.datePickerTokens.textFieldColor, _emotion.datePickerTokens.textFieldPlaceholderColor, _emotion.datePickerTokens.textFieldPlaceholderColorFocus, _emotion.datePickerTokens.textFieldCaretColor, _emotion.datePickerTokens.labelInnerFontFamily, _emotion.datePickerTokens.labelInnerFontSize, _emotion.datePickerTokens.labelInnerFontStyle, _emotion.datePickerTokens.labelInnerFontWeight, _emotion.datePickerTokens.labelInnerLetterSpacing, _emotion.datePickerTokens.labelInnerLineHeight, _emotion.datePickerTokens.indicatorColor, _emotion.datePickerTokens.textFieldBorderColor, _emotion.datePickerTokens.textFieldBorderColorHover, _emotion.datePickerTokens.textFieldBorderColorFocus, _emotion.datePickerTokens.textFieldBorderColorError, _emotion.datePickerTokens.textFieldBorderColorErrorFocus, _emotion.datePickerTokens.textFieldBorderColorSuccess, _emotion.datePickerTokens.textFieldBorderColorSuccessFocus, _emotion.datePickerTokens.textFieldBackgroundColor, _emotion.datePickerTokens.textFieldContentSlotColor, _emotion.datePickerTokens.textFieldTextBeforeColor, _emotion.datePickerTokens.textFieldTextAfterColor, _emotion.datePickerTokens.focusColor, _emotion.datePickerTokens.calendarShadow, _emotion.datePickerTokens.calendarSeparatorBackground, _emotion.datePickerTokens.calendarBackgroundColor, _emotion.datePickerTokens.calendarSelectedItemBackground, _emotion.datePickerTokens.calendarSelectedItemColor, _emotion.datePickerTokens.calendarSelectableItemBackgroundHover, _emotion.datePickerTokens.calendarCurrentItemBorderColor, _emotion.datePickerTokens.calendarCurrentItemBackgroundHover, _emotion.datePickerTokens.calendarCurrentItemColorHover, _emotion.datePickerTokens.calendarCurrentItemChildBackgroundHover, _emotion.datePickerTokens.calendarActiveItemBackground, _emotion.datePickerTokens.calendarActiveItemColor, _emotion.datePickerTokens.calendarHoveredItemBackground, _emotion.datePickerTokens.calendarHoveredItemColor, _emotion.datePickerTokens.calendarRangeBackground, _emotion.datePickerTokens.calendarOutlineFocusColor, _emotion.datePickerTokens.calendarContentPrimaryColor, _emotion.datePickerTokens.calendarContentSecondaryColor, _emotion.datePickerTokens.calendarContentPrimaryDisabledColor, _emotion.datePickerTokens.calendarContentSecondaryDisabledColor, _emotion.datePickerTokens.calendarHeaderArrowColor, _emotion.datePickerTokens.calendarBorderColor, _emotion.datePickerTokens.calendarDayOfWeekColor, _emotion.datePickerTokens.iconButtonColor, _emotion.datePickerTokens.iconButtonBackgroundColor, _emotion.datePickerTokens.iconButtonColorHover, _emotion.datePickerTokens.iconButtonBackgroundColorHover, _emotion.datePickerTokens.iconButtonColorActive, _emotion.datePickerTokens.iconButtonBackgroundColorActive, _emotion.datePickerTokens.iconButtonFocusColor, _emotion.datePickerTokens.textFieldContentRightSlotColor, _emotion.datePickerTokens.textFieldContentRightSlotColorHover)
17
+ "default": /*#__PURE__*/(0, _emotion.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--surface-solid-card);\n ", ": var(--outline-solid-primary);\n ", ": var(--outline-solid-primary-hover);\n ", ": var(--outline-accent);\n ", ": var(--outline-negative);\n ", ": var(--outline-accent);\n\n ", ": var(--text-primary);\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--text-negative);\n ", ": var(--text-positive);\n\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--text-tertiary);\n ", ": var(--text-accent);\n\n ", ": var(--plasma-typo-body-xs-font-family);\n ", ": var(--plasma-typo-body-xs-font-size);\n ", ": var(--plasma-typo-body-xs-font-style);\n ", ": var(--plasma-typo-body-xs-font-weight);\n ", ": var(--plasma-typo-body-xs-letter-spacing);\n ", ": var(--plasma-typo-body-xs-line-height);\n\n ", ": var(--surface-negative);\n\n ", ": var(--outline-solid-primary);\n ", ": var(--outline-solid-primary-hover);\n ", ": var(--outline-accent);\n ", ": var(--outline-negative);\n ", ": var(--outline-negative);\n ", ": var(--outline-accent);\n ", ": var(--outline-accent);\n ", ": var(--surface-solid-card);\n ", ": var(--text-secondary);\n\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n\n ", ": var(--text-accent);\n\n ", ": var(--shadow-down-soft-s);\n ", ": var(--surface-transparent-secondary);\n ", ": var(--surface-solid-card);\n ", ": var(--surface-accent);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-transparent-accent);\n ", ": var(--inverse-outline-solid-secondary);\n ", ": transparent;\n ", ": var(--text-primary);\n ", ": var(--surface-transparent-accent);\n ", ": var(--surface-accent);\n ", ": var(--inverse-text-primary);\n ", ": var(--surface-accent);\n ", ": var(--text-primary);\n ", ": var(--surface-transparent-accent);\n ", ": var(--surface-accent);\n ", ": var(--text-primary);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n ", ": var(--text-secondary);\n ", ": var(--text-accent);\n ", ": var(--outline-solid-primary);\n ", ": var(--text-secondary);\n ", ": 0.4;\n\n ", ": var(--text-accent);\n ", ": var(--surface-clear);\n ", ": var(--text-primary-hover);\n ", ": var(--surface-clear);\n ", ": var(--text-primary-hover);\n ", ": var(--surface-clear);\n ", ": var(--surface-accent);\n\n ", ": var(--text-accent);\n ", ": #1A9E32;\n "])), _emotion.datePickerTokens.background, _emotion.datePickerTokens.borderColor, _emotion.datePickerTokens.borderColorHover, _emotion.datePickerTokens.borderColorFocus, _emotion.datePickerTokens.borderColorError, _emotion.datePickerTokens.borderColorSuccess, _emotion.datePickerTokens.dividerColor, _emotion.datePickerTokens.labelColor, _emotion.datePickerTokens.leftHelperColor, _emotion.datePickerTokens.leftHelperColorError, _emotion.datePickerTokens.leftHelperColorSuccess, _emotion.datePickerTokens.textFieldColor, _emotion.datePickerTokens.textFieldPlaceholderColor, _emotion.datePickerTokens.textFieldPlaceholderColorFocus, _emotion.datePickerTokens.textFieldCaretColor, _emotion.datePickerTokens.labelInnerFontFamily, _emotion.datePickerTokens.labelInnerFontSize, _emotion.datePickerTokens.labelInnerFontStyle, _emotion.datePickerTokens.labelInnerFontWeight, _emotion.datePickerTokens.labelInnerLetterSpacing, _emotion.datePickerTokens.labelInnerLineHeight, _emotion.datePickerTokens.indicatorColor, _emotion.datePickerTokens.textFieldBorderColor, _emotion.datePickerTokens.textFieldBorderColorHover, _emotion.datePickerTokens.textFieldBorderColorFocus, _emotion.datePickerTokens.textFieldBorderColorError, _emotion.datePickerTokens.textFieldBorderColorErrorFocus, _emotion.datePickerTokens.textFieldBorderColorSuccess, _emotion.datePickerTokens.textFieldBorderColorSuccessFocus, _emotion.datePickerTokens.textFieldBackgroundColor, _emotion.datePickerTokens.textFieldContentSlotColor, _emotion.datePickerTokens.textFieldTextBeforeColor, _emotion.datePickerTokens.textFieldTextAfterColor, _emotion.datePickerTokens.focusColor, _emotion.datePickerTokens.calendarShadow, _emotion.datePickerTokens.calendarSeparatorBackground, _emotion.datePickerTokens.calendarBackgroundColor, _emotion.datePickerTokens.calendarSelectedItemBackground, _emotion.datePickerTokens.calendarSelectedItemColor, _emotion.datePickerTokens.calendarSelectableItemBackgroundHover, _emotion.datePickerTokens.calendarCurrentItemBorderColor, _emotion.datePickerTokens.calendarCurrentItemBackgroundHover, _emotion.datePickerTokens.calendarCurrentItemColorHover, _emotion.datePickerTokens.calendarCurrentItemChildBackgroundHover, _emotion.datePickerTokens.calendarActiveItemBackground, _emotion.datePickerTokens.calendarActiveItemColor, _emotion.datePickerTokens.calendarHoveredItemBackground, _emotion.datePickerTokens.calendarHoveredItemColor, _emotion.datePickerTokens.calendarRangeBackground, _emotion.datePickerTokens.calendarOutlineFocusColor, _emotion.datePickerTokens.calendarContentPrimaryColor, _emotion.datePickerTokens.calendarContentSecondaryColor, _emotion.datePickerTokens.calendarContentPrimaryDisabledColor, _emotion.datePickerTokens.calendarContentSecondaryDisabledColor, _emotion.datePickerTokens.calendarHeaderArrowColor, _emotion.datePickerTokens.calendarBorderColor, _emotion.datePickerTokens.calendarDayOfWeekColor, _emotion.datePickerTokens.calendarDisabledOpacity, _emotion.datePickerTokens.iconButtonColor, _emotion.datePickerTokens.iconButtonBackgroundColor, _emotion.datePickerTokens.iconButtonColorHover, _emotion.datePickerTokens.iconButtonBackgroundColorHover, _emotion.datePickerTokens.iconButtonColorActive, _emotion.datePickerTokens.iconButtonBackgroundColorActive, _emotion.datePickerTokens.iconButtonFocusColor, _emotion.datePickerTokens.textFieldContentRightSlotColor, _emotion.datePickerTokens.textFieldContentRightSlotColorHover)
18
18
  },
19
19
  size: {
20
20
  s: /*#__PURE__*/(0, _emotion.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 19.5rem;\n ", ": 0.625rem;\n ", ": 0.125rem;\n\n ", ": 0 0.375rem;\n ", ": var(--plasma-typo-body-m-font-family);\n ", ": var(--plasma-typo-body-m-font-style);\n ", ": var(--plasma-typo-body-m-font-size);\n ", ": var(--plasma-typo-body-m-font-weight);\n ", ": var(--plasma-typo-body-m-letter-spacing);\n ", ": var(--plasma-typo-body-m-line-height);\n\n ", ": 0 0 0 0.75rem;\n ", ": 0;\n\n ", ": 0.5rem;\n ", ": 0.3125rem 0 0 0;\n ", ": 1.0625rem 0 0.3125rem 0;\n\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n\n ", ": 0.375rem;\n ", ": 0.375rem;\n ", ": 0 0 0 0;\n ", ": 0.3125rem auto auto -0.6875rem;\n ", ": 0 0 auto auto;\n ", ": 0.25rem -0.625rem auto auto;\n\n ", ": 2.5rem;\n ", ": 0.625rem;\n ", ": 0.125rem;\n ", ": 0.6875rem 0.75rem 0.6875rem 0.75rem;\n ", ": var(--plasma-typo-body-m-font-family);\n ", ": var(--plasma-typo-body-m-font-style);\n ", ": var(--plasma-typo-body-m-font-size);\n ", ": var(--plasma-typo-body-m-font-weight);\n ", ": var(--plasma-typo-body-m-letter-spacing);\n ", ": var(--plasma-typo-body-m-line-height);\n\n ", ": 0.25rem 0 0 0;\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n\n ", ": -0.1875rem 0.25rem -0.1875rem -0.125rem;\n ", ": -0.1875rem -0.125rem -0.1875rem 0.75rem;\n ", ": 0 0.25rem 0 0;\n ", ": 0 0 0 0.25rem;\n\n ", ": 0.125rem;\n ", ": 19.5rem;\n ", ": 0.875rem;\n\n ", ": 0.5rem 1rem 0.875rem 1rem;\n ", ": 0.5rem;\n ", ": 5.5rem;\n ", ": 3.5rem;\n\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-bold-font-weight);\n\n ", ": 0.5rem 0.5rem 0 0.5rem;\n ", ": 0.5rem;\n ", ": 8.25rem;\n ", ": 7rem;\n\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-bold-font-weight);\n\n ", ": 0.5rem 1rem 0.875rem 1rem;\n ", ": 0.5rem;\n ", ": 5.5rem;\n ", ": 3.5rem;\n\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-bold-font-weight);\n\n ", ": 0.5rem 1rem 0.875rem 1rem;\n ", ": 0.5rem;\n ", ": 2.5rem;\n ", ": 2rem;\n\n ", ": var(--plasma-typo-body-s-font-family);\n ", ": var(--plasma-typo-body-s-font-size);\n ", ": var(--plasma-typo-body-s-font-style);\n ", ": var(--plasma-typo-body-s-letter-spacing);\n ", ": var(--plasma-typo-body-s-line-height);\n ", ": var(--plasma-typo-body-s-font-weight);\n ", ": var(--plasma-typo-body-s-bold-font-weight);\n\n ", ": 0.125rem;\n\n ", ": 0.75rem 1rem 0 1rem;\n ", ": 0.5rem;\n\n ", ": 0 0 0 0.5rem;\n ", ": 0.25rem;\n\n ", ": var(--plasma-typo-body-m-bold-font-family);\n ", ": var(--plasma-typo-body-m-bold-font-size);\n ", ": var(--plasma-typo-body-m-bold-font-style);\n ", ": var(--plasma-typo-body-m-bold-letter-spacing);\n ", ": var(--plasma-typo-body-m-bold-line-height);\n ", ": var(--plasma-typo-body-m-bold-font-weight);\n ", ": var(--plasma-typo-body-m-bold-font-weight);\n\n ", ": 2rem;\n ", ": 2rem;\n ", ": 0.75rem;\n ", ": 0.5rem;\n "])), _emotion.datePickerTokens.width, _emotion.datePickerTokens.borderRadius, _emotion.datePickerTokens.borderWidth, _emotion.datePickerTokens.dividerPadding, _emotion.datePickerTokens.dividerFontFamily, _emotion.datePickerTokens.dividerFontStyle, _emotion.datePickerTokens.dividerFontSize, _emotion.datePickerTokens.dividerFontWeight, _emotion.datePickerTokens.dividerLetterSpacing, _emotion.datePickerTokens.dividerLineHeight, _emotion.datePickerTokens.leftContentMargin, _emotion.datePickerTokens.rightContentMargin, _emotion.datePickerTokens.labelOffset, _emotion.datePickerTokens.labelInnerPadding, _emotion.datePickerTokens.contentLabelInnerPadding, _emotion.datePickerTokens.labelFontFamily, _emotion.datePickerTokens.labelFontStyle, _emotion.datePickerTokens.labelFontSize, _emotion.datePickerTokens.labelFontWeight, _emotion.datePickerTokens.labelLetterSpacing, _emotion.datePickerTokens.labelLineHeight, _emotion.datePickerTokens.indicatorSize, _emotion.datePickerTokens.indicatorSizeOuter, _emotion.datePickerTokens.indicatorPlacement, _emotion.datePickerTokens.indicatorOuterPlacement, _emotion.datePickerTokens.indicatorPlacementRight, _emotion.datePickerTokens.indicatorOuterPlacementRight, _emotion.datePickerTokens.textFieldHeight, _emotion.datePickerTokens.textFieldBorderRadius, _emotion.datePickerTokens.textFieldBorderWidth, _emotion.datePickerTokens.textFieldPadding, _emotion.datePickerTokens.textFieldFontFamily, _emotion.datePickerTokens.textFieldFontStyle, _emotion.datePickerTokens.textFieldFontSize, _emotion.datePickerTokens.textFieldFontWeight, _emotion.datePickerTokens.textFieldLetterSpacing, _emotion.datePickerTokens.textFieldLineHeight, _emotion.datePickerTokens.leftHelperOffset, _emotion.datePickerTokens.leftHelperFontFamily, _emotion.datePickerTokens.leftHelperFontStyle, _emotion.datePickerTokens.leftHelperFontSize, _emotion.datePickerTokens.leftHelperFontWeight, _emotion.datePickerTokens.leftHelperLetterSpacing, _emotion.datePickerTokens.leftHelperLineHeight, _emotion.datePickerTokens.textFieldLeftContentMargin, _emotion.datePickerTokens.textFieldRightContentMargin, _emotion.datePickerTokens.textFieldTextBeforeMargin, _emotion.datePickerTokens.textFieldTextAfterMargin, _emotion.datePickerTokens.calendarBorderWidth, _emotion.datePickerTokens.calendarWidth, _emotion.datePickerTokens.calendarBorderRadius, _emotion.datePickerTokens.calendarYearsPadding, _emotion.datePickerTokens.calendarYearItemBorderRadius, _emotion.datePickerTokens.calendarYearItemWidth, _emotion.datePickerTokens.calendarYearItemHeight, _emotion.datePickerTokens.calendarYearFontFamily, _emotion.datePickerTokens.calendarYearFontSize, _emotion.datePickerTokens.calendarYearFontStyle, _emotion.datePickerTokens.calendarYearFontLetterSpacing, _emotion.datePickerTokens.calendarYearFontLineHeight, _emotion.datePickerTokens.calendarYearFontWeight, _emotion.datePickerTokens.calendarYearSelectedFontWeight, _emotion.datePickerTokens.calendarQuartersPadding, _emotion.datePickerTokens.calendarQuarterItemBorderRadius, _emotion.datePickerTokens.calendarQuarterItemWidth, _emotion.datePickerTokens.calendarQuarterItemHeight, _emotion.datePickerTokens.calendarQuarterFontFamily, _emotion.datePickerTokens.calendarQuarterFontSize, _emotion.datePickerTokens.calendarQuarterFontStyle, _emotion.datePickerTokens.calendarQuarterFontLetterSpacing, _emotion.datePickerTokens.calendarQuarterFontLineHeight, _emotion.datePickerTokens.calendarQuarterFontWeight, _emotion.datePickerTokens.calendarQuarterSelectedFontWeight, _emotion.datePickerTokens.calendarMonthsPadding, _emotion.datePickerTokens.calendarMonthItemBorderRadius, _emotion.datePickerTokens.calendarMonthItemWidth, _emotion.datePickerTokens.calendarMonthItemHeight, _emotion.datePickerTokens.calendarMonthFontFamily, _emotion.datePickerTokens.calendarMonthFontSize, _emotion.datePickerTokens.calendarMonthFontStyle, _emotion.datePickerTokens.calendarMonthFontLetterSpacing, _emotion.datePickerTokens.calendarMonthFontLineHeight, _emotion.datePickerTokens.calendarMonthFontWeight, _emotion.datePickerTokens.calendarMonthSelectedFontWeight, _emotion.datePickerTokens.calendarDaysPadding, _emotion.datePickerTokens.calendarDayItemBorderRadius, _emotion.datePickerTokens.calendarDayItemWidth, _emotion.datePickerTokens.calendarDayItemHeight, _emotion.datePickerTokens.calendarDayFontFamily, _emotion.datePickerTokens.calendarDayFontSize, _emotion.datePickerTokens.calendarDayFontStyle, _emotion.datePickerTokens.calendarDayFontLetterSpacing, _emotion.datePickerTokens.calendarDayFontLineHeight, _emotion.datePickerTokens.calendarDayFontWeight, _emotion.datePickerTokens.calendarDaySelectedFontWeight, _emotion.datePickerTokens.calendarCurrentItemBorderWidth, _emotion.datePickerTokens.calendarHeaderWrapperPadding, _emotion.datePickerTokens.calendarHeaderArrowGap, _emotion.datePickerTokens.calendarHeaderPadding, _emotion.datePickerTokens.calendarHeaderDateGap, _emotion.datePickerTokens.calendarHeaderFontFamily, _emotion.datePickerTokens.calendarHeaderFontSize, _emotion.datePickerTokens.calendarHeaderFontStyle, _emotion.datePickerTokens.calendarHeaderFontLetterSpacing, _emotion.datePickerTokens.calendarHeaderFontLineHeight, _emotion.datePickerTokens.calendarHeaderFontWeight, _emotion.datePickerTokens.calendarHeaderFontWeightBold, _emotion.datePickerTokens.iconButtonHeight, _emotion.datePickerTokens.iconButtonWidth, _emotion.datePickerTokens.iconButtonPadding, _emotion.datePickerTokens.iconButtonRadius)
package/emotion/cjs/components/DatePicker/DatePicker.stories.tsx CHANGED
@@ -9,6 +9,7 @@ import { IconButton } from '../IconButton/IconButton';
9
9
  import { DatePicker, DatePickerRange } from './DatePicker';
10
10
 
11
11
  const onChangeValue = action('onChangeValue');
12
+ const onCommitDate = action('onCommitDate');
12
13
  const onBlur = action('onBlur');
13
14
  const onFocus = action('onFocus');
14
15
 
@@ -107,10 +108,8 @@ const StoryDefault = ({
107
108
  onBlur={onBlur}
108
109
  onFocus={onFocus}
109
110
  onToggle={(is) => setIsOpen(is)}
110
- onChangeValue={(e, currentValue) => {
111
- onChangeValue(e, currentValue);
112
- }}
113
- onCommitDate={() => setIsOpen(false)}
111
+ onChangeValue={onChangeValue}
112
+ onCommitDate={onCommitDate}
114
113
  {...rest}
115
114
  />
116
115
  );
@@ -141,6 +140,7 @@ export const Default: StoryObj<StoryPropsDefault> = {
141
140
  labelPlacement: 'outer',
142
141
  defaultDate: new Date(2024, 5, 14),
143
142
  renderFromDate: new Date(2024, 4, 14),
143
+ includeEdgeDates: true,
144
144
  min: new Date(2024, 1, 1),
145
145
  max: new Date(2024, 12, 29),
146
146
  maskWithFormat: false,
@@ -236,12 +236,8 @@ const StoryRange = ({
236
236
  showDefaultTextBefore ? secondTextfieldTextBefore || 'ПО' : secondTextfieldTextBefore
237
237
  }
238
238
  onToggle={(is) => setIsOpen(is)}
239
- onChangeFirstValue={(e, currentValue) => {
240
- onChangeFirstValue(e, currentValue);
241
- }}
242
- onChangeSecondValue={(e, currentValue) => {
243
- onChangeSecondValue(e, currentValue);
244
- }}
239
+ onChangeFirstValue={onChangeFirstValue}
240
+ onChangeSecondValue={onChangeSecondValue}
245
241
  {...dividerIconProps}
246
242
  {...rest}
247
243
  />
@@ -273,6 +269,7 @@ export const Range: StoryObj<StoryPropsRange> = {
273
269
  closeAfterDateSelect: true,
274
270
  isDoubleCalendar: false,
275
271
  dividerVariant: 'dash',
272
+ includeEdgeDates: true,
276
273
  min: new Date(2024, 1, 1),
277
274
  max: new Date(2024, 12, 29),
278
275
  renderFromDate: new Date(2024, 4, 14),
package/emotion/cjs/components/Select/Select.stories.tsx CHANGED
@@ -5,6 +5,7 @@ import { disableProps, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
5
5
  import { IconPlasma } from '@salutejs/plasma-icons';
6
6
 
7
7
  import './style.css';
8
+
8
9
  import { Select } from './Select';
9
10
 
10
11
  type StorySelectProps = ComponentProps<typeof Select> & {