@salutejs/plasma-new-hope 0.254.0-canary.1727.13073661835.0 → 0.254.0-canary.1739.13073957671.0

package/styled-components/cjs/components/Popover/Popover.js

@@ -13,7 +13,7 @@ var _Portal = /*#__PURE__*/require("../Portal");
 var _base = /*#__PURE__*/require("./variations/_view/base");
 var _Popover = /*#__PURE__*/require("./Popover.styles");
 var _Popover2 = /*#__PURE__*/require("./Popover.tokens");
-var _excluded = ["target", "children", "isOpen", "opened", "trigger", "hasArrow", "frame", "className", "placement", "offset", "zIndex", "isFocusTrapped", "closeOnEsc", "preventOverflow", "usePortal", "view", "onToggle", "closeOnOverlayClick"];
+var _excluded = ["target", "children", "animated", "isOpen", "opened", "trigger", "hasArrow", "frame", "className", "placement", "offset", "zIndex", "isFocusTrapped", "closeOnEsc", "preventOverflow", "usePortal", "view", "onToggle", "closeOnOverlayClick"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -43,6 +43,7 @@ var popoverRoot = exports.popoverRoot = function popoverRoot(Root) {
     var _placement$;
     var target = _ref.target,
       children = _ref.children,
+      animated = _ref.animated,
       isOpen = _ref.isOpen,
       opened = _ref.opened,
       _ref$trigger = _ref.trigger,
@@ -85,6 +86,8 @@ var popoverRoot = exports.popoverRoot = function popoverRoot(Root) {
     var portalContainer = _typeof(target) === 'object' && target !== null && 'current' in target && target.current || undefined;
     var isAutoArray = Array.isArray(placement);
     var isAuto = isAutoArray || placement.startsWith('auto');
+    var openClass = innerIsOpen ? _Popover2.classes.open : undefined;
+    var animatedClass = animated ? _Popover2.classes.animate : undefined;
     var initialStyles = {
       visibility: innerIsOpen ? 'visible' : 'hidden',
       opacity: innerIsOpen ? 1 : 0
@@ -235,11 +238,9 @@ var popoverRoot = exports.popoverRoot = function popoverRoot(Root) {
       view: view,
       className: className
     }, rest), /*#__PURE__*/_react["default"].createElement(_Popover.StyledPopover, _extends({}, attributes.popper, {
-      className: _Popover2.classes.root,
+      className: (0, _utils.cx)(_Popover2.classes.root, openClass, animatedClass),
       ref: popoverForkRef,
-      style: _objectSpread(_objectSpread(_objectSpread({}, styles.popper), {
-        display: innerIsOpen ? 'block' : 'none'
-      }), initialStyles),
+      style: _objectSpread(_objectSpread({}, styles.popper), initialStyles),
       zIndex: zIndex
     }), hasArrow && /*#__PURE__*/_react["default"].createElement(_Popover.StyledArrow, _extends({
       className: _Popover2.classes.arrow,

package/styled-components/cjs/components/Popover/Popover.styles.js

@@ -19,7 +19,7 @@ var StyledArrow = exports.StyledArrow = /*#__PURE__*/_styledComponents["default"
 })(["width:var(", ");height:var(", ");&::before{position:absolute;width:var(", ");height:var(", ");mask-image:var(", ");background:var(", ");content:'';transform:rotate(0deg);}"], /*#__PURE__*/String(_Popover.tokens.arrowMaskWidth), /*#__PURE__*/String(_Popover.tokens.arrowMaskHeight), /*#__PURE__*/String(_Popover.tokens.arrowMaskWidth), /*#__PURE__*/String(_Popover.tokens.arrowMaskHeight), /*#__PURE__*/String(_Popover.tokens.arrowMaskImage), /*#__PURE__*/String(_Popover.tokens.arrowBackground));
 var StyledPopover = exports.StyledPopover = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   componentId: "plasma-new-hope__sc-tnpyex-3"
-})(["position:absolute;z-index:", ";&:before{content:'';display:block;position:absolute;background:transparent;}&[data-popper-placement^='top'] > .", "{bottom:calc(0px - var(", "));}&[data-popper-placement^='bottom'] > .", "{top:calc(0px - var(", "));&::before{transform:rotate(180deg);}}&[data-popper-placement^='left'] > .", "{right:calc(0px - var(", "));&::before{transform:rotate(-90deg);}}&[data-popper-placement^='right'] > .", "{left:calc(0px - var(", "));&::before{transform:rotate(90deg);}}&[data-popper-placement^='top-start'] > .", "{bottom:calc(0px - var(", "));left:var(", ") !important;transform:unset !important;}&[data-popper-placement^='top-end'] > .", "{bottom:calc(0px - var(", "));left:unset !important;right:var(", ") !important;transform:unset !important;}&[data-popper-placement^='bottom-start'] > .", "{top:calc(0px - var(", "));left:var(", ") !important;transform:unset !important;&::before{transform:rotate(180deg);}}&[data-popper-placement^='bottom-end'] > .", "{top:calc(0px - var(", "));left:unset !important;right:var(", ") !important;transform:unset !important;&::before{transform:rotate(180deg);}}&[data-popper-placement^='left-start'] > .", ",&[data-popper-placement^='right-start'] > .", "{top:var(", ") !important;transform:unset !important;}&[data-popper-placement^='left-end'] > .", ",&[data-popper-placement^='right-end'] > .", "{top:unset !important;bottom:var(", ") !important;transform:unset !important;}&[data-popper-placement^='top'],&[data-popper-placement^='top-start'],&[data-popper-placement^='top-end']{&:before{top:unset;left:0;right:0;height:var(", ");bottom:calc(-1 * var(", "));}}&[data-popper-placement^='bottom'],&[data-popper-placement^='bottom-start'],&[data-popper-placement^='bottom-end']{&:before{top:calc(-1 * var(", "));left:0;right:0;bottom:var(", ");height:var(", ");}}&[data-popper-placement^='left'],&[data-popper-placement^='left-start'],&[data-popper-placement^='left-end']{&:before{width:var(", ");height:100%;top:0;right:calc(-1 * var(", "));bottom:0;}}&[data-popper-placement^='right'],&[data-popper-placement^='right-start'],&[data-popper-placement^='right-end']{&:before{width:var(", ");height:100%;top:0;left:calc(-1 * var(", "));bottom:0;}}"], function (_ref) {
+})(["position:absolute;z-index:", ";opacity:0;visibility:hidden;&.", "{transition:opacity 200ms ease-in-out,visibility 200ms ease-in-out;}&.", "{opacity:1;visibility:visible;}&:before{content:'';display:block;position:absolute;background:transparent;}&[data-popper-placement^='top'] > .", "{bottom:calc(0px - var(", "));}&[data-popper-placement^='bottom'] > .", "{top:calc(0px - var(", "));&::before{transform:rotate(180deg);}}&[data-popper-placement^='left'] > .", "{right:calc(0px - var(", "));&::before{transform:rotate(-90deg);}}&[data-popper-placement^='right'] > .", "{left:calc(0px - var(", "));&::before{transform:rotate(90deg);}}&[data-popper-placement^='top-start'] > .", "{bottom:calc(0px - var(", "));left:var(", ") !important;transform:unset !important;}&[data-popper-placement^='top-end'] > .", "{bottom:calc(0px - var(", "));left:unset !important;right:var(", ") !important;transform:unset !important;}&[data-popper-placement^='bottom-start'] > .", "{top:calc(0px - var(", "));left:var(", ") !important;transform:unset !important;&::before{transform:rotate(180deg);}}&[data-popper-placement^='bottom-end'] > .", "{top:calc(0px - var(", "));left:unset !important;right:var(", ") !important;transform:unset !important;&::before{transform:rotate(180deg);}}&[data-popper-placement^='left-start'] > .", ",&[data-popper-placement^='right-start'] > .", "{top:var(", ") !important;transform:unset !important;}&[data-popper-placement^='left-end'] > .", ",&[data-popper-placement^='right-end'] > .", "{top:unset !important;bottom:var(", ") !important;transform:unset !important;}&[data-popper-placement^='top'],&[data-popper-placement^='top-start'],&[data-popper-placement^='top-end']{&:before{top:unset;left:0;right:0;height:var(", ");bottom:calc(-1 * var(", "));}}&[data-popper-placement^='bottom'],&[data-popper-placement^='bottom-start'],&[data-popper-placement^='bottom-end']{&:before{top:calc(-1 * var(", "));left:0;right:0;bottom:var(", ");height:var(", ");}}&[data-popper-placement^='left'],&[data-popper-placement^='left-start'],&[data-popper-placement^='left-end']{&:before{width:var(", ");height:100%;top:0;right:calc(-1 * var(", "));bottom:0;}}&[data-popper-placement^='right'],&[data-popper-placement^='right-start'],&[data-popper-placement^='right-end']{&:before{width:var(", ");height:100%;top:0;left:calc(-1 * var(", "));bottom:0;}}"], function (_ref) {
   var zIndex = _ref.zIndex;
   return zIndex || _utils.DEFAULT_Z_INDEX;
-}, _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowEdgeMargin), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowEdgeMargin), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowEdgeMargin), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowEdgeMargin), _Popover.classes.arrow, _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowEdgeMargin), _Popover.classes.arrow, _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowEdgeMargin), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight));
+}, _Popover.classes.animate, _Popover.classes.open, _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowEdgeMargin), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowEdgeMargin), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowEdgeMargin), _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowEdgeMargin), _Popover.classes.arrow, _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowEdgeMargin), _Popover.classes.arrow, _Popover.classes.arrow, /*#__PURE__*/String(_Popover.tokens.arrowEdgeMargin), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight), /*#__PURE__*/String(_Popover.tokens.arrowHeight));

package/styled-components/cjs/components/Popover/Popover.tokens.js

