@salutejs/plasma-new-hope 0.317.0-canary.1886.14214080050.0 → 0.317.0-canary.1888.14214679698.0

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

@@ -43,15 +43,18 @@ export var Thead = /*#__PURE__*/styled.thead.withConfig({
     view === 'clear' ? 'none' : borderVariant === 'header' || borderVariant === 'rows' ? "inset 0 -1px 0 0 var(".concat(tokens.borderColor, ")") : "inset 0 1px 0 0 var(".concat(tokens.borderColor, "), inset 0 -1px 0 0 var(").concat(tokens.borderColor, ")")
   );
 }, Tr);
-export var Resizer = /*#__PURE__*/styled.div.withConfig({
+export var Tbody = /*#__PURE__*/styled.tbody.withConfig({
   componentId: "plasma-new-hope__sc-1nklm7n-3"
-})(["display:", ";position:absolute;z-index:1;top:-1px;bottom:0;right:-2px;width:0.1875rem;background:var(--outline-accent);cursor:col-resize;user-select:none;touch-action:none;"], function (_ref6) {
+})([""]);
+export var Resizer = /*#__PURE__*/styled.div.withConfig({
+  componentId: "plasma-new-hope__sc-1nklm7n-4"
+})(["display:", ";position:absolute;z-index:1;top:-0.0625rem;bottom:0;right:-0.125rem;width:0.1875rem;background:var(--outline-accent);cursor:col-resize;user-select:none;touch-action:none;"], function (_ref6) {
   var isResizing = _ref6.isResizing;
   return isResizing ? 'block' : 'none';
 });
 export var Th = /*#__PURE__*/styled.th.withConfig({
-  componentId: "plasma-new-hope__sc-1nklm7n-4"
-})(["padding:", ";position:relative;font-weight:600;text-align:left;height:var(", ");background-color:transparent;color:inherit;border-width:1px;border-top-width:0;border-bottom-width:0;border-style:solid;border-color:", ";&:hover{", "{display:block;}}"], function (_ref7) {
+  componentId: "plasma-new-hope__sc-1nklm7n-5"
+})(["padding:", ";position:relative;font-weight:600;text-align:left;height:var(", ");background-color:transparent;color:inherit;border-width:0.0625rem;border-top-width:0;border-bottom-width:0;border-style:solid;border-color:", ";&:hover{", "{display:block;}}"], function (_ref7) {
   var selectionCell = _ref7.selectionCell;
   return selectionCell ? "var(".concat(tokens.checkboxCellPadding, ")") : "var(".concat(tokens.cellPadding, ")");
 }, tokens.headerRowHeight, function (_ref8) {
@@ -59,17 +62,17 @@ export var Th = /*#__PURE__*/styled.th.withConfig({
   return borderVariant === 'all' ? "var(".concat(tokens.borderColor, ")") : 'transparent';
 }, Resizer);
 export var StyledCheckbox = /*#__PURE__*/styled(Checkbox).withConfig({
-  componentId: "plasma-new-hope__sc-1nklm7n-5"
+  componentId: "plasma-new-hope__sc-1nklm7n-6"
 })(["", ":var(", ");", ":var(", ");", ":var(--text-accent);", ":var(--on-dark-text-primary);", ":var(--text-secondary);"], checkboxTokens.triggerSize, tokens.checkboxTriggerSize, checkboxTokens.triggerBorderRadius, tokens.checkboxTriggerBorderRadius, checkboxTokens.fillColor, checkboxTokens.iconColor, checkboxTokens.triggerBorderColor);
 export var StyledDivider = /*#__PURE__*/styled(Divider).withConfig({
-  componentId: "plasma-new-hope__sc-1nklm7n-6"
+  componentId: "plasma-new-hope__sc-1nklm7n-7"
 })(["", ":0.0625rem;", ":var(--surface-transparent-tertiary);", ":0.0625rem;"], dividerTokens.baseSideSize, dividerTokens.background, dividerTokens.borderRadius);
 export var Button = /*#__PURE__*/styled(ButtonBase).withConfig({
-  componentId: "plasma-new-hope__sc-1nklm7n-7"
+  componentId: "plasma-new-hope__sc-1nklm7n-8"
 })(["", ":var(", ");", ":0.4;", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");"], buttonTokens.buttonHeight, tokens.buttonHeight, buttonTokens.buttonDisabledOpacity, buttonTokens.buttonFontFamily, tokens.buttonFontFamily, buttonTokens.buttonFontSize, tokens.buttonFontSize, buttonTokens.buttonFontStyle, tokens.buttonFontStyle, buttonTokens.buttonFontWeight, tokens.buttonFontWeight, buttonTokens.buttonLetterSpacing, tokens.buttonLetterSpacing, buttonTokens.buttonLineHeight, tokens.buttonLineHeight);
 export var ButtonAccent = /*#__PURE__*/styled(Button).withConfig({
-  componentId: "plasma-new-hope__sc-1nklm7n-8"
+  componentId: "plasma-new-hope__sc-1nklm7n-9"
 })(["", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-accent-active);"], buttonTokens.buttonColor, buttonTokens.buttonValueColor, buttonTokens.buttonBackgroundColor, buttonTokens.buttonBackgroundColorHover, buttonTokens.buttonBackgroundColorActive);
 export var LinkButton = /*#__PURE__*/styled(LinkButtonBase).withConfig({
-  componentId: "plasma-new-hope__sc-1nklm7n-9"
+  componentId: "plasma-new-hope__sc-1nklm7n-10"
 })(["", ":var(--text-primary);", ":var(--surface-transparent-clear);", ":var(--text-primary-hover);", ":var(--text-primary-active);", ":var(--surface-accent);", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");"], linkButtonTokens.linkButtonColor, linkButtonTokens.linkButtonBackgroundColor, linkButtonTokens.linkButtonColorHover, linkButtonTokens.linkButtonColorActive, linkButtonTokens.linkButtonFocusColor, linkButtonTokens.linkButtonFontFamily, tokens.linkButtonFontFamily, linkButtonTokens.linkButtonFontSize, tokens.linkButtonFontSize, linkButtonTokens.linkButtonFontStyle, tokens.linkButtonFontStyle, linkButtonTokens.linkButtonFontWeight, tokens.linkButtonFontWeight, linkButtonTokens.linkButtonLetterSpacing, tokens.linkButtonLetterSpacing, linkButtonTokens.linkButtonLineHeight, tokens.linkButtonLineHeight);

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

@@ -1,3 +1,11 @@
+export var classes = {
+  editIcon: 'edit-icon',
+  sortingDefaultIcon: 'sorting-default-icon',
+  sortingAscIcon: 'sorting-asc-icon',
+  sortingDescIcon: 'sorting-desc-icon',
+  filterIcon: 'filter-icon',
+  resizeDivider: 'resize-divider'
+};
 export var tableTokens = {
   fontFamily: '--plasma-table-font-family',
   fontSize: '--plasma-table-font-size',

package/styled-components/es/components/Table/ui/Cell/Cell.styles.js

@@ -2,7 +2,7 @@ import styled from 'styled-components';
 import { tableTokens as tokens } from '../../Table.tokens';
 export var Td = /*#__PURE__*/styled.td.withConfig({
   componentId: "plasma-new-hope__sc-1doamj5-0"
-})(["position:relative;padding:", ";height:var(", ");border-width:1px;border-top-width:0;border-style:solid;border-color:", ";border-bottom-color:", ";box-sizing:border-box;"], function (_ref) {
+})(["position:relative;padding:", ";height:var(", ");border-width:0.0625rem;border-top-width:0;border-style:solid;border-color:", ";border-bottom-color:", ";box-sizing:border-box;"], function (_ref) {
   var selectionCell = _ref.selectionCell;
   return selectionCell ? "var(".concat(tokens.checkboxCellPadding, ")") : "var(".concat(tokens.cellPadding, ")");
 }, tokens.rowHeight, function (_ref2) {

package/styled-components/es/components/Table/ui/EditableCell/EditableCell.js

@@ -1,4 +1,4 @@
-var _IconEditOutline, _Resizer;
+var _Resizer;
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
@@ -12,6 +12,7 @@ import { SELECT_COLUMN_ID } from '../../Table';
 import { useOutsideClick } from '../../../../hooks';
 import { IconEditOutline, IconResetOutline, IconDoneCircleOutline } from '../../../_Icon';
 import { getIconSize } from '../HeadCell/HeadCell';
+import { classes } from '../../Table.tokens';
 import { ContentWrapper, Td, IconDoneButton, Input, InnerWrapper, InputWrapper, EditModeWrapper, IconResetButton } from './EditableCell.styles';
 var keys = {
   Enter: 'Enter',
@@ -19,12 +20,13 @@ var keys = {
   Escape: 'Escape'
 };
 export var EditableCell = function EditableCell(_ref) {
+  var _table$options$meta;
   var size = _ref.size,
+    view = _ref.view,
     cell = _ref.cell,
     borderVariant = _ref.borderVariant,
     table = _ref.table,
-    selected = _ref.selected,
-    view = _ref.view;
+    selected = _ref.selected;
   var _useState = useState(cell.getValue()),
     _useState2 = _slicedToArray(_useState, 2),
     value = _useState2[0],
@@ -33,7 +35,7 @@ export var EditableCell = function EditableCell(_ref) {
     _useState4 = _slicedToArray(_useState3, 2),
     editingMode = _useState4[0],
     setEditingMode = _useState4[1];
-  var updateData = table.options.meta.updateData;
+  var updateData = (_table$options$meta = table.options.meta) === null || _table$options$meta === void 0 ? void 0 : _table$options$meta.updateData;
   var ref = useOutsideClick(function () {
     setEditingMode(false);
   });
@@ -50,14 +52,18 @@ export var EditableCell = function EditableCell(_ref) {
   };
   var handleSubmit = function handleSubmit(e) {
     e.stopPropagation();
-    updateData(cell.row.id, cell.column.id, value);
+    if (updateData) {
+      updateData(cell.row.id, cell.column.id, value);
+    }
     setEditingMode(false);
   };
   var handleKeyDown = function handleKeyDown(event) {
     switch (event.code) {
       case keys.Enter:
         {
-          updateData(cell.row.id, cell.column.id, value);
+          if (updateData) {
+            updateData(cell.row.id, cell.column.id, value);
+          }
           setEditingMode(false);
           break;
         }
@@ -97,11 +103,11 @@ export var EditableCell = function EditableCell(_ref) {
     tabIndex: -1
   }, /*#__PURE__*/React.createElement(IconDoneCircleOutline, {
     size: getIconSize(size)
-  }))) : /*#__PURE__*/React.createElement(ContentWrapper, null, flexRender(cell.column.columnDef.cell, cell.getContext()), _IconEditOutline || (_IconEditOutline = /*#__PURE__*/React.createElement(IconEditOutline, {
+  }))) : /*#__PURE__*/React.createElement(ContentWrapper, null, flexRender(cell.column.columnDef.cell, cell.getContext()), /*#__PURE__*/React.createElement(IconEditOutline, {
     size: "xs",
-    className: "editIcon",
+    className: classes.editIcon,
     color: "var(--text-secondary)"
-  })))), cell.column.getIsResizing() && (_Resizer || (_Resizer = /*#__PURE__*/React.createElement(Resizer, {
+  }))), cell.column.getIsResizing() && (_Resizer || (_Resizer = /*#__PURE__*/React.createElement(Resizer, {
     isResizing: true
   }))));
 };

package/styled-components/es/components/Table/ui/EditableCell/EditableCell.styles.js

@@ -1,12 +1,12 @@
 import styled from 'styled-components';
 import { component, mergeConfig } from '../../../../engines';
-import { tableTokens as tokens } from '../../Table.tokens';
+import { tableTokens as tokens, classes } from '../../Table.tokens';
 import { iconButtonConfig, iconButtonTokens } from '../../../IconButton';
 var mergedIndicatorConfig = /*#__PURE__*/mergeConfig(iconButtonConfig);
 var IconButton = /*#__PURE__*/component(mergedIndicatorConfig);
 export var Td = /*#__PURE__*/styled.td.withConfig({
   componentId: "plasma-new-hope__sc-1uu72a1-0"
-})(["position:relative;padding:", ";height:var(", ");border-width:1px;border-top-width:0;border-style:solid;border-color:", ";border-bottom-color:", ";cursor:pointer;box-sizing:border-box;& .editIcon{opacity:0;}&:hover .editIcon{opacity:1;}"], function (_ref) {
+})(["position:relative;padding:", ";height:var(", ");border-width:0.0625rem;border-top-width:0;border-style:solid;border-color:", ";border-bottom-color:", ";cursor:pointer;box-sizing:border-box;& .", "{opacity:0;}&:hover .", "{opacity:1;}"], function (_ref) {
   var selectionCell = _ref.selectionCell,
     editingMode = _ref.editingMode;
   return (
@@ -24,7 +24,7 @@ export var Td = /*#__PURE__*/styled.td.withConfig({
 }, function (_ref3) {
   var borderVariant = _ref3.borderVariant;
   return borderVariant === 'all' || borderVariant === 'rows' ? "var(".concat(tokens.borderColor, ")") : 'transparent';
-});
+}, classes.editIcon, classes.editIcon);
 export var InnerWrapper = /*#__PURE__*/styled.div.withConfig({
   componentId: "plasma-new-hope__sc-1uu72a1-1"
 })(["display:flex;align-items:center;justify-content:space-between;width:100%;height:100%;"]);
@@ -36,7 +36,7 @@ export var EditModeWrapper = /*#__PURE__*/styled.div.withConfig({
 })(["display:flex;align-items:center;justify-content:space-between;gap:var(", ");height:100%;"], tokens.editableCellPadding);
 export var InputWrapper = /*#__PURE__*/styled.div.withConfig({
   componentId: "plasma-new-hope__sc-1uu72a1-4"
-})(["display:flex;align-items:center;height:100%;flex:1;padding:var(", ");background:var(", ");border:1px solid var(", ");border-radius:var(", ");box-sizing:border-box;gap:var(", ");"], tokens.editableCellInputPadding, tokens.editableCellInputBackground, tokens.editableCellInputBorderColor, tokens.editableCellInputBorderRadius, tokens.editableCellIconGap);
+})(["display:flex;align-items:center;height:100%;flex:1;padding:var(", ");background:var(", ");border:0.0625rem solid var(", ");border-radius:var(", ");box-sizing:border-box;gap:var(", ");"], tokens.editableCellInputPadding, tokens.editableCellInputBackground, tokens.editableCellInputBorderColor, tokens.editableCellInputBorderRadius, tokens.editableCellIconGap);
 export var Input = /*#__PURE__*/styled.input.withConfig({
   componentId: "plasma-new-hope__sc-1uu72a1-5"
 })(["width:auto;border:none;padding:0;background:transparent;outline:none;caret-color:var(--text-accent);font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");"], tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight);

package/styled-components/es/components/Table/ui/HeadCell/HeadCell.js

@@ -3,7 +3,8 @@ import React from 'react';
 import { Th, Resizer } from '../../Table.styles';
 import { IconSwapVert, IconArrowDown, IconArrowUp } from '../../../_Icon';
 import { SELECT_COLUMN_ID } from '../../Table';
-import { ControlButtons, ThWrapper } from './HeadCell.styles';
+import { classes } from '../../Table.tokens';
+import { ControlButtons, ThWrapper, IconWrapper } from './HeadCell.styles';
 import { Filter } from './ui/Filter/Filter';
 export var getIconSize = function getIconSize(size) {
   return size === 's' ? 'xs' : 's';
@@ -30,23 +31,22 @@ export var HeadCell = function HeadCell(_ref) {
     size: size,
     outerFiltered: outerFiltered,
     tableContainerRef: tableContainerRef
-  }), header.column.getCanSort() && /*#__PURE__*/React.createElement("span", {
-    style: {
-      lineHeight: 0,
-      cursor: 'pointer',
-      userSelect: 'none'
-    },
+  }), header.column.getCanSort() && /*#__PURE__*/React.createElement(IconWrapper, {
     onClick: header.column.getToggleSortingHandler()
   }, (_asc$desc = {
     asc: /*#__PURE__*/React.createElement(IconArrowUp, {
-      size: getIconSize(size)
+      size: getIconSize(size),
+      className: classes.sortingAscIcon
     }),
     desc: /*#__PURE__*/React.createElement(IconArrowDown, {
-      size: getIconSize(size)
+      size: getIconSize(size),
+      className: classes.sortingDescIcon
     })
   }[header.column.getIsSorted()]) !== null && _asc$desc !== void 0 ? _asc$desc : /*#__PURE__*/React.createElement(IconSwapVert, {
-    size: getIconSize(size)
+    size: getIconSize(size),
+    className: classes.sortingDefaultIcon
   }))))), header.column.getCanResize() && /*#__PURE__*/React.createElement(Resizer, {
+    className: classes.resizeDivider,
     onMouseDown: header.getResizeHandler(),
     onTouchStart: header.getResizeHandler(),
     isResizing: header.column.getIsResizing()

package/styled-components/es/components/Table/ui/HeadCell/HeadCell.styles.js

@@ -4,4 +4,7 @@ export var ControlButtons = /*#__PURE__*/styled.div.withConfig({
 })(["display:flex;justify-content:space-between;align-items:center;gap:0.5rem;"]);
 export var ThWrapper = /*#__PURE__*/styled.div.withConfig({
   componentId: "plasma-new-hope__sc-haivw3-1"
-})(["display:flex;justify-content:space-between;align-items:center;gap:0.5rem;"]);
+})(["display:flex;justify-content:space-between;align-items:center;gap:0.5rem;"]);
+export var IconWrapper = /*#__PURE__*/styled.div.withConfig({
+  componentId: "plasma-new-hope__sc-haivw3-2"
+})(["line-height:0;cursor:pointer;user-select:none;"]);

package/styled-components/es/components/Table/ui/HeadCell/ui/Filter/Filter.js

@@ -14,6 +14,7 @@ import { useDidMountEffect } from '../../../../../../hooks';
 import { IconFilterFunnel } from '../../../../../_Icon';
 import { getIconSize } from '../../HeadCell';
 import { ButtonAccent, LinkButton } from '../../../../Table.styles';
+import { classes } from '../../../../Table.tokens';
 import { IconFilterWrapper, StyledIndicator, Select, StyledDivider, ControlPanel } from './Filter.styles';
 var getSelectWidth = function getSelectWidth(size) {
   switch (size) {
@@ -76,7 +77,8 @@ export var Filter = function Filter(_ref) {
     onChange: setLocalFiltered,
     renderTarget: function renderTarget() {
       return /*#__PURE__*/React.createElement(IconFilterWrapper, null, /*#__PURE__*/React.createElement(IconFilterFunnel, {
-        size: getIconSize(size)
+        size: getIconSize(size),
+        className: classes.filterIcon
       }), filtered.length ? _StyledIndicator || (_StyledIndicator = /*#__PURE__*/React.createElement(StyledIndicator, {
         size: "s",
         view: "accent"

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

@@ -1,5 +1,5 @@
 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); }
-var _excluded = ["size", "children", "breakWord", "noWrap", "bold", "medium", "color", "className", "style"];
+var _excluded = ["size", "children", "breakWord", "noWrap", "bold", "color", "className", "style"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -21,7 +21,6 @@ export var typographyRootCompose = function typographyRootCompose(defaultArgs) {
         noWrap = props.noWrap,
         _props$bold = props.bold,
         bold = _props$bold === void 0 ? defaultArgs === null || defaultArgs === void 0 ? void 0 : defaultArgs.defaultBold : _props$bold,
-        medium = props.medium,
         color = props.color,
         className = props.className,
         style = props.style,
@@ -29,10 +28,11 @@ export var typographyRootCompose = function typographyRootCompose(defaultArgs) {
       return /*#__PURE__*/React.createElement(Root, _extends({
         size: size,
         ref: ref,
-        className: cx(noWrap && classes.typoWithNoWrap, breakWord && classes.typoWithBreakWord, bold && classes.typoBold, medium && classes.typoMedium, className),
+        className: cx(noWrap && classes.typoWithNoWrap, breakWord && classes.typoWithBreakWord, bold && classes.typoBold, className),
         style: _objectSpread(_objectSpread({
           color: color
-        }, style), applySpacing(rest))
+        }, style), applySpacing(rest)),
+        bold: bold
       }, rest), children);
     });
   };

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

@@ -1,4 +1,4 @@
 import { css } from 'styled-components';
 import { applyHyphens, applyHyphensNormal } from '../../mixins';
 import { classes, tokens } from './tokens';
-export var base = /*#__PURE__*/css(["font-family:var(", ");font-size:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");font-weight:var(", ");&.", "{font-weight:var(", ");}&.", "{font-weight:var(", ");}&.", "{white-space:nowrap;}", ";&.", "{", ";}"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight, tokens.typoFontWeight, classes.typoBold, tokens.typoFontWeightBold, classes.typoMedium, tokens.typoFontWeightMedium, classes.typoWithNoWrap, applyHyphensNormal, classes.typoWithBreakWord, applyHyphens);
+export var base = /*#__PURE__*/css(["font-family:var(", ");font-size:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");font-weight:var(", ");&.", "{font-weight:var(", ");}&.", "{white-space:nowrap;}", ";&.", "{", ";}"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight, tokens.typoFontWeight, classes.typoBold, tokens.typoFontWeightBold, classes.typoWithNoWrap, applyHyphensNormal, classes.typoWithBreakWord, applyHyphens);

package/styled-components/es/components/Typography/Typography.template-doc.mdx

@@ -23,22 +23,6 @@ title: Typography
 По умолчанию в типографике если текст превышает ширину элемента, то слова будут переноситься по пробелам.
 Чтобы запретить перенос по пробелам, необходимо установить свойство `noWrap` в значении `true`.
 
-## Смена тега
-Если при использовании компонентов необходимо сменить тег, то можно использовать свойство `as`:
-
-```tsx live
-import React from 'react';
-import { BodyM } from '@salutejs/{{ package }}';
-
-export function App() {
-    return (
-        <BodyM as="h3">
-            BodyM
-        </BodyM>
-    );
-}
-```
-
 ## Состав
 
 ### Hero unit
@@ -52,15 +36,12 @@ export function App() {
         <div style=\{{ display: 'block' }}>
             <DsplL bold={false}>DsplL</DsplL>
             <DsplL>DsplL Bold</DsplL>
-            <DsplL medium>DsplL Medium</DsplL>
 
             <DsplM bold={false}>DsplM</DsplM>
             <DsplM>DsplM Bold</DsplM>
-            <DsplM medium>DsplM Medium</DsplM>
 
             <DsplS bold={false}>DsplS</DsplS>
             <DsplS>DsplS Bold</DsplS>
-            <DsplS medium>DsplS Medium</DsplS>
         </div>
     );
 }
@@ -77,23 +58,18 @@ export function App() {
         <div style=\{{ display: 'block' }}>
             <H1 bold={false}>H1</H1>
             <H1>H1 Bold</H1>
-            <H1 medium>H1 Medium</H1>
 
             <H2 bold={false}>H2</H2>
             <H2>H2 Bold</H2>
-            <H2 medium>H2 Medium</H2>
 
             <H3 bold={false}>H3</H3>
             <H3>H3 Bold</H3>
-            <H3 medium>H3 Medium</H3>
 
             <H4 bold={false}>H4</H4>
             <H4>H4 Bold</H4>
-            <H4 medium>H4 Medium</H4>
 
             <H5 bold={false}>H5</H5>
             <H5>H5 Bold</H5>
-            <H5 medium>H5 Medium</H5>
         </div>
     );
 }
@@ -110,24 +86,19 @@ export function App() {
     return (
         <div style=\{{ display: 'block' }}>
             <BodyL>BodyL</BodyL>
-            <BodyL bold>BodyL Bold</BodyL>
-            <BodyL medium>BodyL Medium</BodyL>
+            <BodyL bold>BodyL полужирный</BodyL>
 
             <BodyM>BodyM</BodyM>
-            <BodyM bold>BodyM Bold</BodyM>
-            <BodyM medium>BodyM Medium</BodyM>
+            <BodyM bold>BodyM полужирный</BodyM>
 
             <BodyS>BodyS</BodyS>
-            <BodyS bold>BodyS Bold</BodyS>
-            <BodyS medium>BodyS Medium</BodyS>
+            <BodyS bold>BodyS полужирный</BodyS>
 
             <BodyXS>BodyXS</BodyXS>
-            <BodyXS bold>BodyXS Bold</BodyXS>
-            <BodyXS medium>BodyXS Medium</BodyXS>
+            <BodyXS bold>BodyXS полужирный</BodyXS>
 
             <BodyXXS>BodyXXS</BodyXXS>
-            <BodyXXS bold>BodyXXS Bold</BodyXXS>
-            <BodyXXS medium>BodyXXS Medium</BodyXXS>
+            <BodyXXS bold>BodyXXS полужирный</BodyXXS>
         </div>
     );
 }
@@ -144,20 +115,16 @@ export function App() {
     return (
         <div style=\{{ display: 'block' }}>
             <TextL>TextL</TextL>
-            <TextL bold>TextL Bold</TextL>
-            <TextL medium>TextL Medium</TextL>
+            <TextL bold>TextL полужирный</TextL>
 
             <TextM>TextM</TextM>
-            <TextM bold>TextM Bold</TextM>
-            <TextM medium>TextM Medium</TextM>
+            <TextM bold>TextM полужирный</TextM>
 
             <TextS>TextS</TextS>
-            <TextS bold>TextS Bold</TextS>
-            <TextS medium>TextS Medium</TextS>
+            <TextS bold>TextS полужирный</TextS>
 
             <TextXS>TextXS</TextXS>
-            <TextXS bold>TextXS Bold</TextXS>
-            <TextXS medium>TextXS Medium</TextXS>
+            <TextXS bold>TextXS полужирный</TextXS>
         </div>
     );
 }

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

@@ -1,8 +1,7 @@
 export var classes = {
   typoWithNoWrap: 'with-no-wrap',
   typoWithBreakWord: 'with-break-word',
-  typoBold: 'typography-bold',
-  typoMedium: 'typography-medium'
+  typoBold: 'typography-bold'
 };
 export var tokens = {
   typoFontFamily: '--typo-font-family',
@@ -10,7 +9,6 @@ export var tokens = {
   typoFontStyle: '--typo-font-style',
   typoFontWeight: '--typo-font-weight',
   typoFontWeightBold: '--typo-font-weight-bold',
-  typoFontWeightMedium: '--typo-font-weight-medium',
   typoFontLetterSpacing: '--typo-font-letter-spacing',
   typoFontLineHeight: '--typo-font-line-height'
 };

package/styled-components/es/examples/plasma_b2c/components/Table/Table.stories.tsx

@@ -1,5 +1,6 @@
 import React, { useRef, ComponentProps, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
+import { getConfigVariations } from '@salutejs/plasma-sb-utils';
 
 import { WithTheme } from '../../../_helpers';
 import { ButtonGroup } from '../ButtonGroup/ButtonGroup';
@@ -8,12 +9,12 @@ import { IconButton } from '../IconButton/IconButton';
 import { IconEditOutline } from '../../../../components/_Icon';
 import { Dropdown } from '../Dropdown/Dropdown';
 
+import { config } from './Table.config';
 import { Table } from './Table';
 
 type StoryTableProps = ComponentProps<typeof Table>;
 
-const view = ['default', 'clear'];
-const size = ['s', 'm', 'l'];
+const { views, sizes } = getConfigVariations(config);
 const borderVariant = ['rows', 'header', 'all'];
 
 const meta: Meta<StoryTableProps> = {
@@ -23,11 +24,11 @@ const meta: Meta<StoryTableProps> = {
     argTypes: {
         view: {
             control: 'select',
-            options: view,
+            options: views,
         },
         size: {
             control: 'select',
-            options: size,
+            options: sizes,
         },
         borderVariant: {
             control: 'select',
@@ -514,8 +515,8 @@ const StoryComplex = (args: StoryTableProps) => {
                 <Button text="Очистить выбранные" view="warning" size="xs" onClick={clearSelected} />
                 <Button text="Убрать сортировку" view="warning" size="xs" onClick={clearSorted} />
                 <Button text="Очистить фильтры" view="warning" size="xs" onClick={clearFiltered} />
-                <Button text="Очистить все" view="critical" size="xs" onClick={clearAll} />
-                <Button text="Добавить строку" view="success" size="xs" onClick={addRow} />
+                <Button text="Очистить все" view="negative" size="xs" onClick={clearAll} />
+                <Button text="Добавить строку" view="positive" size="xs" onClick={addRow} />
             </ButtonGroup>
 
             <br />

package/styled-components/es/examples/plasma_web/components/Table/Table.stories.tsx

@@ -1,5 +1,6 @@
 import React, { useRef, ComponentProps, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
+import { getConfigVariations } from '@salutejs/plasma-sb-utils';
 
 import { WithTheme } from '../../../_helpers';
 import { ButtonGroup } from '../ButtonGroup/ButtonGroup';
@@ -7,13 +8,13 @@ import { Button } from '../Button/Button';
 import { IconButton } from '../IconButton/IconButton';
 import { IconEditOutline } from '../../../../components/_Icon';
 import { Dropdown } from '../Dropdown/Dropdown';
+import { config } from '../../../plasma_b2c/components/Table/Table.config';
 
 import { Table } from './Table';
 
 type StoryTableProps = ComponentProps<typeof Table>;
 
-const view = ['default', 'clear'];
-const size = ['s', 'm', 'l'];
+const { views, sizes } = getConfigVariations(config);
 const borderVariant = ['rows', 'header', 'all'];
 
 const meta: Meta<StoryTableProps> = {
@@ -23,11 +24,11 @@ const meta: Meta<StoryTableProps> = {
     argTypes: {
         view: {
             control: 'select',
-            options: view,
+            options: views,
         },
         size: {
             control: 'select',
-            options: size,
+            options: sizes,
         },
         borderVariant: {
             control: 'select',
@@ -514,8 +515,8 @@ const StoryComplex = (args: StoryTableProps) => {
                 <Button text="Очистить выбранные" view="warning" size="xs" onClick={clearSelected} />
                 <Button text="Убрать сортировку" view="warning" size="xs" onClick={clearSorted} />
                 <Button text="Очистить фильтры" view="warning" size="xs" onClick={clearFiltered} />
-                <Button text="Очистить все" view="critical" size="xs" onClick={clearAll} />
-                <Button text="Добавить строку" view="success" size="xs" onClick={addRow} />
+                <Button text="Очистить все" view="negative" size="xs" onClick={clearAll} />
+                <Button text="Добавить строку" view="positive" size="xs" onClick={addRow} />
             </ButtonGroup>
 
             <br />

package/styled-components/es/examples/typography/components/Body/Body.config.js

@@ -6,11 +6,11 @@ export var config = {
   },
   variations: {
     size: {
-      l: /*#__PURE__*/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-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-medium-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontWeightMedium, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight),
-      m: /*#__PURE__*/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-font-weight);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-medium-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontWeightMedium, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight),
-      s: /*#__PURE__*/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-font-weight);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-medium-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontWeightMedium, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight),
-      xs: /*#__PURE__*/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-font-weight);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-medium-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontWeightMedium, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight),
-      xxs: /*#__PURE__*/css(["", ":var(--plasma-typo-body-xxs-font-family);", ":var(--plasma-typo-body-xxs-font-size);", ":var(--plasma-typo-body-xxs-font-style);", ":var(--plasma-typo-body-xxs-font-weight);", ":var(--plasma-typo-body-xxs-bold-font-weight);", ":var(--plasma-typo-body-xxs-medium-font-weight);", ":var(--plasma-typo-body-xxs-letter-spacing);", ":var(--plasma-typo-body-xxs-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontWeightMedium, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight)
+      l: /*#__PURE__*/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-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight),
+      m: /*#__PURE__*/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-font-weight);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight),
+      s: /*#__PURE__*/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-font-weight);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight),
+      xs: /*#__PURE__*/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-font-weight);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight),
+      xxs: /*#__PURE__*/css(["", ":var(--plasma-typo-body-xxs-font-family);", ":var(--plasma-typo-body-xxs-font-size);", ":var(--plasma-typo-body-xxs-font-style);", ":var(--plasma-typo-body-xxs-font-weight);", ":var(--plasma-typo-body-xxs-bold-font-weight);", ":var(--plasma-typo-body-xxs-letter-spacing);", ":var(--plasma-typo-body-xxs-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight)
     }
   }
 };

package/styled-components/es/examples/typography/components/Body/Body.stories.tsx

@@ -9,7 +9,7 @@ import { Body } from './Body';
 import { config } from './Body.config';
 
 const meta: Meta<typeof Body> = {
-    title: 'typography/Body',
+    title: 'Data Display/Typography/Body',
     decorators: [WithTheme],
     component: Body,
     argTypes: {
@@ -19,27 +19,11 @@ const meta: Meta<typeof Body> = {
                 type: 'color',
             },
         },
-        as: {
-            control: 'text',
-        },
-        bold: {
-            control: {
-                type: 'boolean',
-            },
-            if: { arg: 'medium', truthy: false },
-        },
-        medium: {
-            control: {
-                type: 'boolean',
-            },
-            if: { arg: 'bold', truthy: false },
-        },
     },
     args: {
         noWrap: false,
         breakWord: true,
         bold: false,
-        medium: false,
     },
 };
 

package/styled-components/es/examples/typography/components/Dspl/Dspl.config.js

@@ -6,9 +6,9 @@ export var config = {
   },
   variations: {
     size: {
-      l: /*#__PURE__*/css(["", ":var(--plasma-typo-dspl-l-font-family);", ":var(--plasma-typo-dspl-l-font-size);", ":var(--plasma-typo-dspl-l-font-style);", ":var(--plasma-typo-dspl-l-font-weight);", ":var(--plasma-typo-dspl-l-bold-font-weight);", ":var(--plasma-typo-dspl-l-medium-font-weight);", ":var(--plasma-typo-dspl-l-letter-spacing);", ":var(--plasma-typo-dspl-l-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontWeightMedium, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight),
-      m: /*#__PURE__*/css(["", ":var(--plasma-typo-dspl-m-font-family);", ":var(--plasma-typo-dspl-m-font-size);", ":var(--plasma-typo-dspl-m-font-style);", ":var(--plasma-typo-dspl-m-font-weight);", ":var(--plasma-typo-dspl-m-bold-font-weight);", ":var(--plasma-typo-dspl-m-medium-font-weight);", ":var(--plasma-typo-dspl-m-letter-spacing);", ":var(--plasma-typo-dspl-m-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontWeightMedium, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight),
-      s: /*#__PURE__*/css(["", ":var(--plasma-typo-dspl-s-font-family);", ":var(--plasma-typo-dspl-s-font-size);", ":var(--plasma-typo-dspl-s-font-style);", ":var(--plasma-typo-dspl-s-font-weight);", ":var(--plasma-typo-dspl-s-bold-font-weight);", ":var(--plasma-typo-dspl-s-medium-font-weight);", ":var(--plasma-typo-dspl-s-letter-spacing);", ":var(--plasma-typo-dspl-s-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontWeightMedium, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight)
+      l: /*#__PURE__*/css(["", ":var(--plasma-typo-dspl-l-font-family);", ":var(--plasma-typo-dspl-l-font-size);", ":var(--plasma-typo-dspl-l-font-style);", ":var(--plasma-typo-dspl-l-font-weight);", ":var(--plasma-typo-dspl-l-bold-font-weight);", ":var(--plasma-typo-dspl-l-letter-spacing);", ":var(--plasma-typo-dspl-l-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight),
+      m: /*#__PURE__*/css(["", ":var(--plasma-typo-dspl-m-font-family);", ":var(--plasma-typo-dspl-m-font-size);", ":var(--plasma-typo-dspl-m-font-style);", ":var(--plasma-typo-dspl-m-font-weight);", ":var(--plasma-typo-dspl-m-bold-font-weight);", ":var(--plasma-typo-dspl-m-letter-spacing);", ":var(--plasma-typo-dspl-m-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight),
+      s: /*#__PURE__*/css(["", ":var(--plasma-typo-dspl-s-font-family);", ":var(--plasma-typo-dspl-s-font-size);", ":var(--plasma-typo-dspl-s-font-style);", ":var(--plasma-typo-dspl-s-font-weight);", ":var(--plasma-typo-dspl-s-bold-font-weight);", ":var(--plasma-typo-dspl-s-letter-spacing);", ":var(--plasma-typo-dspl-s-line-height);"], tokens.typoFontFamily, tokens.typoFontSize, tokens.typoFontStyle, tokens.typoFontWeight, tokens.typoFontWeightBold, tokens.typoFontLetterSpacing, tokens.typoFontLineHeight)
     }
   }
 };