@salutejs/plasma-new-hope 0.68.1-canary.1154.8508988159.0 → 0.69.0-canary.1148.8505804388.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (158) hide show
  1. package/cjs/components/Cell/Cell.css +3 -0
  2. package/cjs/components/Cell/Cell.js +70 -0
  3. package/cjs/components/Cell/Cell.js.map +1 -0
  4. package/cjs/components/Cell/Cell.styles.js +39 -0
  5. package/cjs/components/Cell/Cell.styles.js.map +1 -0
  6. package/cjs/components/Cell/Cell.styles_ygfo1w.css +1 -0
  7. package/cjs/components/Cell/Cell.tokens.js +50 -0
  8. package/cjs/components/Cell/Cell.tokens.js.map +1 -0
  9. package/cjs/components/Cell/CellTextbox/CellTextbox.js +21 -0
  10. package/cjs/components/Cell/CellTextbox/CellTextbox.js.map +1 -0
  11. package/cjs/components/Cell/CellTextbox/CellTextbox.styles.js +13 -0
  12. package/cjs/components/Cell/CellTextbox/CellTextbox.styles.js.map +1 -0
  13. package/cjs/components/Cell/CellTextbox/ui/CellTextLabel.js +17 -0
  14. package/cjs/components/Cell/CellTextbox/ui/CellTextLabel.js.map +1 -0
  15. package/cjs/components/Cell/CellTextbox/ui/CellTextSubtitle.js +17 -0
  16. package/cjs/components/Cell/CellTextbox/ui/CellTextSubtitle.js.map +1 -0
  17. package/cjs/components/Cell/CellTextbox/ui/CellTextTitle.js +17 -0
  18. package/cjs/components/Cell/CellTextbox/ui/CellTextTitle.js.map +1 -0
  19. package/cjs/components/Cell/variations/_size/base.js +9 -0
  20. package/cjs/components/Cell/variations/_size/base.js.map +1 -0
  21. package/cjs/components/Cell/variations/_size/base_x642ct.css +1 -0
  22. package/cjs/components/Cell/variations/_view/base.js +9 -0
  23. package/cjs/components/Cell/variations/_view/base.js.map +1 -0
  24. package/cjs/components/Cell/variations/_view/base_13f5j4a.css +1 -0
  25. package/cjs/components/Pagination/Pagination.js +4 -6
  26. package/cjs/components/Pagination/Pagination.js.map +1 -1
  27. package/cjs/index.css +4 -0
  28. package/cjs/index.js +14 -0
  29. package/cjs/index.js.map +1 -1
  30. package/es/components/Cell/Cell.css +3 -0
  31. package/es/components/Cell/Cell.js +65 -0
  32. package/es/components/Cell/Cell.js.map +1 -0
  33. package/es/components/Cell/Cell.styles.js +31 -0
  34. package/es/components/Cell/Cell.styles.js.map +1 -0
  35. package/es/components/Cell/Cell.styles_ygfo1w.css +1 -0
  36. package/es/components/Cell/Cell.tokens.js +45 -0
  37. package/es/components/Cell/Cell.tokens.js.map +1 -0
  38. package/es/components/Cell/CellTextbox/CellTextbox.js +17 -0
  39. package/es/components/Cell/CellTextbox/CellTextbox.js.map +1 -0
  40. package/es/components/Cell/CellTextbox/CellTextbox.styles.js +9 -0
  41. package/es/components/Cell/CellTextbox/CellTextbox.styles.js.map +1 -0
  42. package/es/components/Cell/CellTextbox/ui/CellTextLabel.js +13 -0
  43. package/es/components/Cell/CellTextbox/ui/CellTextLabel.js.map +1 -0
  44. package/es/components/Cell/CellTextbox/ui/CellTextSubtitle.js +13 -0
  45. package/es/components/Cell/CellTextbox/ui/CellTextSubtitle.js.map +1 -0
  46. package/es/components/Cell/CellTextbox/ui/CellTextTitle.js +13 -0
  47. package/es/components/Cell/CellTextbox/ui/CellTextTitle.js.map +1 -0
  48. package/es/components/Cell/variations/_size/base.js +5 -0
  49. package/es/components/Cell/variations/_size/base.js.map +1 -0
  50. package/es/components/Cell/variations/_size/base_x642ct.css +1 -0
  51. package/es/components/Cell/variations/_view/base.js +5 -0
  52. package/es/components/Cell/variations/_view/base.js.map +1 -0
  53. package/es/components/Cell/variations/_view/base_13f5j4a.css +1 -0
  54. package/es/components/Pagination/Pagination.js +5 -7
  55. package/es/components/Pagination/Pagination.js.map +1 -1
  56. package/es/index.css +4 -0
  57. package/es/index.js +6 -0
  58. package/es/index.js.map +1 -1
  59. package/package.json +2 -2
  60. package/styled-components/cjs/components/Cell/Cell.js +70 -0
  61. package/styled-components/cjs/components/Cell/Cell.styles.js +35 -0
  62. package/styled-components/cjs/components/Cell/Cell.tokens.js +48 -0
  63. package/styled-components/cjs/components/Cell/Cell.types.js +5 -0
  64. package/styled-components/cjs/components/Cell/CellTextbox/CellTextbox.js +20 -0
  65. package/styled-components/cjs/components/Cell/CellTextbox/CellTextbox.styles.js +12 -0
  66. package/styled-components/cjs/components/Cell/CellTextbox/CellTextbox.types.js +5 -0
  67. package/styled-components/cjs/components/Cell/CellTextbox/ui/CellTextLabel.js +16 -0
  68. package/styled-components/cjs/components/Cell/CellTextbox/ui/CellTextSubtitle.js +16 -0
  69. package/styled-components/cjs/components/Cell/CellTextbox/ui/CellTextTitle.js +16 -0
  70. package/styled-components/cjs/components/Cell/index.js +59 -0
  71. package/styled-components/cjs/components/Cell/variations/_size/base.js +8 -0
  72. package/styled-components/cjs/components/Cell/variations/_size/tokens.json +1 -0
  73. package/styled-components/cjs/components/Cell/variations/_stretching/base.js +9 -0
  74. package/styled-components/cjs/components/Cell/variations/_stretching/tokens.json +1 -0
  75. package/styled-components/cjs/components/Cell/variations/_view/base.js +9 -0
  76. package/styled-components/cjs/components/Cell/variations/_view/tokens.json +1 -0
  77. package/styled-components/cjs/components/Pagination/Pagination.js +4 -6
  78. package/styled-components/cjs/examples/plasma_b2c/components/Cell/Cell.config.js +21 -0
  79. package/styled-components/cjs/examples/plasma_b2c/components/Cell/Cell.js +35 -0
  80. package/styled-components/cjs/examples/plasma_b2c/components/Cell/Cell.stories.tsx +128 -0
  81. package/styled-components/cjs/examples/plasma_b2c/components/Pagination/Pagination.config.js +4 -4
  82. package/styled-components/cjs/examples/plasma_b2c/components/Pagination/Pagination.stories.tsx +7 -14
  83. package/styled-components/cjs/examples/plasma_web/components/Cell/Cell.config.js +21 -0
  84. package/styled-components/cjs/examples/plasma_web/components/Cell/Cell.js +35 -0
  85. package/styled-components/cjs/examples/plasma_web/components/Cell/Cell.stories.tsx +128 -0
  86. package/styled-components/cjs/examples/plasma_web/components/Pagination/Pagination.config.js +4 -4
  87. package/styled-components/cjs/examples/plasma_web/components/Pagination/Pagination.stories.tsx +7 -14
  88. package/styled-components/cjs/index.js +11 -0
  89. package/styled-components/es/components/Cell/Cell.js +61 -0
  90. package/styled-components/es/components/Cell/Cell.styles.js +27 -0
  91. package/styled-components/es/components/Cell/Cell.tokens.js +42 -0
  92. package/styled-components/es/components/Cell/Cell.types.js +1 -0
  93. package/styled-components/es/components/Cell/CellTextbox/CellTextbox.js +13 -0
  94. package/styled-components/es/components/Cell/CellTextbox/CellTextbox.styles.js +5 -0
  95. package/styled-components/es/components/Cell/CellTextbox/CellTextbox.types.js +1 -0
  96. package/styled-components/es/components/Cell/CellTextbox/ui/CellTextLabel.js +9 -0
  97. package/styled-components/es/components/Cell/CellTextbox/ui/CellTextSubtitle.js +9 -0
  98. package/styled-components/es/components/Cell/CellTextbox/ui/CellTextTitle.js +9 -0
  99. package/styled-components/es/components/Cell/index.js +6 -0
  100. package/styled-components/es/components/Cell/variations/_size/base.js +2 -0
  101. package/styled-components/es/components/Cell/variations/_size/tokens.json +1 -0
  102. package/styled-components/es/components/Cell/variations/_stretching/base.js +3 -0
  103. package/styled-components/es/components/Cell/variations/_stretching/tokens.json +1 -0
  104. package/styled-components/es/components/Cell/variations/_view/base.js +3 -0
  105. package/styled-components/es/components/Cell/variations/_view/tokens.json +1 -0
  106. package/styled-components/es/components/Pagination/Pagination.js +4 -6
  107. package/styled-components/es/examples/plasma_b2c/components/Cell/Cell.config.js +15 -0
  108. package/styled-components/es/examples/plasma_b2c/components/Cell/Cell.js +6 -0
  109. package/styled-components/es/examples/plasma_b2c/components/Cell/Cell.stories.tsx +128 -0
  110. package/styled-components/es/examples/plasma_b2c/components/Pagination/Pagination.config.js +4 -4
  111. package/styled-components/es/examples/plasma_b2c/components/Pagination/Pagination.stories.tsx +7 -14
  112. package/styled-components/es/examples/plasma_web/components/Cell/Cell.config.js +15 -0
  113. package/styled-components/es/examples/plasma_web/components/Cell/Cell.js +6 -0
  114. package/styled-components/es/examples/plasma_web/components/Cell/Cell.stories.tsx +128 -0
  115. package/styled-components/es/examples/plasma_web/components/Pagination/Pagination.config.js +4 -4
  116. package/styled-components/es/examples/plasma_web/components/Pagination/Pagination.stories.tsx +7 -14
  117. package/styled-components/es/index.js +1 -0
  118. package/types/components/Cell/Cell.d.ts +23 -0
  119. package/types/components/Cell/Cell.d.ts.map +1 -0
  120. package/types/components/Cell/Cell.styles.d.ts +11 -0
  121. package/types/components/Cell/Cell.styles.d.ts.map +1 -0
  122. package/types/components/Cell/Cell.tokens.d.ts +43 -0
  123. package/types/components/Cell/Cell.tokens.d.ts.map +1 -0
  124. package/types/components/Cell/Cell.types.d.ts +46 -0
  125. package/types/components/Cell/Cell.types.d.ts.map +1 -0
  126. package/types/components/Cell/CellTextbox/CellTextbox.d.ts +4 -0
  127. package/types/components/Cell/CellTextbox/CellTextbox.d.ts.map +1 -0
  128. package/types/components/Cell/CellTextbox/CellTextbox.styles.d.ts +2 -0
  129. package/types/components/Cell/CellTextbox/CellTextbox.styles.d.ts.map +1 -0
  130. package/types/components/Cell/CellTextbox/CellTextbox.types.d.ts +43 -0
  131. package/types/components/Cell/CellTextbox/CellTextbox.types.d.ts.map +1 -0
  132. package/types/components/Cell/CellTextbox/ui/CellTextLabel.d.ts +5 -0
  133. package/types/components/Cell/CellTextbox/ui/CellTextLabel.d.ts.map +1 -0
  134. package/types/components/Cell/CellTextbox/ui/CellTextSubtitle.d.ts +5 -0
  135. package/types/components/Cell/CellTextbox/ui/CellTextSubtitle.d.ts.map +1 -0
  136. package/types/components/Cell/CellTextbox/ui/CellTextTitle.d.ts +5 -0
  137. package/types/components/Cell/CellTextbox/ui/CellTextTitle.d.ts.map +1 -0
  138. package/types/components/Cell/index.d.ts +9 -0
  139. package/types/components/Cell/index.d.ts.map +1 -0
  140. package/types/components/Cell/variations/_size/base.d.ts +2 -0
  141. package/types/components/Cell/variations/_size/base.d.ts.map +1 -0
  142. package/types/components/Cell/variations/_stretching/base.d.ts +2 -0
  143. package/types/components/Cell/variations/_stretching/base.d.ts.map +1 -0
  144. package/types/components/Cell/variations/_view/base.d.ts +2 -0
  145. package/types/components/Cell/variations/_view/base.d.ts.map +1 -0
  146. package/types/components/Pagination/Pagination.d.ts.map +1 -1
  147. package/types/examples/plasma_b2c/components/Cell/Cell.config.d.ts +14 -0
  148. package/types/examples/plasma_b2c/components/Cell/Cell.config.d.ts.map +1 -0
  149. package/types/examples/plasma_b2c/components/Cell/Cell.d.ts +45 -0
  150. package/types/examples/plasma_b2c/components/Cell/Cell.d.ts.map +1 -0
  151. package/types/examples/plasma_b2c/components/Combobox/Combobox.d.ts +2 -2
  152. package/types/examples/plasma_web/components/Cell/Cell.config.d.ts +14 -0
  153. package/types/examples/plasma_web/components/Cell/Cell.config.d.ts.map +1 -0
  154. package/types/examples/plasma_web/components/Cell/Cell.d.ts +45 -0
  155. package/types/examples/plasma_web/components/Cell/Cell.d.ts.map +1 -0
  156. package/types/examples/plasma_web/components/Combobox/Combobox.d.ts +2 -2
  157. package/types/index.d.ts +1 -0
  158. package/types/index.d.ts.map +1 -1
