@salutejs/plasma-new-hope 0.69.0-canary.1155.8506197081.0 → 0.69.1-canary.1161.8560768609.0

package/styled-components/cjs/components/Cell/ui/CellTextbox/CellTextbox.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CellTextbox = void 0;
+var _react = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("react"));
+var _CellTextboxLabel = /*#__PURE__*/require("../CellTextboxLabel/CellTextboxLabel");
+var _CellTextboxTitle = /*#__PURE__*/require("../CellTextboxTitle/CellTextboxTitle");
+var _CellTextboxSubtitle = /*#__PURE__*/require("../CellTextboxSubtitle/CellTextboxSubtitle");
+var _CellTextbox = /*#__PURE__*/require("./CellTextbox.styles");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var CellTextbox = exports.CellTextbox = function CellTextbox(_ref) {
+  var label = _ref.label,
+    title = _ref.title,
+    subtitle = _ref.subtitle,
+    children = _ref.children;
+  return /*#__PURE__*/_react["default"].createElement(_CellTextbox.CellTextboxStyled, null, label || title || subtitle ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, label && /*#__PURE__*/_react["default"].createElement(_CellTextboxLabel.CellTextboxLabel, null, label), title && /*#__PURE__*/_react["default"].createElement(_CellTextboxTitle.CellTextboxTitle, null, title), subtitle && /*#__PURE__*/_react["default"].createElement(_CellTextboxSubtitle.CellTextboxSubtitle, null, subtitle)) : children);
+};

package/styled-components/cjs/components/Cell/ui/CellTextbox/CellTextbox.styles.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CellTextboxStyled = void 0;
+var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
+var _Cell = /*#__PURE__*/require("../../Cell.tokens");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var CellTextboxStyled = exports.CellTextboxStyled = /*#__PURE__*/_styledComponents["default"].div.withConfig({
+  componentId: "plasma-new-hope__sc-w4g41u-0"
+})(["display:flex;flex-direction:column;gap:var(", ");"], _Cell.tokens.cellTextboxGap);

package/styled-components/cjs/components/Cell/ui/CellTextbox/CellTextbox.types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/styled-components/cjs/components/Cell/ui/CellTextboxLabel/CellTextboxLabel.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CellTextboxLabel = void 0;
+var _react = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("react"));
+var _CellTextboxLabel = /*#__PURE__*/require("./CellTextboxLabel.styles");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var CellTextboxLabel = exports.CellTextboxLabel = function CellTextboxLabel(props) {
+  return /*#__PURE__*/_react["default"].createElement(_CellTextboxLabel.StyledTextboxLabel, null, props.children);
+};

package/styled-components/cjs/components/Cell/ui/CellTextboxLabel/CellTextboxLabel.styles.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledTextboxLabel = void 0;
+var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
+var _Cell = /*#__PURE__*/require("../../Cell.tokens");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var StyledTextboxLabel = exports.StyledTextboxLabel = /*#__PURE__*/_styledComponents["default"].div.withConfig({
+  componentId: "plasma-new-hope__sc-j0en77-0"
+})(["color:var(", ");font-size:var(", ");font-weight:var(", ");font-family:var(", ");font-style:var(", ");line-height:var(", ");letter-spacing:var(", ");"], _Cell.tokens.cellLabelColor, _Cell.tokens.cellLabelFontSize, _Cell.tokens.cellLabelFontWeight, _Cell.tokens.cellLabelFontFamily, _Cell.tokens.cellLabelFontStyle, _Cell.tokens.cellLabelLineHeight, _Cell.tokens.cellLabelLetterSpacing);

package/styled-components/cjs/components/Cell/ui/CellTextboxSubtitle/CellTextboxSubtitle.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CellTextboxSubtitle = void 0;
+var _react = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("react"));
+var _CellTextboxSubtitle = /*#__PURE__*/require("./CellTextboxSubtitle.styles");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var CellTextboxSubtitle = exports.CellTextboxSubtitle = function CellTextboxSubtitle(props) {
+  return /*#__PURE__*/_react["default"].createElement(_CellTextboxSubtitle.StyledTextboxSubtitle, null, props.children);
+};

package/styled-components/cjs/components/Cell/ui/CellTextboxSubtitle/CellTextboxSubtitle.styles.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledTextboxSubtitle = void 0;
+var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
+var _Cell = /*#__PURE__*/require("../../Cell.tokens");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var StyledTextboxSubtitle = exports.StyledTextboxSubtitle = /*#__PURE__*/_styledComponents["default"].div.withConfig({
+  componentId: "plasma-new-hope__sc-lkssfu-0"
+})(["color:var(", ");font-size:var(", ");font-weight:var(", ");font-family:var(", ");font-style:var(", ");line-height:var(", ");letter-spacing:var(", ");"], _Cell.tokens.cellSubtitleColor, _Cell.tokens.cellSubtitleFontSize, _Cell.tokens.cellSubtitleFontWeight, _Cell.tokens.cellSubtitleFontFamily, _Cell.tokens.cellSubtitleFontStyle, _Cell.tokens.cellSubtitleLineHeight, _Cell.tokens.cellSubtitleLetterSpacing);

package/styled-components/cjs/components/Cell/ui/CellTextboxTitle/CellTextboxTitle.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CellTextboxTitle = void 0;
+var _react = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("react"));
+var _CellTextboxTitle = /*#__PURE__*/require("./CellTextboxTitle.styles");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var CellTextboxTitle = exports.CellTextboxTitle = function CellTextboxTitle(props) {
+  return /*#__PURE__*/_react["default"].createElement(_CellTextboxTitle.StyledTextboxTitle, null, props.children);
+};

package/styled-components/cjs/components/Cell/ui/CellTextboxTitle/CellTextboxTitle.styles.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledTextboxTitle = void 0;
+var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
+var _Cell = /*#__PURE__*/require("../../Cell.tokens");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var StyledTextboxTitle = exports.StyledTextboxTitle = /*#__PURE__*/_styledComponents["default"].div.withConfig({
+  componentId: "plasma-new-hope__sc-3vis0m-0"
+})(["color:var(", ");font-size:var(", ");font-weight:var(", ");font-family:var(", ");font-style:var(", ");line-height:var(", ");letter-spacing:var(", ");"], _Cell.tokens.cellTitleColor, _Cell.tokens.cellTitleFontSize, _Cell.tokens.cellTitleFontWeight, _Cell.tokens.cellTitleFontFamily, _Cell.tokens.cellTitleFontStyle, _Cell.tokens.cellTitleLineHeight, _Cell.tokens.cellTitleLetterSpacing);

package/styled-components/cjs/components/Cell/variations/_size/base.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.base = void 0;
+var _styledComponents = /*#__PURE__*/require("styled-components");
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([""]);