@@ -9,7 +9,9 @@ var classes = exports.classes = {
   root: 'popover-root',
   target: 'popover-target',
   arrow: 'popover-arrow',
-  targetAsRef: 'popover-target-as-ref'
+  targetAsRef: 'popover-target-as-ref',
+  open: 'popover-open',
+  animate: 'popover-animate'
 };
 var tokens = exports.tokens = {
   arrowMaskWidth: '--plasma-popover-arrow-mask-width',

package/styled-components/cjs/components/Range/Range.js

@@ -143,9 +143,7 @@ var rangeRoot = exports.rangeRoot = function rangeRoot(Root) {
       onFocus: onFocusSecondTextfield,
       onBlur: onBlurSecondTextfield,
       autoComplete: autoComplete
-    }), contentRight && /*#__PURE__*/_react["default"].createElement(_Range.StyledContentRight, null, contentRight)), leftHelper && /*#__PURE__*/_react["default"].createElement(_Range.LeftHelper, {
-      className: (0, _utils.cx)(rangeErrorClass, firstValueErrorClass, secondValueErrorClass, rangeSuccessClass, firstValueSuccessClass, secondValueSuccessClass)
-    }, leftHelper));
+    }), contentRight && /*#__PURE__*/_react["default"].createElement(_Range.StyledContentRight, null, contentRight)), leftHelper && /*#__PURE__*/_react["default"].createElement(_Range.LeftHelper, null, leftHelper));
   });
 };
 var rangeConfig = exports.rangeConfig = {

package/styled-components/cjs/components/Range/Range.tokens.js

@@ -58,8 +58,6 @@ var tokens = exports.tokens = {
   leftHelperColor: '--plasma-range__left-helper-color',
   leftHelperColorReadOnly: '--plasma-range__left-helper-color-readonly',
   leftHelperOffset: '--plasma-range__left-helper-offset',
-  leftHelperColorError: '--plasma-range__left-helper-color-error',
-  leftHelperColorSuccess: '--plasma-range__left-helper-color-success',
   leftHelperFontFamily: '--plasma-range__left-helper-font-family',
   leftHelperFontStyle: '--plasma-range__left-helper-font-style',
   leftHelperFontSize: '--plasma-range__left-helper-font-size',

package/styled-components/cjs/components/Range/variations/_view/base.js

@@ -7,4 +7,4 @@ exports.base = void 0;
 var _styledComponents = /*#__PURE__*/require("styled-components");
 var _Range = /*#__PURE__*/require("../../Range.tokens");
 var _Range2 = /*#__PURE__*/require("../../Range.styles");
-var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", "{background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");&.", "{background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");}&.", "{background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");}}", "{color:var(", ");}", "{display:block;color:var(", ");}", "{background-color:var(", ");}", "{color:var(", ");&.", ",&.", "{color:var(", ");}&.", ",&.", "{color:var(", ");}}"], _Range2.ContentWrapper, _Range.tokens.background, _Range.tokens.borderWidth, _Range.tokens.borderColor, _Range.classes.rangeError, _Range.tokens.backgroundError, _Range.tokens.borderWidth, _Range.tokens.borderColorError, _Range.classes.rangeSuccess, _Range.tokens.backgroundSuccess, _Range.tokens.borderWidth, _Range.tokens.borderColorSuccess, _Range2.StyledDivider, _Range.tokens.dividerColor, _Range2.StyledLabel, _Range.tokens.labelColor, _Range2.StyledIndicator, _Range.tokens.indicatorColor, _Range2.LeftHelper, _Range.tokens.leftHelperColor, _Range.classes.rangeError, _Range.classes.rangeValueError, _Range.tokens.leftHelperColorError, _Range.classes.rangeSuccess, _Range.classes.rangeValueSuccess, _Range.tokens.leftHelperColorSuccess);
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", "{background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");&.", "{background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");}&.", "{background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");}}", "{color:var(", ");}", "{display:block;color:var(", ");}", "{background-color:var(", ");}", "{color:var(", ");}"], _Range2.ContentWrapper, _Range.tokens.background, _Range.tokens.borderWidth, _Range.tokens.borderColor, _Range.classes.rangeError, _Range.tokens.backgroundError, _Range.tokens.borderWidth, _Range.tokens.borderColorError, _Range.classes.rangeSuccess, _Range.tokens.backgroundSuccess, _Range.tokens.borderWidth, _Range.tokens.borderColorSuccess, _Range2.StyledDivider, _Range.tokens.dividerColor, _Range2.StyledLabel, _Range.tokens.labelColor, _Range2.StyledIndicator, _Range.tokens.indicatorColor, _Range2.LeftHelper, _Range.tokens.leftHelperColor);

package/styled-components/cjs/components/Tooltip/Tooltip.js