@@ -0,0 +1,35 @@
1
+ "use strict";
2
+
3
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.base = exports.CellRight = exports.CellLeft = exports.CellContentWrapper = exports.CellContent = void 0;
8
+ var _styledComponents = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("styled-components"));
9
+ var _Cell = /*#__PURE__*/require("./Cell.tokens");
10
+ 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); }
11
+ 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 && Object.prototype.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; }
12
+ var alignToFlex = {
13
+ center: 'center',
14
+ top: 'flex-start',
15
+ bottom: 'flex-end'
16
+ };
17
+ 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);
18
+ var CellContentWrapper = exports.CellContentWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
19
+ componentId: "plasma-new-hope__sc-16emz3n-0"
20
+ })(["display:flex;flex:auto;justify-content:space-between;gap:var(", ");height:auto;"], _Cell.tokens.cellGap);
21
+ var CellContent = exports.CellContent = /*#__PURE__*/_styledComponents["default"].div.withConfig({
22
+ componentId: "plasma-new-hope__sc-16emz3n-1"
23
+ })(["display:flex;align-items:center;height:auto;"]);
24
+ var CellLeft = exports.CellLeft = /*#__PURE__*/_styledComponents["default"].div.withConfig({
25
+ componentId: "plasma-new-hope__sc-16emz3n-2"
26
+ })(["display:flex;align-items:", ";"], function (_ref) {
27
+ var align = _ref.align;
28
+ return alignToFlex[align];
29
+ });
30
+ var CellRight = exports.CellRight = /*#__PURE__*/_styledComponents["default"].div.withConfig({
31
+ componentId: "plasma-new-hope__sc-16emz3n-3"
32
+ })(["display:flex;align-items:", ";text-align:right;"], function (_ref2) {
33
+ var align = _ref2.align;
34
+ return alignToFlex[align];
35
+ });
@@ -0,0 +1,48 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.tokens = exports.classes = void 0;
7
+ var tokens = exports.tokens = {
8
+ cellColor: '--plasma-cell-color',
9
+ cellBackgroundColor: '--plasma-cell-background-color',
10
+ cellPadding: '--plasma-cell-padding',
11
+ cellPaddingLeftContent: '--plasma-cell-padding-left-content',
12
+ cellPaddingContent: '--plasma-cell-padding-content',
13
+ cellPaddingRightContent: '--plasma-cell-padding-right-content',
14
+ cellTextboxGap: '--plasma-cell-textbox-gap',
15
+ cellGap: '--plasma-cell-gap',
16
+ cellWidth: '--plasma-cell-width',
17
+ cellLabelColor: '--plasma-cell-label-color',
18
+ cellLabelFontFamily: '--plasma-cell-label-font-family',
19
+ cellLabelFontSize: '--plasma-cell-label-font-size',
20
+ cellLabelFontStyle: '--plasma-cell-label-font-style',
21
+ cellLabelFontWeight: '--plasma-cell-label-font-weight',
22
+ cellLabelLetterSpacing: '--plasma-cell-label-letter-spacing',
23
+ cellLabelLineHeight: '--plasma-cell-label-line-height',
24
+ cellTitleColor: '--plasma-cell-title-color',
25
+ cellTitleFontFamily: '--plasma-cell-title-font-family',
26
+ cellTitleFontSize: '--plasma-cell-title-font-size',
27
+ cellTitleFontStyle: '--plasma-cell-title-font-style',
28
+ cellTitleFontWeight: '--plasma-cell-title-font-weight',
29
+ cellTitleLetterSpacing: '--plasma-cell-title-letter-spacing',
30
+ cellTitleLineHeight: '--plasma-cell-title-line-height',
31
+ cellSubtitleColor: '--plasma-cell-subtitle-color',
32
+ cellSubtitleFontFamily: '--plasma-cell-subtitle-font-family',
33
+ cellSubtitleFontSize: '--plasma-cell-subtitle-font-size',
34
+ cellSubtitleFontStyle: '--plasma-cell-subtitle-font-style',
35
+ cellSubtitleFontWeight: '--plasma-cell-subtitle-font-weight',
36
+ cellSubtitleLetterSpacing: '--plasma-cell-subtitle-letter-spacing',
37
+ cellSubtitleLineHeight: '--plasma-cell-subtitle-line-height'
38
+ };
39
+ var classes = exports.classes = {
40
+ autoStretching: 'cell-stretching-auto',
41
+ filledStretching: 'cell-stretching-filled',
42
+ fixedStretching: 'cell-stretching-fixed',
43
+ cellWrapper: 'cell-wrapper',
44
+ cellRoot: 'cell-root',
45
+ cellContent: 'cell-content',
46
+ cellLeftContent: 'cell-left-content',
47
+ cellRightContent: 'cell-right-content'
48
+ };
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.CellTextbox = void 0;
7
+ var _react = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("react"));
8
+ var _CellTextbox = /*#__PURE__*/require("./CellTextbox.styles");
9
+ var _CellTextLabel = /*#__PURE__*/require("./ui/CellTextLabel");
10
+ var _CellTextTitle = /*#__PURE__*/require("./ui/CellTextTitle");
11
+ var _CellTextSubtitle = /*#__PURE__*/require("./ui/CellTextSubtitle");
12
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
13
+ var CellTextbox = exports.CellTextbox = function CellTextbox(_ref) {
14
+ var label = _ref.label,
15
+ title = _ref.title,
16
+ subtitle = _ref.subtitle,
17
+ description = _ref.description,
18
+ children = _ref.children;
19
+ return /*#__PURE__*/_react["default"].createElement(_CellTextbox.CellTextboxStyled, null, label || title || description || subtitle ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, label && /*#__PURE__*/_react["default"].createElement(_CellTextLabel.CellTextboxLabel, null, label), (title || description) && /*#__PURE__*/_react["default"].createElement(_CellTextTitle.CellTextboxTitle, null, title || description), subtitle && /*#__PURE__*/_react["default"].createElement(_CellTextSubtitle.CellTextboxSubtitle, null, subtitle)) : children);
20
+ };
@@ -0,0 +1,12 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.CellTextboxStyled = void 0;
7
+ var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
8
+ var _Cell = /*#__PURE__*/require("../Cell.tokens");
9
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
10
+ var CellTextboxStyled = exports.CellTextboxStyled = /*#__PURE__*/_styledComponents["default"].div.withConfig({
11
+ componentId: "plasma-new-hope__sc-1ts73cj-0"
12
+ })(["display:flex;flex-direction:column;gap:var(", ");"], _Cell.tokens.cellTextboxGap);
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
@@ -0,0 +1,16 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.CellTextboxLabel = void 0;
7
+ var _react = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("react"));
8
+ var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
9
+ var _Cell = /*#__PURE__*/require("../../Cell.tokens");
10
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
11
+ var StyledTextLabel = /*#__PURE__*/_styledComponents["default"].div.withConfig({
12
+ componentId: "plasma-new-hope__sc-1syy9dx-0"
13
+ })(["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);
14
+ var CellTextboxLabel = exports.CellTextboxLabel = function CellTextboxLabel(props) {
15
+ return /*#__PURE__*/_react["default"].createElement(StyledTextLabel, null, props.children);
16
+ };
@@ -0,0 +1,16 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.CellTextboxSubtitle = void 0;
7
+ var _react = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("react"));
8
+ var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
9
+ var _Cell = /*#__PURE__*/require("../../Cell.tokens");
10
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
11
+ var StyledTextSubtitle = /*#__PURE__*/_styledComponents["default"].div.withConfig({
12
+ componentId: "plasma-new-hope__sc-ulqa2a-0"
13
+ })(["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);
14
+ var CellTextboxSubtitle = exports.CellTextboxSubtitle = function CellTextboxSubtitle(props) {
15
+ return /*#__PURE__*/_react["default"].createElement(StyledTextSubtitle, null, props.children);
16
+ };
@@ -0,0 +1,16 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.CellTextboxTitle = void 0;
7
+ var _react = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("react"));
8
+ var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
9
+ var _Cell = /*#__PURE__*/require("../../Cell.tokens");
10
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
11
+ var StyledTextTitle = /*#__PURE__*/_styledComponents["default"].div.withConfig({
12
+ componentId: "plasma-new-hope__sc-o4ebas-0"
13
+ })(["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);
14
+ var CellTextboxTitle = exports.CellTextboxTitle = function CellTextboxTitle(props) {
15
+ return /*#__PURE__*/_react["default"].createElement(StyledTextTitle, null, props.children);
16
+ };
@@ -0,0 +1,59 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "CellTextbox", {
7
+ enumerable: true,
8
+ get: function get() {
9
+ return _CellTextbox.CellTextbox;
10
+ }
11
+ });
12
+ Object.defineProperty(exports, "CellTextboxLabel", {
13
+ enumerable: true,
14
+ get: function get() {
15
+ return _CellTextLabel.CellTextboxLabel;
16
+ }
17
+ });
18
+ Object.defineProperty(exports, "CellTextboxSubtitle", {
19
+ enumerable: true,
20
+ get: function get() {
21
+ return _CellTextSubtitle.CellTextboxSubtitle;
22
+ }
23
+ });
24
+ Object.defineProperty(exports, "CellTextboxTitle", {
25
+ enumerable: true,
26
+ get: function get() {
27
+ return _CellTextTitle.CellTextboxTitle;
28
+ }
29
+ });
30
+ Object.defineProperty(exports, "cellClasses", {
31
+ enumerable: true,
32
+ get: function get() {
33
+ return _Cell2.classes;
34
+ }
35
+ });
36
+ Object.defineProperty(exports, "cellConfig", {
37
+ enumerable: true,
38
+ get: function get() {
39
+ return _Cell.cellConfig;
40
+ }
41
+ });
42
+ Object.defineProperty(exports, "cellRoot", {
43
+ enumerable: true,
44
+ get: function get() {
45
+ return _Cell.cellRoot;
46
+ }
47
+ });
48
+ Object.defineProperty(exports, "cellTokens", {
49
+ enumerable: true,
50
+ get: function get() {
51
+ return _Cell2.tokens;
52
+ }
53
+ });
54
+ var _CellTextLabel = /*#__PURE__*/require("./CellTextbox/ui/CellTextLabel");
55
+ var _CellTextTitle = /*#__PURE__*/require("./CellTextbox/ui/CellTextTitle");
56
+ var _CellTextSubtitle = /*#__PURE__*/require("./CellTextbox/ui/CellTextSubtitle");
57
+ var _Cell = /*#__PURE__*/require("./Cell");
58
+ var _Cell2 = /*#__PURE__*/require("./Cell.tokens");
59
+ var _CellTextbox = /*#__PURE__*/require("./CellTextbox/CellTextbox");
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.base = void 0;
7
+ var _styledComponents = /*#__PURE__*/require("styled-components");
8
+ var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([""]);
@@ -0,0 +1 @@
1
+ ["--plasma-cell-left-height", "--plasma-cell-right-height", "--plasma-cell-height"]
@@ -0,0 +1,9 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.base = void 0;
7
+ var _styledComponents = /*#__PURE__*/require("styled-components");
8
+ var _Cell = /*#__PURE__*/require("../../Cell.tokens");
9
+ 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);
@@ -0,0 +1 @@
1
+ ["--plasma-button-width"]
@@ -0,0 +1,9 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.base = void 0;
7
+ var _styledComponents = /*#__PURE__*/require("styled-components");
8
+ var _Cell = /*#__PURE__*/require("../../Cell.tokens");
9
+ var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["color:var(", ");background-color:var(", ");width:100%;display:flex;align-items:center;gap:var(", ");&:focus{outline:0 none;}"], _Cell.tokens.cellColor, _Cell.tokens.cellBackgroundColor, _Cell.tokens.cellGap);
@@ -0,0 +1 @@
1
+ ["--plasma-cell-color", "--plasma-cell-background-color"]
@@ -67,7 +67,7 @@ var paginationRoot = exports.paginationRoot = function paginationRoot(Root) {
67
67
  onChangePageValue = _ref.onChangePageValue,
68
68
  onChangePerPageValue = _ref.onChangePerPageValue,
69
69
  rest = _objectWithoutProperties(_ref, _excluded);
70
- var _useState = (0, _react.useState)(1),
70
+ var _useState = (0, _react.useState)(value !== null && value !== void 0 ? value : _utils2.defaultValues.value),
71
71
  _useState2 = _slicedToArray(_useState, 2),
72
72
  page = _useState2[0],
73
73
  setPageValue = _useState2[1];
@@ -109,8 +109,9 @@ var paginationRoot = exports.paginationRoot = function paginationRoot(Root) {
109
109
  onChangePageValue === null || onChangePageValue === void 0 ? void 0 : onChangePageValue(newPageValue);
110
110
  };
111
111
  var handlerSetPerPage = function handlerSetPerPage(newPerPageValue) {
112
- handlerSetPage(1);
112
+ setPageValue(1);
113
113
  setPerPageValue(newPerPageValue);
114
+ onChangePageValue === null || onChangePageValue === void 0 ? void 0 : onChangePageValue(1);
114
115
  onChangePerPageValue === null || onChangePerPageValue === void 0 ? void 0 : onChangePerPageValue(newPerPageValue);
115
116
  handlerSetPages(newPerPageValue);
116
117
  };
@@ -119,10 +120,7 @@ var paginationRoot = exports.paginationRoot = function paginationRoot(Root) {
119
120
  };
120
121
  (0, _react.useEffect)(function () {
121
122
  handlerSetPages(perPage);
122
- }, [perPage, count, handlerSetPages]);
123
- (0, _react.useEffect)(function () {
124
- handlerSetPage(value);
125
- }, [value]);
123
+ }, [perPage, handlerSetPages]);
126
124
  (0, _react.useEffect)(function () {
127
125
  setSections((0, _utils2.getSections)(page, pages, slots));
128
126
  }, [page, slots, pages, setSections, _utils2.getSections]);
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.config = void 0;
7
+ var _styledComponents = /*#__PURE__*/require("styled-components");
8
+ var _Cell = /*#__PURE__*/require("../../../../components/Cell");
9
+ var config = exports.config = {
10
+ variations: {
11
+ view: {
12
+ "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)
13
+ },
14
+ size: {
15
+ 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),
16
+ 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),
17
+ 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),
18
+ 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)
19
+ }
20
+ }
21
+ };
@@ -0,0 +1,35 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.Cell = void 0;
7
+ Object.defineProperty(exports, "CellTextbox", {
8
+ enumerable: true,
9
+ get: function get() {
10
+ return _Cell.CellTextbox;
11
+ }
12
+ });
13
+ Object.defineProperty(exports, "CellTextboxLabel", {
14
+ enumerable: true,
15
+ get: function get() {
16
+ return _Cell.CellTextboxLabel;
17
+ }
18
+ });
19
+ Object.defineProperty(exports, "CellTextboxSubtitle", {
20
+ enumerable: true,
21
+ get: function get() {
22
+ return _Cell.CellTextboxSubtitle;
23
+ }
24
+ });
25
+ Object.defineProperty(exports, "CellTextboxTitle", {
26
+ enumerable: true,
27
+ get: function get() {
28
+ return _Cell.CellTextboxTitle;
29
+ }
30
+ });
31
+ var _Cell = /*#__PURE__*/require("../../../../components/Cell");
32
+ var _engines = /*#__PURE__*/require("../../../../engines");
33
+ var _Cell2 = /*#__PURE__*/require("./Cell.config");
34
+ var mergedConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_Cell.cellConfig, _Cell2.config);
35
+ var Cell = exports.Cell = /*#__PURE__*/(0, _engines.component)(mergedConfig);
@@ -0,0 +1,128 @@
1
+ import React from 'react';
2
+ import type { ComponentProps } from 'react';
3
+ import type { StoryObj, Meta } from '@storybook/react';
4
+ import styled from 'styled-components';
5
+
6
+ import { WithTheme } from '../../../_helpers';
7
+ import { Avatar } from '../Avatar/Avatar';
8
+ import { IconChevronLeft } from '../../../../components/_Icon';
9
+
10
+ import { Cell, CellTextbox, CellTextboxTitle } from './Cell';
11
+
12
+ type StoryProps = ComponentProps<typeof Cell> & {
13
+ itemsCount?: number;
14
+ enableLeftContent?: boolean;
15
+ enableRightContent?: boolean;
16
+ };
17
+ type Story = StoryObj<StoryProps>;
18
+
19
+ const sizes = ['l', 'm', 's', 'xs'];
20
+ const stretchingValues = ['fixed', 'filled', 'auto'];
21
+ const alignLeft = ['top', 'center', 'bottom'];
22
+ const alignRight = ['top', 'center', 'bottom'];
23
+
24
+ type SizesCell = 'xs' | 'l' | 'm' | 's' | undefined;
25
+ type SizesAvatar = 'l' | 'm' | 's';
26
+
27
+ const getSize = (size: SizesCell): SizesAvatar => {
28
+ if (size === 'xs' || !size) {
29
+ return 's';
30
+ }
31
+
32
+ return size;
33
+ };
34
+
35
+ const meta: Meta<typeof Cell> = {
36
+ title: 'plasma_b2c/Cell',
37
+ decorators: [WithTheme],
38
+ argTypes: {
39
+ size: {
40
+ options: sizes,
41
+ control: {
42
+ type: 'select',
43
+ },
44
+ },
45
+ stretching: {
46
+ options: stretchingValues,
47
+ control: {
48
+ type: 'select',
49
+ },
50
+ },
51
+ alignContentLeft: {
52
+ options: alignLeft,
53
+ control: {
54
+ type: 'select',
55
+ },
56
+ },
57
+ alignContentRight: {
58
+ options: alignRight,
59
+ control: {
60
+ type: 'select',
61
+ },
62
+ },
63
+ },
64
+ };
65
+
66
+ export default meta;
67
+
68
+ const ChevronRight = styled(IconChevronLeft)`
69
+ transform: rotate(180deg);
70
+ color: var(--text-secondary);
71
+ `;
72
+
73
+ export const Default: Story = {
74
+ args: {
75
+ size: 'm',
76
+ stretching: 'filled',
77
+ enableLeftContent: false,
78
+ enableRightContent: false,
79
+ alignContentLeft: 'center',
80
+ alignContentRight: 'center',
81
+ title: 'Title',
82
+ subtitle: 'Subtitle',
83
+ label: 'Label',
84
+ },
85
+ render: ({ ...args }: StoryProps) => {
86
+ return (
87
+ <Cell
88
+ contentLeft={
89
+ !args.enableLeftContent && (
90
+ <Avatar size={getSize(args.size)} url="https://avatars.githubusercontent.com/u/1813468?v=4" />
91
+ )
92
+ }
93
+ contentRight={!args.enableRightContent && <ChevronRight color="inherit" size="xs" />}
94
+ {...args}
95
+ />
96
+ );
97
+ },
98
+ };
99
+
100
+ export const WithContentTextboxCustom: Story = {
101
+ args: {
102
+ size: 'm',
103
+ stretching: 'filled',
104
+ },
105
+ render: ({ ...args }: StoryProps) => {
106
+ const MyStyledText = styled.div`
107
+ font-size: 12px;
108
+ font-weight: 600;
109
+ opacity: 0.5;
110
+ `;
111
+ return (
112
+ <Cell
113
+ view="default"
114
+ size={args.size}
115
+ stretching={args.stretching}
116
+ contentLeft={
117
+ <Avatar size={getSize(args.size)} url="https://avatars.githubusercontent.com/u/1813468?v=4" />
118
+ }
119
+ contentRight={!args.enableRightContent && <ChevronRight color="inherit" size="xs" />}
120
+ >
121
+ <CellTextboxTitle>
122
+ <CellTextbox>Title</CellTextbox>
123
+ <MyStyledText>My styled Text</MyStyledText>
124
+ </CellTextboxTitle>
125
+ </Cell>
126
+ );
127
+ },
128
+ };
@@ -24,10 +24,10 @@ var config = exports.config = {
24
24
  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)
25
25
  },
26
26
  size: {
27
- 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),
28
- 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),
29
- 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),
30
- 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)
27
+ 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),
28
+ 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),
29
+ 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),
30
+ 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)
31
31
  },
32
32
  type: {
33
33
  compact: /*#__PURE__*/(0, _styledComponents.css)([""]),