@salutejs/plasma-new-hope 0.321.0-canary.1877.14266570620.0 → 0.321.0-canary.1877.14334483082.0

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

@@ -17,9 +17,9 @@ var config = exports.config = {
       clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":transparent;"], _Table.tableTokens.borderColor)
     },
     size: {
-      l: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.125rem;", ":3.125rem;", ":0.375rem 1rem;", ":0.375rem 1rem;", ":0.125rem;", ":transparent;", ":1.25rem;", ":0.375rem;", ":0.5rem;", ":3rem;", ":100%;", ":0.25rem;", ":0.875rem;", ":0 0.75rem;", ":var(--surface-transparent-tertiary);", ":0.75rem 0;", ":0.375rem 1rem;", ":2.5rem;", ":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);", ":0.125rem;", ":0.875rem;", ":1.5rem;", ":0.75rem 0.875rem;", ":0.75rem;", ":0 0.375rem 0 0;", ":1.5rem;", ":0;", ":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);", ":1.25rem;", ":0.375rem;", ":0.5rem 1rem;", ":0.5rem;", ":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);"], _Table.tableTokens.fontFamily, _Table.tableTokens.fontSize, _Table.tableTokens.fontStyle, _Table.tableTokens.fontWeight, _Table.tableTokens.letterSpacing, _Table.tableTokens.lineHeight, _Table.tableTokens.headerRowHeight, _Table.tableTokens.rowHeight, _Table.tableTokens.cellPadding, _Table.tableTokens.checkboxCellPadding, _Table.tableTokens.checkboxTriggerBorderWidth, _Table.tableTokens.checkboxTriggerBorderCheckedColor, _Table.tableTokens.checkboxTriggerSize, _Table.tableTokens.checkboxTriggerBorderRadius, _Table.tableTokens.editableCellIconGap, _Table.tableTokens.editableCellIconButtonWidth, _Table.tableTokens.editableCellIconButtonHeight, _Table.tableTokens.editableCellPadding, _Table.tableTokens.editableCellInputBorderRadius, _Table.tableTokens.editableCellInputPadding, _Table.tableTokens.editableCellInputBackground, _Table.tableTokens.filterCheckboxPadding, _Table.tableTokens.filterDividerMargin, _Table.tableTokens.buttonHeight, _Table.tableTokens.buttonFontFamily, _Table.tableTokens.buttonFontSize, _Table.tableTokens.buttonFontStyle, _Table.tableTokens.buttonFontWeight, _Table.tableTokens.buttonLetterSpacing, _Table.tableTokens.buttonLineHeight, _Table.tableTokens.selectPadding, _Table.tableTokens.selectBorderRadius, _Table.tableTokens.selectItemHeight, _Table.tableTokens.selectItemPadding, _Table.tableTokens.selectItemBorderRadius, _Table.tableTokens.selectItemIconMargin, _Table.tableTokens.selectItemIconSize, _Table.tableTokens.selectCellPadding, _Table.tableTokens.selectCellTitleFontFamily, _Table.tableTokens.selectCellTitleFontSize, _Table.tableTokens.selectCellTitleFontStyle, _Table.tableTokens.selectCellTitleFontWeight, _Table.tableTokens.selectCellTitleLetterSpacing, _Table.tableTokens.selectCellTitleLineHeight, _Table.tableTokens.selectCheckboxTriggerSize, _Table.tableTokens.selectCheckboxTriggerBorderRadius, _Table.tableTokens.selectControlPanelPadding, _Table.tableTokens.selectControlPanelGap, _Table.tableTokens.linkButtonFontFamily, _Table.tableTokens.linkButtonFontSize, _Table.tableTokens.linkButtonFontStyle, _Table.tableTokens.linkButtonFontWeight, _Table.tableTokens.linkButtonLetterSpacing, _Table.tableTokens.linkButtonLineHeight),
-      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-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":2.75rem;", ":2.75rem;", ":0.25rem 0.875rem;", ":0.25rem 0.75rem;", ":0.125rem;", ":transparent;", ":1.25rem;", ":0.375rem;", ":0.375rem;", ":2.5rem;", ":100%;", ":0.25rem;", ":0.625rem;", ":0 0.625rem;", ":var(--surface-transparent-tertiary);", ":0.5rem 0;", ":0.375rem 0.875rem;", ":2rem;", ":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);", ":0.125rem;", ":0.75rem;", ":1.5rem;", ":0.5rem 0.625rem;", ":0.625rem;", ":0 0.375rem 0 0;", ":1.5rem;", ":0;", ":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);", ":1.25rem;", ":0.375rem;", ":0.25rem 0.875rem;", ":0.625rem;", ":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);"], _Table.tableTokens.fontFamily, _Table.tableTokens.fontSize, _Table.tableTokens.fontStyle, _Table.tableTokens.fontWeight, _Table.tableTokens.letterSpacing, _Table.tableTokens.lineHeight, _Table.tableTokens.headerRowHeight, _Table.tableTokens.rowHeight, _Table.tableTokens.cellPadding, _Table.tableTokens.checkboxCellPadding, _Table.tableTokens.checkboxTriggerBorderWidth, _Table.tableTokens.checkboxTriggerBorderCheckedColor, _Table.tableTokens.checkboxTriggerSize, _Table.tableTokens.checkboxTriggerBorderRadius, _Table.tableTokens.editableCellIconGap, _Table.tableTokens.editableCellIconButtonWidth, _Table.tableTokens.editableCellIconButtonHeight, _Table.tableTokens.editableCellPadding, _Table.tableTokens.editableCellInputBorderRadius, _Table.tableTokens.editableCellInputPadding, _Table.tableTokens.editableCellInputBackground, _Table.tableTokens.filterCheckboxPadding, _Table.tableTokens.filterDividerMargin, _Table.tableTokens.buttonHeight, _Table.tableTokens.buttonFontFamily, _Table.tableTokens.buttonFontSize, _Table.tableTokens.buttonFontStyle, _Table.tableTokens.buttonFontWeight, _Table.tableTokens.buttonLetterSpacing, _Table.tableTokens.buttonLineHeight, _Table.tableTokens.selectPadding, _Table.tableTokens.selectBorderRadius, _Table.tableTokens.selectItemHeight, _Table.tableTokens.selectItemPadding, _Table.tableTokens.selectItemBorderRadius, _Table.tableTokens.selectItemIconMargin, _Table.tableTokens.selectItemIconSize, _Table.tableTokens.selectCellPadding, _Table.tableTokens.selectCellTitleFontFamily, _Table.tableTokens.selectCellTitleFontSize, _Table.tableTokens.selectCellTitleFontStyle, _Table.tableTokens.selectCellTitleFontWeight, _Table.tableTokens.selectCellTitleLetterSpacing, _Table.tableTokens.selectCellTitleLineHeight, _Table.tableTokens.selectCheckboxTriggerSize, _Table.tableTokens.selectCheckboxTriggerBorderRadius, _Table.tableTokens.selectControlPanelPadding, _Table.tableTokens.selectControlPanelGap, _Table.tableTokens.linkButtonFontFamily, _Table.tableTokens.linkButtonFontSize, _Table.tableTokens.linkButtonFontStyle, _Table.tableTokens.linkButtonFontWeight, _Table.tableTokens.linkButtonLetterSpacing, _Table.tableTokens.linkButtonLineHeight),
-      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-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":2.125rem;", ":2.125rem;", ":0.125rem 0.625rem;", ":0.125rem;", ":transparent;", ":0.875rem;", ":0.25rem;", ":0.25rem;", ":2rem;", ":100%;", ":0.125rem;", ":0.5rem;", ":0 0.375rem;", ":var(--surface-transparent-tertiary);", ":0.5rem 0;", ":0.25rem 0.625rem;", ":1.5rem;", ":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);", ":0.125rem;", ":0.625rem;", ":1rem;", ":0.5rem;", ":0.5rem;", ":0 0.25rem 0 0;", ":1rem;", ":0;", ":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);", ":0.875rem;", ":0.25rem;", ":0.25rem 0.625rem;", ":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-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], _Table.tableTokens.fontFamily, _Table.tableTokens.fontSize, _Table.tableTokens.fontStyle, _Table.tableTokens.fontWeight, _Table.tableTokens.letterSpacing, _Table.tableTokens.lineHeight, _Table.tableTokens.headerRowHeight, _Table.tableTokens.rowHeight, _Table.tableTokens.checkboxCellPadding, _Table.tableTokens.checkboxTriggerBorderWidth, _Table.tableTokens.checkboxTriggerBorderCheckedColor, _Table.tableTokens.checkboxTriggerSize, _Table.tableTokens.checkboxTriggerBorderRadius, _Table.tableTokens.editableCellIconGap, _Table.tableTokens.editableCellIconButtonWidth, _Table.tableTokens.editableCellIconButtonHeight, _Table.tableTokens.editableCellPadding, _Table.tableTokens.editableCellInputBorderRadius, _Table.tableTokens.editableCellInputPadding, _Table.tableTokens.editableCellInputBackground, _Table.tableTokens.filterCheckboxPadding, _Table.tableTokens.filterDividerMargin, _Table.tableTokens.buttonHeight, _Table.tableTokens.buttonFontFamily, _Table.tableTokens.buttonFontSize, _Table.tableTokens.buttonFontStyle, _Table.tableTokens.buttonFontWeight, _Table.tableTokens.buttonLetterSpacing, _Table.tableTokens.buttonLineHeight, _Table.tableTokens.selectPadding, _Table.tableTokens.selectBorderRadius, _Table.tableTokens.selectItemHeight, _Table.tableTokens.selectItemPadding, _Table.tableTokens.selectItemBorderRadius, _Table.tableTokens.selectItemIconMargin, _Table.tableTokens.selectItemIconSize, _Table.tableTokens.selectCellPadding, _Table.tableTokens.selectCellTitleFontFamily, _Table.tableTokens.selectCellTitleFontSize, _Table.tableTokens.selectCellTitleFontStyle, _Table.tableTokens.selectCellTitleFontWeight, _Table.tableTokens.selectCellTitleLetterSpacing, _Table.tableTokens.selectCellTitleLineHeight, _Table.tableTokens.selectCheckboxTriggerSize, _Table.tableTokens.selectCheckboxTriggerBorderRadius, _Table.tableTokens.selectControlPanelPadding, _Table.tableTokens.selectControlPanelGap, _Table.tableTokens.linkButtonFontFamily, _Table.tableTokens.linkButtonFontSize, _Table.tableTokens.linkButtonFontStyle, _Table.tableTokens.linkButtonFontWeight, _Table.tableTokens.linkButtonLetterSpacing, _Table.tableTokens.linkButtonLineHeight)
+      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-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.125rem;", ":3.125rem;", ":0.375rem 1rem;", ":0.375rem 1rem;", ":0.125rem;", ":transparent;", ":1.25rem;", ":0.375rem;", ":0.5rem;", ":3rem;", ":100%;", ":0.25rem;", ":0.875rem;", ":0 0.75rem;", ":var(--surface-transparent-tertiary);", ":0.75rem 0;", ":0.375rem 1rem;", ":2.5rem;", ":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);", ":0.125rem;", ":0.875rem;", ":1.5rem;", ":0.75rem 0.875rem;", ":0.75rem;", ":0 0.375rem 0 0;", ":1.5rem;", ":0;", ":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);", ":1.25rem;", ":0.375rem;", ":0.125rem;", ":transparent;", ":0.5rem 1rem;", ":0.5rem;", ":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);"], _Table.tableTokens.fontFamily, _Table.tableTokens.fontSize, _Table.tableTokens.fontStyle, _Table.tableTokens.fontWeight, _Table.tableTokens.letterSpacing, _Table.tableTokens.lineHeight, _Table.tableTokens.headerRowHeight, _Table.tableTokens.rowHeight, _Table.tableTokens.cellPadding, _Table.tableTokens.checkboxCellPadding, _Table.tableTokens.checkboxTriggerBorderWidth, _Table.tableTokens.checkboxTriggerBorderCheckedColor, _Table.tableTokens.checkboxTriggerSize, _Table.tableTokens.checkboxTriggerBorderRadius, _Table.tableTokens.editableCellIconGap, _Table.tableTokens.editableCellIconButtonWidth, _Table.tableTokens.editableCellIconButtonHeight, _Table.tableTokens.editableCellPadding, _Table.tableTokens.editableCellInputBorderRadius, _Table.tableTokens.editableCellInputPadding, _Table.tableTokens.editableCellInputBackground, _Table.tableTokens.filterCheckboxPadding, _Table.tableTokens.filterDividerMargin, _Table.tableTokens.buttonHeight, _Table.tableTokens.buttonFontFamily, _Table.tableTokens.buttonFontSize, _Table.tableTokens.buttonFontStyle, _Table.tableTokens.buttonFontWeight, _Table.tableTokens.buttonLetterSpacing, _Table.tableTokens.buttonLineHeight, _Table.tableTokens.selectPadding, _Table.tableTokens.selectBorderRadius, _Table.tableTokens.selectItemHeight, _Table.tableTokens.selectItemPadding, _Table.tableTokens.selectItemBorderRadius, _Table.tableTokens.selectItemIconMargin, _Table.tableTokens.selectItemIconSize, _Table.tableTokens.selectCellPadding, _Table.tableTokens.selectCellTitleFontFamily, _Table.tableTokens.selectCellTitleFontSize, _Table.tableTokens.selectCellTitleFontStyle, _Table.tableTokens.selectCellTitleFontWeight, _Table.tableTokens.selectCellTitleLetterSpacing, _Table.tableTokens.selectCellTitleLineHeight, _Table.tableTokens.selectCheckboxTriggerSize, _Table.tableTokens.selectCheckboxTriggerBorderRadius, _Table.tableTokens.selectCheckboxTriggerBorderWidth, _Table.tableTokens.selectCheckboxTriggerBorderCheckedColor, _Table.tableTokens.selectControlPanelPadding, _Table.tableTokens.selectControlPanelGap, _Table.tableTokens.linkButtonFontFamily, _Table.tableTokens.linkButtonFontSize, _Table.tableTokens.linkButtonFontStyle, _Table.tableTokens.linkButtonFontWeight, _Table.tableTokens.linkButtonLetterSpacing, _Table.tableTokens.linkButtonLineHeight),
+      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-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":2.75rem;", ":2.75rem;", ":0.25rem 0.875rem;", ":0.25rem 0.75rem;", ":0.125rem;", ":transparent;", ":1.25rem;", ":0.375rem;", ":0.375rem;", ":2.5rem;", ":100%;", ":0.25rem;", ":0.625rem;", ":0 0.625rem;", ":var(--surface-transparent-tertiary);", ":0.5rem 0;", ":0.375rem 0.875rem;", ":2rem;", ":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);", ":0.125rem;", ":0.75rem;", ":1.5rem;", ":0.5rem 0.625rem;", ":0.625rem;", ":0 0.375rem 0 0;", ":1.5rem;", ":0;", ":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);", ":1.25rem;", ":0.375rem;", ":0.125rem;", ":transparent;", ":0.25rem 0.875rem;", ":0.625rem;", ":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);"], _Table.tableTokens.fontFamily, _Table.tableTokens.fontSize, _Table.tableTokens.fontStyle, _Table.tableTokens.fontWeight, _Table.tableTokens.letterSpacing, _Table.tableTokens.lineHeight, _Table.tableTokens.headerRowHeight, _Table.tableTokens.rowHeight, _Table.tableTokens.cellPadding, _Table.tableTokens.checkboxCellPadding, _Table.tableTokens.checkboxTriggerBorderWidth, _Table.tableTokens.checkboxTriggerBorderCheckedColor, _Table.tableTokens.checkboxTriggerSize, _Table.tableTokens.checkboxTriggerBorderRadius, _Table.tableTokens.editableCellIconGap, _Table.tableTokens.editableCellIconButtonWidth, _Table.tableTokens.editableCellIconButtonHeight, _Table.tableTokens.editableCellPadding, _Table.tableTokens.editableCellInputBorderRadius, _Table.tableTokens.editableCellInputPadding, _Table.tableTokens.editableCellInputBackground, _Table.tableTokens.filterCheckboxPadding, _Table.tableTokens.filterDividerMargin, _Table.tableTokens.buttonHeight, _Table.tableTokens.buttonFontFamily, _Table.tableTokens.buttonFontSize, _Table.tableTokens.buttonFontStyle, _Table.tableTokens.buttonFontWeight, _Table.tableTokens.buttonLetterSpacing, _Table.tableTokens.buttonLineHeight, _Table.tableTokens.selectPadding, _Table.tableTokens.selectBorderRadius, _Table.tableTokens.selectItemHeight, _Table.tableTokens.selectItemPadding, _Table.tableTokens.selectItemBorderRadius, _Table.tableTokens.selectItemIconMargin, _Table.tableTokens.selectItemIconSize, _Table.tableTokens.selectCellPadding, _Table.tableTokens.selectCellTitleFontFamily, _Table.tableTokens.selectCellTitleFontSize, _Table.tableTokens.selectCellTitleFontStyle, _Table.tableTokens.selectCellTitleFontWeight, _Table.tableTokens.selectCellTitleLetterSpacing, _Table.tableTokens.selectCellTitleLineHeight, _Table.tableTokens.selectCheckboxTriggerSize, _Table.tableTokens.selectCheckboxTriggerBorderRadius, _Table.tableTokens.selectCheckboxTriggerBorderWidth, _Table.tableTokens.selectCheckboxTriggerBorderCheckedColor, _Table.tableTokens.selectControlPanelPadding, _Table.tableTokens.selectControlPanelGap, _Table.tableTokens.linkButtonFontFamily, _Table.tableTokens.linkButtonFontSize, _Table.tableTokens.linkButtonFontStyle, _Table.tableTokens.linkButtonFontWeight, _Table.tableTokens.linkButtonLetterSpacing, _Table.tableTokens.linkButtonLineHeight),
+      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-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":2.125rem;", ":2.125rem;", ":0.125rem 0.5rem;", ":0.125rem 0.625rem;", ":0.125rem;", ":transparent;", ":0.875rem;", ":0.25rem;", ":0.25rem;", ":2rem;", ":100%;", ":0.125rem;", ":0.5rem;", ":0 0.375rem;", ":var(--surface-transparent-tertiary);", ":0.5rem 0;", ":0.25rem 0.625rem;", ":1.5rem;", ":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);", ":0.125rem;", ":0.625rem;", ":1rem;", ":0.5rem;", ":0.5rem;", ":0 0.25rem 0 0;", ":1rem;", ":0;", ":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);", ":0.875rem;", ":0.25rem;", ":0.125rem;", ":transparent;", ":0.25rem 0.625rem;", ":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-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], _Table.tableTokens.fontFamily, _Table.tableTokens.fontSize, _Table.tableTokens.fontStyle, _Table.tableTokens.fontWeight, _Table.tableTokens.letterSpacing, _Table.tableTokens.lineHeight, _Table.tableTokens.headerRowHeight, _Table.tableTokens.rowHeight, _Table.tableTokens.cellPadding, _Table.tableTokens.checkboxCellPadding, _Table.tableTokens.checkboxTriggerBorderWidth, _Table.tableTokens.checkboxTriggerBorderCheckedColor, _Table.tableTokens.checkboxTriggerSize, _Table.tableTokens.checkboxTriggerBorderRadius, _Table.tableTokens.editableCellIconGap, _Table.tableTokens.editableCellIconButtonWidth, _Table.tableTokens.editableCellIconButtonHeight, _Table.tableTokens.editableCellPadding, _Table.tableTokens.editableCellInputBorderRadius, _Table.tableTokens.editableCellInputPadding, _Table.tableTokens.editableCellInputBackground, _Table.tableTokens.filterCheckboxPadding, _Table.tableTokens.filterDividerMargin, _Table.tableTokens.buttonHeight, _Table.tableTokens.buttonFontFamily, _Table.tableTokens.buttonFontSize, _Table.tableTokens.buttonFontStyle, _Table.tableTokens.buttonFontWeight, _Table.tableTokens.buttonLetterSpacing, _Table.tableTokens.buttonLineHeight, _Table.tableTokens.selectPadding, _Table.tableTokens.selectBorderRadius, _Table.tableTokens.selectItemHeight, _Table.tableTokens.selectItemPadding, _Table.tableTokens.selectItemBorderRadius, _Table.tableTokens.selectItemIconMargin, _Table.tableTokens.selectItemIconSize, _Table.tableTokens.selectCellPadding, _Table.tableTokens.selectCellTitleFontFamily, _Table.tableTokens.selectCellTitleFontSize, _Table.tableTokens.selectCellTitleFontStyle, _Table.tableTokens.selectCellTitleFontWeight, _Table.tableTokens.selectCellTitleLetterSpacing, _Table.tableTokens.selectCellTitleLineHeight, _Table.tableTokens.selectCheckboxTriggerSize, _Table.tableTokens.selectCheckboxTriggerBorderRadius, _Table.tableTokens.selectCheckboxTriggerBorderWidth, _Table.tableTokens.selectCheckboxTriggerBorderCheckedColor, _Table.tableTokens.selectControlPanelPadding, _Table.tableTokens.selectControlPanelGap, _Table.tableTokens.linkButtonFontFamily, _Table.tableTokens.linkButtonFontSize, _Table.tableTokens.linkButtonFontStyle, _Table.tableTokens.linkButtonFontWeight, _Table.tableTokens.linkButtonLetterSpacing, _Table.tableTokens.linkButtonLineHeight)
     }
   }
 };