@@ -34,7 +34,7 @@ var getStringValue = function getStringValue(value) {
 var Popover = /*#__PURE__*/(0, _engines.component)(_Popover.popoverConfig);
 var StyledPopover = /*#__PURE__*/(0, _styledComponents["default"])(Popover).withConfig({
   componentId: "plasma-new-hope__sc-dj06kz-0"
-})(["", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");&.", " .", "{transition:opacity 200ms ease-in-out,visibility 200ms ease-in-out;}"], _Popover.popoverTokens.arrowMaskWidth, _Tooltip2.tokens.arrowMaskWidth, _Popover.popoverTokens.arrowMaskHeight, _Tooltip2.tokens.arrowMaskHeight, _Popover.popoverTokens.arrowMaskImage, _Tooltip2.tokens.arrowMaskImage, _Popover.popoverTokens.arrowBackground, _Tooltip2.tokens.arrowBackground, _Popover.popoverTokens.arrowHeight, _Tooltip2.tokens.arrowHeight, _Popover.popoverTokens.arrowEdgeMargin, _Tooltip2.tokens.arrowEdgeMargin, _Tooltip2.classes.animated, _Popover.popoverClasses.root);
+})(["", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");"], _Popover.popoverTokens.arrowMaskWidth, _Tooltip2.tokens.arrowMaskWidth, _Popover.popoverTokens.arrowMaskHeight, _Tooltip2.tokens.arrowMaskHeight, _Popover.popoverTokens.arrowMaskImage, _Tooltip2.tokens.arrowMaskImage, _Popover.popoverTokens.arrowBackground, _Tooltip2.tokens.arrowBackground, _Popover.popoverTokens.arrowHeight, _Tooltip2.tokens.arrowHeight, _Popover.popoverTokens.arrowEdgeMargin, _Tooltip2.tokens.arrowEdgeMargin);
 
 /**
  * Компонент для текстовых подсказок. Основное предназначение — подписи к блокам.
@@ -91,7 +91,6 @@ var tooltipRoot = exports.tooltipRoot = function tooltipRoot(Root) {
     var innerIsOpen = Boolean(isVisible || isOpen || opened);
     var innerHasArrow = arrow || hasArrow;
     var showTooltip = innerIsOpen && Boolean(text);
-    var animatedClass = animated ? _Tooltip2.classes.animated : undefined;
     (0, _react.useEffect)(function () {
       var onKeyDown = function onKeyDown(event) {
         if (event.keyCode === ESCAPE_KEYCODE) {
@@ -142,7 +141,8 @@ var tooltipRoot = exports.tooltipRoot = function tooltipRoot(Root) {
       "aria-hidden": !innerIsOpen,
       "aria-live": "polite",
       role: "tooltip",
-      className: (0, _utils.cx)(ref === null || ref === void 0 ? void 0 : ref.classList.toString(), animatedClass)
+      animated: animated,
+      className: (0, _utils.cx)(ref === null || ref === void 0 ? void 0 : ref.classList.toString())
     }, (trigger === 'hover' || trigger === 'click') && {
       trigger: trigger,
       onToggle: onToggle

package/styled-components/cjs/examples/plasma_b2c/components/DatePicker/DatePicker.config.js

@@ -13,7 +13,7 @@ var config = exports.config = {
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-transparent-primary);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-positive);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-negative);", ":var(--text-positive);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-accent);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--surface-negative);", ":var(--surface-transparent-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-negative-active);", ":var(--surface-transparent-positive);", ":var(--surface-transparent-positive-active);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-accent);", ":var(--text-tertiary);", ":var(--shadow-down-soft-s);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-card);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-default);", ":transparent;", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-accent);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-accent);", ":var(--surface-solid-default);", ":", ";", ":var(--text-secondary);", ":var(--text-primary);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--surface-accent);"], _DatePicker.datePickerTokens.background, _DatePicker.datePickerTokens.backgroundError, _DatePicker.datePickerTokens.backgroundSuccess, _DatePicker.datePickerTokens.dividerColor, _DatePicker.datePickerTokens.labelColor, _DatePicker.datePickerTokens.leftHelperColor, _DatePicker.datePickerTokens.leftHelperColorError, _DatePicker.datePickerTokens.leftHelperColorSuccess, _DatePicker.datePickerTokens.textFieldColor, _DatePicker.datePickerTokens.textFieldPlaceholderColor, _DatePicker.datePickerTokens.textFieldCaretColor, _DatePicker.datePickerTokens.labelInnerFontFamily, _DatePicker.datePickerTokens.labelInnerFontSize, _DatePicker.datePickerTokens.labelInnerFontStyle, _DatePicker.datePickerTokens.labelInnerFontWeight, _DatePicker.datePickerTokens.labelInnerLetterSpacing, _DatePicker.datePickerTokens.labelInnerLineHeight, _DatePicker.datePickerTokens.indicatorColor, _DatePicker.datePickerTokens.textFieldBackgroundColor, _DatePicker.datePickerTokens.textFieldBackgroundColorFocus, _DatePicker.datePickerTokens.textFieldBackgroundErrorColor, _DatePicker.datePickerTokens.textFieldBackgroundErrorColorFocus, _DatePicker.datePickerTokens.textFieldBackgroundSuccessColor, _DatePicker.datePickerTokens.textFieldBackgroundSuccessColorFocus, _DatePicker.datePickerTokens.textFieldTextBeforeColor, _DatePicker.datePickerTokens.textFieldTextAfterColor, _DatePicker.datePickerTokens.focusColor, _DatePicker.datePickerTokens.textFieldPlaceholderColorFocus, _DatePicker.datePickerTokens.calendarShadow, _DatePicker.datePickerTokens.calendarSeparatorBackground, _DatePicker.datePickerTokens.calendarBackgroundColor, _DatePicker.datePickerTokens.calendarSelectedItemBackground, _DatePicker.datePickerTokens.calendarSelectedItemColor, _DatePicker.datePickerTokens.calendarSelectableItemBackgroundHover, _DatePicker.datePickerTokens.calendarCurrentItemBorderColor, _DatePicker.datePickerTokens.calendarCurrentItemBackgroundHover, _DatePicker.datePickerTokens.calendarCurrentItemColorHover, _DatePicker.datePickerTokens.calendarCurrentItemChildBackgroundHover, _DatePicker.datePickerTokens.calendarActiveItemBackground, _DatePicker.datePickerTokens.calendarActiveItemColor, _DatePicker.datePickerTokens.calendarHoveredItemBackground, _DatePicker.datePickerTokens.calendarHoveredItemColor, _DatePicker.datePickerTokens.calendarRangeBackground, _DatePicker.datePickerTokens.calendarOutlineFocusColor, _DatePicker.datePickerTokens.calendarContentPrimaryColor, _DatePicker.datePickerTokens.calendarHeaderArrowColor, _DatePicker.datePickerTokens.calendarContentPrimaryColor, _DatePicker.datePickerTokens.calendarContentSecondaryColor, _DatePicker.datePickerTokens.iconButtonColor, _DatePicker.datePickerTokens.iconButtonBackgroundColor, _DatePicker.datePickerTokens.iconButtonColorHover, _DatePicker.datePickerTokens.iconButtonBackgroundColorHover, _DatePicker.datePickerTokens.iconButtonColorActive, _DatePicker.datePickerTokens.iconButtonBackgroundColorActive, _DatePicker.datePickerTokens.iconButtonFocusColor)
+      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-transparent-primary);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-positive);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-accent);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--surface-negative);", ":var(--surface-transparent-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-negative-active);", ":var(--surface-transparent-positive);", ":var(--surface-transparent-positive-active);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-accent);", ":var(--text-tertiary);", ":var(--shadow-down-soft-s);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-card);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-default);", ":transparent;", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-accent);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-accent);", ":var(--surface-solid-default);", ":", ";", ":var(--text-secondary);", ":var(--text-primary);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--surface-accent);"], _DatePicker.datePickerTokens.background, _DatePicker.datePickerTokens.backgroundError, _DatePicker.datePickerTokens.backgroundSuccess, _DatePicker.datePickerTokens.dividerColor, _DatePicker.datePickerTokens.labelColor, _DatePicker.datePickerTokens.leftHelperColor, _DatePicker.datePickerTokens.textFieldColor, _DatePicker.datePickerTokens.textFieldPlaceholderColor, _DatePicker.datePickerTokens.textFieldCaretColor, _DatePicker.datePickerTokens.labelInnerFontFamily, _DatePicker.datePickerTokens.labelInnerFontSize, _DatePicker.datePickerTokens.labelInnerFontStyle, _DatePicker.datePickerTokens.labelInnerFontWeight, _DatePicker.datePickerTokens.labelInnerLetterSpacing, _DatePicker.datePickerTokens.labelInnerLineHeight, _DatePicker.datePickerTokens.indicatorColor, _DatePicker.datePickerTokens.textFieldBackgroundColor, _DatePicker.datePickerTokens.textFieldBackgroundColorFocus, _DatePicker.datePickerTokens.textFieldBackgroundErrorColor, _DatePicker.datePickerTokens.textFieldBackgroundErrorColorFocus, _DatePicker.datePickerTokens.textFieldBackgroundSuccessColor, _DatePicker.datePickerTokens.textFieldBackgroundSuccessColorFocus, _DatePicker.datePickerTokens.textFieldTextBeforeColor, _DatePicker.datePickerTokens.textFieldTextAfterColor, _DatePicker.datePickerTokens.focusColor, _DatePicker.datePickerTokens.textFieldPlaceholderColorFocus, _DatePicker.datePickerTokens.calendarShadow, _DatePicker.datePickerTokens.calendarSeparatorBackground, _DatePicker.datePickerTokens.calendarBackgroundColor, _DatePicker.datePickerTokens.calendarSelectedItemBackground, _DatePicker.datePickerTokens.calendarSelectedItemColor, _DatePicker.datePickerTokens.calendarSelectableItemBackgroundHover, _DatePicker.datePickerTokens.calendarCurrentItemBorderColor, _DatePicker.datePickerTokens.calendarCurrentItemBackgroundHover, _DatePicker.datePickerTokens.calendarCurrentItemColorHover, _DatePicker.datePickerTokens.calendarCurrentItemChildBackgroundHover, _DatePicker.datePickerTokens.calendarActiveItemBackground, _DatePicker.datePickerTokens.calendarActiveItemColor, _DatePicker.datePickerTokens.calendarHoveredItemBackground, _DatePicker.datePickerTokens.calendarHoveredItemColor, _DatePicker.datePickerTokens.calendarRangeBackground, _DatePicker.datePickerTokens.calendarOutlineFocusColor, _DatePicker.datePickerTokens.calendarContentPrimaryColor, _DatePicker.datePickerTokens.calendarHeaderArrowColor, _DatePicker.datePickerTokens.calendarContentPrimaryColor, _DatePicker.datePickerTokens.calendarContentSecondaryColor, _DatePicker.datePickerTokens.iconButtonColor, _DatePicker.datePickerTokens.iconButtonBackgroundColor, _DatePicker.datePickerTokens.iconButtonColorHover, _DatePicker.datePickerTokens.iconButtonBackgroundColorHover, _DatePicker.datePickerTokens.iconButtonColorActive, _DatePicker.datePickerTokens.iconButtonBackgroundColorActive, _DatePicker.datePickerTokens.iconButtonFocusColor)
     },
     size: {
       l: /*#__PURE__*/(0, _styledComponents.css)(["", ":26.5rem;", ":0.875rem;", ":0 0.375rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0 0 0 1rem;", ":0;", ":0.75rem;", ":0.5625rem 0 0.125rem 0;", ":1.5625rem 0 0.5625rem 0;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.5rem;", ":0.375rem;", ":0 0 0 0;", ":0.5rem auto auto -0.75rem;", ":0 0 auto auto;", ":0.25rem -0.625rem auto auto;", ":3.5rem;", ":0.875rem;", ":1.0625rem 1.125rem 1.0625rem 1.125rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-0.0625rem 0.5rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;", ":0.875rem;", ":26.5rem;", ":0.5rem 1rem 1.125rem 1rem;", ":0.75rem;", ":7.8125rem;", ":5.25rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.5rem 1rem 1.125rem 1rem;", ":0.75rem;", ":7.8125rem;", ":5.25rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.5rem 0.5rem 0 0.5rem;", ":0.75rem;", ":11.75rem;", ":10.5rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.5rem 1rem 1.125rem 1rem;", ":0.75rem;", ":3.5rem;", ":3rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.063rem;", ":0.875rem 1rem 0 1rem;", ":0.5rem;", ":0 0 0 1rem;", ":0.5rem;", ":var(--plasma-typo-h3-font-family);", ":var(--plasma-typo-h3-font-size);", ":var(--plasma-typo-h3-font-style);", ":var(--plasma-typo-h3-letter-spacing);", ":var(--plasma-typo-h3-line-height);", ":var(--plasma-typo-h3-font-weight);", ":var(--plasma-typo-h3-bold-font-weight);", ":3.5rem;", ":3.5rem;", ":1.5rem;", ":0.875rem;"], _DatePicker.datePickerTokens.width, _DatePicker.datePickerTokens.borderRadius, _DatePicker.datePickerTokens.dividerPadding, _DatePicker.datePickerTokens.dividerFontFamily, _DatePicker.datePickerTokens.dividerFontStyle, _DatePicker.datePickerTokens.dividerFontSize, _DatePicker.datePickerTokens.dividerFontWeight, _DatePicker.datePickerTokens.dividerLetterSpacing, _DatePicker.datePickerTokens.dividerLineHeight, _DatePicker.datePickerTokens.leftContentMargin, _DatePicker.datePickerTokens.rightContentMargin, _DatePicker.datePickerTokens.labelOffset, _DatePicker.datePickerTokens.labelInnerPadding, _DatePicker.datePickerTokens.contentLabelInnerPadding, _DatePicker.datePickerTokens.labelFontFamily, _DatePicker.datePickerTokens.labelFontStyle, _DatePicker.datePickerTokens.labelFontSize, _DatePicker.datePickerTokens.labelFontWeight, _DatePicker.datePickerTokens.labelLetterSpacing, _DatePicker.datePickerTokens.labelLineHeight, _DatePicker.datePickerTokens.indicatorSize, _DatePicker.datePickerTokens.indicatorSizeOuter, _DatePicker.datePickerTokens.indicatorPlacement, _DatePicker.datePickerTokens.indicatorOuterPlacement, _DatePicker.datePickerTokens.indicatorPlacementRight, _DatePicker.datePickerTokens.indicatorOuterPlacementRight, _DatePicker.datePickerTokens.textFieldHeight, _DatePicker.datePickerTokens.textFieldBorderRadius, _DatePicker.datePickerTokens.textFieldPadding, _DatePicker.datePickerTokens.textFieldFontFamily, _DatePicker.datePickerTokens.textFieldFontStyle, _DatePicker.datePickerTokens.textFieldFontSize, _DatePicker.datePickerTokens.textFieldFontWeight, _DatePicker.datePickerTokens.textFieldLetterSpacing, _DatePicker.datePickerTokens.textFieldLineHeight, _DatePicker.datePickerTokens.leftHelperOffset, _DatePicker.datePickerTokens.leftHelperFontFamily, _DatePicker.datePickerTokens.leftHelperFontStyle, _DatePicker.datePickerTokens.leftHelperFontSize, _DatePicker.datePickerTokens.leftHelperFontWeight, _DatePicker.datePickerTokens.leftHelperLetterSpacing, _DatePicker.datePickerTokens.leftHelperLineHeight, _DatePicker.datePickerTokens.textFieldLeftContentMargin, _DatePicker.datePickerTokens.textFieldRightContentMargin, _DatePicker.datePickerTokens.textFieldTextBeforeMargin, _DatePicker.datePickerTokens.textFieldTextAfterMargin, _DatePicker.datePickerTokens.calendarBorderRadius, _DatePicker.datePickerTokens.calendarWidth, _DatePicker.datePickerTokens.calendarYearsPadding, _DatePicker.datePickerTokens.calendarYearItemBorderRadius, _DatePicker.datePickerTokens.calendarYearItemWidth, _DatePicker.datePickerTokens.calendarYearItemHeight, _DatePicker.datePickerTokens.calendarYearFontFamily, _DatePicker.datePickerTokens.calendarYearFontSize, _DatePicker.datePickerTokens.calendarYearFontStyle, _DatePicker.datePickerTokens.calendarYearFontLetterSpacing, _DatePicker.datePickerTokens.calendarYearFontLineHeight, _DatePicker.datePickerTokens.calendarYearFontWeight, _DatePicker.datePickerTokens.calendarYearSelectedFontWeight, _DatePicker.datePickerTokens.calendarMonthsPadding, _DatePicker.datePickerTokens.calendarMonthItemBorderRadius, _DatePicker.datePickerTokens.calendarMonthItemWidth, _DatePicker.datePickerTokens.calendarMonthItemHeight, _DatePicker.datePickerTokens.calendarMonthFontFamily, _DatePicker.datePickerTokens.calendarMonthFontSize, _DatePicker.datePickerTokens.calendarMonthFontStyle, _DatePicker.datePickerTokens.calendarMonthFontLetterSpacing, _DatePicker.datePickerTokens.calendarMonthFontLineHeight, _DatePicker.datePickerTokens.calendarMonthFontWeight, _DatePicker.datePickerTokens.calendarMonthSelectedFontWeight, _DatePicker.datePickerTokens.calendarQuartersPadding, _DatePicker.datePickerTokens.calendarQuarterItemBorderRadius, _DatePicker.datePickerTokens.calendarQuarterItemWidth, _DatePicker.datePickerTokens.calendarQuarterItemHeight, _DatePicker.datePickerTokens.calendarQuarterFontFamily, _DatePicker.datePickerTokens.calendarQuarterFontSize, _DatePicker.datePickerTokens.calendarQuarterFontStyle, _DatePicker.datePickerTokens.calendarQuarterFontLetterSpacing, _DatePicker.datePickerTokens.calendarQuarterFontLineHeight, _DatePicker.datePickerTokens.calendarQuarterFontWeight, _DatePicker.datePickerTokens.calendarQuarterSelectedFontWeight, _DatePicker.datePickerTokens.calendarDaysPadding, _DatePicker.datePickerTokens.calendarDayItemBorderRadius, _DatePicker.datePickerTokens.calendarDayItemWidth, _DatePicker.datePickerTokens.calendarDayItemHeight, _DatePicker.datePickerTokens.calendarDayFontFamily, _DatePicker.datePickerTokens.calendarDayFontSize, _DatePicker.datePickerTokens.calendarDayFontStyle, _DatePicker.datePickerTokens.calendarDayFontLetterSpacing, _DatePicker.datePickerTokens.calendarDayFontLineHeight, _DatePicker.datePickerTokens.calendarDayFontWeight, _DatePicker.datePickerTokens.calendarDaySelectedFontWeight, _DatePicker.datePickerTokens.calendarCurrentItemBorderWidth, _DatePicker.datePickerTokens.calendarHeaderWrapperPadding, _DatePicker.datePickerTokens.calendarHeaderArrowGap, _DatePicker.datePickerTokens.calendarHeaderPadding, _DatePicker.datePickerTokens.calendarHeaderDateGap, _DatePicker.datePickerTokens.calendarHeaderFontFamily, _DatePicker.datePickerTokens.calendarHeaderFontSize, _DatePicker.datePickerTokens.calendarHeaderFontStyle, _DatePicker.datePickerTokens.calendarHeaderFontLetterSpacing, _DatePicker.datePickerTokens.calendarHeaderFontLineHeight, _DatePicker.datePickerTokens.calendarHeaderFontWeight, _DatePicker.datePickerTokens.calendarHeaderFontWeightBold, _DatePicker.datePickerTokens.iconButtonHeight, _DatePicker.datePickerTokens.iconButtonWidth, _DatePicker.datePickerTokens.iconButtonPadding, _DatePicker.datePickerTokens.iconButtonRadius),