package/styled-components/cjs/components/Cell/variations/_size/tokens.json

@@ -0,0 +1 @@
+["--plasma-cell-left-height", "--plasma-cell-right-height", "--plasma-cell-height"]

package/styled-components/cjs/components/Cell/variations/_stretching/base.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.base = void 0;
+var _styledComponents = /*#__PURE__*/require("styled-components");
+var _Cell = /*#__PURE__*/require("../../Cell.tokens");
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", "{width:var(", ");}&.", "{width:100%;}&.", "{width:auto;}"], _Cell.classes.fixedStretching, _Cell.tokens.cellWidth, _Cell.classes.filledStretching, _Cell.classes.autoStretching);

package/styled-components/cjs/components/Cell/variations/_stretching/tokens.json

@@ -0,0 +1 @@
+["--plasma-button-width"]

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

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.base = void 0;
+var _styledComponents = /*#__PURE__*/require("styled-components");
+var _Cell = /*#__PURE__*/require("../../Cell.tokens");
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["color:var(", ");background-color:var(", ");width:100%;display:flex;align-items:stretch;gap:var(", ");&:focus{outline:0 none;}"], _Cell.tokens.cellColor, _Cell.tokens.cellBackgroundColor, _Cell.tokens.cellGap);

package/styled-components/cjs/components/Cell/variations/_view/tokens.json

@@ -0,0 +1 @@
+["--plasma-cell-color", "--plasma-cell-background-color"]

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

@@ -11,7 +11,7 @@ var _Combobox = /*#__PURE__*/require("./Combobox.tokens");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 var StyledRoot = exports.StyledRoot = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   componentId: "plasma-new-hope__sc-gt7m6a-0"
-})(["width:100%;position:relative;"]);
+})(["width:100%;position:relative;& .", "{display:block;}"], _Popover.popoverClasses.wrapper);
 var StyledCombobox = exports.StyledCombobox = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   componentId: "plasma-new-hope__sc-gt7m6a-1"
 })(["box-sizing:border-box;background:var(", ");box-shadow:var(", ");border-radius:var(", ");width:var(", ");height:var(", ");padding:var(", ") var(", ") var(", ") var(", ");"], _Combobox.tokens.background, _Combobox.tokens.boxShadow, _Combobox.tokens.borderRadius, _Combobox.tokens.width, _Combobox.tokens.height, _Combobox.tokens.paddingTop, _Combobox.tokens.paddingRight, _Combobox.tokens.paddingBottom, _Combobox.tokens.paddingLeft);

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