package/styled-components/cjs/utils/createConditionalComponent.js

@@ -19,8 +19,10 @@ function createConditionalComponent(defaultComponent, mappings) {
         var conditions = mapping.conditions,
           component = mapping.component;
         var conditionsArray = Array.isArray(conditions) ? conditions : [conditions];
-        var allConditionsMatch = conditionsArray.every(function (condition) {
-          return props[condition.prop] === condition.value;
+        var allConditionsMatch = conditionsArray.every(function (_ref) {
+          var prop = _ref.prop,
+            value = _ref.value;
+          return props[prop] === value;
         });
         if (allConditionsMatch) {
           var Component = component;

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

@@ -30,7 +30,7 @@ export function App() {
             <Cell
                 contentLeft={ <Avatar size="m" url="https://avatars.githubusercontent.com/u/1813468?v=4" /> }
                 size="m"
-                contentRight={<IconChevronRight color="inheart" size="xs" />}
+                contentRight={<IconChevronRight color="inherit" size="xs" />}
                 title="Title"
                 subtitle="Subtitle"
                 label="Label"
@@ -53,7 +53,7 @@ export function App() {
             <Cell
                 contentLeft={ <Avatar size="m" url="https://avatars.githubusercontent.com/u/1813468?v=4" /> }
                 size="m"
-                contentRight={<IconChevronRight color="inheart" size="xs" />}
+                contentRight={<IconChevronRight color="inherit" size="xs" />}
             >
                 <CellTextbox>
                     <CellTextboxLabel>Label</CellTextboxLabel>

package/styled-components/es/components/Steps/Steps.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 = ["view", "size", "orientation", "contentAlign", "hasLine", "hasContent", "hasLoader", "items", "onChange", "current", "status"];
+var _excluded = ["view", "itemView", "size", "orientation", "contentAlign", "hasLine", "hasContent", "hasLoader", "items", "onChange", "current", "status"];
 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,11 +21,14 @@ import { StepItem } from './ui';
 import { base } from './Steps.styles';
 import { base as sizeCSS } from './variations/_size/base';
 import { base as viewCSS } from './variations/_view/base';
+import { base as itemViewCSS } from './variations/_itemView/base';
 import { getItemStatus } from './utils/getItemStatus';
 export var stepsRoot = function stepsRoot(Root) {
   return /*#__PURE__*/forwardRef(function (props, outerRef) {
     var _props$view = props.view,
       view = _props$view === void 0 ? 'default' : _props$view,
+      _props$itemView = props.itemView,
+      itemView = _props$itemView === void 0 ? 'default' : _props$itemView,
       size = props.size,
       _props$orientation = props.orientation,
       orientation = _props$orientation === void 0 ? 'horizontal' : _props$orientation,
@@ -86,6 +89,7 @@ export var stepsRoot = function stepsRoot(Root) {
     return /*#__PURE__*/React.createElement(Root, _extends({
       size: size,
       view: view,
+      itemView: itemView,
       ref: outerRef,
       className: cls(_defineProperty(_defineProperty(_defineProperty({}, classes.verticalOrientation, orientation === 'vertical'), classes.simple, isSimple), classes.hasIndicator, hasIndicator))
     }, rest), innerItems.map(function (item, index) {
@@ -120,10 +124,12 @@ export var stepsConfig = {
   base: base,
   variations: {
     size: sizeCSS,
-    view: viewCSS
+    view: viewCSS,
+    itemView: itemViewCSS
   },
   defaults: {
     view: 'default',
-    size: 'm'
+    size: 'm',
+    itemView: 'default'
   }
 };

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

@@ -10,7 +10,29 @@ import { PropsTable, Description } from '@site/src/components';
 <Description name="Steps" />
 <PropsTable name="Steps" />
 
-## Вариант использования с управлением текущим элементом из вне
+## Внешнее вид
+
+:::info
+Важно! Значения `ItemView` применяются к шагу только когда его статус — inProgress.
+:::
+
+Внешний вид компонента регулируется 2 свойствами:
+
+#### View
+
+Свойство применяется ко всему компоненту и принимает следующие значения:
+- `default`
+- `accent`
+
+#### ItemView
+
+Свойство применяется к индикатору шага и заголовку, и принимает следующие значения:
+- `default`
+- `negative`
+- `warning`
+- `positive`
+
+## Внешнее управление
 
 ```tsx live
 import React, { useState } from 'react';
@@ -30,9 +52,7 @@ export function App() {
 
     return (
         <section>
-            <Steps items={items}
-                current={current}
-            />
+            <Steps items={items} current={current} />
             <br />
             <Button view="secondary" onClick={onClick}>
                 Next
@@ -42,7 +62,7 @@ export function App() {
 }
 ```
 
-## Вариант более гибкого использования через onChange и status в items
+## Управление через onChange и статус шага
 
 ```tsx live
 import React, { useState } from 'react';
@@ -82,3 +102,45 @@ export function App() {
     );
 }
 ```
+
+
+## Использование свойства ItemView
+
+```tsx live
+import React, { useState } from 'react';
+import { Steps, StepItemProps  } from '@salutejs/{{ package }}';
+
+export function App() {
+    const initialItems = [{
+        indicator: 1,
+        title: 'Title',
+        content: 'Content',
+    }, {
+        indicator: 2,
+        title: 'Title',
+        content: 'Content',
+    }, {
+        indicator: 3,
+        title: 'Title',
+        content: 'Content',
+    }];
+
+    const [items, setItems] = useState(initialItems);
+
+    const onChange = (item: StepItemProps, index: number, prevIndex: number) => {
+        if (prevIndex !== undefined) {
+            items[prevIndex].status = 'completed';
+        }
+
+        items[index].status = 'active';
+
+        setItems([...items]);
+    };
+
+    return (
+        <section>
+            <Steps items={items} itemView="positive" onChange={onChange} />
+        </section>
+    );
+}
+```

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

@@ -63,6 +63,7 @@ export var tokens = {
   activeIndicatorColorHover: '--plasma-step-item-active-indicator-color-hover',
   activeIndicatorBackground: '--plasma-step-item-active-indicator-background',
   completedTitleColor: '--plasma-step-item-completed-title-color',
+  completedTitleColorHover: '--plasma-step-item-completed-title-color-hover',
   completedIndicatorColor: '--plasma-step-item-completed-indicator-color',
   completedIndicatorColorHover: '--plasma-step-item-completed-indicator-color-hover',
   completedIndicatorBackground: '--plasma-step-item-completed-indicator-background',
@@ -72,5 +73,6 @@ export var tokens = {
   inactiveIndicatorBackground: '--plasma-step-item-inactive-indicator-background',
   inactiveIndicatorBackgroundHover: '--plasma-step-item-inactive-indicator-background-hover',
   disabledOpacity: '--plasma-step-item-disabled-opacity',
-  dividerThickness: '--plasma-step-item-divider-thickness'
+  dividerThickness: '--plasma-step-item-divider-thickness',
+  dividerColor: '--plasma-step-item-divider-color'
 };

package/styled-components/es/components/Steps/ui/StepItem/StepItem.styles.js

@@ -32,13 +32,13 @@ export var BulletIndicator = /*#__PURE__*/styled.button.withConfig({
   outlineSize: '0.0625rem',
   outlineRadius: '50%',
   outlineColor: /*#__PURE__*/"var(".concat(tokens.focusColor, ")")
-}), classes.inactive, tokens.inactiveIndicatorColor, tokens.inactiveIndicatorBackground, classes.simple, tokens.inactiveIndicatorBackground);
+}), classes.inactive, tokens.inactiveIndicatorColor, tokens.inactiveIndicatorBackground, classes.simple, tokens.dividerColor);
 export var Bullet = /*#__PURE__*/styled(BulletIndicator).withConfig({
   componentId: "plasma-new-hope__sc-bjma6z-5"
 })(["width:var(", ");height:var(", ");&.", "{width:var(", ");height:var(", ");border:var(", ") var(", ");background:var(", ");}"], tokens.bulletSize, tokens.bulletSize, classes.active, tokens.activeBulletSize, tokens.activeBulletSize, tokens.dividerThickness, tokens.activeIndicatorBorder, tokens.activeIndicatorBackground);
 export var StepItemDivider = /*#__PURE__*/styled.div.withConfig({
   componentId: "plasma-new-hope__sc-bjma6z-6"
-})(["width:100%;height:var(", ");flex:1;background:var(", ");&.", "{background:var(", ");}&.", "{opacity:var(", ");}&.", "{background:transparent;}&.", "{width:var(", ");height:100%;}&.", "{height:", ";min-height:", ";max-height:", ";&.", "{height:auto;max-height:none;}}"], tokens.dividerThickness, tokens.activeIndicatorColor, classes.inactive, tokens.inactiveIndicatorBackground, classes.disabled, tokens.disabledOpacity, classes.transparentDivider, classes.verticalOrientation, tokens.dividerThickness, classes.indentDivider, function (_ref2) {
+})(["flex:1;width:100%;height:var(", ");background:var(", ");&.", "{background:var(", ");}&.", "{opacity:var(", ");}&.", "{background:transparent;}&.", "{width:var(", ");height:100%;}&.", "{height:", ";min-height:", ";max-height:", ";&.", "{height:auto;max-height:none;}}"], tokens.dividerThickness, tokens.dividerColor, classes.inactive, tokens.inactiveIndicatorBackground, classes.disabled, tokens.disabledOpacity, classes.transparentDivider, classes.verticalOrientation, tokens.dividerThickness, classes.indentDivider, function (_ref2) {
   var indentToken = _ref2.indentToken;
   return indentToken || '';
 }, function (_ref3) {
@@ -53,4 +53,4 @@ export var StepItemContentWrapper = /*#__PURE__*/styled.div.withConfig({
 })(["&.", "{", "{padding-top:var(", ");padding-right:0;}", "{padding-top:var(", ");padding-bottom:var(", ");padding-right:0;}}"], classes.verticalOrientation, StepItemTitle, tokens.contentVerticalPadding, StepItemContent, tokens.contentVerticalPadding, tokens.contentVerticalPadding);
 export var StepItemStyled = /*#__PURE__*/styled.div.withConfig({
   componentId: "plasma-new-hope__sc-bjma6z-8"
-})(["position:relative;display:flex;flex-direction:column;align-items:flex-start;flex:1;color:var(", ");&.", "{flex-direction:row;align-items:stretch;", "{width:var(", ");height:100%;}}", "{color:var(", ",", ");}&.", "{", "{cursor:default;}", "{color:var(", ");}}&.", "{color:var(", ");", "{color:var(", ");}}&.", "{flex:0;align-items:center;justify-content:center;flex-direction:row;height:100%;&.", "{min-width:var(", ");min-height:var(", ");}&:not(.", "){width:var(", ");min-height:var(", ");}&.", ",&:not(.", "){&:before,&:after{content:'';display:block;width:calc((var(", ") - var(", ")) / 2);height:var(", ");background:var(", ");}&:not(.", "){&:before,&:after{width:calc((var(", ") - var(", ")) / 2);}}&.", "{flex-direction:column;&:before,&:after{width:var(", ");height:calc((var(", ") - var(", ")) / 2);margin:0 auto;align-self:auto;}&:not(.", "){&:before,&:after{height:calc((var(", ") - var(", ")) / 2);}}&:after{margin:0 auto;}}&.isFirst{&:before{background:transparent;}}&.isLast{&:after{background:transparent;}}}&.", "{&:after,&:before{background:var(", ");}}&.isPrevInactive{&:before{background:var(", ");}}&.isNextInactive{&:after{background:var(", ");}}&.", "{&:before,&:after{background:var(", ");opacity:1;}}&.", "{&:before,&:after{background:transparent;}}}&:not(.", "):not(.", "){&.isNextActive{", "{width:calc(100% - (var(", ") - var(", ")) / 2);}}&.", "{", "{margin-left:calc((var(", ") - var(", ")) / -2);width:calc(100% + (var(", ") - var(", ")) / 2);}}}&.", "{&:not(.", "){", "{cursor:pointer;color:var(", ");}", ",", "{color:var(", ");background:var(", ");}}&.", "{", "{color:var(", ");}", ",", "{color:var(", ");background:var(", ");}}", "{cursor:pointer;}}&.", "{align-items:center;", "{display:flex;flex-direction:column;align-items:center;padding-left:calc(var(", ") / 2);padding-right:calc(var(", ") / 2);", "{width:100%;}", ",", "{padding-right:0;text-align:center;}}}&.", "{cursor:default;opacity:var(", ");}"], tokens.activeIndicatorColor, classes.verticalOrientation, StepItemDivider, tokens.dividerThickness, StepItemTitle, tokens.completedTitleColor, tokens.activeTitleColor, classes.active, BulletIndicator, StepItemTitle, tokens.activeTitleColor, classes.inactive, tokens.inactiveIndicatorColor, StepItemTitle, tokens.inactiveTitleColor, classes.simple, classes.hasIndicator, tokens.activeIndicatorSize, tokens.activeIndicatorSize, classes.hasIndicator, tokens.activeBulletSize, tokens.activeBulletSize, classes.inactive, classes.active, tokens.activeIndicatorSize, tokens.indicatorSize, tokens.dividerThickness, tokens.activeIndicatorColor, classes.hasIndicator, tokens.activeBulletSize, tokens.bulletSize, classes.verticalOrientation, tokens.dividerThickness, tokens.activeIndicatorSize, tokens.indicatorSize, classes.hasIndicator, tokens.activeBulletSize, tokens.bulletSize, classes.inactive, tokens.inactiveIndicatorBackground, tokens.inactiveIndicatorBackground, tokens.inactiveIndicatorBackground, classes.disabled, tokens.inactiveIndicatorBackground, classes.transparentDivider, classes.simple, classes.verticalOrientation, BulletIndicatorWrapper, tokens.activeIndicatorSize, tokens.indicatorSize, classes.active, BulletIndicatorWrapper, tokens.activeIndicatorSize, tokens.indicatorSize, tokens.activeIndicatorSize, tokens.indicatorSize, classes.hovered, classes.active, StepItemTitle, tokens.activeTitleColorHover, BulletIndicator, Bullet, tokens.completedIndicatorColorHover, tokens.completedIndicatorBackgroundHover, classes.inactive, StepItemTitle, tokens.inactiveTitleColorHover, BulletIndicator, Bullet, tokens.inactiveIndicatorColorHover, tokens.inactiveIndicatorBackgroundHover, BulletIndicatorWrapper, classes.centered, StepItemContentWrapper, tokens.contentSidePadding, tokens.contentSidePadding, StepItemTitle, StepItemTitle, StepItemContent, classes.disabled, tokens.disabledOpacity);
+})(["position:relative;display:flex;flex-direction:column;align-items:flex-start;flex:1;color:var(", ");&.", "{flex-direction:row;align-items:stretch;", "{width:var(", ");height:100%;}}", "{color:var(", ",", ");}&.", "{", "{cursor:default;}", "{color:var(", ");}}&.", "{color:var(", ");", "{color:var(", ");}}&.", "{flex:0;align-items:center;justify-content:center;flex-direction:row;height:100%;&.", "{min-width:var(", ");min-height:var(", ");}&:not(.", "){width:var(", ");min-height:var(", ");}&.", ",&:not(.", "){&:before,&:after{content:'';display:block;width:calc((var(", ") - var(", ")) / 2);height:var(", ");background:var(", ");}&:not(.", "){&:before,&:after{width:calc((var(", ") - var(", ")) / 2);}}&.", "{flex-direction:column;&:before,&:after{width:var(", ");height:calc((var(", ") - var(", ")) / 2);margin:0 auto;align-self:auto;}&:not(.", "){&:before,&:after{height:calc((var(", ") - var(", ")) / 2);}}&:after{margin:0 auto;}}&.isFirst{&:before{background:transparent;}}&.isLast{&:after{background:transparent;}}}&.", "{&:after,&:before{background:var(", ");}}&.isPrevInactive{&:before{background:var(", ");}}&.isNextInactive{&:after{background:var(", ");}}&.", "{&:before,&:after{background:var(", ");opacity:1;}}&.", "{&:before,&:after{background:transparent;}}}&:not(.", "):not(.", "){&.isNextActive{", "{width:calc(100% - (var(", ") - var(", ")) / 2);}}&.", "{", "{margin-left:calc((var(", ") - var(", ")) / -2);width:calc(100% + (var(", ") - var(", ")) / 2);}}}&.", "{&:not(.", "){", "{cursor:pointer;color:var(", ");}", ",", "{color:var(", ");background:var(", ");}}&.", "{", "{color:var(", ");}", ",", "{color:var(", ");background:var(", ");}}", "{cursor:pointer;}}&.", "{align-items:center;", "{display:flex;flex-direction:column;align-items:center;padding-left:calc(var(", ") / 2);padding-right:calc(var(", ") / 2);", "{width:100%;}", ",", "{padding-right:0;text-align:center;}}}&.", "{cursor:default;opacity:var(", ");}"], tokens.activeIndicatorColor, classes.verticalOrientation, StepItemDivider, tokens.dividerThickness, StepItemTitle, tokens.completedTitleColor, tokens.activeTitleColor, classes.active, BulletIndicator, StepItemTitle, tokens.activeTitleColor, classes.inactive, tokens.inactiveIndicatorColor, StepItemTitle, tokens.inactiveTitleColor, classes.simple, classes.hasIndicator, tokens.activeIndicatorSize, tokens.activeIndicatorSize, classes.hasIndicator, tokens.activeBulletSize, tokens.activeBulletSize, classes.inactive, classes.active, tokens.activeIndicatorSize, tokens.indicatorSize, tokens.dividerThickness, tokens.dividerColor, classes.hasIndicator, tokens.activeBulletSize, tokens.bulletSize, classes.verticalOrientation, tokens.dividerThickness, tokens.activeIndicatorSize, tokens.indicatorSize, classes.hasIndicator, tokens.activeBulletSize, tokens.bulletSize, classes.inactive, tokens.inactiveIndicatorBackground, tokens.inactiveIndicatorBackground, tokens.inactiveIndicatorBackground, classes.disabled, tokens.inactiveIndicatorBackground, classes.transparentDivider, classes.simple, classes.verticalOrientation, BulletIndicatorWrapper, tokens.activeIndicatorSize, tokens.indicatorSize, classes.active, BulletIndicatorWrapper, tokens.activeIndicatorSize, tokens.indicatorSize, tokens.activeIndicatorSize, tokens.indicatorSize, classes.hovered, classes.active, StepItemTitle, tokens.completedTitleColorHover, BulletIndicator, Bullet, tokens.completedIndicatorColorHover, tokens.completedIndicatorBackgroundHover, classes.inactive, StepItemTitle, tokens.inactiveTitleColorHover, BulletIndicator, Bullet, tokens.inactiveIndicatorColorHover, tokens.inactiveIndicatorBackgroundHover, BulletIndicatorWrapper, classes.centered, StepItemContentWrapper, tokens.contentSidePadding, tokens.contentSidePadding, StepItemTitle, StepItemTitle, StepItemContent, classes.disabled, tokens.disabledOpacity);

package/styled-components/es/components/Steps/variations/_itemView/base.js

@@ -0,0 +1,2 @@
+import { css } from 'styled-components';
+export var base = /*#__PURE__*/css([""]);

package/styled-components/es/components/Steps/variations/_itemView/tokens.json

@@ -0,0 +1 @@
+[]

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

@@ -55,6 +55,8 @@ export var tableTokens = {
   selectCellTitleLineHeight: '--plasma-table-select-cell-title-line-height',
   selectCheckboxTriggerSize: '--plasma-table-select-checkbox-trigger-size',
   selectCheckboxTriggerBorderRadius: '--plasma-table-select-checkbox-trigger-border-radius',
+  selectCheckboxTriggerBorderWidth: '--plasma-table-select-checkbox-trigger-border-width',
+  selectCheckboxTriggerBorderCheckedColor: '--plasma-table-select-checkbox-trigger-border-color-checked',
   selectControlPanelPadding: '--plasma-table-select-control-panel-padding',
   selectControlPanelGap: '--plasma-table-select-control-panel-gap',
   linkButtonFontFamily: '--plasma-table-link-button-font-family',

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

@@ -7,7 +7,7 @@ import { StyledCheckbox as Checkbox, StyledDivider as Divider } from '../../../.
 var SelectBase = /*#__PURE__*/component(selectConfig);
 export var Select = /*#__PURE__*/styled(SelectBase).withConfig({
   componentId: "plasma-new-hope__sc-qeyuhn-0"
-})(["", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(--text-accent);", ":var(--on-dark-text-primary);", ":var(--text-secondary);"], selectTokens.padding, tokens.selectPadding, selectTokens.borderRadius, tokens.selectBorderRadius, selectTokens.itemHeight, tokens.selectItemHeight, selectTokens.itemPadding, tokens.selectItemPadding, selectTokens.itemBorderRadius, tokens.selectItemBorderRadius, selectTokens.itemIconMargin, tokens.selectItemIconMargin, selectTokens.itemIconSize, tokens.selectItemIconSize, selectTokens.cellPadding, tokens.selectCellPadding, selectTokens.cellTitleFontFamily, tokens.selectCellTitleFontFamily, selectTokens.cellTitleFontSize, tokens.selectCellTitleFontSize, selectTokens.cellTitleFontStyle, tokens.selectCellTitleFontStyle, selectTokens.cellTitleFontWeight, tokens.selectCellTitleFontWeight, selectTokens.cellTitleLetterSpacing, tokens.selectCellTitleLetterSpacing, selectTokens.cellTitleLineHeight, tokens.selectCellTitleLineHeight, selectTokens.checkboxTriggerSize, tokens.selectCheckboxTriggerSize, selectTokens.checkboxTriggerBorderRadius, tokens.selectCheckboxTriggerBorderRadius, selectTokens.checkboxFillColor, selectTokens.checkboxIconColor, selectTokens.checkboxTriggerBorderColor);
+})(["", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(--text-accent);", ":var(--on-dark-text-primary);", ":var(--text-secondary);"], selectTokens.padding, tokens.selectPadding, selectTokens.borderRadius, tokens.selectBorderRadius, selectTokens.itemHeight, tokens.selectItemHeight, selectTokens.itemPadding, tokens.selectItemPadding, selectTokens.itemBorderRadius, tokens.selectItemBorderRadius, selectTokens.itemIconMargin, tokens.selectItemIconMargin, selectTokens.itemIconSize, tokens.selectItemIconSize, selectTokens.cellPadding, tokens.selectCellPadding, selectTokens.cellTitleFontFamily, tokens.selectCellTitleFontFamily, selectTokens.cellTitleFontSize, tokens.selectCellTitleFontSize, selectTokens.cellTitleFontStyle, tokens.selectCellTitleFontStyle, selectTokens.cellTitleFontWeight, tokens.selectCellTitleFontWeight, selectTokens.cellTitleLetterSpacing, tokens.selectCellTitleLetterSpacing, selectTokens.cellTitleLineHeight, tokens.selectCellTitleLineHeight, selectTokens.checkboxTriggerSize, tokens.selectCheckboxTriggerSize, selectTokens.checkboxTriggerBorderRadius, tokens.selectCheckboxTriggerBorderRadius, selectTokens.checkboxTriggerBorderWidth, tokens.selectCheckboxTriggerBorderWidth, selectTokens.checkboxTriggerBorderCheckedColor, tokens.selectCheckboxTriggerBorderCheckedColor, selectTokens.checkboxFillColor, selectTokens.checkboxIconColor, selectTokens.checkboxTriggerBorderColor);
 var mergedIndicatorConfig = /*#__PURE__*/mergeConfig(indicatorConfig);
 var Indicator = /*#__PURE__*/component(mergedIndicatorConfig);
 export var IconFilterWrapper = /*#__PURE__*/styled.div.withConfig({

package/styled-components/es/examples/plasma_b2c/components/Steps/Steps.config.js

@@ -1,13 +1,23 @@
 import { css } from 'styled-components';
 import { stepsTokens as tokens } from '../../../../components/Steps';
+var baseItemView = /*#__PURE__*/"\n    ".concat(tokens.activeTitleColor, ": var(--text-primary);\n    ").concat(tokens.activeTitleColorHover, ": var(--text-primary-hover);\n    ").concat(tokens.activeIndicatorBorder, ": solid var(--surface-solid-default);\n    ").concat(tokens.activeIndicatorColor, ": var(--text-primary);\n    ").concat(tokens.activeIndicatorBackground, ": var(--surface-clear);\n    \n    ").concat(tokens.completedIndicatorColor, ": var(--inverse-text-primary);\n    ").concat(tokens.completedIndicatorColorHover, ": var(--inverse-text-primary);\n    ").concat(tokens.completedIndicatorBackground, ": var(--surface-solid-default);\n    ").concat(tokens.completedIndicatorBackgroundHover, ": var(--surface-solid-default-hover);\n    ").concat(tokens.completedTitleColor, ": var(--text-primary);\n    ").concat(tokens.completedTitleColorHover, ": var(--text-primary-hover);\n\n    ").concat(tokens.inactiveTitleColor, ": var(--text-secondary);\n    ").concat(tokens.inactiveTitleColorHover, ": var(--text-secondary-hover);\n    ").concat(tokens.inactiveIndicatorColor, ": var(--text-secondary);\n    ").concat(tokens.inactiveIndicatorColorHover, ": var(--text-secondary);\n    ").concat(tokens.inactiveIndicatorBackground, ": var(--surface-transparent-secondary);\n    ").concat(tokens.inactiveIndicatorBackgroundHover, ": var(--surface-transparent-secondary-hover);\n\n    ").concat(tokens.contentColor, ": var(--text-secondary);\n    ").concat(tokens.focusColor, ": var(--surface-accent);\n\n    ").concat(tokens.disabledOpacity, ": 0.4;\n");
+var accentConfig = /*#__PURE__*/"\n    ".concat(tokens.completedTitleColor, ": var(--text-primary);\n    ").concat(tokens.completedTitleColorHover, ": var(--text-primary-hover);\n    \n    ").concat(tokens.completedIndicatorBackground, ": var(--surface-accent);\n    ").concat(tokens.completedIndicatorBackgroundHover, ": var(--surface-accent-hover);\n    \n    // \u0426\u0432\u0435\u0442 \u043A\u043E\u043D\u0442\u0435\u043D\u0442\u0430 \u0432\u043D\u0443\u0442\u0440\u0438 \u044D\u043B\u0435\u043C\u0435\u043D\u0442\u0430 Step\n    ").concat(tokens.completedIndicatorColor, ": var(--on-dark-text-primary);\n    ").concat(tokens.completedIndicatorColorHover, ": var(--on-dark-text-primary-hover);\n");
 export var config = {
   defaults: {
     size: 'm',
-    view: 'default'
+    view: 'default',
+    itemView: 'default'
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-primary-hover);", ":solid var(--surface-solid-default);", ":var(--text-primary);", ":var(--surface-clear);", ":var(--inverse-text-primary);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--surface-solid-default-hover);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-secondary);", ":var(--surface-accent);", ":0.4;"], tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor, tokens.activeIndicatorBackground, tokens.completedIndicatorColor, tokens.completedIndicatorColorHover, tokens.completedIndicatorBackground, tokens.completedIndicatorBackgroundHover, tokens.inactiveTitleColor, tokens.inactiveTitleColorHover, tokens.inactiveIndicatorColor, tokens.inactiveIndicatorColorHover, tokens.inactiveIndicatorBackground, tokens.inactiveIndicatorBackgroundHover, tokens.contentColor, tokens.focusColor, tokens.disabledOpacity)
+      "default": /*#__PURE__*/css(["", ":var(--surface-solid-default);"], tokens.dividerColor),
+      accent: /*#__PURE__*/css(["", ":var(--surface-accent);"], tokens.dividerColor)
+    },
+    itemView: {
+      "default": /*#__PURE__*/css(["", ";"], baseItemView),
+      negative: /*#__PURE__*/css(["", ";", ":var(--surface-negative);", ":var(--surface-negative-hover);", ":solid var(--surface-negative);", ":var(--text-negative);"], baseItemView, tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor),
+      warning: /*#__PURE__*/css(["", ";", ":var(--surface-warning);", ":var(--surface-warning-hover);", ":solid var(--surface-warning);", ":var(--text-warning);"], baseItemView, tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor),
+      positive: /*#__PURE__*/css(["", ";", ":var(--surface-positive);", ":var(--surface-positive-hover);", ":solid var(--surface-positive);", ":var(--text-positive);"], baseItemView, tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor)
     },
     size: {
       l: /*#__PURE__*/css(["", ":1.5rem;", ":2.25rem;", ":0.5rem;", ":1rem;", ":0.75rem;", ":0.375rem;", ":2rem;", ":1.0625rem;", ":0.75rem;", ":1rem;", ":0.625rem;", ":1.5rem;", ":1.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-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-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);", ":0.125rem;"], tokens.indicatorSize, tokens.activeIndicatorSize, tokens.bulletSize, tokens.activeBulletSize, tokens.titlePaddingTop, tokens.contentPaddingTop, tokens.contentSidePadding, tokens.contentVerticalPadding, tokens.verticalContentPaddingLeft, tokens.smallIndicatorIndentHeight, tokens.largeIndicatorIndentHeight, tokens.smallBulletIndentHeight, tokens.largeBulletIndentHeight, tokens.indicatorFontFamily, tokens.indicatorFontSize, tokens.indicatorFontStyle, tokens.indicatorFontWeight, tokens.indicatorLetterSpacing, tokens.indicatorLineHeight, tokens.activeIndicatorFontFamily, tokens.activeIndicatorFontSize, tokens.activeIndicatorFontStyle, tokens.activeIndicatorFontWeight, tokens.activeIndicatorLetterSpacing, tokens.activeIndicatorLineHeight, tokens.titleFontFamily, tokens.titleFontSize, tokens.titleFontStyle, tokens.titleFontWeight, tokens.titleLetterSpacing, tokens.titleLineHeight, tokens.contentFontFamily, tokens.contentFontSize, tokens.contentFontStyle, tokens.contentFontWeight, tokens.contentLetterSpacing, tokens.contentLineHeight, tokens.dividerThickness),
@@ -15,5 +25,22 @@ export var config = {
       s: /*#__PURE__*/css(["", ":1.5rem;", ":1.5rem;", ":0.5rem;", ":1rem;", ":0.5rem;", ":0.375rem;", ":1.5rem;", ":0.6875rem;", ":0.75rem;", ":0.5rem;", ":0.5rem;", ":1rem;", ":0.75rem;", ":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-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);", ":0.125rem;"], tokens.indicatorSize, tokens.activeIndicatorSize, tokens.bulletSize, tokens.activeBulletSize, tokens.titlePaddingTop, tokens.contentPaddingTop, tokens.contentSidePadding, tokens.contentVerticalPadding, tokens.verticalContentPaddingLeft, tokens.smallIndicatorIndentHeight, tokens.largeIndicatorIndentHeight, tokens.smallBulletIndentHeight, tokens.largeBulletIndentHeight, tokens.indicatorFontFamily, tokens.indicatorFontSize, tokens.indicatorFontStyle, tokens.indicatorFontWeight, tokens.indicatorLetterSpacing, tokens.indicatorLineHeight, tokens.activeIndicatorFontFamily, tokens.activeIndicatorFontSize, tokens.activeIndicatorFontStyle, tokens.activeIndicatorFontWeight, tokens.activeIndicatorLetterSpacing, tokens.activeIndicatorLineHeight, tokens.titleFontFamily, tokens.titleFontSize, tokens.titleFontStyle, tokens.titleFontWeight, tokens.titleLetterSpacing, tokens.titleLineHeight, tokens.contentFontFamily, tokens.contentFontSize, tokens.contentFontStyle, tokens.contentFontWeight, tokens.contentLetterSpacing, tokens.contentLineHeight, tokens.dividerThickness),
       xs: /*#__PURE__*/css(["", ":1.5rem;", ":1.5rem;", ":0.5rem;", ":1rem;", ":0.5rem;", ":0.25rem;", ":1.5rem;", ":0.5625rem;", ":0.75rem;", ":0.25rem;", ":0.25rem;", ":0.75rem;", ":0.5rem;", ":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);", ":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);", ":0.125rem;"], tokens.indicatorSize, tokens.activeIndicatorSize, tokens.bulletSize, tokens.activeBulletSize, tokens.titlePaddingTop, tokens.contentPaddingTop, tokens.contentSidePadding, tokens.contentVerticalPadding, tokens.verticalContentPaddingLeft, tokens.smallIndicatorIndentHeight, tokens.largeIndicatorIndentHeight, tokens.smallBulletIndentHeight, tokens.largeBulletIndentHeight, tokens.indicatorFontFamily, tokens.indicatorFontSize, tokens.indicatorFontStyle, tokens.indicatorFontWeight, tokens.indicatorLetterSpacing, tokens.indicatorLineHeight, tokens.activeIndicatorFontFamily, tokens.activeIndicatorFontSize, tokens.activeIndicatorFontStyle, tokens.activeIndicatorFontWeight, tokens.activeIndicatorLetterSpacing, tokens.activeIndicatorLineHeight, tokens.titleFontFamily, tokens.titleFontSize, tokens.titleFontStyle, tokens.titleFontWeight, tokens.titleLetterSpacing, tokens.titleLineHeight, tokens.contentFontFamily, tokens.contentFontSize, tokens.contentFontStyle, tokens.contentFontWeight, tokens.contentLetterSpacing, tokens.contentLineHeight, tokens.dividerThickness)
     }
-  }
+  },
+  intersections: [{
+    view: 'accent',
+    itemView: 'default',
+    style: /*#__PURE__*/css(["", ":solid var(--text-accent);", ":var(--text-accent);", ";"], tokens.activeIndicatorBorder, tokens.activeIndicatorColor, accentConfig)
+  }, {
+    view: 'accent',
+    itemView: 'negative',
+    style: /*#__PURE__*/css(["", ";"], accentConfig)
+  }, {
+    view: 'accent',
+    itemView: 'warning',
+    style: /*#__PURE__*/css(["", ";"], accentConfig)
+  }, {
+    view: 'accent',
+    itemView: 'positive',
+    style: /*#__PURE__*/css(["", ";"], accentConfig)
+  }]
 };

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

@@ -1,14 +1,17 @@
 import React, { useState, useEffect } from 'react';
 import type { ComponentProps } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
-import { disableProps } from '@salutejs/plasma-sb-utils';
+import { getConfigVariations } from '@salutejs/plasma-sb-utils';
 
 import { IconMic } from '../../../../components/_Icon';
 import { argTypesFromConfig, WithTheme } from '../../../_helpers';
 import { StepItemProps } from '../../../../components/Steps/ui';
 
+import { config } from './Steps.config';
 import { Steps, mergedConfig } from './Steps';
 
+const { views, sizes } = getConfigVariations(config);
+
 const meta: Meta<typeof Steps> = {
     title: 'b2c/Navigation/Steps',
     decorators: [WithTheme],
@@ -133,9 +136,11 @@ const DefaultStory = (args) => {
 
 export const Default: Story = {
     args: {
+        view: 'default',
+        itemView: 'default',
+        size: 'm',
         maxWidth: '100%',
         quantity: 6,
-        size: 'm',
         title: 'Title',
         content: 'Content',
         contentAlign: 'left',
@@ -153,10 +158,22 @@ export const Default: Story = {
                 type: 'text',
             },
         },
+        view: {
+            options: views,
+            control: {
+                type: 'select',
+            },
+        },
+        itemView: {
+            options: ['default', 'negative', 'warning', 'positive'],
+            control: {
+                type: 'select',
+            },
+        },
         size: {
-            options: ['xs', 's', 'm', 'l'],
+            options: sizes,
             control: {
-                type: 'inline-radio',
+                type: 'select',
             },
         },
         orientation: {
@@ -189,7 +206,6 @@ export const Default: Story = {
                 type: 'boolean',
             },
         },
-        ...disableProps(['view']),
     },
     render: (args) => <DefaultStory {...args} />,
 };

package/styled-components/es/examples/plasma_b2c/components/Table/Table.config.js

@@ -11,9 +11,9 @@ export var config = {
       clear: /*#__PURE__*/css(["", ":transparent;"], tokens.borderColor)
     },
     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-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.125rem;", ":3.125rem;", ":0.375rem 1rem;", ":0.375rem 1rem;", ":0.125rem;", ":transparent;", ":1.25rem;", ":0.375rem;", ":0.5rem;", ":3rem;", ":100%;", ":0.25rem;", ":0.875rem;", ":0 0.75rem;", ":var(--surface-transparent-tertiary);", ":0.75rem 0;", ":0.375rem 1rem;", ":2.5rem;", ":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);", ":0.125rem;", ":0.875rem;", ":1.5rem;", ":0.75rem 0.875rem;", ":0.75rem;", ":0 0.375rem 0 0;", ":1.5rem;", ":0;", ":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);", ":1.25rem;", ":0.375rem;", ":0.5rem 1rem;", ":0.5rem;", ":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);"], tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.headerRowHeight, tokens.rowHeight, tokens.cellPadding, tokens.checkboxCellPadding, tokens.checkboxTriggerBorderWidth, tokens.checkboxTriggerBorderCheckedColor, tokens.checkboxTriggerSize, tokens.checkboxTriggerBorderRadius, tokens.editableCellIconGap, tokens.editableCellIconButtonWidth, tokens.editableCellIconButtonHeight, tokens.editableCellPadding, tokens.editableCellInputBorderRadius, tokens.editableCellInputPadding, tokens.editableCellInputBackground, tokens.filterCheckboxPadding, tokens.filterDividerMargin, tokens.buttonHeight, tokens.buttonFontFamily, tokens.buttonFontSize, tokens.buttonFontStyle, tokens.buttonFontWeight, tokens.buttonLetterSpacing, tokens.buttonLineHeight, tokens.selectPadding, tokens.selectBorderRadius, tokens.selectItemHeight, tokens.selectItemPadding, tokens.selectItemBorderRadius, tokens.selectItemIconMargin, tokens.selectItemIconSize, tokens.selectCellPadding, tokens.selectCellTitleFontFamily, tokens.selectCellTitleFontSize, tokens.selectCellTitleFontStyle, tokens.selectCellTitleFontWeight, tokens.selectCellTitleLetterSpacing, tokens.selectCellTitleLineHeight, tokens.selectCheckboxTriggerSize, tokens.selectCheckboxTriggerBorderRadius, tokens.selectControlPanelPadding, tokens.selectControlPanelGap, tokens.linkButtonFontFamily, tokens.linkButtonFontSize, tokens.linkButtonFontStyle, tokens.linkButtonFontWeight, tokens.linkButtonLetterSpacing, tokens.linkButtonLineHeight),
-      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-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":2.75rem;", ":2.75rem;", ":0.25rem 0.875rem;", ":0.25rem 0.75rem;", ":0.125rem;", ":transparent;", ":1.25rem;", ":0.375rem;", ":0.375rem;", ":2.5rem;", ":100%;", ":0.25rem;", ":0.625rem;", ":0 0.625rem;", ":var(--surface-transparent-tertiary);", ":0.5rem 0;", ":0.375rem 0.875rem;", ":2rem;", ":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);", ":0.125rem;", ":0.75rem;", ":1.5rem;", ":0.5rem 0.625rem;", ":0.625rem;", ":0 0.375rem 0 0;", ":1.5rem;", ":0;", ":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);", ":1.25rem;", ":0.375rem;", ":0.25rem 0.875rem;", ":0.625rem;", ":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);"], tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.headerRowHeight, tokens.rowHeight, tokens.cellPadding, tokens.checkboxCellPadding, tokens.checkboxTriggerBorderWidth, tokens.checkboxTriggerBorderCheckedColor, tokens.checkboxTriggerSize, tokens.checkboxTriggerBorderRadius, tokens.editableCellIconGap, tokens.editableCellIconButtonWidth, tokens.editableCellIconButtonHeight, tokens.editableCellPadding, tokens.editableCellInputBorderRadius, tokens.editableCellInputPadding, tokens.editableCellInputBackground, tokens.filterCheckboxPadding, tokens.filterDividerMargin, tokens.buttonHeight, tokens.buttonFontFamily, tokens.buttonFontSize, tokens.buttonFontStyle, tokens.buttonFontWeight, tokens.buttonLetterSpacing, tokens.buttonLineHeight, tokens.selectPadding, tokens.selectBorderRadius, tokens.selectItemHeight, tokens.selectItemPadding, tokens.selectItemBorderRadius, tokens.selectItemIconMargin, tokens.selectItemIconSize, tokens.selectCellPadding, tokens.selectCellTitleFontFamily, tokens.selectCellTitleFontSize, tokens.selectCellTitleFontStyle, tokens.selectCellTitleFontWeight, tokens.selectCellTitleLetterSpacing, tokens.selectCellTitleLineHeight, tokens.selectCheckboxTriggerSize, tokens.selectCheckboxTriggerBorderRadius, tokens.selectControlPanelPadding, tokens.selectControlPanelGap, tokens.linkButtonFontFamily, tokens.linkButtonFontSize, tokens.linkButtonFontStyle, tokens.linkButtonFontWeight, tokens.linkButtonLetterSpacing, tokens.linkButtonLineHeight),
-      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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":2.125rem;", ":2.125rem;", ":0.125rem 0.625rem;", ":0.125rem;", ":transparent;", ":0.875rem;", ":0.25rem;", ":0.25rem;", ":2rem;", ":100%;", ":0.125rem;", ":0.5rem;", ":0 0.375rem;", ":var(--surface-transparent-tertiary);", ":0.5rem 0;", ":0.25rem 0.625rem;", ":1.5rem;", ":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);", ":0.125rem;", ":0.625rem;", ":1rem;", ":0.5rem;", ":0.5rem;", ":0 0.25rem 0 0;", ":1rem;", ":0;", ":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);", ":0.875rem;", ":0.25rem;", ":0.25rem 0.625rem;", ":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-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.headerRowHeight, tokens.rowHeight, tokens.checkboxCellPadding, tokens.checkboxTriggerBorderWidth, tokens.checkboxTriggerBorderCheckedColor, tokens.checkboxTriggerSize, tokens.checkboxTriggerBorderRadius, tokens.editableCellIconGap, tokens.editableCellIconButtonWidth, tokens.editableCellIconButtonHeight, tokens.editableCellPadding, tokens.editableCellInputBorderRadius, tokens.editableCellInputPadding, tokens.editableCellInputBackground, tokens.filterCheckboxPadding, tokens.filterDividerMargin, tokens.buttonHeight, tokens.buttonFontFamily, tokens.buttonFontSize, tokens.buttonFontStyle, tokens.buttonFontWeight, tokens.buttonLetterSpacing, tokens.buttonLineHeight, tokens.selectPadding, tokens.selectBorderRadius, tokens.selectItemHeight, tokens.selectItemPadding, tokens.selectItemBorderRadius, tokens.selectItemIconMargin, tokens.selectItemIconSize, tokens.selectCellPadding, tokens.selectCellTitleFontFamily, tokens.selectCellTitleFontSize, tokens.selectCellTitleFontStyle, tokens.selectCellTitleFontWeight, tokens.selectCellTitleLetterSpacing, tokens.selectCellTitleLineHeight, tokens.selectCheckboxTriggerSize, tokens.selectCheckboxTriggerBorderRadius, tokens.selectControlPanelPadding, tokens.selectControlPanelGap, tokens.linkButtonFontFamily, tokens.linkButtonFontSize, tokens.linkButtonFontStyle, tokens.linkButtonFontWeight, tokens.linkButtonLetterSpacing, tokens.linkButtonLineHeight)
+      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-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.125rem;", ":3.125rem;", ":0.375rem 1rem;", ":0.375rem 1rem;", ":0.125rem;", ":transparent;", ":1.25rem;", ":0.375rem;", ":0.5rem;", ":3rem;", ":100%;", ":0.25rem;", ":0.875rem;", ":0 0.75rem;", ":var(--surface-transparent-tertiary);", ":0.75rem 0;", ":0.375rem 1rem;", ":2.5rem;", ":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);", ":0.125rem;", ":0.875rem;", ":1.5rem;", ":0.75rem 0.875rem;", ":0.75rem;", ":0 0.375rem 0 0;", ":1.5rem;", ":0;", ":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);", ":1.25rem;", ":0.375rem;", ":0.125rem;", ":transparent;", ":0.5rem 1rem;", ":0.5rem;", ":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);"], tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.headerRowHeight, tokens.rowHeight, tokens.cellPadding, tokens.checkboxCellPadding, tokens.checkboxTriggerBorderWidth, tokens.checkboxTriggerBorderCheckedColor, tokens.checkboxTriggerSize, tokens.checkboxTriggerBorderRadius, tokens.editableCellIconGap, tokens.editableCellIconButtonWidth, tokens.editableCellIconButtonHeight, tokens.editableCellPadding, tokens.editableCellInputBorderRadius, tokens.editableCellInputPadding, tokens.editableCellInputBackground, tokens.filterCheckboxPadding, tokens.filterDividerMargin, tokens.buttonHeight, tokens.buttonFontFamily, tokens.buttonFontSize, tokens.buttonFontStyle, tokens.buttonFontWeight, tokens.buttonLetterSpacing, tokens.buttonLineHeight, tokens.selectPadding, tokens.selectBorderRadius, tokens.selectItemHeight, tokens.selectItemPadding, tokens.selectItemBorderRadius, tokens.selectItemIconMargin, tokens.selectItemIconSize, tokens.selectCellPadding, tokens.selectCellTitleFontFamily, tokens.selectCellTitleFontSize, tokens.selectCellTitleFontStyle, tokens.selectCellTitleFontWeight, tokens.selectCellTitleLetterSpacing, tokens.selectCellTitleLineHeight, tokens.selectCheckboxTriggerSize, tokens.selectCheckboxTriggerBorderRadius, tokens.selectCheckboxTriggerBorderWidth, tokens.selectCheckboxTriggerBorderCheckedColor, tokens.selectControlPanelPadding, tokens.selectControlPanelGap, tokens.linkButtonFontFamily, tokens.linkButtonFontSize, tokens.linkButtonFontStyle, tokens.linkButtonFontWeight, tokens.linkButtonLetterSpacing, tokens.linkButtonLineHeight),
+      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-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":2.75rem;", ":2.75rem;", ":0.25rem 0.875rem;", ":0.25rem 0.75rem;", ":0.125rem;", ":transparent;", ":1.25rem;", ":0.375rem;", ":0.375rem;", ":2.5rem;", ":100%;", ":0.25rem;", ":0.625rem;", ":0 0.625rem;", ":var(--surface-transparent-tertiary);", ":0.5rem 0;", ":0.375rem 0.875rem;", ":2rem;", ":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);", ":0.125rem;", ":0.75rem;", ":1.5rem;", ":0.5rem 0.625rem;", ":0.625rem;", ":0 0.375rem 0 0;", ":1.5rem;", ":0;", ":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);", ":1.25rem;", ":0.375rem;", ":0.125rem;", ":transparent;", ":0.25rem 0.875rem;", ":0.625rem;", ":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);"], tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.headerRowHeight, tokens.rowHeight, tokens.cellPadding, tokens.checkboxCellPadding, tokens.checkboxTriggerBorderWidth, tokens.checkboxTriggerBorderCheckedColor, tokens.checkboxTriggerSize, tokens.checkboxTriggerBorderRadius, tokens.editableCellIconGap, tokens.editableCellIconButtonWidth, tokens.editableCellIconButtonHeight, tokens.editableCellPadding, tokens.editableCellInputBorderRadius, tokens.editableCellInputPadding, tokens.editableCellInputBackground, tokens.filterCheckboxPadding, tokens.filterDividerMargin, tokens.buttonHeight, tokens.buttonFontFamily, tokens.buttonFontSize, tokens.buttonFontStyle, tokens.buttonFontWeight, tokens.buttonLetterSpacing, tokens.buttonLineHeight, tokens.selectPadding, tokens.selectBorderRadius, tokens.selectItemHeight, tokens.selectItemPadding, tokens.selectItemBorderRadius, tokens.selectItemIconMargin, tokens.selectItemIconSize, tokens.selectCellPadding, tokens.selectCellTitleFontFamily, tokens.selectCellTitleFontSize, tokens.selectCellTitleFontStyle, tokens.selectCellTitleFontWeight, tokens.selectCellTitleLetterSpacing, tokens.selectCellTitleLineHeight, tokens.selectCheckboxTriggerSize, tokens.selectCheckboxTriggerBorderRadius, tokens.selectCheckboxTriggerBorderWidth, tokens.selectCheckboxTriggerBorderCheckedColor, tokens.selectControlPanelPadding, tokens.selectControlPanelGap, tokens.linkButtonFontFamily, tokens.linkButtonFontSize, tokens.linkButtonFontStyle, tokens.linkButtonFontWeight, tokens.linkButtonLetterSpacing, tokens.linkButtonLineHeight),
+      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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":2.125rem;", ":2.125rem;", ":0.125rem 0.5rem;", ":0.125rem 0.625rem;", ":0.125rem;", ":transparent;", ":0.875rem;", ":0.25rem;", ":0.25rem;", ":2rem;", ":100%;", ":0.125rem;", ":0.5rem;", ":0 0.375rem;", ":var(--surface-transparent-tertiary);", ":0.5rem 0;", ":0.25rem 0.625rem;", ":1.5rem;", ":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);", ":0.125rem;", ":0.625rem;", ":1rem;", ":0.5rem;", ":0.5rem;", ":0 0.25rem 0 0;", ":1rem;", ":0;", ":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);", ":0.875rem;", ":0.25rem;", ":0.125rem;", ":transparent;", ":0.25rem 0.625rem;", ":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-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.headerRowHeight, tokens.rowHeight, tokens.cellPadding, tokens.checkboxCellPadding, tokens.checkboxTriggerBorderWidth, tokens.checkboxTriggerBorderCheckedColor, tokens.checkboxTriggerSize, tokens.checkboxTriggerBorderRadius, tokens.editableCellIconGap, tokens.editableCellIconButtonWidth, tokens.editableCellIconButtonHeight, tokens.editableCellPadding, tokens.editableCellInputBorderRadius, tokens.editableCellInputPadding, tokens.editableCellInputBackground, tokens.filterCheckboxPadding, tokens.filterDividerMargin, tokens.buttonHeight, tokens.buttonFontFamily, tokens.buttonFontSize, tokens.buttonFontStyle, tokens.buttonFontWeight, tokens.buttonLetterSpacing, tokens.buttonLineHeight, tokens.selectPadding, tokens.selectBorderRadius, tokens.selectItemHeight, tokens.selectItemPadding, tokens.selectItemBorderRadius, tokens.selectItemIconMargin, tokens.selectItemIconSize, tokens.selectCellPadding, tokens.selectCellTitleFontFamily, tokens.selectCellTitleFontSize, tokens.selectCellTitleFontStyle, tokens.selectCellTitleFontWeight, tokens.selectCellTitleLetterSpacing, tokens.selectCellTitleLineHeight, tokens.selectCheckboxTriggerSize, tokens.selectCheckboxTriggerBorderRadius, tokens.selectCheckboxTriggerBorderWidth, tokens.selectCheckboxTriggerBorderCheckedColor, tokens.selectControlPanelPadding, tokens.selectControlPanelGap, tokens.linkButtonFontFamily, tokens.linkButtonFontSize, tokens.linkButtonFontStyle, tokens.linkButtonFontWeight, tokens.linkButtonLetterSpacing, tokens.linkButtonLineHeight)
     }
   }
 };