package/styled-components/cjs/examples/plasma_b2c/components/Popover/Popover.stories.tsx

@@ -67,6 +67,7 @@ const meta: Meta<typeof Popover> = {
         skidding: 0,
         distance: 6,
         hasArrow: true,
+        animated: true,
     },
 };
 

package/styled-components/cjs/examples/plasma_b2c/components/Range/Range.config.js

@@ -13,7 +13,7 @@ var config = exports.config = {
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-transparent-primary);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-positive);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-negative);", ":var(--text-positive);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-accent);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-negative-active);", ":var(--surface-transparent-positive);", ":var(--surface-transparent-positive-active);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--surface-negative);", ":var(--text-accent);", ":var(--text-tertiary);"], _Range.rangeTokens.background, _Range.rangeTokens.backgroundError, _Range.rangeTokens.backgroundSuccess, _Range.rangeTokens.dividerColor, _Range.rangeTokens.labelColor, _Range.rangeTokens.leftHelperColor, _Range.rangeTokens.leftHelperColorError, _Range.rangeTokens.leftHelperColorSuccess, _Range.rangeTokens.textFieldColor, _Range.rangeTokens.textFieldPlaceholderColor, _Range.rangeTokens.textFieldCaretColor, _Range.rangeTokens.textFieldBackgroundColorFocus, _Range.rangeTokens.textFieldBackgroundErrorColor, _Range.rangeTokens.textFieldBackgroundErrorColorFocus, _Range.rangeTokens.textFieldBackgroundSuccessColor, _Range.rangeTokens.textFieldBackgroundSuccessColorFocus, _Range.rangeTokens.textFieldTextBeforeColor, _Range.rangeTokens.textFieldTextAfterColor, _Range.rangeTokens.indicatorColor, _Range.rangeTokens.focusColor, _Range.rangeTokens.textFieldPlaceholderColorFocus)
+      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-transparent-primary);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-positive);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-accent);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-negative-active);", ":var(--surface-transparent-positive);", ":var(--surface-transparent-positive-active);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--surface-negative);", ":var(--text-accent);", ":var(--text-tertiary);"], _Range.rangeTokens.background, _Range.rangeTokens.backgroundError, _Range.rangeTokens.backgroundSuccess, _Range.rangeTokens.dividerColor, _Range.rangeTokens.labelColor, _Range.rangeTokens.leftHelperColor, _Range.rangeTokens.textFieldColor, _Range.rangeTokens.textFieldPlaceholderColor, _Range.rangeTokens.textFieldCaretColor, _Range.rangeTokens.textFieldBackgroundColorFocus, _Range.rangeTokens.textFieldBackgroundErrorColor, _Range.rangeTokens.textFieldBackgroundErrorColorFocus, _Range.rangeTokens.textFieldBackgroundSuccessColor, _Range.rangeTokens.textFieldBackgroundSuccessColorFocus, _Range.rangeTokens.textFieldTextBeforeColor, _Range.rangeTokens.textFieldTextAfterColor, _Range.rangeTokens.indicatorColor, _Range.rangeTokens.focusColor, _Range.rangeTokens.textFieldPlaceholderColorFocus)
     },
     size: {
       l: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.875rem;", ":0 0.375rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0 0 0 1rem;", ":0;", ":0.75rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.5rem;", ":0.875rem;", ":1.0625rem 1.125rem 1.0625rem 1.125rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-0.0625rem 0.5rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;", ":0.5rem;", ":0.375rem;", ":0 0 0 0;", ":0.5rem auto auto -0.75rem;", ":0 0 auto auto;", ":0.25rem -0.625rem auto auto;"], _Range.rangeTokens.borderRadius, _Range.rangeTokens.dividerPadding, _Range.rangeTokens.dividerFontFamily, _Range.rangeTokens.dividerFontStyle, _Range.rangeTokens.dividerFontSize, _Range.rangeTokens.dividerFontWeight, _Range.rangeTokens.dividerLetterSpacing, _Range.rangeTokens.dividerLineHeight, _Range.rangeTokens.leftContentMargin, _Range.rangeTokens.rightContentMargin, _Range.rangeTokens.labelOffset, _Range.rangeTokens.labelFontFamily, _Range.rangeTokens.labelFontStyle, _Range.rangeTokens.labelFontSize, _Range.rangeTokens.labelFontWeight, _Range.rangeTokens.labelLetterSpacing, _Range.rangeTokens.labelLineHeight, _Range.rangeTokens.textFieldHeight, _Range.rangeTokens.textFieldBorderRadius, _Range.rangeTokens.textFieldPadding, _Range.rangeTokens.textFieldFontFamily, _Range.rangeTokens.textFieldFontStyle, _Range.rangeTokens.textFieldFontSize, _Range.rangeTokens.textFieldFontWeight, _Range.rangeTokens.textFieldLetterSpacing, _Range.rangeTokens.textFieldLineHeight, _Range.rangeTokens.leftHelperOffset, _Range.rangeTokens.leftHelperFontFamily, _Range.rangeTokens.leftHelperFontStyle, _Range.rangeTokens.leftHelperFontSize, _Range.rangeTokens.leftHelperFontWeight, _Range.rangeTokens.leftHelperLetterSpacing, _Range.rangeTokens.leftHelperLineHeight, _Range.rangeTokens.textFieldLeftContentMargin, _Range.rangeTokens.textFieldRightContentMargin, _Range.rangeTokens.textFieldTextBeforeMargin, _Range.rangeTokens.textFieldTextAfterMargin, _Range.rangeTokens.indicatorSize, _Range.rangeTokens.indicatorSizeOuter, _Range.rangeTokens.indicatorPlacement, _Range.rangeTokens.indicatorOuterPlacement, _Range.rangeTokens.indicatorPlacementRight, _Range.rangeTokens.indicatorOuterPlacementRight),

package/styled-components/cjs/examples/plasma_web/components/DatePicker/DatePicker.config.js

@@ -13,7 +13,7 @@ var config = exports.config = {
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-clear);", ":var(--surface-transparent-tertiary);", ":var(--surface-negative);", ":var(--surface-positive);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-negative);", ":var(--text-positive);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-accent);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--surface-negative);", ":var(--surface-accent);", ":var(--surface-negative);", ":var(--surface-accent);", ":var(--surface-positive);", ":var(--surface-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-accent);", ":var(--text-tertiary);", ":var(--shadow-down-soft-s);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-card);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-default);", ":transparent;", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-accent);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-accent);", ":var(--surface-solid-default);", ":", ";", ":var(--text-secondary);", ":var(--text-primary);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--surface-accent);"], _DatePicker.datePickerTokens.background, _DatePicker.datePickerTokens.borderColor, _DatePicker.datePickerTokens.borderColorError, _DatePicker.datePickerTokens.borderColorSuccess, _DatePicker.datePickerTokens.borderColorHover, _DatePicker.datePickerTokens.borderColorFocus, _DatePicker.datePickerTokens.dividerColor, _DatePicker.datePickerTokens.labelColor, _DatePicker.datePickerTokens.leftHelperColor, _DatePicker.datePickerTokens.leftHelperColorError, _DatePicker.datePickerTokens.leftHelperColorSuccess, _DatePicker.datePickerTokens.textFieldColor, _DatePicker.datePickerTokens.textFieldPlaceholderColor, _DatePicker.datePickerTokens.textFieldCaretColor, _DatePicker.datePickerTokens.labelInnerFontFamily, _DatePicker.datePickerTokens.labelInnerFontSize, _DatePicker.datePickerTokens.labelInnerFontStyle, _DatePicker.datePickerTokens.labelInnerFontWeight, _DatePicker.datePickerTokens.labelInnerLetterSpacing, _DatePicker.datePickerTokens.labelInnerLineHeight, _DatePicker.datePickerTokens.indicatorColor, _DatePicker.datePickerTokens.textFieldBorderColorFocus, _DatePicker.datePickerTokens.textFieldBorderColorError, _DatePicker.datePickerTokens.textFieldBorderColorErrorFocus, _DatePicker.datePickerTokens.textFieldBorderColorSuccess, _DatePicker.datePickerTokens.textFieldBorderColorSuccessFocus, _DatePicker.datePickerTokens.textFieldTextBeforeColor, _DatePicker.datePickerTokens.textFieldTextAfterColor, _DatePicker.datePickerTokens.focusColor, _DatePicker.datePickerTokens.textFieldPlaceholderColorFocus, _DatePicker.datePickerTokens.calendarShadow, _DatePicker.datePickerTokens.calendarSeparatorBackground, _DatePicker.datePickerTokens.calendarBackgroundColor, _DatePicker.datePickerTokens.calendarSelectedItemBackground, _DatePicker.datePickerTokens.calendarSelectedItemColor, _DatePicker.datePickerTokens.calendarSelectableItemBackgroundHover, _DatePicker.datePickerTokens.calendarCurrentItemBorderColor, _DatePicker.datePickerTokens.calendarCurrentItemBackgroundHover, _DatePicker.datePickerTokens.calendarCurrentItemColorHover, _DatePicker.datePickerTokens.calendarCurrentItemChildBackgroundHover, _DatePicker.datePickerTokens.calendarActiveItemBackground, _DatePicker.datePickerTokens.calendarActiveItemColor, _DatePicker.datePickerTokens.calendarHoveredItemBackground, _DatePicker.datePickerTokens.calendarHoveredItemColor, _DatePicker.datePickerTokens.calendarRangeBackground, _DatePicker.datePickerTokens.calendarOutlineFocusColor, _DatePicker.datePickerTokens.calendarContentPrimaryColor, _DatePicker.datePickerTokens.calendarHeaderArrowColor, _DatePicker.datePickerTokens.calendarContentPrimaryColor, _DatePicker.datePickerTokens.calendarContentSecondaryColor, _DatePicker.datePickerTokens.iconButtonColor, _DatePicker.datePickerTokens.iconButtonBackgroundColor, _DatePicker.datePickerTokens.iconButtonColorHover, _DatePicker.datePickerTokens.iconButtonBackgroundColorHover, _DatePicker.datePickerTokens.iconButtonColorActive, _DatePicker.datePickerTokens.iconButtonBackgroundColorActive, _DatePicker.datePickerTokens.iconButtonFocusColor)
+      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-clear);", ":var(--surface-transparent-tertiary);", ":var(--surface-negative);", ":var(--surface-positive);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-accent);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--surface-negative);", ":var(--surface-accent);", ":var(--surface-negative);", ":var(--surface-accent);", ":var(--surface-positive);", ":var(--surface-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-accent);", ":var(--text-tertiary);", ":var(--shadow-down-soft-s);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-card);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-default);", ":transparent;", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-accent);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-accent);", ":var(--surface-solid-default);", ":", ";", ":var(--text-secondary);", ":var(--text-primary);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--surface-accent);"], _DatePicker.datePickerTokens.background, _DatePicker.datePickerTokens.borderColor, _DatePicker.datePickerTokens.borderColorError, _DatePicker.datePickerTokens.borderColorSuccess, _DatePicker.datePickerTokens.borderColorHover, _DatePicker.datePickerTokens.borderColorFocus, _DatePicker.datePickerTokens.dividerColor, _DatePicker.datePickerTokens.labelColor, _DatePicker.datePickerTokens.leftHelperColor, _DatePicker.datePickerTokens.textFieldColor, _DatePicker.datePickerTokens.textFieldPlaceholderColor, _DatePicker.datePickerTokens.textFieldCaretColor, _DatePicker.datePickerTokens.labelInnerFontFamily, _DatePicker.datePickerTokens.labelInnerFontSize, _DatePicker.datePickerTokens.labelInnerFontStyle, _DatePicker.datePickerTokens.labelInnerFontWeight, _DatePicker.datePickerTokens.labelInnerLetterSpacing, _DatePicker.datePickerTokens.labelInnerLineHeight, _DatePicker.datePickerTokens.indicatorColor, _DatePicker.datePickerTokens.textFieldBorderColorFocus, _DatePicker.datePickerTokens.textFieldBorderColorError, _DatePicker.datePickerTokens.textFieldBorderColorErrorFocus, _DatePicker.datePickerTokens.textFieldBorderColorSuccess, _DatePicker.datePickerTokens.textFieldBorderColorSuccessFocus, _DatePicker.datePickerTokens.textFieldTextBeforeColor, _DatePicker.datePickerTokens.textFieldTextAfterColor, _DatePicker.datePickerTokens.focusColor, _DatePicker.datePickerTokens.textFieldPlaceholderColorFocus, _DatePicker.datePickerTokens.calendarShadow, _DatePicker.datePickerTokens.calendarSeparatorBackground, _DatePicker.datePickerTokens.calendarBackgroundColor, _DatePicker.datePickerTokens.calendarSelectedItemBackground, _DatePicker.datePickerTokens.calendarSelectedItemColor, _DatePicker.datePickerTokens.calendarSelectableItemBackgroundHover, _DatePicker.datePickerTokens.calendarCurrentItemBorderColor, _DatePicker.datePickerTokens.calendarCurrentItemBackgroundHover, _DatePicker.datePickerTokens.calendarCurrentItemColorHover, _DatePicker.datePickerTokens.calendarCurrentItemChildBackgroundHover, _DatePicker.datePickerTokens.calendarActiveItemBackground, _DatePicker.datePickerTokens.calendarActiveItemColor, _DatePicker.datePickerTokens.calendarHoveredItemBackground, _DatePicker.datePickerTokens.calendarHoveredItemColor, _DatePicker.datePickerTokens.calendarRangeBackground, _DatePicker.datePickerTokens.calendarOutlineFocusColor, _DatePicker.datePickerTokens.calendarContentPrimaryColor, _DatePicker.datePickerTokens.calendarHeaderArrowColor, _DatePicker.datePickerTokens.calendarContentPrimaryColor, _DatePicker.datePickerTokens.calendarContentSecondaryColor, _DatePicker.datePickerTokens.iconButtonColor, _DatePicker.datePickerTokens.iconButtonBackgroundColor, _DatePicker.datePickerTokens.iconButtonColorHover, _DatePicker.datePickerTokens.iconButtonBackgroundColorHover, _DatePicker.datePickerTokens.iconButtonColorActive, _DatePicker.datePickerTokens.iconButtonBackgroundColorActive, _DatePicker.datePickerTokens.iconButtonFocusColor)
     },
     size: {
       l: /*#__PURE__*/(0, _styledComponents.css)(["", ":26.5rem;", ":0.875rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0 0 0 1rem;", ":0;", ":0.75rem;", ":0.5625rem 0 0.125rem 0;", ":1.5625rem 0 0.5625rem 0;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.5rem;", ":0.375rem;", ":0 0 0 0;", ":0.5rem auto auto -0.75rem;", ":0 0 auto auto;", ":0.25rem -0.625rem auto auto;", ":3.5rem;", ":0.875rem;", ":0.0625rem;", ":1.0625rem 1.125rem 1.0625rem 1.125rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-0.0625rem 0.5rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;", ":0.875rem;", ":0.875rem ", ":26.5rem;", ":0.5rem 1rem 1.125rem 1rem;", ":0.75rem;", ":7.8125rem;", ":5.25rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.5rem 0.5rem 0 0.5rem;", ":0.75rem;", ":11.75rem;", ":10.5rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.5rem 1rem 1.125rem 1rem;", ":0.75rem;", ":7.8125rem;", ":5.25rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.5rem 1rem 1.125rem 1rem;", ":0.75rem;", ":3.5rem;", ":3rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.063rem;", ":0.875rem 1rem 0 1rem;", ":0.5rem;", ":0 0 0 1rem;", ":0.5rem;", ":var(--plasma-typo-h3-font-family);", ":var(--plasma-typo-h3-font-size);", ":var(--plasma-typo-h3-font-style);", ":var(--plasma-typo-h3-letter-spacing);", ":var(--plasma-typo-h3-line-height);", ":var(--plasma-typo-h3-font-weight);", ":var(--plasma-typo-h3-bold-font-weight);", ":3.5rem;", ":3.5rem;", ":1.5rem;", ":0.875rem;"], _DatePicker.datePickerTokens.width, _DatePicker.datePickerTokens.borderRadius, _DatePicker.datePickerTokens.borderWidth, _DatePicker.datePickerTokens.dividerPadding, _DatePicker.datePickerTokens.dividerFontFamily, _DatePicker.datePickerTokens.dividerFontStyle, _DatePicker.datePickerTokens.dividerFontSize, _DatePicker.datePickerTokens.dividerFontWeight, _DatePicker.datePickerTokens.dividerLetterSpacing, _DatePicker.datePickerTokens.dividerLineHeight, _DatePicker.datePickerTokens.leftContentMargin, _DatePicker.datePickerTokens.rightContentMargin, _DatePicker.datePickerTokens.labelOffset, _DatePicker.datePickerTokens.labelInnerPadding, _DatePicker.datePickerTokens.contentLabelInnerPadding, _DatePicker.datePickerTokens.labelFontFamily, _DatePicker.datePickerTokens.labelFontStyle, _DatePicker.datePickerTokens.labelFontSize, _DatePicker.datePickerTokens.labelFontWeight, _DatePicker.datePickerTokens.labelLetterSpacing, _DatePicker.datePickerTokens.labelLineHeight, _DatePicker.datePickerTokens.indicatorSize, _DatePicker.datePickerTokens.indicatorSizeOuter, _DatePicker.datePickerTokens.indicatorPlacement, _DatePicker.datePickerTokens.indicatorOuterPlacement, _DatePicker.datePickerTokens.indicatorPlacementRight, _DatePicker.datePickerTokens.indicatorOuterPlacementRight, _DatePicker.datePickerTokens.textFieldHeight, _DatePicker.datePickerTokens.textFieldBorderRadius, _DatePicker.datePickerTokens.textFieldBorderWidth, _DatePicker.datePickerTokens.textFieldPadding, _DatePicker.datePickerTokens.textFieldFontFamily, _DatePicker.datePickerTokens.textFieldFontStyle, _DatePicker.datePickerTokens.textFieldFontSize, _DatePicker.datePickerTokens.textFieldFontWeight, _DatePicker.datePickerTokens.textFieldLetterSpacing, _DatePicker.datePickerTokens.textFieldLineHeight, _DatePicker.datePickerTokens.leftHelperOffset, _DatePicker.datePickerTokens.leftHelperFontFamily, _DatePicker.datePickerTokens.leftHelperFontStyle, _DatePicker.datePickerTokens.leftHelperFontSize, _DatePicker.datePickerTokens.leftHelperFontWeight, _DatePicker.datePickerTokens.leftHelperLetterSpacing, _DatePicker.datePickerTokens.leftHelperLineHeight, _DatePicker.datePickerTokens.textFieldLeftContentMargin, _DatePicker.datePickerTokens.textFieldRightContentMargin, _DatePicker.datePickerTokens.textFieldTextBeforeMargin, _DatePicker.datePickerTokens.textFieldTextAfterMargin, _DatePicker.datePickerTokens.calendarBorderRadius, _DatePicker.datePickerTokens.calendarPaddingTop, _DatePicker.datePickerTokens.calendarWidth, _DatePicker.datePickerTokens.calendarYearsPadding, _DatePicker.datePickerTokens.calendarYearItemBorderRadius, _DatePicker.datePickerTokens.calendarYearItemWidth, _DatePicker.datePickerTokens.calendarYearItemHeight, _DatePicker.datePickerTokens.calendarYearFontFamily, _DatePicker.datePickerTokens.calendarYearFontSize, _DatePicker.datePickerTokens.calendarYearFontStyle, _DatePicker.datePickerTokens.calendarYearFontLetterSpacing, _DatePicker.datePickerTokens.calendarYearFontLineHeight, _DatePicker.datePickerTokens.calendarYearFontWeight, _DatePicker.datePickerTokens.calendarYearSelectedFontWeight, _DatePicker.datePickerTokens.calendarQuartersPadding, _DatePicker.datePickerTokens.calendarQuarterItemBorderRadius, _DatePicker.datePickerTokens.calendarQuarterItemWidth, _DatePicker.datePickerTokens.calendarQuarterItemHeight, _DatePicker.datePickerTokens.calendarQuarterFontFamily, _DatePicker.datePickerTokens.calendarQuarterFontSize, _DatePicker.datePickerTokens.calendarQuarterFontStyle, _DatePicker.datePickerTokens.calendarQuarterFontLetterSpacing, _DatePicker.datePickerTokens.calendarQuarterFontLineHeight, _DatePicker.datePickerTokens.calendarQuarterFontWeight, _DatePicker.datePickerTokens.calendarQuarterSelectedFontWeight, _DatePicker.datePickerTokens.calendarMonthsPadding, _DatePicker.datePickerTokens.calendarMonthItemBorderRadius, _DatePicker.datePickerTokens.calendarMonthItemWidth, _DatePicker.datePickerTokens.calendarMonthItemHeight, _DatePicker.datePickerTokens.calendarMonthFontFamily, _DatePicker.datePickerTokens.calendarMonthFontSize, _DatePicker.datePickerTokens.calendarMonthFontStyle, _DatePicker.datePickerTokens.calendarMonthFontLetterSpacing, _DatePicker.datePickerTokens.calendarMonthFontLineHeight, _DatePicker.datePickerTokens.calendarMonthFontWeight, _DatePicker.datePickerTokens.calendarMonthSelectedFontWeight, _DatePicker.datePickerTokens.calendarDaysPadding, _DatePicker.datePickerTokens.calendarDayItemBorderRadius, _DatePicker.datePickerTokens.calendarDayItemWidth, _DatePicker.datePickerTokens.calendarDayItemHeight, _DatePicker.datePickerTokens.calendarDayFontFamily, _DatePicker.datePickerTokens.calendarDayFontSize, _DatePicker.datePickerTokens.calendarDayFontStyle, _DatePicker.datePickerTokens.calendarDayFontLetterSpacing, _DatePicker.datePickerTokens.calendarDayFontLineHeight, _DatePicker.datePickerTokens.calendarDayFontWeight, _DatePicker.datePickerTokens.calendarDaySelectedFontWeight, _DatePicker.datePickerTokens.calendarCurrentItemBorderWidth, _DatePicker.datePickerTokens.calendarHeaderWrapperPadding, _DatePicker.datePickerTokens.calendarHeaderArrowGap, _DatePicker.datePickerTokens.calendarHeaderPadding, _DatePicker.datePickerTokens.calendarHeaderDateGap, _DatePicker.datePickerTokens.calendarHeaderFontFamily, _DatePicker.datePickerTokens.calendarHeaderFontSize, _DatePicker.datePickerTokens.calendarHeaderFontStyle, _DatePicker.datePickerTokens.calendarHeaderFontLetterSpacing, _DatePicker.datePickerTokens.calendarHeaderFontLineHeight, _DatePicker.datePickerTokens.calendarHeaderFontWeight, _DatePicker.datePickerTokens.calendarHeaderFontWeightBold, _DatePicker.datePickerTokens.iconButtonHeight, _DatePicker.datePickerTokens.iconButtonWidth, _DatePicker.datePickerTokens.iconButtonPadding, _DatePicker.datePickerTokens.iconButtonRadius),

package/styled-components/cjs/examples/plasma_web/components/Popover/Popover.stories.tsx

@@ -66,6 +66,7 @@ const meta: Meta<typeof Popover> = {
         isFocusTrapped: true,
         skidding: 0,
         distance: 6,
+        animated: true,
     },
 };
 