@@ -71,7 +71,6 @@ var dropdownRoot = exports.dropdownRoot = function dropdownRoot(Root) {
       placement: (0, _utils.getPlacements)(placement),
       trigger: trigger,
       closeOnOverlayClick: closeOnOverlayClick,
-      closeOnBeyondTargetHover: false,
       closeOnEsc: closeOnEsc,
       isFocusTrapped: isFocusTrapped,
       frame: frame

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

@@ -67,7 +67,7 @@ var paginationRoot = exports.paginationRoot = function paginationRoot(Root) {
       onChangePageValue = _ref.onChangePageValue,
       onChangePerPageValue = _ref.onChangePerPageValue,
       rest = _objectWithoutProperties(_ref, _excluded);
-    var _useState = (0, _react.useState)(value !== null && value !== void 0 ? value : _utils2.defaultValues.value),
+    var _useState = (0, _react.useState)(1),
       _useState2 = _slicedToArray(_useState, 2),
       page = _useState2[0],
       setPageValue = _useState2[1];
@@ -94,24 +94,22 @@ var paginationRoot = exports.paginationRoot = function paginationRoot(Root) {
       setPagesValue(Math.ceil(count / (newPerPage || (hasPerPage ? _utils2.defaultValues.perPage : 1))));
     };
     var handlerSetPage = function handlerSetPage(newPageValue) {
-      var _newPageValue;
-      newPageValue = (_newPageValue = newPageValue) !== null && _newPageValue !== void 0 ? _newPageValue : _utils2.defaultValues.value;
-      if (newPageValue > pages) {
-        newPageValue = pages;
+      var pageValue = newPageValue !== null && newPageValue !== void 0 ? newPageValue : _utils2.defaultValues.value;
+      if (pageValue > pages) {
+        pageValue = pages;
       }
-      if (newPageValue < 1) {
-        newPageValue = 1;
+      if (pageValue < 1) {
+        pageValue = 1;
       }
-      if (disabled.includes(newPageValue)) {
+      if (disabled.includes(pageValue)) {
         return;
       }
-      setPageValue(newPageValue);
-      onChangePageValue === null || onChangePageValue === void 0 ? void 0 : onChangePageValue(newPageValue);
+      setPageValue(pageValue);
+      onChangePageValue === null || onChangePageValue === void 0 ? void 0 : onChangePageValue(pageValue);
     };
     var handlerSetPerPage = function handlerSetPerPage(newPerPageValue) {
-      setPageValue(1);
+      handlerSetPage(1);
       setPerPageValue(newPerPageValue);
-      onChangePageValue === null || onChangePageValue === void 0 ? void 0 : onChangePageValue(1);
       onChangePerPageValue === null || onChangePerPageValue === void 0 ? void 0 : onChangePerPageValue(newPerPageValue);
       handlerSetPages(newPerPageValue);
     };
@@ -120,7 +118,10 @@ var paginationRoot = exports.paginationRoot = function paginationRoot(Root) {
     };
     (0, _react.useEffect)(function () {
       handlerSetPages(perPage);
-    }, [perPage, handlerSetPages]);
+    }, [perPage, count, handlerSetPages]);
+    (0, _react.useEffect)(function () {
+      handlerSetPage(value);
+    }, [value]);
     (0, _react.useEffect)(function () {
       setSections((0, _utils2.getSections)(page, pages, slots));
     }, [page, slots, pages, setSections, _utils2.getSections]);

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

@@ -66,14 +66,6 @@ var popoverRoot = exports.popoverRoot = function popoverRoot(Root) {
       view = props.view,
       onToggle = props.onToggle,
       rest = _objectWithoutProperties(props, _excluded);
-    var closeOnOverlayClick = true;
-    var closeOnBeyondTargetHover = true;
-    if (props.trigger === 'click' && props.closeOnOverlayClick === false) {
-      closeOnOverlayClick = false;
-    }
-    if (props.trigger === 'hover' && props.closeOnBeyondTargetHover === false) {
-      closeOnBeyondTargetHover = false;
-    }
     var rootRef = (0, _react.useRef)(null);
     var popoverRef = (0, _react.useRef)(null);
     var handleRef = (0, _plasmaCore.useForkRef)(rootRef, outerRootRef);
@@ -129,7 +121,7 @@ var popoverRoot = exports.popoverRoot = function popoverRoot(Root) {
       }
     }, [closeOnEsc, isOpen, onToggle]);
     var onDocumentClick = (0, _react.useCallback)(function (event) {
-      if (isOpen && closeOnOverlayClick && onToggle) {
+      if (isOpen && props.closeOnOverlayClick && onToggle) {
         var _rootRef$current;
         var targetIsRoot = event.target === rootRef.current;
         var rootHasTarget = (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.contains(event.target);
@@ -137,7 +129,7 @@ var popoverRoot = exports.popoverRoot = function popoverRoot(Root) {
           onToggle(false, event);
         }
       }
-    }, [closeOnOverlayClick, isOpen, onToggle]);
+    }, [props.closeOnOverlayClick, isOpen, onToggle]);
     var onClick = (0, _react.useCallback)(function (event) {
       if (trigger === 'click') {
         var _popoverRef$current;
@@ -173,7 +165,7 @@ var popoverRoot = exports.popoverRoot = function popoverRoot(Root) {
       return function () {
         return document.removeEventListener('click', onDocumentClick);
       };
-    }, [closeOnOverlayClick, isOpen, onToggle]);
+    }, [isOpen, onToggle]);
     (0, _react.useEffect)(function () {
       window.addEventListener('keydown', onEscape);
       return function () {
@@ -220,22 +212,19 @@ var popoverRoot = exports.popoverRoot = function popoverRoot(Root) {
       Promise.resolve().then(forceUpdate);
     }, [isOpen, children, forceUpdate]);
     return /*#__PURE__*/_react["default"].createElement(_Popover.StyledWrapper, {
-      className: _Popover2.classes.wrapper
+      className: _Popover2.classes.wrapper,
+      onMouseEnter: onMouseEnter,
+      onMouseLeave: onMouseLeave
     }, /*#__PURE__*/_react["default"].createElement(_Popover.StyledRoot, {
       ref: handleRef,
       onClick: onClick,
-      onMouseEnter: onMouseEnter,
-      onMouseLeave: onMouseLeave,
       onFocus: onFocus,
       onBlur: onBlur,
       className: (0, _utils.cx)(className, _Popover2.classes.target)
     }, target), children && portalRef.current && /*#__PURE__*/_reactDom["default"].createPortal( /*#__PURE__*/_react["default"].createElement(Root, _extends({
       view: view,
       className: className
-    }, rest, {
-      onMouseEnter: closeOnBeyondTargetHover ? undefined : onMouseEnter,
-      onMouseLeave: closeOnBeyondTargetHover ? undefined : onMouseEnter
-    }), /*#__PURE__*/_react["default"].createElement(_Popover.StyledPopover, _extends({}, attributes.popper, {
+    }, rest), /*#__PURE__*/_react["default"].createElement(_Popover.StyledPopover, _extends({}, attributes.popper, {
       className: _Popover2.classes.root,
       ref: popoverForkRef,
       style: _objectSpread(_objectSpread(_objectSpread({}, styles.popper), {

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

@@ -10,7 +10,7 @@ var _Popover = /*#__PURE__*/require("./Popover.tokens");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 var StyledWrapper = exports.StyledWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   componentId: "plasma-new-hope__sc-tnpyex-0"
-})([""]);
+})(["display:inline-block;"]);
 var StyledRoot = exports.StyledRoot = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   componentId: "plasma-new-hope__sc-tnpyex-1"
 })(["display:inline-flex;box-sizing:border-box;position:relative;"]);

package/styled-components/cjs/components/Select/ui/SelectTarget/SelectTarget.js

@@ -120,7 +120,8 @@ var SelectTarget = exports.SelectTarget = /*#__PURE__*/(0, _react.forwardRef)(fu
     "aria-label": label,
     className: (0, _utils.cx)(withInnerLabelUp, withHasChips, withNoFocus, selectTarget),
     onWheel: onWheel,
-    onKeyDown: onKeyDown
+    onKeyDown: onKeyDown,
+    stretching: "filled"
   }), hasText && (enumerationType === 'comma' || target === 'button-like' ? /*#__PURE__*/_react["default"].createElement(_SelectTarget.StyledText, {
     className: selectTargeText
   }, textContent) : /*#__PURE__*/_react["default"].createElement(_SelectTarget.StyledChipsWrapper, {

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

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.config = void 0;
+var _styledComponents = /*#__PURE__*/require("styled-components");
+var _Cell = /*#__PURE__*/require("../../../../components/Cell");
+var config = exports.config = {
+  variations: {
+    view: {
+      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--text-secondary);", ":transparent;"], _Cell.cellTokens.cellColor, _Cell.cellTokens.cellLabelColor, _Cell.cellTokens.cellTitleColor, _Cell.cellTokens.cellSubtitleColor, _Cell.cellTokens.cellBackgroundColor)
+    },
+    size: {
+      l: /*#__PURE__*/(0, _styledComponents.css)(["", ":15rem;", ":0rem;", ":0rem;", ":0rem;", ":0rem;", ":0.125rem;", ":0.375rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":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-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);"], _Cell.cellTokens.cellWidth, _Cell.cellTokens.cellPadding, _Cell.cellTokens.cellPaddingLeftContent, _Cell.cellTokens.cellPaddingContent, _Cell.cellTokens.cellPaddingRightContent, _Cell.cellTokens.cellTextboxGap, _Cell.cellTokens.cellGap, _Cell.cellTokens.cellLabelFontFamily, _Cell.cellTokens.cellLabelFontSize, _Cell.cellTokens.cellLabelFontStyle, _Cell.cellTokens.cellLabelFontWeight, _Cell.cellTokens.cellLabelLetterSpacing, _Cell.cellTokens.cellLabelLineHeight, _Cell.cellTokens.cellTitleFontFamily, _Cell.cellTokens.cellTitleFontSize, _Cell.cellTokens.cellTitleFontStyle, _Cell.cellTokens.cellTitleFontWeight, _Cell.cellTokens.cellTitleLetterSpacing, _Cell.cellTokens.cellTitleLineHeight, _Cell.cellTokens.cellSubtitleFontFamily, _Cell.cellTokens.cellSubtitleFontSize, _Cell.cellTokens.cellSubtitleFontStyle, _Cell.cellTokens.cellSubtitleFontWeight, _Cell.cellTokens.cellSubtitleLetterSpacing, _Cell.cellTokens.cellSubtitleLineHeight),
+      m: /*#__PURE__*/(0, _styledComponents.css)(["", ":15rem;", ":0rem;", ":0rem;", ":0rem;", ":0rem;", ":0.125rem;", ":0.375rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);"], _Cell.cellTokens.cellWidth, _Cell.cellTokens.cellPadding, _Cell.cellTokens.cellPaddingLeftContent, _Cell.cellTokens.cellPaddingContent, _Cell.cellTokens.cellPaddingRightContent, _Cell.cellTokens.cellTextboxGap, _Cell.cellTokens.cellGap, _Cell.cellTokens.cellLabelFontFamily, _Cell.cellTokens.cellLabelFontSize, _Cell.cellTokens.cellLabelFontStyle, _Cell.cellTokens.cellLabelFontWeight, _Cell.cellTokens.cellLabelLetterSpacing, _Cell.cellTokens.cellLabelLineHeight, _Cell.cellTokens.cellTitleFontFamily, _Cell.cellTokens.cellTitleFontSize, _Cell.cellTokens.cellTitleFontStyle, _Cell.cellTokens.cellTitleFontWeight, _Cell.cellTokens.cellTitleLetterSpacing, _Cell.cellTokens.cellTitleLineHeight, _Cell.cellTokens.cellSubtitleFontFamily, _Cell.cellTokens.cellSubtitleFontSize, _Cell.cellTokens.cellSubtitleFontStyle, _Cell.cellTokens.cellSubtitleFontWeight, _Cell.cellTokens.cellSubtitleLetterSpacing, _Cell.cellTokens.cellSubtitleLineHeight),
+      s: /*#__PURE__*/(0, _styledComponents.css)(["", ":15rem;", ":0rem;", ":0rem;", ":0rem;", ":0rem;", ":0.125rem;", ":0.375rem;", ":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(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":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);"], _Cell.cellTokens.cellWidth, _Cell.cellTokens.cellPadding, _Cell.cellTokens.cellPaddingLeftContent, _Cell.cellTokens.cellPaddingContent, _Cell.cellTokens.cellPaddingRightContent, _Cell.cellTokens.cellTextboxGap, _Cell.cellTokens.cellGap, _Cell.cellTokens.cellLabelFontFamily, _Cell.cellTokens.cellLabelFontSize, _Cell.cellTokens.cellLabelFontStyle, _Cell.cellTokens.cellLabelFontWeight, _Cell.cellTokens.cellLabelLetterSpacing, _Cell.cellTokens.cellLabelLineHeight, _Cell.cellTokens.cellTitleFontFamily, _Cell.cellTokens.cellTitleFontSize, _Cell.cellTokens.cellTitleFontStyle, _Cell.cellTokens.cellTitleFontWeight, _Cell.cellTokens.cellTitleLetterSpacing, _Cell.cellTokens.cellTitleLineHeight, _Cell.cellTokens.cellSubtitleFontFamily, _Cell.cellTokens.cellSubtitleFontSize, _Cell.cellTokens.cellSubtitleFontStyle, _Cell.cellTokens.cellSubtitleFontWeight, _Cell.cellTokens.cellSubtitleLetterSpacing, _Cell.cellTokens.cellSubtitleLineHeight),
+      xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":15rem;", ":0rem;", ":0rem;", ":0rem;", ":0rem;", ":0.125rem;", ":0.25rem;", ":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(--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(--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);"], _Cell.cellTokens.cellWidth, _Cell.cellTokens.cellPadding, _Cell.cellTokens.cellPaddingLeftContent, _Cell.cellTokens.cellPaddingContent, _Cell.cellTokens.cellPaddingRightContent, _Cell.cellTokens.cellTextboxGap, _Cell.cellTokens.cellGap, _Cell.cellTokens.cellLabelFontFamily, _Cell.cellTokens.cellLabelFontSize, _Cell.cellTokens.cellLabelFontStyle, _Cell.cellTokens.cellLabelFontWeight, _Cell.cellTokens.cellLabelLetterSpacing, _Cell.cellTokens.cellLabelLineHeight, _Cell.cellTokens.cellTitleFontFamily, _Cell.cellTokens.cellTitleFontSize, _Cell.cellTokens.cellTitleFontStyle, _Cell.cellTokens.cellTitleFontWeight, _Cell.cellTokens.cellTitleLetterSpacing, _Cell.cellTokens.cellTitleLineHeight, _Cell.cellTokens.cellSubtitleFontFamily, _Cell.cellTokens.cellSubtitleFontSize, _Cell.cellTokens.cellSubtitleFontStyle, _Cell.cellTokens.cellSubtitleFontWeight, _Cell.cellTokens.cellSubtitleLetterSpacing, _Cell.cellTokens.cellSubtitleLineHeight)
+    }
+  }
+};

package/styled-components/cjs/examples/plasma_b2c/components/Cell/Cell.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Cell = void 0;
+Object.defineProperty(exports, "CellTextbox", {
+  enumerable: true,
+  get: function get() {
+    return _Cell.CellTextbox;
+  }
+});
+Object.defineProperty(exports, "CellTextboxLabel", {
+  enumerable: true,
+  get: function get() {
+    return _Cell.CellTextboxLabel;
+  }
+});
+Object.defineProperty(exports, "CellTextboxSubtitle", {
+  enumerable: true,
+  get: function get() {
+    return _Cell.CellTextboxSubtitle;
+  }
+});
+Object.defineProperty(exports, "CellTextboxTitle", {
+  enumerable: true,
+  get: function get() {
+    return _Cell.CellTextboxTitle;
+  }
+});
+var _Cell = /*#__PURE__*/require("../../../../components/Cell");
+var _engines = /*#__PURE__*/require("../../../../engines");
+var _Cell2 = /*#__PURE__*/require("./Cell.config");
+var mergedConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_Cell.cellConfig, _Cell2.config);
+var Cell = exports.Cell = /*#__PURE__*/(0, _engines.component)(mergedConfig);

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

@@ -0,0 +1,128 @@
+import React from 'react';
+import type { ComponentProps } from 'react';
+import type { StoryObj, Meta } from '@storybook/react';
+import styled from 'styled-components';
+
+import { WithTheme } from '../../../_helpers';
+import { Avatar } from '../Avatar/Avatar';
+import { IconChevronLeft } from '../../../../components/_Icon';
+
+import { Cell, CellTextbox, CellTextboxTitle } from './Cell';
+
+type StoryProps = ComponentProps<typeof Cell> & {
+    itemsCount?: number;
+    disableLeftContent?: boolean;
+    disableRightContent?: boolean;
+};
+type Story = StoryObj<StoryProps>;
+
+const sizes = ['l', 'm', 's', 'xs'];
+const stretchingValues = ['fixed', 'filled', 'auto'];
+const alignLeft = ['top', 'center', 'bottom'];
+const alignRight = ['top', 'center', 'bottom'];
+
+type SizesCell = 'xs' | 'l' | 'm' | 's' | undefined;
+type SizesAvatar = 'l' | 'm' | 's';
+
+const getSize = (size: SizesCell): SizesAvatar => {
+    if (size === 'xs' || !size) {
+        return 's';
+    }
+
+    return size;
+};
+
+const meta: Meta<typeof Cell> = {
+    title: 'plasma_b2c/Cell',
+    decorators: [WithTheme],
+    argTypes: {
+        size: {
+            options: sizes,
+            control: {
+                type: 'select',
+            },
+        },
+        stretching: {
+            options: stretchingValues,
+            control: {
+                type: 'select',
+            },
+        },
+        alignContentLeft: {
+            options: alignLeft,
+            control: {
+                type: 'select',
+            },
+        },
+        alignContentRight: {
+            options: alignRight,
+            control: {
+                type: 'select',
+            },
+        },
+    },
+};
+
+export default meta;
+
+const ChevronRight = styled(IconChevronLeft)`
+    transform: rotate(180deg);
+    color: var(--text-secondary);
+`;
+
+export const Default: Story = {
+    args: {
+        size: 'm',
+        stretching: 'filled',
+        disableLeftContent: false,
+        disableRightContent: false,
+        alignContentLeft: 'center',
+        alignContentRight: 'center',
+        title: 'Title',
+        subtitle: 'Subtitle',
+        label: 'Label',
+    },
+    render: ({ ...args }: StoryProps) => {
+        return (
+            <Cell
+                contentLeft={
+                    !args.disableLeftContent && (
+                        <Avatar size={getSize(args.size)} url="https://avatars.githubusercontent.com/u/1813468?v=4" />
+                    )
+                }
+                contentRight={!args.disableRightContent && <ChevronRight color="inherit" size="xs" />}
+                {...args}
+            />
+        );
+    },
+};
+
+export const WithContentTextboxCustom: Story = {
+    args: {
+        size: 'm',
+        stretching: 'filled',
+    },
+    render: ({ ...args }: StoryProps) => {
+        const MyStyledText = styled.div`
+            font-size: 12px;
+            font-weight: 600;
+            opacity: 0.5;
+        `;
+        return (
+            <Cell
+                view="default"
+                size={args.size}
+                stretching={args.stretching}
+                contentLeft={
+                    <Avatar size={getSize(args.size)} url="https://avatars.githubusercontent.com/u/1813468?v=4" />
+                }
+                contentRight={!args.disableRightContent && <ChevronRight color="inherit" size="xs" />}
+            >
+                <CellTextboxTitle>
+                    <CellTextbox>Title</CellTextbox>
+                    <MyStyledText>My styled Text</MyStyledText>
+                </CellTextboxTitle>
+            </Cell>
+        );
+    },
+};

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

@@ -8,13 +8,12 @@ var _styledComponents = /*#__PURE__*/require("styled-components");
 var _Chip = /*#__PURE__*/require("../../../../components/Chip");
 var config = exports.config = {
   defaults: {
-    view: 'default',
+    view: 'primary',
     focused: 'true',
     size: 'm'
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 85% );", ":var(--inverse-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 80% );", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);"], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover),
       primary: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 85% );", ":var(--inverse-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 80% );", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);"], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover),
       secondary: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-transparent-secondary) 85% );", ":var(--text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-transparent-secondary) 80% );", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);"], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover),
       positive: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--surface-positive);", ":var(--on-dark-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-positive) 85% );", ":var(--on-dark-text-primary);", ":color-mix(in srgb,var(--text-primary),var(--surface-positive) 85%);", ":var(--surface-positive);", ":var(--on-dark-text-primary);", ":var(--surface-positive);", ":var(--on-dark-text-primary);"], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover)

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

