@salutejs/plasma-new-hope 0.338.0-canary.2277.18342250629.0 → 0.338.0-canary.2280.18409919038.0

package/styled-components/cjs/components/TextField/ui/TextFieldChipNew/TextFieldChipNew.styles.js

@@ -20,6 +20,7 @@ var _styledcomponents = /*#__PURE__*/ _interop_require_default(require("styled-c
 var _engines = require("../../../../engines");
 var _mixins = require("../../../../mixins");
 var _Chip = require("../../../Chip");
+var _Chipstyles = require("../../../Chip/Chip.styles");
 var _TextFieldtokens = require("../../TextField.tokens");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
@@ -31,7 +32,7 @@ var mergedConfig = (0, _engines.mergeConfig)(_Chip.chipConfig);
 var Chip = (0, _engines.component)(mergedConfig);
 var StyledChip = (0, _styledcomponents.default)(Chip).withConfig({
     displayName: "TextFieldChipNew.styles__StyledChip",
-    componentId: "sc-ffa02158-0"
+    componentId: "sc-92ebcae4-0"
 })([
     "",
     ":var(",
@@ -84,18 +85,40 @@ var StyledChip = (0, _styledcomponents.default)(Chip).withConfig({
     ");",
     ":var(",
     ");",
+    ":var(",
+    ");",
+    ":var(",
+    ");",
     ":0.4;",
     " &[readonly]{opacity:var(",
-    ");}"
-], _Chip.chipTokens.color, _TextFieldtokens.tokens.chipColor, _Chip.chipTokens.background, _TextFieldtokens.tokens.chipBackground, _Chip.chipTokens.colorHover, _TextFieldtokens.tokens.chipColorHover, _Chip.chipTokens.backgroundHover, _TextFieldtokens.tokens.chipBackgroundHover, _Chip.chipTokens.colorActive, _TextFieldtokens.tokens.chipColorActive, _Chip.chipTokens.backgroundActive, _TextFieldtokens.tokens.chipBackgroundActive, _Chip.chipTokens.backgroundReadOnly, _TextFieldtokens.tokens.chipBackgroundReadOnly, _Chip.chipTokens.colorReadOnly, _TextFieldtokens.tokens.chipColorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _TextFieldtokens.tokens.chipBackgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover, _TextFieldtokens.tokens.chipColorReadOnlyHover, _Chip.chipTokens.borderRadius, _TextFieldtokens.tokens.chipBorderRadius, _Chip.chipTokens.width, _TextFieldtokens.tokens.chipWidth, _Chip.chipTokens.height, _TextFieldtokens.tokens.chipHeight, _Chip.chipTokens.padding, _TextFieldtokens.tokens.chipPadding, _Chip.chipTokens.fontFamily, _TextFieldtokens.tokens.chipFontFamily, _Chip.chipTokens.fontSize, _TextFieldtokens.tokens.chipFontSize, _Chip.chipTokens.fontStyle, _TextFieldtokens.tokens.chipFontStyle, _Chip.chipTokens.fontWeight, _TextFieldtokens.tokens.chipFontWeight, _Chip.chipTokens.letterSpacing, _TextFieldtokens.tokens.chipLetterSpacing, _Chip.chipTokens.lineHeight, _TextFieldtokens.tokens.chipLineHeight, _Chip.chipTokens.clearContentMarginLeft, _TextFieldtokens.tokens.chipClearContentMarginLeft, _Chip.chipTokens.clearContentMarginRight, _TextFieldtokens.tokens.chipClearContentMarginRight, _Chip.chipTokens.closeIconSize, _TextFieldtokens.tokens.chipCloseIconSize, _Chip.chipTokens.closeIconColor, _TextFieldtokens.tokens.chipCloseIconColor, _Chip.chipTokens.focusColor, _TextFieldtokens.tokens.focusColor, _Chip.chipTokens.disabledOpacity, (0, _mixins.addFocus)({
+    ");}&:not([readonly]):hover,&:not([readonly]):active{color:",
+    ";background-color:",
+    ";cursor:",
+    ";",
+    "{color:",
+    ";:hover{cursor:pointer;color:var(",
+    ");}}}"
+], _Chip.chipTokens.color, _TextFieldtokens.tokens.chipColor, _Chip.chipTokens.background, _TextFieldtokens.tokens.chipBackground, _Chip.chipTokens.colorHover, _TextFieldtokens.tokens.chipColorHover, _Chip.chipTokens.backgroundHover, _TextFieldtokens.tokens.chipBackgroundHover, _Chip.chipTokens.colorActive, _TextFieldtokens.tokens.chipColorActive, _Chip.chipTokens.backgroundActive, _TextFieldtokens.tokens.chipBackgroundActive, _Chip.chipTokens.backgroundReadOnly, _TextFieldtokens.tokens.chipBackgroundReadOnly, _Chip.chipTokens.colorReadOnly, _TextFieldtokens.tokens.chipColorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _TextFieldtokens.tokens.chipBackgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover, _TextFieldtokens.tokens.chipColorReadOnlyHover, _Chip.chipTokens.borderRadius, _TextFieldtokens.tokens.chipBorderRadius, _Chip.chipTokens.width, _TextFieldtokens.tokens.chipWidth, _Chip.chipTokens.height, _TextFieldtokens.tokens.chipHeight, _Chip.chipTokens.padding, _TextFieldtokens.tokens.chipPadding, _Chip.chipTokens.fontFamily, _TextFieldtokens.tokens.chipFontFamily, _Chip.chipTokens.fontSize, _TextFieldtokens.tokens.chipFontSize, _Chip.chipTokens.fontStyle, _TextFieldtokens.tokens.chipFontStyle, _Chip.chipTokens.fontWeight, _TextFieldtokens.tokens.chipFontWeight, _Chip.chipTokens.letterSpacing, _TextFieldtokens.tokens.chipLetterSpacing, _Chip.chipTokens.lineHeight, _TextFieldtokens.tokens.chipLineHeight, _Chip.chipTokens.clearContentMarginLeft, _TextFieldtokens.tokens.chipClearContentMarginLeft, _Chip.chipTokens.clearContentMarginRight, _TextFieldtokens.tokens.chipClearContentMarginRight, _Chip.chipTokens.closeIconSize, _TextFieldtokens.tokens.chipCloseIconSize, _Chip.chipTokens.closeIconColor, _TextFieldtokens.tokens.chipCloseIconColor, _Chip.chipTokens.closeIconColorHover, _TextFieldtokens.tokens.chipCloseIconColorHover, _Chip.chipTokens.closeIconColorReadonly, _TextFieldtokens.tokens.chipCloseIconColorReadonly, _Chip.chipTokens.focusColor, _TextFieldtokens.tokens.focusColor, _Chip.chipTokens.disabledOpacity, (0, _mixins.addFocus)({
     outlineOffset: '0.0625rem',
     outlineSize: '0.0625rem',
     outlineRadius: "calc(var(".concat(_TextFieldtokens.tokens.chipBorderRadius, ") - 0.1rem)"),
     outlineColor: "var(".concat(_TextFieldtokens.tokens.focusColor, ")")
-}), _TextFieldtokens.tokens.chipOpacityReadonly);
+}), _TextFieldtokens.tokens.chipOpacityReadonly, function(param) {
+    var chipClickArea = param.chipClickArea;
+    return chipClickArea === 'full' ? "var(".concat(_TextFieldtokens.tokens.chipColorHover, ")") : "var(".concat(_TextFieldtokens.tokens.chipColor, ")");
+}, function(param) {
+    var chipClickArea = param.chipClickArea;
+    return chipClickArea === 'full' ? "var(".concat(_TextFieldtokens.tokens.chipBackgroundHover, ")") : "var(".concat(_TextFieldtokens.tokens.chipBackground, ")");
+}, function(param) {
+    var chipClickArea = param.chipClickArea;
+    return chipClickArea === 'full' ? 'pointer' : 'default';
+}, _Chipstyles.StyledContentClear, function(param) {
+    var chipClickArea = param.chipClickArea;
+    return chipClickArea === 'full' ? "var(".concat(_TextFieldtokens.tokens.chipCloseIconColorHover, ")") : "var(".concat(_TextFieldtokens.tokens.chipCloseIconColor, ")");
+}, _TextFieldtokens.tokens.chipCloseIconColorHover);
 var TextChip = _styledcomponents.default.button.withConfig({
     displayName: "TextFieldChipNew.styles__TextChip",
-    componentId: "sc-ffa02158-1"
+    componentId: "sc-92ebcae4-1"
 })([
     "display:block;flex:none;background:none;border:none;outline:none;padding:0;white-space:nowrap;cursor:pointer;font-family:var(",
     ");font-size:var(",

package/styled-components/cjs/components/Tree/utils/traverseTree.js

@@ -88,7 +88,7 @@ var deepCopy = function(obj) {
             return deepCopy(item);
         });
     }
-    if (obj.type && (typeof obj.type === 'function' || typeof obj.type === 'string')) {
+    if (obj.$$typeof === Symbol.for('react.element') || obj.$$typeof === Symbol.for('react.fragment') || _type_of(obj === null || obj === void 0 ? void 0 : obj.$$typeof) === 'symbol') {
         return obj;
     }
     return Object.fromEntries(Object.entries(obj).map(function(param) {

package/styled-components/cjs/components/_Icon/index.js

@@ -60,6 +60,9 @@ _export(exports, {
     get IconCross () {
         return _IconCross.IconCross;
     },
+    get IconCrossThin () {
+        return _IconCrossThin.IconCrossThin;
+    },
     get IconDisclosureDownCentered () {
         return _IconDisclosureDownCentered.IconDisclosureDownCentered;
     },
@@ -181,6 +184,7 @@ var _IconChevronDown = require("./Icons/IconChevronDown");
 var _IconChevronDownFill = require("./Icons/IconChevronDownFill");
 var _IconClose = require("./Icons/IconClose");
 var _IconCross = require("./Icons/IconCross");
+var _IconCrossThin = require("./Icons/IconCrossThin");
 var _IconDone = require("./Icons/IconDone");
 var _IconDisclosureRightCentered = require("./Icons/IconDisclosureRightCentered");
 var _IconDisclosureDownCentered = require("./Icons/IconDisclosureDownCentered");

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

@@ -29,8 +29,10 @@ var config = {
                 ":var(--surface-solid-default);",
                 ":var(--inverse-text-primary);",
                 ":var(--surface-solid-default);",
-                ":var(--inverse-text-primary);"
-            ], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover),
+                ":var(--inverse-text-primary);",
+                ":var(--inverse-text-secondary);",
+                ":var(--inverse-text-secondary-hover);"
+            ], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover, _Chip.chipTokens.closeIconColor, _Chip.chipTokens.closeIconColorHover),
             secondary: (0, _styledcomponents.css)([
                 "",
                 ":var(--text-primary);",
@@ -42,8 +44,10 @@ var config = {
                 ":var(--surface-transparent-secondary);",
                 ":var(--text-primary);",
                 ":var(--surface-transparent-secondary);",
-                ":var(--text-primary);"
-            ], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover),
+                ":var(--text-primary);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary-hover);"
+            ], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover, _Chip.chipTokens.closeIconColor, _Chip.chipTokens.closeIconColorHover),
             accent: (0, _styledcomponents.css)([
                 "",
                 ":var(--on-dark-text-primary);",
@@ -55,8 +59,10 @@ var config = {
                 ":var(--surface-accent);",
                 ":var(--on-dark-text-primary);",
                 ":var(--surface-accent);",
-                ":var(--on-dark-text-primary);"
-            ], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover),
+                ":var(--on-dark-text-primary);",
+                ":var(--on-dark-text-secondary);",
+                ":var(--on-dark-text-secondary-hover);"
+            ], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover, _Chip.chipTokens.closeIconColor, _Chip.chipTokens.closeIconColorHover),
             positive: (0, _styledcomponents.css)([
                 "",
                 ":var(--on-dark-text-primary);",
@@ -68,8 +74,10 @@ var config = {
                 ":var(--surface-positive);",
                 ":var(--on-dark-text-primary);",
                 ":var(--surface-positive);",
-                ":var(--on-dark-text-primary);"
-            ], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover),
+                ":var(--on-dark-text-primary);",
+                ":var(--on-dark-text-secondary);",
+                ":var(--on-dark-text-secondary-hover);"
+            ], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover, _Chip.chipTokens.closeIconColor, _Chip.chipTokens.closeIconColorHover),
             warning: (0, _styledcomponents.css)([
                 "",
                 ":var(--on-dark-text-primary);",
@@ -81,8 +89,10 @@ var config = {
                 ":var(--surface-warning);",
                 ":var(--on-dark-text-primary);",
                 ":var(--surface-warning);",
-                ":var(--on-dark-text-primary);"
-            ], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover),
+                ":var(--on-dark-text-primary);",
+                ":var(--on-dark-text-secondary);",
+                ":var(--on-dark-text-secondary-hover);"
+            ], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover, _Chip.chipTokens.closeIconColor, _Chip.chipTokens.closeIconColorHover),
             negative: (0, _styledcomponents.css)([
                 "",
                 ":var(--on-dark-text-primary);",
@@ -94,8 +104,10 @@ var config = {
                 ":var(--surface-negative);",
                 ":var(--on-dark-text-primary);",
                 ":var(--surface-negative);",
-                ":var(--on-dark-text-primary);"
-            ], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover)
+                ":var(--on-dark-text-primary);",
+                ":var(--on-dark-text-secondary);",
+                ":var(--on-dark-text-secondary-hover);"
+            ], _Chip.chipTokens.color, _Chip.chipTokens.background, _Chip.chipTokens.colorHover, _Chip.chipTokens.backgroundHover, _Chip.chipTokens.colorActive, _Chip.chipTokens.backgroundActive, _Chip.chipTokens.backgroundReadOnly, _Chip.chipTokens.colorReadOnly, _Chip.chipTokens.backgroundReadOnlyHover, _Chip.chipTokens.colorReadOnlyHover, _Chip.chipTokens.closeIconColor, _Chip.chipTokens.closeIconColorHover)
         },
         size: {
             l: (0, _styledcomponents.css)([

package/styled-components/cjs/examples/components/Combobox/Combobox.config.js

@@ -40,6 +40,8 @@ var config = {
                 ":var(--surface-negative);",
                 ":var(--text-tertiary);",
                 ":var(--text-secondary);",
+                ":var(--text-secondary-hover);",
+                ":var(--text-secondary);",
                 ":var(--text-primary);",
                 ":var(--surface-transparent-secondary);",
                 ":var(--text-primary);",
@@ -61,7 +63,7 @@ var config = {
                 ":var(--on-dark-text-primary);",
                 ":transparent;",
                 ":var(--text-secondary);"
-            ], _Combobox.comboboxNewTokens.textFieldColor, _Combobox.comboboxNewTokens.textFieldClearColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColor, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldBackgroundColor, _Combobox.comboboxNewTokens.textFieldBackgroundColorFocus, _Combobox.comboboxNewTokens.textFieldCaretColor, _Combobox.comboboxNewTokens.textFieldTextBeforeColor, _Combobox.comboboxNewTokens.textFieldTextAfterColor, _Combobox.comboboxNewTokens.textFieldLabelColor, _Combobox.comboboxNewTokens.textFieldLeftHelperColor, _Combobox.comboboxNewTokens.textFieldFocusColor, _Combobox.comboboxNewTokens.textFieldContentSlotColor, _Combobox.comboboxNewTokens.textFieldContentSlotColorHover, _Combobox.comboboxNewTokens.textFieldContentSlotColorActive, _Combobox.comboboxNewTokens.textFieldIndicatorColor, _Combobox.comboboxNewTokens.textFieldOptionalColor, _Combobox.comboboxNewTokens.textFieldChipCloseIconColor, _Combobox.comboboxNewTokens.textFieldChipColor, _Combobox.comboboxNewTokens.textFieldChipBackground, _Combobox.comboboxNewTokens.textFieldChipColorHover, _Combobox.comboboxNewTokens.textFieldChipBackgroundHover, _Combobox.comboboxNewTokens.textFieldChipColorActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnly, _Combobox.comboboxNewTokens.textFieldChipColorReadOnly, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipColorReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipOpacityReadonly, _Combobox.comboboxNewTokens.disclosureIconColor, _Combobox.comboboxNewTokens.disclosureIconColorHover, _Combobox.comboboxNewTokens.itemBackgroundHover, _Combobox.comboboxNewTokens.textFieldHintIconColor, _Combobox.comboboxNewTokens.dividerColor, _Combobox.comboboxNewTokens.itemIconColor, _Combobox.comboboxNewTokens.checkboxFillColor, _Combobox.comboboxNewTokens.checkboxIconColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderCheckedColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderColor),
+            ], _Combobox.comboboxNewTokens.textFieldColor, _Combobox.comboboxNewTokens.textFieldClearColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColor, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldBackgroundColor, _Combobox.comboboxNewTokens.textFieldBackgroundColorFocus, _Combobox.comboboxNewTokens.textFieldCaretColor, _Combobox.comboboxNewTokens.textFieldTextBeforeColor, _Combobox.comboboxNewTokens.textFieldTextAfterColor, _Combobox.comboboxNewTokens.textFieldLabelColor, _Combobox.comboboxNewTokens.textFieldLeftHelperColor, _Combobox.comboboxNewTokens.textFieldFocusColor, _Combobox.comboboxNewTokens.textFieldContentSlotColor, _Combobox.comboboxNewTokens.textFieldContentSlotColorHover, _Combobox.comboboxNewTokens.textFieldContentSlotColorActive, _Combobox.comboboxNewTokens.textFieldIndicatorColor, _Combobox.comboboxNewTokens.textFieldOptionalColor, _Combobox.comboboxNewTokens.textFieldChipCloseIconColor, _Combobox.comboboxNewTokens.textFieldChipCloseIconColorHover, _Combobox.comboboxNewTokens.textFieldChipCloseIconColorReadonly, _Combobox.comboboxNewTokens.textFieldChipColor, _Combobox.comboboxNewTokens.textFieldChipBackground, _Combobox.comboboxNewTokens.textFieldChipColorHover, _Combobox.comboboxNewTokens.textFieldChipBackgroundHover, _Combobox.comboboxNewTokens.textFieldChipColorActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnly, _Combobox.comboboxNewTokens.textFieldChipColorReadOnly, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipColorReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipOpacityReadonly, _Combobox.comboboxNewTokens.disclosureIconColor, _Combobox.comboboxNewTokens.disclosureIconColorHover, _Combobox.comboboxNewTokens.itemBackgroundHover, _Combobox.comboboxNewTokens.textFieldHintIconColor, _Combobox.comboboxNewTokens.dividerColor, _Combobox.comboboxNewTokens.itemIconColor, _Combobox.comboboxNewTokens.checkboxFillColor, _Combobox.comboboxNewTokens.checkboxIconColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderCheckedColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderColor),
             positive: (0, _styledcomponents.css)([
                 "",
                 ":var(--text-primary);",
@@ -84,6 +86,8 @@ var config = {
                 ":var(--surface-negative);",
                 ":var(--text-tertiary);",
                 ":var(--text-secondary);",
+                ":var(--text-secondary-hover);",
+                ":var(--text-secondary);",
                 ":var(--text-primary);",
                 ":var(--surface-transparent-secondary);",
                 ":var(--text-primary);",
@@ -105,7 +109,7 @@ var config = {
                 ":var(--on-dark-text-primary);",
                 ":transparent;",
                 ":var(--text-secondary);"
-            ], _Combobox.comboboxNewTokens.textFieldColor, _Combobox.comboboxNewTokens.textFieldClearColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColor, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldBackgroundColor, _Combobox.comboboxNewTokens.textFieldBackgroundColorFocus, _Combobox.comboboxNewTokens.textFieldCaretColor, _Combobox.comboboxNewTokens.textFieldTextBeforeColor, _Combobox.comboboxNewTokens.textFieldTextAfterColor, _Combobox.comboboxNewTokens.textFieldLabelColor, _Combobox.comboboxNewTokens.textFieldLeftHelperColor, _Combobox.comboboxNewTokens.textFieldFocusColor, _Combobox.comboboxNewTokens.textFieldContentSlotColor, _Combobox.comboboxNewTokens.textFieldContentSlotColorHover, _Combobox.comboboxNewTokens.textFieldContentSlotColorActive, _Combobox.comboboxNewTokens.textFieldIndicatorColor, _Combobox.comboboxNewTokens.textFieldOptionalColor, _Combobox.comboboxNewTokens.textFieldChipCloseIconColor, _Combobox.comboboxNewTokens.textFieldChipColor, _Combobox.comboboxNewTokens.textFieldChipBackground, _Combobox.comboboxNewTokens.textFieldChipColorHover, _Combobox.comboboxNewTokens.textFieldChipBackgroundHover, _Combobox.comboboxNewTokens.textFieldChipColorActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnly, _Combobox.comboboxNewTokens.textFieldChipColorReadOnly, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipColorReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipOpacityReadonly, _Combobox.comboboxNewTokens.disclosureIconColor, _Combobox.comboboxNewTokens.disclosureIconColorHover, _Combobox.comboboxNewTokens.itemBackgroundHover, _Combobox.comboboxNewTokens.textFieldHintIconColor, _Combobox.comboboxNewTokens.dividerColor, _Combobox.comboboxNewTokens.itemIconColor, _Combobox.comboboxNewTokens.checkboxFillColor, _Combobox.comboboxNewTokens.checkboxIconColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderCheckedColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderColor),
+            ], _Combobox.comboboxNewTokens.textFieldColor, _Combobox.comboboxNewTokens.textFieldClearColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColor, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldBackgroundColor, _Combobox.comboboxNewTokens.textFieldBackgroundColorFocus, _Combobox.comboboxNewTokens.textFieldCaretColor, _Combobox.comboboxNewTokens.textFieldTextBeforeColor, _Combobox.comboboxNewTokens.textFieldTextAfterColor, _Combobox.comboboxNewTokens.textFieldLabelColor, _Combobox.comboboxNewTokens.textFieldLeftHelperColor, _Combobox.comboboxNewTokens.textFieldFocusColor, _Combobox.comboboxNewTokens.textFieldContentSlotColor, _Combobox.comboboxNewTokens.textFieldContentSlotColorHover, _Combobox.comboboxNewTokens.textFieldContentSlotColorActive, _Combobox.comboboxNewTokens.textFieldIndicatorColor, _Combobox.comboboxNewTokens.textFieldOptionalColor, _Combobox.comboboxNewTokens.textFieldChipCloseIconColor, _Combobox.comboboxNewTokens.textFieldChipCloseIconColorHover, _Combobox.comboboxNewTokens.textFieldChipCloseIconColorReadonly, _Combobox.comboboxNewTokens.textFieldChipColor, _Combobox.comboboxNewTokens.textFieldChipBackground, _Combobox.comboboxNewTokens.textFieldChipColorHover, _Combobox.comboboxNewTokens.textFieldChipBackgroundHover, _Combobox.comboboxNewTokens.textFieldChipColorActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnly, _Combobox.comboboxNewTokens.textFieldChipColorReadOnly, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipColorReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipOpacityReadonly, _Combobox.comboboxNewTokens.disclosureIconColor, _Combobox.comboboxNewTokens.disclosureIconColorHover, _Combobox.comboboxNewTokens.itemBackgroundHover, _Combobox.comboboxNewTokens.textFieldHintIconColor, _Combobox.comboboxNewTokens.dividerColor, _Combobox.comboboxNewTokens.itemIconColor, _Combobox.comboboxNewTokens.checkboxFillColor, _Combobox.comboboxNewTokens.checkboxIconColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderCheckedColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderColor),
             warning: (0, _styledcomponents.css)([
                 "",
                 ":var(--text-primary);",
@@ -128,6 +132,8 @@ var config = {
                 ":var(--surface-negative);",
                 ":var(--text-tertiary);",
                 ":var(--text-secondary);",
+                ":var(--text-secondary-hover);",
+                ":var(--text-secondary);",
                 ":var(--text-primary);",
                 ":var(--surface-transparent-secondary);",
                 ":var(--text-primary);",
@@ -149,7 +155,7 @@ var config = {
                 ":var(--on-dark-text-primary);",
                 ":transparent;",
                 ":var(--text-secondary);"
-            ], _Combobox.comboboxNewTokens.textFieldColor, _Combobox.comboboxNewTokens.textFieldClearColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColor, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldBackgroundColor, _Combobox.comboboxNewTokens.textFieldBackgroundColorFocus, _Combobox.comboboxNewTokens.textFieldCaretColor, _Combobox.comboboxNewTokens.textFieldTextBeforeColor, _Combobox.comboboxNewTokens.textFieldTextAfterColor, _Combobox.comboboxNewTokens.textFieldLabelColor, _Combobox.comboboxNewTokens.textFieldLeftHelperColor, _Combobox.comboboxNewTokens.textFieldFocusColor, _Combobox.comboboxNewTokens.textFieldContentSlotColor, _Combobox.comboboxNewTokens.textFieldContentSlotColorHover, _Combobox.comboboxNewTokens.textFieldContentSlotColorActive, _Combobox.comboboxNewTokens.textFieldIndicatorColor, _Combobox.comboboxNewTokens.textFieldOptionalColor, _Combobox.comboboxNewTokens.textFieldChipCloseIconColor, _Combobox.comboboxNewTokens.textFieldChipColor, _Combobox.comboboxNewTokens.textFieldChipBackground, _Combobox.comboboxNewTokens.textFieldChipColorHover, _Combobox.comboboxNewTokens.textFieldChipBackgroundHover, _Combobox.comboboxNewTokens.textFieldChipColorActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnly, _Combobox.comboboxNewTokens.textFieldChipColorReadOnly, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipColorReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipOpacityReadonly, _Combobox.comboboxNewTokens.disclosureIconColor, _Combobox.comboboxNewTokens.disclosureIconColorHover, _Combobox.comboboxNewTokens.itemBackgroundHover, _Combobox.comboboxNewTokens.textFieldHintIconColor, _Combobox.comboboxNewTokens.dividerColor, _Combobox.comboboxNewTokens.itemIconColor, _Combobox.comboboxNewTokens.checkboxFillColor, _Combobox.comboboxNewTokens.checkboxIconColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderCheckedColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderColor),
+            ], _Combobox.comboboxNewTokens.textFieldColor, _Combobox.comboboxNewTokens.textFieldClearColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColor, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldBackgroundColor, _Combobox.comboboxNewTokens.textFieldBackgroundColorFocus, _Combobox.comboboxNewTokens.textFieldCaretColor, _Combobox.comboboxNewTokens.textFieldTextBeforeColor, _Combobox.comboboxNewTokens.textFieldTextAfterColor, _Combobox.comboboxNewTokens.textFieldLabelColor, _Combobox.comboboxNewTokens.textFieldLeftHelperColor, _Combobox.comboboxNewTokens.textFieldFocusColor, _Combobox.comboboxNewTokens.textFieldContentSlotColor, _Combobox.comboboxNewTokens.textFieldContentSlotColorHover, _Combobox.comboboxNewTokens.textFieldContentSlotColorActive, _Combobox.comboboxNewTokens.textFieldIndicatorColor, _Combobox.comboboxNewTokens.textFieldOptionalColor, _Combobox.comboboxNewTokens.textFieldChipCloseIconColor, _Combobox.comboboxNewTokens.textFieldChipCloseIconColorHover, _Combobox.comboboxNewTokens.textFieldChipCloseIconColorReadonly, _Combobox.comboboxNewTokens.textFieldChipColor, _Combobox.comboboxNewTokens.textFieldChipBackground, _Combobox.comboboxNewTokens.textFieldChipColorHover, _Combobox.comboboxNewTokens.textFieldChipBackgroundHover, _Combobox.comboboxNewTokens.textFieldChipColorActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnly, _Combobox.comboboxNewTokens.textFieldChipColorReadOnly, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipColorReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipOpacityReadonly, _Combobox.comboboxNewTokens.disclosureIconColor, _Combobox.comboboxNewTokens.disclosureIconColorHover, _Combobox.comboboxNewTokens.itemBackgroundHover, _Combobox.comboboxNewTokens.textFieldHintIconColor, _Combobox.comboboxNewTokens.dividerColor, _Combobox.comboboxNewTokens.itemIconColor, _Combobox.comboboxNewTokens.checkboxFillColor, _Combobox.comboboxNewTokens.checkboxIconColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderCheckedColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderColor),
             negative: (0, _styledcomponents.css)([
                 "",
                 ":var(--text-primary);",
@@ -172,6 +178,8 @@ var config = {
                 ":var(--surface-negative);",
                 ":var(--text-tertiary);",
                 ":var(--text-secondary);",
+                ":var(--text-secondary-hover);",
+                ":var(--text-secondary);",
                 ":var(--text-primary);",
                 ":var(--surface-transparent-secondary);",
                 ":var(--text-primary);",
@@ -193,7 +201,7 @@ var config = {
                 ":var(--on-dark-text-primary);",
                 ":transparent;",
                 ":var(--text-secondary);"
-            ], _Combobox.comboboxNewTokens.textFieldColor, _Combobox.comboboxNewTokens.textFieldClearColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColor, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldBackgroundColor, _Combobox.comboboxNewTokens.textFieldBackgroundColorFocus, _Combobox.comboboxNewTokens.textFieldCaretColor, _Combobox.comboboxNewTokens.textFieldTextBeforeColor, _Combobox.comboboxNewTokens.textFieldTextAfterColor, _Combobox.comboboxNewTokens.textFieldLabelColor, _Combobox.comboboxNewTokens.textFieldLeftHelperColor, _Combobox.comboboxNewTokens.textFieldFocusColor, _Combobox.comboboxNewTokens.textFieldContentSlotColor, _Combobox.comboboxNewTokens.textFieldContentSlotColorHover, _Combobox.comboboxNewTokens.textFieldContentSlotColorActive, _Combobox.comboboxNewTokens.textFieldIndicatorColor, _Combobox.comboboxNewTokens.textFieldOptionalColor, _Combobox.comboboxNewTokens.textFieldChipCloseIconColor, _Combobox.comboboxNewTokens.textFieldChipColor, _Combobox.comboboxNewTokens.textFieldChipBackground, _Combobox.comboboxNewTokens.textFieldChipColorHover, _Combobox.comboboxNewTokens.textFieldChipBackgroundHover, _Combobox.comboboxNewTokens.textFieldChipColorActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnly, _Combobox.comboboxNewTokens.textFieldChipColorReadOnly, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipColorReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipOpacityReadonly, _Combobox.comboboxNewTokens.disclosureIconColor, _Combobox.comboboxNewTokens.disclosureIconColorHover, _Combobox.comboboxNewTokens.itemBackgroundHover, _Combobox.comboboxNewTokens.textFieldHintIconColor, _Combobox.comboboxNewTokens.dividerColor, _Combobox.comboboxNewTokens.itemIconColor, _Combobox.comboboxNewTokens.checkboxFillColor, _Combobox.comboboxNewTokens.checkboxIconColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderCheckedColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderColor)
+            ], _Combobox.comboboxNewTokens.textFieldColor, _Combobox.comboboxNewTokens.textFieldClearColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColor, _Combobox.comboboxNewTokens.textFieldPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColor, _Combobox.comboboxNewTokens.textFieldClearPlaceholderColorFocus, _Combobox.comboboxNewTokens.textFieldBackgroundColor, _Combobox.comboboxNewTokens.textFieldBackgroundColorFocus, _Combobox.comboboxNewTokens.textFieldCaretColor, _Combobox.comboboxNewTokens.textFieldTextBeforeColor, _Combobox.comboboxNewTokens.textFieldTextAfterColor, _Combobox.comboboxNewTokens.textFieldLabelColor, _Combobox.comboboxNewTokens.textFieldLeftHelperColor, _Combobox.comboboxNewTokens.textFieldFocusColor, _Combobox.comboboxNewTokens.textFieldContentSlotColor, _Combobox.comboboxNewTokens.textFieldContentSlotColorHover, _Combobox.comboboxNewTokens.textFieldContentSlotColorActive, _Combobox.comboboxNewTokens.textFieldIndicatorColor, _Combobox.comboboxNewTokens.textFieldOptionalColor, _Combobox.comboboxNewTokens.textFieldChipCloseIconColor, _Combobox.comboboxNewTokens.textFieldChipCloseIconColorHover, _Combobox.comboboxNewTokens.textFieldChipCloseIconColorReadonly, _Combobox.comboboxNewTokens.textFieldChipColor, _Combobox.comboboxNewTokens.textFieldChipBackground, _Combobox.comboboxNewTokens.textFieldChipColorHover, _Combobox.comboboxNewTokens.textFieldChipBackgroundHover, _Combobox.comboboxNewTokens.textFieldChipColorActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundActive, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnly, _Combobox.comboboxNewTokens.textFieldChipColorReadOnly, _Combobox.comboboxNewTokens.textFieldChipBackgroundReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipColorReadOnlyHover, _Combobox.comboboxNewTokens.textFieldChipOpacityReadonly, _Combobox.comboboxNewTokens.disclosureIconColor, _Combobox.comboboxNewTokens.disclosureIconColorHover, _Combobox.comboboxNewTokens.itemBackgroundHover, _Combobox.comboboxNewTokens.textFieldHintIconColor, _Combobox.comboboxNewTokens.dividerColor, _Combobox.comboboxNewTokens.itemIconColor, _Combobox.comboboxNewTokens.checkboxFillColor, _Combobox.comboboxNewTokens.checkboxIconColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderCheckedColor, _Combobox.comboboxNewTokens.checkboxTriggerBorderColor)
         },
         size: {
             l: (0, _styledcomponents.css)([

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

@@ -1 +1,16 @@
 "use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Combobox", {
+    enumerable: true,
+    get: function() {
+        return Combobox;
+    }
+});
+var _engines = require("../../../engines");
+var _ = require("../../..");
+var _Comboboxconfig = require("./Combobox.config");
+var mergedConfig = (0, _engines.mergeConfig)(_.comboboxNewConfig, _Comboboxconfig.config);
+var ComboboxComponent = (0, _engines.component)(mergedConfig);
+var Combobox = ComboboxComponent;

package/styled-components/cjs/examples/components/ProgressBarCircular/ProgressBarCircular.config.js

@@ -0,0 +1,151 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "config", {
+    enumerable: true,
+    get: function() {
+        return config;
+    }
+});
+var _styledcomponents = require("styled-components");
+var _ProgressBarCircular = require("../../../components/ProgressBarCircular");
+var config = {
+    defaults: {
+        view: 'default',
+        size: 'm'
+    },
+    variations: {
+        view: {
+            default: (0, _styledcomponents.css)([
+                "",
+                ":var(--surface-transparent-tertiary);",
+                ":var(--surface-solid-default);",
+                ":var(--text-primary);"
+            ], _ProgressBarCircular.progressBarCircularTokens.backgroundStroke, _ProgressBarCircular.progressBarCircularTokens.progressStroke, _ProgressBarCircular.progressBarCircularTokens.contentColor),
+            secondary: (0, _styledcomponents.css)([
+                "",
+                ":var(--surface-transparent-tertiary);",
+                ":var(--surface-transparent-secondary);",
+                ":var(--text-primary);"
+            ], _ProgressBarCircular.progressBarCircularTokens.backgroundStroke, _ProgressBarCircular.progressBarCircularTokens.progressStroke, _ProgressBarCircular.progressBarCircularTokens.contentColor),
+            accent: (0, _styledcomponents.css)([
+                "",
+                ":var(--surface-transparent-tertiary);",
+                ":var(--surface-accent);",
+                ":var(--text-primary);"
+            ], _ProgressBarCircular.progressBarCircularTokens.backgroundStroke, _ProgressBarCircular.progressBarCircularTokens.progressStroke, _ProgressBarCircular.progressBarCircularTokens.contentColor),
+            positive: (0, _styledcomponents.css)([
+                "",
+                ":var(--surface-transparent-tertiary);",
+                ":var(--surface-positive);",
+                ":var(--text-primary);"
+            ], _ProgressBarCircular.progressBarCircularTokens.backgroundStroke, _ProgressBarCircular.progressBarCircularTokens.progressStroke, _ProgressBarCircular.progressBarCircularTokens.contentColor),
+            warning: (0, _styledcomponents.css)([
+                "",
+                ":var(--surface-transparent-tertiary);",
+                ":var(--surface-warning);",
+                ":var(--text-primary);"
+            ], _ProgressBarCircular.progressBarCircularTokens.backgroundStroke, _ProgressBarCircular.progressBarCircularTokens.progressStroke, _ProgressBarCircular.progressBarCircularTokens.contentColor),
+            negative: (0, _styledcomponents.css)([
+                "",
+                ":var(--surface-transparent-tertiary);",
+                ":var(--surface-negative);",
+                ":var(--text-primary);"
+            ], _ProgressBarCircular.progressBarCircularTokens.backgroundStroke, _ProgressBarCircular.progressBarCircularTokens.progressStroke, _ProgressBarCircular.progressBarCircularTokens.contentColor)
+        },
+        size: {
+            xxl: (0, _styledcomponents.css)([
+                "",
+                ":8rem;",
+                ":8rem;",
+                ":0.25rem;",
+                ":0.25rem;",
+                ":var(--plasma-typo-h2-font-family);",
+                ":var(--plasma-typo-h2-font-size);",
+                ":var(--plasma-typo-h2-font-style);",
+                ":var(--plasma-typo-h2-bold-font-weight);",
+                ":var(--plasma-typo-h2-letter-spacing);",
+                ":var(--plasma-typo-h2-line-height);"
+            ], _ProgressBarCircular.progressBarCircularTokens.width, _ProgressBarCircular.progressBarCircularTokens.height, _ProgressBarCircular.progressBarCircularTokens.backgroundStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.progressStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.contentFontFamily, _ProgressBarCircular.progressBarCircularTokens.contentFontSize, _ProgressBarCircular.progressBarCircularTokens.contentFontStyle, _ProgressBarCircular.progressBarCircularTokens.contentFontWeight, _ProgressBarCircular.progressBarCircularTokens.contentLetterSpacing, _ProgressBarCircular.progressBarCircularTokens.contentLineHeight),
+            xl: (0, _styledcomponents.css)([
+                "",
+                ":5.5rem;",
+                ":5.5rem;",
+                ":0.25rem;",
+                ":0.25rem;",
+                ":var(--plasma-typo-h5-font-family);",
+                ":var(--plasma-typo-h5-font-size);",
+                ":var(--plasma-typo-h5-font-style);",
+                ":var(--plasma-typo-h5-bold-font-weight);",
+                ":var(--plasma-typo-h5-letter-spacing);",
+                ":var(--plasma-typo-h5-line-height);"
+            ], _ProgressBarCircular.progressBarCircularTokens.width, _ProgressBarCircular.progressBarCircularTokens.height, _ProgressBarCircular.progressBarCircularTokens.backgroundStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.progressStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.contentFontFamily, _ProgressBarCircular.progressBarCircularTokens.contentFontSize, _ProgressBarCircular.progressBarCircularTokens.contentFontStyle, _ProgressBarCircular.progressBarCircularTokens.contentFontWeight, _ProgressBarCircular.progressBarCircularTokens.contentLetterSpacing, _ProgressBarCircular.progressBarCircularTokens.contentLineHeight),
+            l: (0, _styledcomponents.css)([
+                "",
+                ":3.5rem;",
+                ":3.5rem;",
+                ":0.125rem;",
+                ":0.125rem;",
+                ":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-body-font-weight);",
+                ":var(--plasma-typo-body-l-letter-spacing);",
+                ":var(--plasma-typo-body-l-line-height);"
+            ], _ProgressBarCircular.progressBarCircularTokens.width, _ProgressBarCircular.progressBarCircularTokens.height, _ProgressBarCircular.progressBarCircularTokens.backgroundStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.progressStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.contentFontFamily, _ProgressBarCircular.progressBarCircularTokens.contentFontSize, _ProgressBarCircular.progressBarCircularTokens.contentFontStyle, _ProgressBarCircular.progressBarCircularTokens.contentFontWeight, _ProgressBarCircular.progressBarCircularTokens.contentLetterSpacing, _ProgressBarCircular.progressBarCircularTokens.contentLineHeight),
+            m: (0, _styledcomponents.css)([
+                "",
+                ":3rem;",
+                ":3rem;",
+                ":0.125rem;",
+                ":0.125rem;",
+                ":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-body-font-weight);",
+                ":var(--plasma-typo-body-m-letter-spacing);",
+                ":var(--plasma-typo-body-m-line-height);"
+            ], _ProgressBarCircular.progressBarCircularTokens.width, _ProgressBarCircular.progressBarCircularTokens.height, _ProgressBarCircular.progressBarCircularTokens.backgroundStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.progressStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.contentFontFamily, _ProgressBarCircular.progressBarCircularTokens.contentFontSize, _ProgressBarCircular.progressBarCircularTokens.contentFontStyle, _ProgressBarCircular.progressBarCircularTokens.contentFontWeight, _ProgressBarCircular.progressBarCircularTokens.contentLetterSpacing, _ProgressBarCircular.progressBarCircularTokens.contentLineHeight),
+            s: (0, _styledcomponents.css)([
+                "",
+                ":2.25rem;",
+                ":2.25rem;",
+                ":0.125rem;",
+                ":0.125rem;",
+                ":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-body-font-weight);",
+                ":var(--plasma-typo-body-s-letter-spacing);",
+                ":var(--plasma-typo-body-s-line-height);"
+            ], _ProgressBarCircular.progressBarCircularTokens.width, _ProgressBarCircular.progressBarCircularTokens.height, _ProgressBarCircular.progressBarCircularTokens.backgroundStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.progressStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.contentFontFamily, _ProgressBarCircular.progressBarCircularTokens.contentFontSize, _ProgressBarCircular.progressBarCircularTokens.contentFontStyle, _ProgressBarCircular.progressBarCircularTokens.contentFontWeight, _ProgressBarCircular.progressBarCircularTokens.contentLetterSpacing, _ProgressBarCircular.progressBarCircularTokens.contentLineHeight),
+            xs: (0, _styledcomponents.css)([
+                "",
+                ":1.5rem;",
+                ":1.5rem;",
+                ":0.125rem;",
+                ":0.125rem;",
+                ":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-body-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);"
+            ], _ProgressBarCircular.progressBarCircularTokens.width, _ProgressBarCircular.progressBarCircularTokens.height, _ProgressBarCircular.progressBarCircularTokens.backgroundStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.progressStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.contentFontFamily, _ProgressBarCircular.progressBarCircularTokens.contentFontSize, _ProgressBarCircular.progressBarCircularTokens.contentFontStyle, _ProgressBarCircular.progressBarCircularTokens.contentFontWeight, _ProgressBarCircular.progressBarCircularTokens.contentLetterSpacing, _ProgressBarCircular.progressBarCircularTokens.contentLineHeight),
+            xxs: (0, _styledcomponents.css)([
+                "",
+                ":1rem;",
+                ":1rem;",
+                ":0.125rem;",
+                ":0.125rem;",
+                ":var(--plasma-typo-body-xxs-font-family);",
+                ":var(--plasma-typo-body-xxs-font-size);",
+                ":var(--plasma-typo-body-xxs-font-style);",
+                ":var(--plasma-typo-body-xxs-body-font-weight);",
+                ":var(--plasma-typo-body-xxs-letter-spacing);",
+                ":var(--plasma-typo-body-xxs-line-height);"
+            ], _ProgressBarCircular.progressBarCircularTokens.width, _ProgressBarCircular.progressBarCircularTokens.height, _ProgressBarCircular.progressBarCircularTokens.backgroundStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.progressStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.contentFontFamily, _ProgressBarCircular.progressBarCircularTokens.contentFontSize, _ProgressBarCircular.progressBarCircularTokens.contentFontStyle, _ProgressBarCircular.progressBarCircularTokens.contentFontWeight, _ProgressBarCircular.progressBarCircularTokens.contentLetterSpacing, _ProgressBarCircular.progressBarCircularTokens.contentLineHeight)
+        }
+    }
+};

package/styled-components/cjs/examples/components/ProgressBarCircular/ProgressBarCircular.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "ProgressBarCircular", {
+    enumerable: true,
+    get: function() {
+        return ProgressBarCircular;
+    }
+});
+var _ProgressBarCircular = require("../../../components/ProgressBarCircular");
+var _engines = require("../../../engines");
+var _ProgressBarCircularconfig = require("./ProgressBarCircular.config");
+var mergedConfig = (0, _engines.mergeConfig)(_ProgressBarCircular.progressBarCircularConfig, _ProgressBarCircularconfig.config);
+var ProgressBarCircular = (0, _engines.component)(mergedConfig);