package/styled-components/cjs/examples/plasma_web/components/Range/Range.config.js

@@ -13,7 +13,7 @@ var config = exports.config = {
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-clear);", ":var(--surface-transparent-tertiary);", ":var(--surface-negative);", ":var(--surface-positive);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-negative);", ":var(--text-positive);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-accent);", ":var(--surface-accent);", ":var(--surface-negative);", ":var(--surface-accent);", ":var(--surface-positive);", ":var(--surface-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--surface-negative);", ":var(--text-accent);", ":var(--text-tertiary);"], _Range.rangeTokens.background, _Range.rangeTokens.borderColor, _Range.rangeTokens.borderColorError, _Range.rangeTokens.borderColorSuccess, _Range.rangeTokens.dividerColor, _Range.rangeTokens.labelColor, _Range.rangeTokens.leftHelperColor, _Range.rangeTokens.leftHelperColorError, _Range.rangeTokens.leftHelperColorSuccess, _Range.rangeTokens.textFieldColor, _Range.rangeTokens.textFieldPlaceholderColor, _Range.rangeTokens.textFieldCaretColor, _Range.rangeTokens.textFieldBorderColorFocus, _Range.rangeTokens.textFieldBorderColorError, _Range.rangeTokens.textFieldBorderColorErrorFocus, _Range.rangeTokens.textFieldBorderColorSuccess, _Range.rangeTokens.textFieldBorderColorSuccessFocus, _Range.rangeTokens.textFieldTextBeforeColor, _Range.rangeTokens.textFieldTextAfterColor, _Range.rangeTokens.indicatorColor, _Range.rangeTokens.focusColor, _Range.rangeTokens.textFieldPlaceholderColorFocus)
+      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-clear);", ":var(--surface-transparent-tertiary);", ":var(--surface-negative);", ":var(--surface-positive);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-accent);", ":var(--surface-accent);", ":var(--surface-negative);", ":var(--surface-accent);", ":var(--surface-positive);", ":var(--surface-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--surface-negative);", ":var(--text-accent);", ":var(--text-tertiary);"], _Range.rangeTokens.background, _Range.rangeTokens.borderColor, _Range.rangeTokens.borderColorError, _Range.rangeTokens.borderColorSuccess, _Range.rangeTokens.dividerColor, _Range.rangeTokens.labelColor, _Range.rangeTokens.leftHelperColor, _Range.rangeTokens.textFieldColor, _Range.rangeTokens.textFieldPlaceholderColor, _Range.rangeTokens.textFieldCaretColor, _Range.rangeTokens.textFieldBorderColorFocus, _Range.rangeTokens.textFieldBorderColorError, _Range.rangeTokens.textFieldBorderColorErrorFocus, _Range.rangeTokens.textFieldBorderColorSuccess, _Range.rangeTokens.textFieldBorderColorSuccessFocus, _Range.rangeTokens.textFieldTextBeforeColor, _Range.rangeTokens.textFieldTextAfterColor, _Range.rangeTokens.indicatorColor, _Range.rangeTokens.focusColor, _Range.rangeTokens.textFieldPlaceholderColorFocus)
     },
     size: {
       l: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.875rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0 0 0 1rem;", ":0;", ":0.75rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.5rem;", ":0.875rem;", ":0.0625rem;", ":1.0625rem 1.125rem 1.0625rem 1.125rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-0.0625rem 0.5rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;", ":0.5rem;", ":0.375rem;", ":0 0 0 0;", ":0.5rem auto auto -0.75rem;", ":0 0 auto auto;", ":0.25rem -0.625rem auto auto;"], _Range.rangeTokens.borderRadius, _Range.rangeTokens.borderWidth, _Range.rangeTokens.dividerPadding, _Range.rangeTokens.dividerFontFamily, _Range.rangeTokens.dividerFontStyle, _Range.rangeTokens.dividerFontSize, _Range.rangeTokens.dividerFontWeight, _Range.rangeTokens.dividerLetterSpacing, _Range.rangeTokens.dividerLineHeight, _Range.rangeTokens.leftContentMargin, _Range.rangeTokens.rightContentMargin, _Range.rangeTokens.labelOffset, _Range.rangeTokens.labelFontFamily, _Range.rangeTokens.labelFontStyle, _Range.rangeTokens.labelFontSize, _Range.rangeTokens.labelFontWeight, _Range.rangeTokens.labelLetterSpacing, _Range.rangeTokens.labelLineHeight, _Range.rangeTokens.textFieldHeight, _Range.rangeTokens.textFieldBorderRadius, _Range.rangeTokens.textFieldBorderWidth, _Range.rangeTokens.textFieldPadding, _Range.rangeTokens.textFieldFontFamily, _Range.rangeTokens.textFieldFontStyle, _Range.rangeTokens.textFieldFontSize, _Range.rangeTokens.textFieldFontWeight, _Range.rangeTokens.textFieldLetterSpacing, _Range.rangeTokens.textFieldLineHeight, _Range.rangeTokens.leftHelperOffset, _Range.rangeTokens.leftHelperFontFamily, _Range.rangeTokens.leftHelperFontStyle, _Range.rangeTokens.leftHelperFontSize, _Range.rangeTokens.leftHelperFontWeight, _Range.rangeTokens.leftHelperLetterSpacing, _Range.rangeTokens.leftHelperLineHeight, _Range.rangeTokens.textFieldLeftContentMargin, _Range.rangeTokens.textFieldRightContentMargin, _Range.rangeTokens.textFieldTextBeforeMargin, _Range.rangeTokens.textFieldTextAfterMargin, _Range.rangeTokens.indicatorSize, _Range.rangeTokens.indicatorSizeOuter, _Range.rangeTokens.indicatorPlacement, _Range.rangeTokens.indicatorOuterPlacement, _Range.rangeTokens.indicatorPlacementRight, _Range.rangeTokens.indicatorOuterPlacementRight),

package/styled-components/es/components/DatePicker/DatePicker.tokens.js

@@ -60,8 +60,6 @@ export var tokens = {
   contentLabelInnerPadding: '--plasma-date-picker-placement_inner__content-padding',
   /** Токены вспомогательного текста */
   leftHelperColor: '--plasma-date-picker__left-helper-color',
-  leftHelperColorError: '--plasma-date-picker__left-helper-color-error',
-  leftHelperColorSuccess: '--plasma-date-picker__left-helper-color-success',
   leftHelperColorReadOnly: '--plasma-date-picker__left-helper-color-readonly',
   leftHelperOffset: '--plasma-date-picker__left-helper-offset',
   leftHelperFontFamily: '--plasma-date-picker__left-helper-font-family',

package/styled-components/es/components/DatePicker/RangeDate/RangeDate.js

@@ -157,8 +157,6 @@ export var datePickerRangeRoot = function datePickerRangeRoot(Root) {
       _useState18 = _slicedToArray(_useState17, 2),
       secondTextFieldClicked = _useState18[0],
       setSecondTextFieldClicked = _useState18[1];
-    var rangeErrorClass = firstValueError || secondValueError ? classes.datePickerError : undefined;
-    var rangeSuccessClass = firstValueSuccess || secondValueSuccess ? classes.datePickerSuccess : undefined;
     var setFirstInputValue = function setFirstInputValue(value) {
       setInputFirstValue(value);
       if (onChange) {
@@ -466,9 +464,7 @@ export var datePickerRangeRoot = function datePickerRangeRoot(Root) {
       rootWrapper: RootWrapper,
       onChangeStartOfRange: handleChangeStartOfRange,
       onChangeValue: handleChangeCalendarValue
-    }), leftHelper && /*#__PURE__*/React.createElement(LeftHelper, {
-      className: cx(rangeErrorClass, rangeSuccessClass)
-    }, leftHelper), /*#__PURE__*/React.createElement(InputHidden, _extends({
+    }), leftHelper && /*#__PURE__*/React.createElement(LeftHelper, null, leftHelper), /*#__PURE__*/React.createElement(InputHidden, _extends({
       name: name,
       type: "hidden",
       datatype: "datepicker-double",

package/styled-components/es/components/DatePicker/RangeDate/RangeDate.styles.js

@@ -2,7 +2,7 @@ import styled from 'styled-components';
 import { css } from 'styled-components';
 import { component, mergeConfig } from '../../../engines';
 import { rangeConfig, rangeTokens } from '../../Range';
-import { classes, tokens } from '../DatePicker.tokens';
+import { tokens } from '../DatePicker.tokens';
 import { popoverConfig } from '../../Popover';
 var mergedRangeConfig = /*#__PURE__*/mergeConfig(rangeConfig);
 var Range = /*#__PURE__*/component(mergedRangeConfig);
@@ -19,4 +19,4 @@ export var StyledRange = /*#__PURE__*/styled(Range).withConfig({
 export var base = /*#__PURE__*/css(["display:inline-block;"]);
 export var LeftHelper = /*#__PURE__*/styled.div.withConfig({
   componentId: "plasma-new-hope__sc-14j95rs-2"
-})(["color:var(", ");&.", "{color:var(", ");}&.", "{color:var(", ");}"], tokens.leftHelperColor, classes.datePickerError, tokens.leftHelperColorError, classes.datePickerSuccess, tokens.leftHelperColorSuccess);
+})([""]);

package/styled-components/es/components/DatePicker/SingleDate/SingleDate.js

@@ -241,9 +241,7 @@ export var datePickerRoot = function datePickerRoot(Root) {
       onChangeValue: function onChangeValue(date, dateInfo) {
         return handleCommitDate(date, false, true, dateInfo);
       }
-    }))), leftHelper && /*#__PURE__*/React.createElement(LeftHelper, {
-      className: cx(datePickerErrorClass, datePickerSuccessClass)
-    }, leftHelper), /*#__PURE__*/React.createElement(InputHidden, _extends({
+    }))), leftHelper && /*#__PURE__*/React.createElement(LeftHelper, null, leftHelper), /*#__PURE__*/React.createElement(InputHidden, _extends({
       type: "hidden",
       datatype: "datepicker-single",
       name: name,

package/styled-components/es/components/DatePicker/SingleDate/SingleDate.styles.js

@@ -19,4 +19,4 @@ export var StyledInput = /*#__PURE__*/styled(TextField).withConfig({
 export var base = /*#__PURE__*/css(["display:inline-block;.", ",.", "{width:inherit;}"], /*#__PURE__*/String(popoverClasses.wrapper), /*#__PURE__*/String(popoverClasses.target));
 export var LeftHelper = /*#__PURE__*/styled.div.withConfig({
   componentId: "plasma-new-hope__sc-1ye0xbz-2"
-})(["color:var(", ");&.", "{color:var(", ");}&.", "{color:var(", ");}"], tokens.leftHelperColor, classes.datePickerError, tokens.leftHelperColorError, classes.datePickerSuccess, tokens.leftHelperColorSuccess);
+})([""]);

package/styled-components/es/components/Popover/Popover.js

@@ -1,4 +1,4 @@
-var _excluded = ["target", "children", "isOpen", "opened", "trigger", "hasArrow", "frame", "className", "placement", "offset", "zIndex", "isFocusTrapped", "closeOnEsc", "preventOverflow", "usePortal", "view", "onToggle", "closeOnOverlayClick"];
+var _excluded = ["target", "children", "animated", "isOpen", "opened", "trigger", "hasArrow", "frame", "className", "placement", "offset", "zIndex", "isFocusTrapped", "closeOnEsc", "preventOverflow", "usePortal", "view", "onToggle", "closeOnOverlayClick"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -35,6 +35,7 @@ export var popoverRoot = function popoverRoot(Root) {
     var _placement$;
     var target = _ref.target,
       children = _ref.children,
+      animated = _ref.animated,
       isOpen = _ref.isOpen,
       opened = _ref.opened,
       _ref$trigger = _ref.trigger,
@@ -77,6 +78,8 @@ export var popoverRoot = function popoverRoot(Root) {
     var portalContainer = _typeof(target) === 'object' && target !== null && 'current' in target && target.current || undefined;
     var isAutoArray = Array.isArray(placement);
     var isAuto = isAutoArray || placement.startsWith('auto');
+    var openClass = innerIsOpen ? classes.open : undefined;
+    var animatedClass = animated ? classes.animate : undefined;
     var initialStyles = {
       visibility: innerIsOpen ? 'visible' : 'hidden',
       opacity: innerIsOpen ? 1 : 0
@@ -227,11 +230,9 @@ export var popoverRoot = function popoverRoot(Root) {
       view: view,
       className: className
     }, rest), /*#__PURE__*/React.createElement(StyledPopover, _extends({}, attributes.popper, {
-      className: classes.root,
+      className: cx(classes.root, openClass, animatedClass),
       ref: popoverForkRef,
-      style: _objectSpread(_objectSpread(_objectSpread({}, styles.popper), {
-        display: innerIsOpen ? 'block' : 'none'
-      }), initialStyles),
+      style: _objectSpread(_objectSpread({}, styles.popper), initialStyles),
       zIndex: zIndex
     }), hasArrow && /*#__PURE__*/React.createElement(StyledArrow, _extends({
       className: classes.arrow,

package/styled-components/es/components/Popover/Popover.styles.js

@@ -12,7 +12,7 @@ export var StyledArrow = /*#__PURE__*/styled.div.withConfig({
 })(["width:var(", ");height:var(", ");&::before{position:absolute;width:var(", ");height:var(", ");mask-image:var(", ");background:var(", ");content:'';transform:rotate(0deg);}"], /*#__PURE__*/String(tokens.arrowMaskWidth), /*#__PURE__*/String(tokens.arrowMaskHeight), /*#__PURE__*/String(tokens.arrowMaskWidth), /*#__PURE__*/String(tokens.arrowMaskHeight), /*#__PURE__*/String(tokens.arrowMaskImage), /*#__PURE__*/String(tokens.arrowBackground));
 export var StyledPopover = /*#__PURE__*/styled.div.withConfig({
   componentId: "plasma-new-hope__sc-tnpyex-3"
-})(["position:absolute;z-index:", ";&:before{content:'';display:block;position:absolute;background:transparent;}&[data-popper-placement^='top'] > .", "{bottom:calc(0px - var(", "));}&[data-popper-placement^='bottom'] > .", "{top:calc(0px - var(", "));&::before{transform:rotate(180deg);}}&[data-popper-placement^='left'] > .", "{right:calc(0px - var(", "));&::before{transform:rotate(-90deg);}}&[data-popper-placement^='right'] > .", "{left:calc(0px - var(", "));&::before{transform:rotate(90deg);}}&[data-popper-placement^='top-start'] > .", "{bottom:calc(0px - var(", "));left:var(", ") !important;transform:unset !important;}&[data-popper-placement^='top-end'] > .", "{bottom:calc(0px - var(", "));left:unset !important;right:var(", ") !important;transform:unset !important;}&[data-popper-placement^='bottom-start'] > .", "{top:calc(0px - var(", "));left:var(", ") !important;transform:unset !important;&::before{transform:rotate(180deg);}}&[data-popper-placement^='bottom-end'] > .", "{top:calc(0px - var(", "));left:unset !important;right:var(", ") !important;transform:unset !important;&::before{transform:rotate(180deg);}}&[data-popper-placement^='left-start'] > .", ",&[data-popper-placement^='right-start'] > .", "{top:var(", ") !important;transform:unset !important;}&[data-popper-placement^='left-end'] > .", ",&[data-popper-placement^='right-end'] > .", "{top:unset !important;bottom:var(", ") !important;transform:unset !important;}&[data-popper-placement^='top'],&[data-popper-placement^='top-start'],&[data-popper-placement^='top-end']{&:before{top:unset;left:0;right:0;height:var(", ");bottom:calc(-1 * var(", "));}}&[data-popper-placement^='bottom'],&[data-popper-placement^='bottom-start'],&[data-popper-placement^='bottom-end']{&:before{top:calc(-1 * var(", "));left:0;right:0;bottom:var(", ");height:var(", ");}}&[data-popper-placement^='left'],&[data-popper-placement^='left-start'],&[data-popper-placement^='left-end']{&:before{width:var(", ");height:100%;top:0;right:calc(-1 * var(", "));bottom:0;}}&[data-popper-placement^='right'],&[data-popper-placement^='right-start'],&[data-popper-placement^='right-end']{&:before{width:var(", ");height:100%;top:0;left:calc(-1 * var(", "));bottom:0;}}"], function (_ref) {
+})(["position:absolute;z-index:", ";opacity:0;visibility:hidden;&.", "{transition:opacity 200ms ease-in-out,visibility 200ms ease-in-out;}&.", "{opacity:1;visibility:visible;}&:before{content:'';display:block;position:absolute;background:transparent;}&[data-popper-placement^='top'] > .", "{bottom:calc(0px - var(", "));}&[data-popper-placement^='bottom'] > .", "{top:calc(0px - var(", "));&::before{transform:rotate(180deg);}}&[data-popper-placement^='left'] > .", "{right:calc(0px - var(", "));&::before{transform:rotate(-90deg);}}&[data-popper-placement^='right'] > .", "{left:calc(0px - var(", "));&::before{transform:rotate(90deg);}}&[data-popper-placement^='top-start'] > .", "{bottom:calc(0px - var(", "));left:var(", ") !important;transform:unset !important;}&[data-popper-placement^='top-end'] > .", "{bottom:calc(0px - var(", "));left:unset !important;right:var(", ") !important;transform:unset !important;}&[data-popper-placement^='bottom-start'] > .", "{top:calc(0px - var(", "));left:var(", ") !important;transform:unset !important;&::before{transform:rotate(180deg);}}&[data-popper-placement^='bottom-end'] > .", "{top:calc(0px - var(", "));left:unset !important;right:var(", ") !important;transform:unset !important;&::before{transform:rotate(180deg);}}&[data-popper-placement^='left-start'] > .", ",&[data-popper-placement^='right-start'] > .", "{top:var(", ") !important;transform:unset !important;}&[data-popper-placement^='left-end'] > .", ",&[data-popper-placement^='right-end'] > .", "{top:unset !important;bottom:var(", ") !important;transform:unset !important;}&[data-popper-placement^='top'],&[data-popper-placement^='top-start'],&[data-popper-placement^='top-end']{&:before{top:unset;left:0;right:0;height:var(", ");bottom:calc(-1 * var(", "));}}&[data-popper-placement^='bottom'],&[data-popper-placement^='bottom-start'],&[data-popper-placement^='bottom-end']{&:before{top:calc(-1 * var(", "));left:0;right:0;bottom:var(", ");height:var(", ");}}&[data-popper-placement^='left'],&[data-popper-placement^='left-start'],&[data-popper-placement^='left-end']{&:before{width:var(", ");height:100%;top:0;right:calc(-1 * var(", "));bottom:0;}}&[data-popper-placement^='right'],&[data-popper-placement^='right-start'],&[data-popper-placement^='right-end']{&:before{width:var(", ");height:100%;top:0;left:calc(-1 * var(", "));bottom:0;}}"], function (_ref) {
   var zIndex = _ref.zIndex;
   return zIndex || DEFAULT_Z_INDEX;
-}, classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowEdgeMargin), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowEdgeMargin), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowEdgeMargin), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowEdgeMargin), classes.arrow, classes.arrow, /*#__PURE__*/String(tokens.arrowEdgeMargin), classes.arrow, classes.arrow, /*#__PURE__*/String(tokens.arrowEdgeMargin), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight));
+}, classes.animate, classes.open, classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowEdgeMargin), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowEdgeMargin), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowEdgeMargin), classes.arrow, /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowEdgeMargin), classes.arrow, classes.arrow, /*#__PURE__*/String(tokens.arrowEdgeMargin), classes.arrow, classes.arrow, /*#__PURE__*/String(tokens.arrowEdgeMargin), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight), /*#__PURE__*/String(tokens.arrowHeight));

package/styled-components/es/components/Popover/Popover.tokens.js

@@ -3,7 +3,9 @@ export var classes = {
   root: 'popover-root',
   target: 'popover-target',
   arrow: 'popover-arrow',
-  targetAsRef: 'popover-target-as-ref'
+  targetAsRef: 'popover-target-as-ref',
+  open: 'popover-open',
+  animate: 'popover-animate'
 };
 export var tokens = {
   arrowMaskWidth: '--plasma-popover-arrow-mask-width',

package/styled-components/es/components/Range/Range.js

@@ -134,9 +134,7 @@ export var rangeRoot = function rangeRoot(Root) {
       onFocus: onFocusSecondTextfield,
       onBlur: onBlurSecondTextfield,
       autoComplete: autoComplete
-    }), contentRight && /*#__PURE__*/React.createElement(StyledContentRight, null, contentRight)), leftHelper && /*#__PURE__*/React.createElement(LeftHelper, {
-      className: cx(rangeErrorClass, firstValueErrorClass, secondValueErrorClass, rangeSuccessClass, firstValueSuccessClass, secondValueSuccessClass)
-    }, leftHelper));
+    }), contentRight && /*#__PURE__*/React.createElement(StyledContentRight, null, contentRight)), leftHelper && /*#__PURE__*/React.createElement(LeftHelper, null, leftHelper));
   });
 };
 export var rangeConfig = {

package/styled-components/es/components/Range/Range.tokens.js

@@ -52,8 +52,6 @@ export var tokens = {
   leftHelperColor: '--plasma-range__left-helper-color',
   leftHelperColorReadOnly: '--plasma-range__left-helper-color-readonly',
   leftHelperOffset: '--plasma-range__left-helper-offset',
-  leftHelperColorError: '--plasma-range__left-helper-color-error',
-  leftHelperColorSuccess: '--plasma-range__left-helper-color-success',
   leftHelperFontFamily: '--plasma-range__left-helper-font-family',
   leftHelperFontStyle: '--plasma-range__left-helper-font-style',
   leftHelperFontSize: '--plasma-range__left-helper-font-size',

package/styled-components/es/components/Range/variations/_view/base.js

@@ -1,4 +1,4 @@
 import { css } from 'styled-components';
 import { classes, tokens } from '../../Range.tokens';
 import { StyledLabel, LeftHelper, StyledDivider, ContentWrapper, StyledIndicator } from '../../Range.styles';
-export var base = /*#__PURE__*/css(["", "{background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");&.", "{background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");}&.", "{background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");}}", "{color:var(", ");}", "{display:block;color:var(", ");}", "{background-color:var(", ");}", "{color:var(", ");&.", ",&.", "{color:var(", ");}&.", ",&.", "{color:var(", ");}}"], ContentWrapper, tokens.background, tokens.borderWidth, tokens.borderColor, classes.rangeError, tokens.backgroundError, tokens.borderWidth, tokens.borderColorError, classes.rangeSuccess, tokens.backgroundSuccess, tokens.borderWidth, tokens.borderColorSuccess, StyledDivider, tokens.dividerColor, StyledLabel, tokens.labelColor, StyledIndicator, tokens.indicatorColor, LeftHelper, tokens.leftHelperColor, classes.rangeError, classes.rangeValueError, tokens.leftHelperColorError, classes.rangeSuccess, classes.rangeValueSuccess, tokens.leftHelperColorSuccess);
+export var base = /*#__PURE__*/css(["", "{background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");&.", "{background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");}&.", "{background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");}}", "{color:var(", ");}", "{display:block;color:var(", ");}", "{background-color:var(", ");}", "{color:var(", ");}"], ContentWrapper, tokens.background, tokens.borderWidth, tokens.borderColor, classes.rangeError, tokens.backgroundError, tokens.borderWidth, tokens.borderColorError, classes.rangeSuccess, tokens.backgroundSuccess, tokens.borderWidth, tokens.borderColorSuccess, StyledDivider, tokens.dividerColor, StyledLabel, tokens.labelColor, StyledIndicator, tokens.indicatorColor, LeftHelper, tokens.leftHelperColor);