@@ -24,10 +24,10 @@ var config = exports.config = {
       clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--surface-clear);", ":var(--text-primary);", ":color-mix(in srgb,var(--text-primary),var(--surface-clear) 95%);", ":var(--text-primary);", ":color-mix(in srgb,var(--text-primary),var(--surface-clear) 90%);"], _Pagination.paginationTokens.paginationCurrentButtonColor, _Pagination.paginationTokens.paginationCurrentButtonBackgroundColor, _Pagination.paginationTokens.paginationCurrentButtonHoverColor, _Pagination.paginationTokens.paginationCurrentButtonHoverBackgroundColor, _Pagination.paginationTokens.paginationCurrentButtonActiveColor, _Pagination.paginationTokens.paginationCurrentButtonActiveBackgroundColor)
     },
     size: {
-      l: /*#__PURE__*/(0, _styledComponents.css)(["", ":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-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.5rem;", ":3rem;", ":2.25rem;", ":4rem;", ":0.875rem;", ":1.2rem;", ":1.45rem;", ":100%;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":auto;", ":1.5rem;", ":1rem;", ":1rem;", ":1rem;", ":1rem;", ":1.875rem;", ":transparent;", ":1rem;", ":100%;", ":0 3.5rem 0 1.5rem;", ":0 3.625rem 0 0.375rem;", ":0 3.625rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.875rem;", ":4rem;", ":3.5rem;", ":0 0.625rem;", ":0.125rem;"], _Pagination.paginationTokens.paginationFontFamily, _Pagination.paginationTokens.paginationFontSize, _Pagination.paginationTokens.paginationFontStyle, _Pagination.paginationTokens.paginationFontWeight, _Pagination.paginationTokens.paginationLetterSpacing, _Pagination.paginationTokens.paginationLineHeight, _Pagination.paginationTokens.buttonHeight, _Pagination.paginationTokens.buttonWidth, _Pagination.paginationTokens.buttonWidthShorter, _Pagination.paginationTokens.paginationInputWidth, _Pagination.paginationTokens.buttonRadius, _Pagination.paginationTokens.paginationIconSize, _Pagination.paginationTokens.paginationIconDoubleSize, _Pagination.paginationTokens.selectWidth, _Pagination.paginationTokens.selectHeight, _Pagination.paginationTokens.selectPaddingTop, _Pagination.paginationTokens.selectPaddingRight, _Pagination.paginationTokens.selectPaddingBottom, _Pagination.paginationTokens.selectPaddingLeft, _Pagination.paginationTokens.selectItemWidth, _Pagination.paginationTokens.selectItemHeight, _Pagination.paginationTokens.selectItemPaddingTop, _Pagination.paginationTokens.selectItemPaddingRight, _Pagination.paginationTokens.selectItemPaddingBottom, _Pagination.paginationTokens.selectItemPaddingLeft, _Pagination.paginationTokens.selectItemContentLeftWidth, _Pagination.paginationTokens.selectItemBackground, _Pagination.paginationTokens.selectTargetArrowRight, _Pagination.paginationTokens.selectTargetWidth, _Pagination.paginationTokens.selectTargetPadding, _Pagination.paginationTokens.selectTargetPaddingHasChips, _Pagination.paginationTokens.selectTargetPaddingWithInput, _Pagination.paginationTokens.selectTargetInnerTop, _Pagination.paginationTokens.selectTargetLabelInnerTop, _Pagination.paginationTokens.inputBorderRadius, _Pagination.paginationTokens.inputWidth, _Pagination.paginationTokens.inputHeight, _Pagination.paginationTokens.inputPadding, _Pagination.paginationTokens.inputBorderWidth),
-      m: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":3rem;", ":3rem;", ":2rem;", ":3.5rem;", ":0.75rem;", ":1.05rem;", ":1.3rem;", ":100%;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":auto;", ":1.5rem;", ":0.75rem;", ":0.75rem;", ":0.75rem;", ":0.75rem;", ":1.75rem;", ":transparent;", ":0.875rem;", ":100%;", ":0 3.25rem 0 1.25rem;", ":0 3.375rem 0 0.375rem;", ":0 3.375rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.75rem;", ":3.5rem;", ":3rem;", ":0 0.625rem;", ":0.125rem;"], _Pagination.paginationTokens.paginationFontFamily, _Pagination.paginationTokens.paginationFontSize, _Pagination.paginationTokens.paginationFontStyle, _Pagination.paginationTokens.paginationFontWeight, _Pagination.paginationTokens.paginationLetterSpacing, _Pagination.paginationTokens.paginationLineHeight, _Pagination.paginationTokens.buttonHeight, _Pagination.paginationTokens.buttonWidth, _Pagination.paginationTokens.buttonWidthShorter, _Pagination.paginationTokens.paginationInputWidth, _Pagination.paginationTokens.buttonRadius, _Pagination.paginationTokens.paginationIconSize, _Pagination.paginationTokens.paginationIconDoubleSize, _Pagination.paginationTokens.selectWidth, _Pagination.paginationTokens.selectHeight, _Pagination.paginationTokens.selectPaddingTop, _Pagination.paginationTokens.selectPaddingRight, _Pagination.paginationTokens.selectPaddingBottom, _Pagination.paginationTokens.selectPaddingLeft, _Pagination.paginationTokens.selectItemWidth, _Pagination.paginationTokens.selectItemHeight, _Pagination.paginationTokens.selectItemPaddingTop, _Pagination.paginationTokens.selectItemPaddingRight, _Pagination.paginationTokens.selectItemPaddingBottom, _Pagination.paginationTokens.selectItemPaddingLeft, _Pagination.paginationTokens.selectItemContentLeftWidth, _Pagination.paginationTokens.selectItemBackground, _Pagination.paginationTokens.selectTargetArrowRight, _Pagination.paginationTokens.selectTargetWidth, _Pagination.paginationTokens.selectTargetPadding, _Pagination.paginationTokens.selectTargetPaddingHasChips, _Pagination.paginationTokens.selectTargetPaddingWithInput, _Pagination.paginationTokens.selectTargetInnerTop, _Pagination.paginationTokens.selectTargetLabelInnerTop, _Pagination.paginationTokens.inputBorderRadius, _Pagination.paginationTokens.inputWidth, _Pagination.paginationTokens.inputHeight, _Pagination.paginationTokens.inputPadding, _Pagination.paginationTokens.inputBorderWidth),
-      s: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":2.5rem;", ":2.5rem;", ":1.75rem;", ":3rem;", ":0.625rem;", ":0.9rem;", ":1.15rem;", ":100%;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":auto;", ":1.5rem;", ":0.5rem;", ":0.75rem;", ":0.5rem;", ":0.75rem;", ":1.75rem;", ":transparent;", ":0.75rem;", ":100%;", ":0 3rem 0 1rem;", ":0 3.125rem 0 0.375rem;", ":0 3.125rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.625rem;", ":3rem;", ":2.5rem;", ":0 0.625rem;", ":0.125rem;"], _Pagination.paginationTokens.paginationFontFamily, _Pagination.paginationTokens.paginationFontSize, _Pagination.paginationTokens.paginationFontStyle, _Pagination.paginationTokens.paginationFontWeight, _Pagination.paginationTokens.paginationLetterSpacing, _Pagination.paginationTokens.paginationLineHeight, _Pagination.paginationTokens.buttonHeight, _Pagination.paginationTokens.buttonWidth, _Pagination.paginationTokens.buttonWidthShorter, _Pagination.paginationTokens.paginationInputWidth, _Pagination.paginationTokens.buttonRadius, _Pagination.paginationTokens.paginationIconSize, _Pagination.paginationTokens.paginationIconDoubleSize, _Pagination.paginationTokens.selectWidth, _Pagination.paginationTokens.selectHeight, _Pagination.paginationTokens.selectPaddingTop, _Pagination.paginationTokens.selectPaddingRight, _Pagination.paginationTokens.selectPaddingBottom, _Pagination.paginationTokens.selectPaddingLeft, _Pagination.paginationTokens.selectItemWidth, _Pagination.paginationTokens.selectItemHeight, _Pagination.paginationTokens.selectItemPaddingTop, _Pagination.paginationTokens.selectItemPaddingRight, _Pagination.paginationTokens.selectItemPaddingBottom, _Pagination.paginationTokens.selectItemPaddingLeft, _Pagination.paginationTokens.selectItemContentLeftWidth, _Pagination.paginationTokens.selectItemBackground, _Pagination.paginationTokens.selectTargetArrowRight, _Pagination.paginationTokens.selectTargetWidth, _Pagination.paginationTokens.selectTargetPadding, _Pagination.paginationTokens.selectTargetPaddingHasChips, _Pagination.paginationTokens.selectTargetPaddingWithInput, _Pagination.paginationTokens.selectTargetInnerTop, _Pagination.paginationTokens.selectTargetLabelInnerTop, _Pagination.paginationTokens.inputBorderRadius, _Pagination.paginationTokens.inputWidth, _Pagination.paginationTokens.inputHeight, _Pagination.paginationTokens.inputPadding, _Pagination.paginationTokens.inputBorderWidth),
-      xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":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-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":2rem;", ":2.5rem;", ":0.5rem;", ":2rem;", ":1.5rem;", ":0.75rem;", ":1rem;", ":100%;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":auto;", ":1rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":1.25rem;", ":transparent;", ":0.5rem;", ":100%;", ":0 2.5rem 0 0.75rem;", ":0 2.625rem 0 0.375rem;", ":0 2.625rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.5rem;", ":2.5rem;", ":2rem;", ":0 0.625rem;", ":0.125rem;"], _Pagination.paginationTokens.paginationFontFamily, _Pagination.paginationTokens.paginationFontSize, _Pagination.paginationTokens.paginationFontStyle, _Pagination.paginationTokens.paginationFontWeight, _Pagination.paginationTokens.paginationLetterSpacing, _Pagination.paginationTokens.paginationLineHeight, _Pagination.paginationTokens.buttonHeight, _Pagination.paginationTokens.paginationInputWidth, _Pagination.paginationTokens.buttonRadius, _Pagination.paginationTokens.buttonWidth, _Pagination.paginationTokens.buttonWidthShorter, _Pagination.paginationTokens.paginationIconSize, _Pagination.paginationTokens.paginationIconDoubleSize, _Pagination.paginationTokens.selectWidth, _Pagination.paginationTokens.selectHeight, _Pagination.paginationTokens.selectPaddingTop, _Pagination.paginationTokens.selectPaddingRight, _Pagination.paginationTokens.selectPaddingBottom, _Pagination.paginationTokens.selectPaddingLeft, _Pagination.paginationTokens.selectItemWidth, _Pagination.paginationTokens.selectItemHeight, _Pagination.paginationTokens.selectItemPaddingTop, _Pagination.paginationTokens.selectItemPaddingRight, _Pagination.paginationTokens.selectItemPaddingBottom, _Pagination.paginationTokens.selectItemPaddingLeft, _Pagination.paginationTokens.selectItemContentLeftWidth, _Pagination.paginationTokens.selectItemBackground, _Pagination.paginationTokens.selectTargetArrowRight, _Pagination.paginationTokens.selectTargetWidth, _Pagination.paginationTokens.selectTargetPadding, _Pagination.paginationTokens.selectTargetPaddingHasChips, _Pagination.paginationTokens.selectTargetPaddingWithInput, _Pagination.paginationTokens.selectTargetInnerTop, _Pagination.paginationTokens.selectTargetLabelInnerTop, _Pagination.paginationTokens.inputBorderRadius, _Pagination.paginationTokens.inputWidth, _Pagination.paginationTokens.inputHeight, _Pagination.paginationTokens.inputPadding, _Pagination.paginationTokens.inputBorderWidth)
+      l: /*#__PURE__*/(0, _styledComponents.css)(["", ":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-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.5rem;", ":3rem;", ":2.25rem;", ":4rem;", ":0.875rem;", ":1.2rem;", ":1.45rem;", ":100%;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":auto;", ":1.5rem;", ":1rem;", ":1rem;", ":1rem;", ":1rem;", ":1.875rem;", ":transparent;", ":1rem;", ":100%;", ":0 3.5rem 0 1.5rem;", ":0 3.625rem 0 0.375rem;", ":0 3.625rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.875rem;", ":4rem;", ":3.5rem;", ":0 0.625rem;", ":0.0625rem;"], _Pagination.paginationTokens.paginationFontFamily, _Pagination.paginationTokens.paginationFontSize, _Pagination.paginationTokens.paginationFontStyle, _Pagination.paginationTokens.paginationFontWeight, _Pagination.paginationTokens.paginationLetterSpacing, _Pagination.paginationTokens.paginationLineHeight, _Pagination.paginationTokens.buttonHeight, _Pagination.paginationTokens.buttonWidth, _Pagination.paginationTokens.buttonWidthShorter, _Pagination.paginationTokens.paginationInputWidth, _Pagination.paginationTokens.buttonRadius, _Pagination.paginationTokens.paginationIconSize, _Pagination.paginationTokens.paginationIconDoubleSize, _Pagination.paginationTokens.selectWidth, _Pagination.paginationTokens.selectHeight, _Pagination.paginationTokens.selectPaddingTop, _Pagination.paginationTokens.selectPaddingRight, _Pagination.paginationTokens.selectPaddingBottom, _Pagination.paginationTokens.selectPaddingLeft, _Pagination.paginationTokens.selectItemWidth, _Pagination.paginationTokens.selectItemHeight, _Pagination.paginationTokens.selectItemPaddingTop, _Pagination.paginationTokens.selectItemPaddingRight, _Pagination.paginationTokens.selectItemPaddingBottom, _Pagination.paginationTokens.selectItemPaddingLeft, _Pagination.paginationTokens.selectItemContentLeftWidth, _Pagination.paginationTokens.selectItemBackground, _Pagination.paginationTokens.selectTargetArrowRight, _Pagination.paginationTokens.selectTargetWidth, _Pagination.paginationTokens.selectTargetPadding, _Pagination.paginationTokens.selectTargetPaddingHasChips, _Pagination.paginationTokens.selectTargetPaddingWithInput, _Pagination.paginationTokens.selectTargetInnerTop, _Pagination.paginationTokens.selectTargetLabelInnerTop, _Pagination.paginationTokens.inputBorderRadius, _Pagination.paginationTokens.inputWidth, _Pagination.paginationTokens.inputHeight, _Pagination.paginationTokens.inputPadding, _Pagination.paginationTokens.inputBorderWidth),
+      m: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":3rem;", ":3rem;", ":2rem;", ":3.5rem;", ":0.75rem;", ":1.05rem;", ":1.3rem;", ":100%;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":auto;", ":1.5rem;", ":0.75rem;", ":0.75rem;", ":0.75rem;", ":0.75rem;", ":1.75rem;", ":transparent;", ":0.875rem;", ":100%;", ":0 3.25rem 0 1.25rem;", ":0 3.375rem 0 0.375rem;", ":0 3.375rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.75rem;", ":3.5rem;", ":3rem;", ":0 0.625rem;", ":0.0625rem;"], _Pagination.paginationTokens.paginationFontFamily, _Pagination.paginationTokens.paginationFontSize, _Pagination.paginationTokens.paginationFontStyle, _Pagination.paginationTokens.paginationFontWeight, _Pagination.paginationTokens.paginationLetterSpacing, _Pagination.paginationTokens.paginationLineHeight, _Pagination.paginationTokens.buttonHeight, _Pagination.paginationTokens.buttonWidth, _Pagination.paginationTokens.buttonWidthShorter, _Pagination.paginationTokens.paginationInputWidth, _Pagination.paginationTokens.buttonRadius, _Pagination.paginationTokens.paginationIconSize, _Pagination.paginationTokens.paginationIconDoubleSize, _Pagination.paginationTokens.selectWidth, _Pagination.paginationTokens.selectHeight, _Pagination.paginationTokens.selectPaddingTop, _Pagination.paginationTokens.selectPaddingRight, _Pagination.paginationTokens.selectPaddingBottom, _Pagination.paginationTokens.selectPaddingLeft, _Pagination.paginationTokens.selectItemWidth, _Pagination.paginationTokens.selectItemHeight, _Pagination.paginationTokens.selectItemPaddingTop, _Pagination.paginationTokens.selectItemPaddingRight, _Pagination.paginationTokens.selectItemPaddingBottom, _Pagination.paginationTokens.selectItemPaddingLeft, _Pagination.paginationTokens.selectItemContentLeftWidth, _Pagination.paginationTokens.selectItemBackground, _Pagination.paginationTokens.selectTargetArrowRight, _Pagination.paginationTokens.selectTargetWidth, _Pagination.paginationTokens.selectTargetPadding, _Pagination.paginationTokens.selectTargetPaddingHasChips, _Pagination.paginationTokens.selectTargetPaddingWithInput, _Pagination.paginationTokens.selectTargetInnerTop, _Pagination.paginationTokens.selectTargetLabelInnerTop, _Pagination.paginationTokens.inputBorderRadius, _Pagination.paginationTokens.inputWidth, _Pagination.paginationTokens.inputHeight, _Pagination.paginationTokens.inputPadding, _Pagination.paginationTokens.inputBorderWidth),
+      s: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":2.5rem;", ":2.5rem;", ":1.75rem;", ":3rem;", ":0.625rem;", ":0.9rem;", ":1.15rem;", ":100%;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":auto;", ":1.5rem;", ":0.5rem;", ":0.75rem;", ":0.5rem;", ":0.75rem;", ":1.75rem;", ":transparent;", ":0.75rem;", ":100%;", ":0 3rem 0 1rem;", ":0 3.125rem 0 0.375rem;", ":0 3.125rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.625rem;", ":3rem;", ":2.5rem;", ":0 0.625rem;", ":0.0625rem;"], _Pagination.paginationTokens.paginationFontFamily, _Pagination.paginationTokens.paginationFontSize, _Pagination.paginationTokens.paginationFontStyle, _Pagination.paginationTokens.paginationFontWeight, _Pagination.paginationTokens.paginationLetterSpacing, _Pagination.paginationTokens.paginationLineHeight, _Pagination.paginationTokens.buttonHeight, _Pagination.paginationTokens.buttonWidth, _Pagination.paginationTokens.buttonWidthShorter, _Pagination.paginationTokens.paginationInputWidth, _Pagination.paginationTokens.buttonRadius, _Pagination.paginationTokens.paginationIconSize, _Pagination.paginationTokens.paginationIconDoubleSize, _Pagination.paginationTokens.selectWidth, _Pagination.paginationTokens.selectHeight, _Pagination.paginationTokens.selectPaddingTop, _Pagination.paginationTokens.selectPaddingRight, _Pagination.paginationTokens.selectPaddingBottom, _Pagination.paginationTokens.selectPaddingLeft, _Pagination.paginationTokens.selectItemWidth, _Pagination.paginationTokens.selectItemHeight, _Pagination.paginationTokens.selectItemPaddingTop, _Pagination.paginationTokens.selectItemPaddingRight, _Pagination.paginationTokens.selectItemPaddingBottom, _Pagination.paginationTokens.selectItemPaddingLeft, _Pagination.paginationTokens.selectItemContentLeftWidth, _Pagination.paginationTokens.selectItemBackground, _Pagination.paginationTokens.selectTargetArrowRight, _Pagination.paginationTokens.selectTargetWidth, _Pagination.paginationTokens.selectTargetPadding, _Pagination.paginationTokens.selectTargetPaddingHasChips, _Pagination.paginationTokens.selectTargetPaddingWithInput, _Pagination.paginationTokens.selectTargetInnerTop, _Pagination.paginationTokens.selectTargetLabelInnerTop, _Pagination.paginationTokens.inputBorderRadius, _Pagination.paginationTokens.inputWidth, _Pagination.paginationTokens.inputHeight, _Pagination.paginationTokens.inputPadding, _Pagination.paginationTokens.inputBorderWidth),
+      xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":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-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":2rem;", ":2.5rem;", ":0.5rem;", ":2rem;", ":1.5rem;", ":0.75rem;", ":1rem;", ":100%;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":auto;", ":1rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":1.25rem;", ":transparent;", ":0.5rem;", ":100%;", ":0 2.5rem 0 0.75rem;", ":0 2.625rem 0 0.375rem;", ":0 2.625rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.5rem;", ":2.5rem;", ":2rem;", ":0 0.625rem;", ":0.0625rem;"], _Pagination.paginationTokens.paginationFontFamily, _Pagination.paginationTokens.paginationFontSize, _Pagination.paginationTokens.paginationFontStyle, _Pagination.paginationTokens.paginationFontWeight, _Pagination.paginationTokens.paginationLetterSpacing, _Pagination.paginationTokens.paginationLineHeight, _Pagination.paginationTokens.buttonHeight, _Pagination.paginationTokens.paginationInputWidth, _Pagination.paginationTokens.buttonRadius, _Pagination.paginationTokens.buttonWidth, _Pagination.paginationTokens.buttonWidthShorter, _Pagination.paginationTokens.paginationIconSize, _Pagination.paginationTokens.paginationIconDoubleSize, _Pagination.paginationTokens.selectWidth, _Pagination.paginationTokens.selectHeight, _Pagination.paginationTokens.selectPaddingTop, _Pagination.paginationTokens.selectPaddingRight, _Pagination.paginationTokens.selectPaddingBottom, _Pagination.paginationTokens.selectPaddingLeft, _Pagination.paginationTokens.selectItemWidth, _Pagination.paginationTokens.selectItemHeight, _Pagination.paginationTokens.selectItemPaddingTop, _Pagination.paginationTokens.selectItemPaddingRight, _Pagination.paginationTokens.selectItemPaddingBottom, _Pagination.paginationTokens.selectItemPaddingLeft, _Pagination.paginationTokens.selectItemContentLeftWidth, _Pagination.paginationTokens.selectItemBackground, _Pagination.paginationTokens.selectTargetArrowRight, _Pagination.paginationTokens.selectTargetWidth, _Pagination.paginationTokens.selectTargetPadding, _Pagination.paginationTokens.selectTargetPaddingHasChips, _Pagination.paginationTokens.selectTargetPaddingWithInput, _Pagination.paginationTokens.selectTargetInnerTop, _Pagination.paginationTokens.selectTargetLabelInnerTop, _Pagination.paginationTokens.inputBorderRadius, _Pagination.paginationTokens.inputWidth, _Pagination.paginationTokens.inputHeight, _Pagination.paginationTokens.inputPadding, _Pagination.paginationTokens.inputBorderWidth)
     },
     type: {
       compact: /*#__PURE__*/(0, _styledComponents.css)([""]),