package/styled-components/es/examples/plasma_web/components/Steps/Steps.config.js

@@ -1,13 +1,23 @@
 import { css } from 'styled-components';
 import { stepsTokens as tokens } from '../../../../components/Steps';
+var baseItemView = /*#__PURE__*/"\n    ".concat(tokens.activeTitleColor, ": var(--text-primary);\n    ").concat(tokens.activeTitleColorHover, ": var(--text-primary-hover);\n    ").concat(tokens.activeIndicatorBorder, ": solid var(--surface-solid-default);\n    ").concat(tokens.activeIndicatorColor, ": var(--text-primary);\n    ").concat(tokens.activeIndicatorBackground, ": var(--surface-clear);\n    \n    ").concat(tokens.completedIndicatorColor, ": var(--inverse-text-primary);\n    ").concat(tokens.completedIndicatorColorHover, ": var(--inverse-text-primary);\n    ").concat(tokens.completedIndicatorBackground, ": var(--surface-solid-default);\n    ").concat(tokens.completedIndicatorBackgroundHover, ": var(--surface-solid-default-hover);\n    ").concat(tokens.completedTitleColor, ": var(--text-primary);\n    ").concat(tokens.completedTitleColorHover, ": var(--text-primary-hover);\n\n    ").concat(tokens.inactiveTitleColor, ": var(--text-secondary);\n    ").concat(tokens.inactiveTitleColorHover, ": var(--text-secondary-hover);\n    ").concat(tokens.inactiveIndicatorColor, ": var(--text-secondary);\n    ").concat(tokens.inactiveIndicatorColorHover, ": var(--text-secondary);\n    ").concat(tokens.inactiveIndicatorBackground, ": var(--surface-transparent-secondary);\n    ").concat(tokens.inactiveIndicatorBackgroundHover, ": var(--surface-transparent-secondary-hover);\n\n    ").concat(tokens.contentColor, ": var(--text-secondary);\n    ").concat(tokens.focusColor, ": var(--surface-accent);\n\n    ").concat(tokens.disabledOpacity, ": 0.4;\n");
+var accentConfig = /*#__PURE__*/"\n    ".concat(tokens.completedTitleColor, ": var(--text-primary);\n    ").concat(tokens.completedTitleColorHover, ": var(--text-primary-hover);\n    \n    ").concat(tokens.completedIndicatorBackground, ": var(--surface-accent);\n    ").concat(tokens.completedIndicatorBackgroundHover, ": var(--surface-accent-hover);\n    \n    // \u0426\u0432\u0435\u0442 \u043A\u043E\u043D\u0442\u0435\u043D\u0442\u0430 \u0432\u043D\u0443\u0442\u0440\u0438 \u044D\u043B\u0435\u043C\u0435\u043D\u0442\u0430 Step\n    ").concat(tokens.completedIndicatorColor, ": var(--on-dark-text-primary);\n    ").concat(tokens.completedIndicatorColorHover, ": var(--on-dark-text-primary-hover);\n");
 export var config = {
   defaults: {
     size: 'm',
-    view: 'default'
+    view: 'default',
+    itemView: 'default'
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-primary-hover);", ":solid var(--surface-solid-default);", ":var(--text-primary);", ":var(--surface-clear);", ":var(--inverse-text-primary);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--surface-solid-default-hover);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-secondary);", ":var(--surface-accent);", ":0.4;"], tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor, tokens.activeIndicatorBackground, tokens.completedIndicatorColor, tokens.completedIndicatorColorHover, tokens.completedIndicatorBackground, tokens.completedIndicatorBackgroundHover, tokens.inactiveTitleColor, tokens.inactiveTitleColorHover, tokens.inactiveIndicatorColor, tokens.inactiveIndicatorColorHover, tokens.inactiveIndicatorBackground, tokens.inactiveIndicatorBackgroundHover, tokens.contentColor, tokens.focusColor, tokens.disabledOpacity)
+      "default": /*#__PURE__*/css(["", ":var(--surface-solid-default);"], tokens.dividerColor),
+      accent: /*#__PURE__*/css(["", ":var(--surface-accent);"], tokens.dividerColor)
+    },
+    itemView: {
+      "default": /*#__PURE__*/css(["", ";"], baseItemView),
+      negative: /*#__PURE__*/css(["", ";", ":var(--surface-negative);", ":var(--surface-negative-hover);", ":solid var(--surface-negative);", ":var(--text-negative);"], baseItemView, tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor),
+      warning: /*#__PURE__*/css(["", ";", ":var(--surface-warning);", ":var(--surface-warning-hover);", ":solid var(--surface-warning);", ":var(--text-warning);"], baseItemView, tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor),
+      positive: /*#__PURE__*/css(["", ";", ":var(--surface-positive);", ":var(--surface-positive-hover);", ":solid var(--surface-positive);", ":var(--text-positive);"], baseItemView, tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor)
     },
     size: {
       l: /*#__PURE__*/css(["", ":1.5rem;", ":2.25rem;", ":0.5rem;", ":1rem;", ":0.75rem;", ":0.375rem;", ":2rem;", ":1.0625rem;", ":0.75rem;", ":1rem;", ":0.625rem;", ":1.5rem;", ":1.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-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-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);", ":0.125rem;"], tokens.indicatorSize, tokens.activeIndicatorSize, tokens.bulletSize, tokens.activeBulletSize, tokens.titlePaddingTop, tokens.contentPaddingTop, tokens.contentSidePadding, tokens.contentVerticalPadding, tokens.verticalContentPaddingLeft, tokens.smallIndicatorIndentHeight, tokens.largeIndicatorIndentHeight, tokens.smallBulletIndentHeight, tokens.largeBulletIndentHeight, tokens.indicatorFontFamily, tokens.indicatorFontSize, tokens.indicatorFontStyle, tokens.indicatorFontWeight, tokens.indicatorLetterSpacing, tokens.indicatorLineHeight, tokens.activeIndicatorFontFamily, tokens.activeIndicatorFontSize, tokens.activeIndicatorFontStyle, tokens.activeIndicatorFontWeight, tokens.activeIndicatorLetterSpacing, tokens.activeIndicatorLineHeight, tokens.titleFontFamily, tokens.titleFontSize, tokens.titleFontStyle, tokens.titleFontWeight, tokens.titleLetterSpacing, tokens.titleLineHeight, tokens.contentFontFamily, tokens.contentFontSize, tokens.contentFontStyle, tokens.contentFontWeight, tokens.contentLetterSpacing, tokens.contentLineHeight, tokens.dividerThickness),
@@ -15,5 +25,22 @@ export var config = {
       s: /*#__PURE__*/css(["", ":1.5rem;", ":1.5rem;", ":0.5rem;", ":1rem;", ":0.5rem;", ":0.375rem;", ":1.5rem;", ":0.6875rem;", ":0.75rem;", ":0.5rem;", ":0.5rem;", ":1rem;", ":0.75rem;", ":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-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);", ":0.125rem;"], tokens.indicatorSize, tokens.activeIndicatorSize, tokens.bulletSize, tokens.activeBulletSize, tokens.titlePaddingTop, tokens.contentPaddingTop, tokens.contentSidePadding, tokens.contentVerticalPadding, tokens.verticalContentPaddingLeft, tokens.smallIndicatorIndentHeight, tokens.largeIndicatorIndentHeight, tokens.smallBulletIndentHeight, tokens.largeBulletIndentHeight, tokens.indicatorFontFamily, tokens.indicatorFontSize, tokens.indicatorFontStyle, tokens.indicatorFontWeight, tokens.indicatorLetterSpacing, tokens.indicatorLineHeight, tokens.activeIndicatorFontFamily, tokens.activeIndicatorFontSize, tokens.activeIndicatorFontStyle, tokens.activeIndicatorFontWeight, tokens.activeIndicatorLetterSpacing, tokens.activeIndicatorLineHeight, tokens.titleFontFamily, tokens.titleFontSize, tokens.titleFontStyle, tokens.titleFontWeight, tokens.titleLetterSpacing, tokens.titleLineHeight, tokens.contentFontFamily, tokens.contentFontSize, tokens.contentFontStyle, tokens.contentFontWeight, tokens.contentLetterSpacing, tokens.contentLineHeight, tokens.dividerThickness),
       xs: /*#__PURE__*/css(["", ":1.5rem;", ":1.5rem;", ":0.5rem;", ":1rem;", ":0.5rem;", ":0.25rem;", ":1.5rem;", ":0.5625rem;", ":0.75rem;", ":0.25rem;", ":0.25rem;", ":0.75rem;", ":0.5rem;", ":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);", ":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);", ":0.125rem;"], tokens.indicatorSize, tokens.activeIndicatorSize, tokens.bulletSize, tokens.activeBulletSize, tokens.titlePaddingTop, tokens.contentPaddingTop, tokens.contentSidePadding, tokens.contentVerticalPadding, tokens.verticalContentPaddingLeft, tokens.smallIndicatorIndentHeight, tokens.largeIndicatorIndentHeight, tokens.smallBulletIndentHeight, tokens.largeBulletIndentHeight, tokens.indicatorFontFamily, tokens.indicatorFontSize, tokens.indicatorFontStyle, tokens.indicatorFontWeight, tokens.indicatorLetterSpacing, tokens.indicatorLineHeight, tokens.activeIndicatorFontFamily, tokens.activeIndicatorFontSize, tokens.activeIndicatorFontStyle, tokens.activeIndicatorFontWeight, tokens.activeIndicatorLetterSpacing, tokens.activeIndicatorLineHeight, tokens.titleFontFamily, tokens.titleFontSize, tokens.titleFontStyle, tokens.titleFontWeight, tokens.titleLetterSpacing, tokens.titleLineHeight, tokens.contentFontFamily, tokens.contentFontSize, tokens.contentFontStyle, tokens.contentFontWeight, tokens.contentLetterSpacing, tokens.contentLineHeight, tokens.dividerThickness)
     }
-  }
+  },
+  intersections: [{
+    view: 'accent',
+    itemView: 'default',
+    style: /*#__PURE__*/css(["", ":solid var(--text-accent);", ":var(--text-accent);", ";"], tokens.activeIndicatorBorder, tokens.activeIndicatorColor, accentConfig)
+  }, {
+    view: 'accent',
+    itemView: 'negative',
+    style: /*#__PURE__*/css(["", ";"], accentConfig)
+  }, {
+    view: 'accent',
+    itemView: 'warning',
+    style: /*#__PURE__*/css(["", ";"], accentConfig)
+  }, {
+    view: 'accent',
+    itemView: 'positive',
+    style: /*#__PURE__*/css(["", ";"], accentConfig)
+  }]
 };