package/styled-components/es/components/Tooltip/Tooltip.js

@@ -11,12 +11,12 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import React, { useEffect, forwardRef, useState, useRef } from 'react';
 import styled from 'styled-components';
 import { component } from '../../engines';
-import { popoverClasses, popoverConfig, popoverTokens } from '../Popover';
+import { popoverConfig, popoverTokens } from '../Popover';
 import { cx } from '../../utils';
 import { StyledContentLeft, TooltipRoot } from './Tooltip.styles';
 import { base as viewCSS } from './variations/_view/base';
 import { base as sizeCSS } from './variations/_size/base';
-import { classes, tokens } from './Tooltip.tokens';
+import { tokens } from './Tooltip.tokens';
 var ESCAPE_KEYCODE = 27;
 var getStringValue = function getStringValue(value) {
   return typeof value === 'number' ? "".concat(value, "rem") : value;
@@ -24,7 +24,7 @@ var getStringValue = function getStringValue(value) {
 var Popover = /*#__PURE__*/component(popoverConfig);
 var StyledPopover = /*#__PURE__*/styled(Popover).withConfig({
   componentId: "plasma-new-hope__sc-dj06kz-0"
-})(["", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");&.", " .", "{transition:opacity 200ms ease-in-out,visibility 200ms ease-in-out;}"], popoverTokens.arrowMaskWidth, tokens.arrowMaskWidth, popoverTokens.arrowMaskHeight, tokens.arrowMaskHeight, popoverTokens.arrowMaskImage, tokens.arrowMaskImage, popoverTokens.arrowBackground, tokens.arrowBackground, popoverTokens.arrowHeight, tokens.arrowHeight, popoverTokens.arrowEdgeMargin, tokens.arrowEdgeMargin, classes.animated, popoverClasses.root);
+})(["", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");"], popoverTokens.arrowMaskWidth, tokens.arrowMaskWidth, popoverTokens.arrowMaskHeight, tokens.arrowMaskHeight, popoverTokens.arrowMaskImage, tokens.arrowMaskImage, popoverTokens.arrowBackground, tokens.arrowBackground, popoverTokens.arrowHeight, tokens.arrowHeight, popoverTokens.arrowEdgeMargin, tokens.arrowEdgeMargin);
 
 /**
  * Компонент для текстовых подсказок. Основное предназначение — подписи к блокам.
@@ -81,7 +81,6 @@ export var tooltipRoot = function tooltipRoot(Root) {
     var innerIsOpen = Boolean(isVisible || isOpen || opened);
     var innerHasArrow = arrow || hasArrow;
     var showTooltip = innerIsOpen && Boolean(text);
-    var animatedClass = animated ? classes.animated : undefined;
     useEffect(function () {
       var onKeyDown = function onKeyDown(event) {
         if (event.keyCode === ESCAPE_KEYCODE) {
@@ -132,7 +131,8 @@ export var tooltipRoot = function tooltipRoot(Root) {
       "aria-hidden": !innerIsOpen,
       "aria-live": "polite",
       role: "tooltip",
-      className: cx(ref === null || ref === void 0 ? void 0 : ref.classList.toString(), animatedClass)
+      animated: animated,
+      className: cx(ref === null || ref === void 0 ? void 0 : ref.classList.toString())
     }, (trigger === 'hover' || trigger === 'click') && {
       trigger: trigger,
       onToggle: onToggle