package/styled-components/cjs/examples/components/Scrollbar/Scrollbar.config.js

@@ -0,0 +1,93 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "config", {
+    enumerable: true,
+    get: function() {
+        return config;
+    }
+});
+var _styledcomponents = require("styled-components");
+var _ProgressBarCircular = require("../../../components/ProgressBarCircular");
+var config = {
+    defaults: {
+        view: 'default',
+        size: 'm'
+    },
+    variations: {
+        view: {
+            default: (0, _styledcomponents.css)([
+                "",
+                ":var(--surface-solid-tertiary);",
+                ":var(--surface-accent);",
+                ":var(--text-primary);"
+            ], _ProgressBarCircular.progressBarCircularTokens.backgroundStroke, _ProgressBarCircular.progressBarCircularTokens.progressStroke, _ProgressBarCircular.progressBarCircularTokens.contentColor),
+            accent: (0, _styledcomponents.css)([
+                "",
+                ":var(--surface-solid-tertiary);",
+                ":var(--surface-accent);",
+                ":var(--on-dark-text-primary);"
+            ], _ProgressBarCircular.progressBarCircularTokens.backgroundStroke, _ProgressBarCircular.progressBarCircularTokens.progressStroke, _ProgressBarCircular.progressBarCircularTokens.contentColor),
+            positive: (0, _styledcomponents.css)([
+                "",
+                ":var(--surface-solid-tertiary);",
+                ":var(--surface-positive);",
+                ":var(--text-primary);"
+            ], _ProgressBarCircular.progressBarCircularTokens.backgroundStroke, _ProgressBarCircular.progressBarCircularTokens.progressStroke, _ProgressBarCircular.progressBarCircularTokens.contentColor),
+            warning: (0, _styledcomponents.css)([
+                "",
+                ":var(--surface-solid-tertiary);",
+                ":var(--surface-warning);",
+                ":var(--text-primary);"
+            ], _ProgressBarCircular.progressBarCircularTokens.backgroundStroke, _ProgressBarCircular.progressBarCircularTokens.progressStroke, _ProgressBarCircular.progressBarCircularTokens.contentColor),
+            negative: (0, _styledcomponents.css)([
+                "",
+                ":var(--surface-solid-tertiary);",
+                ":var(--surface-negative);",
+                ":var(--text-primary);"
+            ], _ProgressBarCircular.progressBarCircularTokens.backgroundStroke, _ProgressBarCircular.progressBarCircularTokens.progressStroke, _ProgressBarCircular.progressBarCircularTokens.contentColor)
+        },
+        size: {
+            l: (0, _styledcomponents.css)([
+                "",
+                ":4rem;",
+                ":4rem;",
+                ":0.5rem;",
+                ":0.5rem;",
+                ":var(--plasma-typo-body-l-font-family);",
+                ":var(--plasma-typo-body-l-font-size);",
+                ":var(--plasma-typo-body-l-font-style);",
+                ":var(--plasma-typo-body-l-font-weight);",
+                ":var(--plasma-typo-body-l-letter-spacing);",
+                ":var(--plasma-typo-body-l-line-height);"
+            ], _ProgressBarCircular.progressBarCircularTokens.width, _ProgressBarCircular.progressBarCircularTokens.height, _ProgressBarCircular.progressBarCircularTokens.backgroundStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.progressStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.contentFontFamily, _ProgressBarCircular.progressBarCircularTokens.contentFontSize, _ProgressBarCircular.progressBarCircularTokens.contentFontStyle, _ProgressBarCircular.progressBarCircularTokens.contentFontWeight, _ProgressBarCircular.progressBarCircularTokens.contentLetterSpacing, _ProgressBarCircular.progressBarCircularTokens.contentLineHeight),
+            m: (0, _styledcomponents.css)([
+                "",
+                ":3rem;",
+                ":3rem;",
+                ":0.375rem;",
+                ":0.375rem;",
+                ":var(--plasma-typo-body-m-font-family);",
+                ":var(--plasma-typo-body-m-font-size);",
+                ":var(--plasma-typo-body-m-font-style);",
+                ":var(--plasma-typo-body-m-font-weight);",
+                ":var(--plasma-typo-body-m-letter-spacing);",
+                ":var(--plasma-typo-body-m-line-height);"
+            ], _ProgressBarCircular.progressBarCircularTokens.width, _ProgressBarCircular.progressBarCircularTokens.height, _ProgressBarCircular.progressBarCircularTokens.backgroundStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.progressStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.contentFontFamily, _ProgressBarCircular.progressBarCircularTokens.contentFontSize, _ProgressBarCircular.progressBarCircularTokens.contentFontStyle, _ProgressBarCircular.progressBarCircularTokens.contentFontWeight, _ProgressBarCircular.progressBarCircularTokens.contentLetterSpacing, _ProgressBarCircular.progressBarCircularTokens.contentLineHeight),
+            s: (0, _styledcomponents.css)([
+                "",
+                ":2rem;",
+                ":2rem;",
+                ":0.25rem;",
+                ":0.25rem;",
+                ":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);"
+            ], _ProgressBarCircular.progressBarCircularTokens.width, _ProgressBarCircular.progressBarCircularTokens.height, _ProgressBarCircular.progressBarCircularTokens.backgroundStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.progressStrokeWidth, _ProgressBarCircular.progressBarCircularTokens.contentFontFamily, _ProgressBarCircular.progressBarCircularTokens.contentFontSize, _ProgressBarCircular.progressBarCircularTokens.contentFontStyle, _ProgressBarCircular.progressBarCircularTokens.contentFontWeight, _ProgressBarCircular.progressBarCircularTokens.contentLetterSpacing, _ProgressBarCircular.progressBarCircularTokens.contentLineHeight)
+        }
+    }
+};

package/styled-components/cjs/examples/components/Scrollbar/Scrollbar.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Scrollbar", {
+    enumerable: true,
+    get: function() {
+        return Scrollbar;
+    }
+});
+var _Scrollbar = require("../../../components/Scrollbar");
+var _engines = require("../../../engines");
+var _Scrollbarconfig = require("./Scrollbar.config");
+var mergedConfig = (0, _engines.mergeConfig)(_Scrollbar.scrollbarConfig, _Scrollbarconfig.config);
+var Scrollbar = (0, _engines.component)(mergedConfig);