@salutejs/sdds-os 0.32.0-next-sbcom.0 → 0.32.0

package/dist/styled-components/cjs/components/Notification/Notification.config.js

@@ -21,175 +21,66 @@ const config = {
                 ${_styledcomponents.notificationTokens.contentLeftIconColor}: var(--text-primary);
                 ${_styledcomponents.notificationTokens.contentColor}: var(--text-secondary);
                 ${_styledcomponents.notificationTokens.background}: var(--surface-solid-card);
-                ${_styledcomponents.notificationTokens.borderRadius}: 0.75rem;
-                ${_styledcomponents.notificationTokens.padding}: 0.375rem;
-
-                ${_styledcomponents.notificationTokens.contentPaddingTop}: 0.125rem;
-                ${_styledcomponents.notificationTokens.contentPaddingRight}: 0.25rem;
-                ${_styledcomponents.notificationTokens.contentPaddingBottom}: 0rem;
-                ${_styledcomponents.notificationTokens.contentPaddingLeft}: 0.25rem;
-
-                ${_styledcomponents.notificationTokens.contentPaddingTopWithoutIcon}: 0.25rem;
-                ${_styledcomponents.notificationTokens.horizontalLayoutRightPaddingWithoutCloseIcon}: 1rem;
-
-                ${_styledcomponents.notificationTokens.textboxPaddingTop}: 0.1875rem;
-                ${_styledcomponents.notificationTokens.textboxPaddingRight}: 0.125rem;
-                ${_styledcomponents.notificationTokens.textboxPaddingBottom}: 0.375rem;
-                ${_styledcomponents.notificationTokens.textboxPaddingLeft}: 0.125rem;
-
-                ${_styledcomponents.notificationTokens.textboxPaddingRightWithCloseIcon}: 1.625rem;
-                ${_styledcomponents.notificationTokens.textboxGap}: 0.25rem;
-
-                ${_styledcomponents.notificationTokens.closeIconTop}: 0.5rem;
-                ${_styledcomponents.notificationTokens.closeIconRight}: 0.5rem;
-
-                ${_styledcomponents.notificationTokens.buttonsMarginTop}: 0.375rem;
-
-                ${_styledcomponents.notificationTokens.contentLeftIconSize}: 1.5rem;
-                ${_styledcomponents.notificationTokens.contentLeftIconMargin}: 0.375rem;
-                ${_styledcomponents.notificationTokens.contentTopIconMargin}: 0.5rem;
-
-                ${_styledcomponents.notificationTokens.contentFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.notificationTokens.contentFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.notificationTokens.contentFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.notificationTokens.contentFontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_styledcomponents.notificationTokens.contentFontLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.notificationTokens.contentFontLineHeight}: var(--plasma-typo-body-s-line-height);
-
-                ${_styledcomponents.notificationTokens.titleFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.notificationTokens.titleFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.notificationTokens.titleFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.notificationTokens.titleFontWeight}: var(--plasma-typo-body-s-bold-font-weight);
-                ${_styledcomponents.notificationTokens.titleFontLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.notificationTokens.titleFontLineHeight}: var(--plasma-typo-body-s-line-height);
 
                 ${_styledcomponents.notificationTokens.closeIconColor}: var(--text-tertiary);
                 ${_styledcomponents.notificationTokens.closeIconColorOnHover}: var(--text-primary);
-
-                ${_styledcomponents.notificationTokens.horizontalLayoutGap}: 0.375rem;
-                ${_styledcomponents.notificationTokens.horizontalLayoutLeftIconMargin}: 0.75rem;
-                ${_styledcomponents.notificationTokens.paddingOneLineTextbox}: 0.8125rem 0.5rem 0.8125rem 0.875rem;
             `,
             negative: (0, _styledcomponents.css)`
                 ${_styledcomponents.notificationTokens.titleColor}: var(--text-negative);
                 ${_styledcomponents.notificationTokens.contentLeftIconColor}: var(--text-negative);
                 ${_styledcomponents.notificationTokens.contentColor}: var(--text-secondary);
                 ${_styledcomponents.notificationTokens.background}: var(--surface-solid-card);
-                ${_styledcomponents.notificationTokens.borderRadius}: 0.75rem;
-                ${_styledcomponents.notificationTokens.padding}: 0.375rem;
-
-                ${_styledcomponents.notificationTokens.contentPaddingTop}: 0.125rem;
-                ${_styledcomponents.notificationTokens.contentPaddingRight}: 0.25rem;
-                ${_styledcomponents.notificationTokens.contentPaddingBottom}: 0rem;
-                ${_styledcomponents.notificationTokens.contentPaddingLeft}: 0.25rem;
-
-                ${_styledcomponents.notificationTokens.contentPaddingTopWithoutIcon}: 0.25rem;
-                ${_styledcomponents.notificationTokens.horizontalLayoutRightPaddingWithoutCloseIcon}: 1rem;
-
-                ${_styledcomponents.notificationTokens.textboxPaddingTop}: 0.1875rem;
-                ${_styledcomponents.notificationTokens.textboxPaddingRight}: 0.125rem;
-                ${_styledcomponents.notificationTokens.textboxPaddingBottom}: 0.375rem;
-                ${_styledcomponents.notificationTokens.textboxPaddingLeft}: 0.125rem;
-
-                ${_styledcomponents.notificationTokens.textboxPaddingRightWithCloseIcon}: 1.625rem;
-                ${_styledcomponents.notificationTokens.textboxGap}: 0.25rem;
-
-                ${_styledcomponents.notificationTokens.closeIconTop}: 0.5rem;
-                ${_styledcomponents.notificationTokens.closeIconRight}: 0.5rem;
-
-                ${_styledcomponents.notificationTokens.buttonsMarginTop}: 0.375rem;
-
-                ${_styledcomponents.notificationTokens.contentLeftIconSize}: 1.5rem;
-                ${_styledcomponents.notificationTokens.contentLeftIconMargin}: 0.375rem;
-                ${_styledcomponents.notificationTokens.contentTopIconMargin}: 0.5rem;
-
-                ${_styledcomponents.notificationTokens.contentFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.notificationTokens.contentFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.notificationTokens.contentFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.notificationTokens.contentFontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_styledcomponents.notificationTokens.contentFontLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.notificationTokens.contentFontLineHeight}: var(--plasma-typo-body-s-line-height);
-
-                ${_styledcomponents.notificationTokens.titleFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.notificationTokens.titleFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.notificationTokens.titleFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.notificationTokens.titleFontWeight}: var(--plasma-typo-body-s-bold-font-weight);
-                ${_styledcomponents.notificationTokens.titleFontLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.notificationTokens.titleFontLineHeight}: var(--plasma-typo-body-s-line-height);
 
                 ${_styledcomponents.notificationTokens.closeIconColor}: var(--text-tertiary);
                 ${_styledcomponents.notificationTokens.closeIconColorOnHover}: var(--text-primary);
-
-                ${_styledcomponents.notificationTokens.horizontalLayoutGap}: 0.375rem;
-                ${_styledcomponents.notificationTokens.horizontalLayoutLeftIconMargin}: 0.75rem;
-                ${_styledcomponents.notificationTokens.paddingOneLineTextbox}: 0.8125rem 0.5rem 0.8125rem 0.875rem;
             `,
             positive: (0, _styledcomponents.css)`
                 ${_styledcomponents.notificationTokens.titleColor}: var(--text-positive);
                 ${_styledcomponents.notificationTokens.contentLeftIconColor}: var(--text-positive);
                 ${_styledcomponents.notificationTokens.contentColor}: var(--text-secondary);
                 ${_styledcomponents.notificationTokens.background}: var(--surface-solid-card);
-                ${_styledcomponents.notificationTokens.borderRadius}: 0.75rem;
-                ${_styledcomponents.notificationTokens.padding}: 0.375rem;
-
-                ${_styledcomponents.notificationTokens.contentPaddingTop}: 0.125rem;
-                ${_styledcomponents.notificationTokens.contentPaddingRight}: 0.25rem;
-                ${_styledcomponents.notificationTokens.contentPaddingBottom}: 0rem;
-                ${_styledcomponents.notificationTokens.contentPaddingLeft}: 0.25rem;
-
-                ${_styledcomponents.notificationTokens.contentPaddingTopWithoutIcon}: 0.25rem;
-                ${_styledcomponents.notificationTokens.horizontalLayoutRightPaddingWithoutCloseIcon}: 1rem;
-
-                ${_styledcomponents.notificationTokens.textboxPaddingTop}: 0.1875rem;
-                ${_styledcomponents.notificationTokens.textboxPaddingRight}: 0.125rem;
-                ${_styledcomponents.notificationTokens.textboxPaddingBottom}: 0.375rem;
-                ${_styledcomponents.notificationTokens.textboxPaddingLeft}: 0.125rem;
-
-                ${_styledcomponents.notificationTokens.textboxPaddingRightWithCloseIcon}: 1.625rem;
-                ${_styledcomponents.notificationTokens.textboxGap}: 0.25rem;
-
-                ${_styledcomponents.notificationTokens.closeIconTop}: 0.5rem;
-                ${_styledcomponents.notificationTokens.closeIconRight}: 0.5rem;
-
-                ${_styledcomponents.notificationTokens.buttonsMarginTop}: 0.375rem;
-
-                ${_styledcomponents.notificationTokens.contentLeftIconSize}: 1.5rem;
-                ${_styledcomponents.notificationTokens.contentLeftIconMargin}: 0.375rem;
-                ${_styledcomponents.notificationTokens.contentTopIconMargin}: 0.5rem;
-
-                ${_styledcomponents.notificationTokens.contentFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.notificationTokens.contentFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.notificationTokens.contentFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.notificationTokens.contentFontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_styledcomponents.notificationTokens.contentFontLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.notificationTokens.contentFontLineHeight}: var(--plasma-typo-body-s-line-height);
-
-                ${_styledcomponents.notificationTokens.titleFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.notificationTokens.titleFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.notificationTokens.titleFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.notificationTokens.titleFontWeight}: var(--plasma-typo-body-s-bold-font-weight);
-                ${_styledcomponents.notificationTokens.titleFontLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.notificationTokens.titleFontLineHeight}: var(--plasma-typo-body-s-line-height);
 
                 ${_styledcomponents.notificationTokens.closeIconColor}: var(--text-tertiary);
                 ${_styledcomponents.notificationTokens.closeIconColorOnHover}: var(--text-primary);
-
-                ${_styledcomponents.notificationTokens.horizontalLayoutGap}: 0.375rem;
-                ${_styledcomponents.notificationTokens.horizontalLayoutLeftIconMargin}: 0.75rem;
-                ${_styledcomponents.notificationTokens.paddingOneLineTextbox}: 0.8125rem 0.5rem 0.8125rem 0.875rem;
             `,
             warning: (0, _styledcomponents.css)`
                 ${_styledcomponents.notificationTokens.titleColor}: var(--text-warning);
                 ${_styledcomponents.notificationTokens.contentLeftIconColor}: var(--text-warning);
                 ${_styledcomponents.notificationTokens.contentColor}: var(--text-secondary);
                 ${_styledcomponents.notificationTokens.background}: var(--surface-solid-card);
-                ${_styledcomponents.notificationTokens.borderRadius}: 0.75rem;
-                ${_styledcomponents.notificationTokens.padding}: 0.375rem;
 
-                ${_styledcomponents.notificationTokens.contentPaddingTop}: 0.125rem;
-                ${_styledcomponents.notificationTokens.contentPaddingRight}: 0.25rem;
-                ${_styledcomponents.notificationTokens.contentPaddingBottom}: 0rem;
-                ${_styledcomponents.notificationTokens.contentPaddingLeft}: 0.25rem;
+                ${_styledcomponents.notificationTokens.closeIconColor}: var(--text-tertiary);
+                ${_styledcomponents.notificationTokens.closeIconColorOnHover}: var(--text-primary);
+            `,
+            info: (0, _styledcomponents.css)`
+                ${_styledcomponents.notificationTokens.titleColor}: var(--text-info);
+                ${_styledcomponents.notificationTokens.contentLeftIconColor}: var(--text-info);
+                ${_styledcomponents.notificationTokens.contentColor}: var(--text-secondary);
+                ${_styledcomponents.notificationTokens.background}: var(--surface-solid-card);
+
+                ${_styledcomponents.notificationTokens.closeIconColor}: var(--text-tertiary);
+                ${_styledcomponents.notificationTokens.closeIconColorOnHover}: var(--text-primary);
+            `
+        },
+        layout: {
+            horizontal: (0, _styledcomponents.css)`
+                ${_styledcomponents.notificationTokens.width}: 25rem;
+                ${_styledcomponents.notificationTokens.horizontalLayoutPadding}: 1rem 0.5rem 1rem 0.875rem;
+            `,
+            vertical: (0, _styledcomponents.css)`
+                ${_styledcomponents.notificationTokens.width}: 15rem;
+                ${_styledcomponents.notificationTokens.padding}: 0.375rem;
+            `
+        },
+        closeIconType: {
+            default: (0, _styledcomponents.css)`
+                ${_styledcomponents.notificationTokens.closeIconButtonSize}: 1.5rem;
+                ${_styledcomponents.notificationTokens.closeIconSize}: 1.5rem;
+            `
+        },
+        size: {
+            xs: (0, _styledcomponents.css)`
+                ${_styledcomponents.notificationTokens.borderRadius}: 0.75rem;
 
                 ${_styledcomponents.notificationTokens.contentPaddingTopWithoutIcon}: 0.25rem;
                 ${_styledcomponents.notificationTokens.horizontalLayoutRightPaddingWithoutCloseIcon}: 1rem;
@@ -198,13 +89,9 @@ const config = {
                 ${_styledcomponents.notificationTokens.textboxPaddingRight}: 0.125rem;
                 ${_styledcomponents.notificationTokens.textboxPaddingBottom}: 0.375rem;
                 ${_styledcomponents.notificationTokens.textboxPaddingLeft}: 0.125rem;
-
                 ${_styledcomponents.notificationTokens.textboxPaddingRightWithCloseIcon}: 1.625rem;
                 ${_styledcomponents.notificationTokens.textboxGap}: 0.25rem;
 
-                ${_styledcomponents.notificationTokens.closeIconTop}: 0.5rem;
-                ${_styledcomponents.notificationTokens.closeIconRight}: 0.5rem;
-
                 ${_styledcomponents.notificationTokens.buttonsMarginTop}: 0.375rem;
 
                 ${_styledcomponents.notificationTokens.contentLeftIconSize}: 1.5rem;
@@ -225,26 +112,26 @@ const config = {
                 ${_styledcomponents.notificationTokens.titleFontLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
                 ${_styledcomponents.notificationTokens.titleFontLineHeight}: var(--plasma-typo-body-s-line-height);
 
-                ${_styledcomponents.notificationTokens.closeIconColor}: var(--text-tertiary);
-                ${_styledcomponents.notificationTokens.closeIconColorOnHover}: var(--text-primary);
-
                 ${_styledcomponents.notificationTokens.horizontalLayoutGap}: 0.375rem;
                 ${_styledcomponents.notificationTokens.horizontalLayoutLeftIconMargin}: 0.75rem;
                 ${_styledcomponents.notificationTokens.paddingOneLineTextbox}: 0.8125rem 0.5rem 0.8125rem 0.875rem;
-            `,
-            info: (0, _styledcomponents.css)`
-                ${_styledcomponents.notificationTokens.titleColor}: var(--text-info);
-                ${_styledcomponents.notificationTokens.contentLeftIconColor}: var(--text-info);
-                ${_styledcomponents.notificationTokens.contentColor}: var(--text-secondary);
-                ${_styledcomponents.notificationTokens.background}: var(--surface-solid-card);
-                ${_styledcomponents.notificationTokens.borderRadius}: 0.75rem;
+
+                ${_styledcomponents.notificationTokens.closeIconTop}: 0.5rem;
+                ${_styledcomponents.notificationTokens.closeIconRight}: 0.5rem;
+
                 ${_styledcomponents.notificationTokens.padding}: 0.375rem;
+                ${_styledcomponents.notificationTokens.textboxPaddingTopWithTopIcon}: 0rem;
 
                 ${_styledcomponents.notificationTokens.contentPaddingTop}: 0.125rem;
                 ${_styledcomponents.notificationTokens.contentPaddingRight}: 0.25rem;
                 ${_styledcomponents.notificationTokens.contentPaddingBottom}: 0rem;
                 ${_styledcomponents.notificationTokens.contentPaddingLeft}: 0.25rem;
 
+                ${_styledcomponents.notificationTokens.buttonsMarginLeft}: 0rem;
+            `,
+            xxs: (0, _styledcomponents.css)`
+                ${_styledcomponents.notificationTokens.borderRadius}: 0.75rem;
+
                 ${_styledcomponents.notificationTokens.contentPaddingTopWithoutIcon}: 0.25rem;
                 ${_styledcomponents.notificationTokens.horizontalLayoutRightPaddingWithoutCloseIcon}: 1rem;
 
@@ -252,13 +139,9 @@ const config = {
                 ${_styledcomponents.notificationTokens.textboxPaddingRight}: 0.125rem;
                 ${_styledcomponents.notificationTokens.textboxPaddingBottom}: 0.375rem;
                 ${_styledcomponents.notificationTokens.textboxPaddingLeft}: 0.125rem;
-
                 ${_styledcomponents.notificationTokens.textboxPaddingRightWithCloseIcon}: 1.625rem;
                 ${_styledcomponents.notificationTokens.textboxGap}: 0.25rem;
 
-                ${_styledcomponents.notificationTokens.closeIconTop}: 0.5rem;
-                ${_styledcomponents.notificationTokens.closeIconRight}: 0.5rem;
-
                 ${_styledcomponents.notificationTokens.buttonsMarginTop}: 0.375rem;
 
                 ${_styledcomponents.notificationTokens.contentLeftIconSize}: 1.5rem;
@@ -279,46 +162,10 @@ const config = {
                 ${_styledcomponents.notificationTokens.titleFontLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
                 ${_styledcomponents.notificationTokens.titleFontLineHeight}: var(--plasma-typo-body-s-line-height);
 
-                ${_styledcomponents.notificationTokens.closeIconColor}: var(--text-tertiary);
-                ${_styledcomponents.notificationTokens.closeIconColorOnHover}: var(--text-primary);
-
                 ${_styledcomponents.notificationTokens.horizontalLayoutGap}: 0.375rem;
                 ${_styledcomponents.notificationTokens.horizontalLayoutLeftIconMargin}: 0.75rem;
                 ${_styledcomponents.notificationTokens.paddingOneLineTextbox}: 0.8125rem 0.5rem 0.8125rem 0.875rem;
-            `
-        },
-        layout: {
-            horizontal: (0, _styledcomponents.css)`
-                ${_styledcomponents.notificationTokens.width}: 25rem;
-                ${_styledcomponents.notificationTokens.horizontalLayoutPadding}: 1rem 0.5rem 1rem 0.875rem;
-            `,
-            vertical: (0, _styledcomponents.css)`
-                ${_styledcomponents.notificationTokens.width}: 15rem;
-                ${_styledcomponents.notificationTokens.padding}: 0.375rem;
-            `
-        },
-        closeIconType: {
-            default: (0, _styledcomponents.css)`
-                ${_styledcomponents.notificationTokens.closeIconButtonSize}: 1.5rem;
-                ${_styledcomponents.notificationTokens.closeIconSize}: 1.5rem;
-            `
-        },
-        size: {
-            xs: (0, _styledcomponents.css)`
-                ${_styledcomponents.notificationTokens.closeIconTop}: 0.5rem;
-                ${_styledcomponents.notificationTokens.closeIconRight}: 0.5rem;
-
-                ${_styledcomponents.notificationTokens.padding}: 0.375rem;
-                ${_styledcomponents.notificationTokens.textboxPaddingTopWithTopIcon}: 0rem;
-
-                ${_styledcomponents.notificationTokens.contentPaddingTop}: 0.125rem;
-                ${_styledcomponents.notificationTokens.contentPaddingRight}: 0.25rem;
-                ${_styledcomponents.notificationTokens.contentPaddingBottom}: 0rem;
-                ${_styledcomponents.notificationTokens.contentPaddingLeft}: 0.25rem;
 
-                ${_styledcomponents.notificationTokens.buttonsMarginLeft}: 0rem;
-            `,
-            xxs: (0, _styledcomponents.css)`
                 ${_styledcomponents.notificationTokens.closeIconTop}: 0.8125rem;
                 ${_styledcomponents.notificationTokens.closeIconRight}: 1rem;
 

package/dist/styled-components/cjs/components/Progress/Progress.config.js

@@ -33,14 +33,6 @@ const config = {
                 ${_styledcomponents.progressTokens.valueColor}: var(--text-secondary);
                 ${_styledcomponents.progressTokens.captionColor}: var(--text-secondary);
             `,
-            accent: (0, _styledcomponents.css)`
-                ${_styledcomponents.progressTokens.trackBackgroundColor}: var(--surface-solid-secondary);
-                ${_styledcomponents.progressTokens.progressFilledBackgroundColor}: var(--surface-accent);
-                ${_styledcomponents.progressTokens.labelColor}: var(--text-primary);
-                ${_styledcomponents.progressTokens.labelIconColor}: var(--text-primary);
-                ${_styledcomponents.progressTokens.valueColor}: var(--text-secondary);
-                ${_styledcomponents.progressTokens.captionColor}: var(--text-secondary);
-            `,
             accentGradient: (0, _styledcomponents.css)`
                 ${_styledcomponents.progressTokens.trackBackgroundColor}: var(--surface-solid-secondary);
                 ${_styledcomponents.progressTokens.progressFilledBackgroundColor}: var(--surface-accent-gradient);

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

@@ -26,11 +26,6 @@ const config = {
                 ${_styledcomponents.progressBarCircularTokens.progressStroke}: var(--surface-solid-secondary);
                 ${_styledcomponents.progressBarCircularTokens.contentColor}: var(--text-primary);
             `,
-            accent: (0, _styledcomponents.css)`
-                ${_styledcomponents.progressBarCircularTokens.backgroundStroke}: var(--surface-solid-tertiary);
-                ${_styledcomponents.progressBarCircularTokens.progressStroke}: var(--surface-accent);
-                ${_styledcomponents.progressBarCircularTokens.contentColor}: var(--text-primary);
-            `,
             positive: (0, _styledcomponents.css)`
                 ${_styledcomponents.progressBarCircularTokens.backgroundStroke}: var(--surface-solid-tertiary);
                 ${_styledcomponents.progressBarCircularTokens.progressStroke}: var(--surface-positive);

package/dist/styled-components/cjs/components/Range/Range.config.js

@@ -20,8 +20,12 @@ const config = {
         view: {
             default: (0, _styledcomponents.css)`
                 ${_styledcomponents.rangeTokens.background}: var(--surface-solid-primary);
-                ${_styledcomponents.rangeTokens.backgroundError}: var(--surface-solid-negative);
-                ${_styledcomponents.rangeTokens.backgroundSuccess}: var(--surface-solid-positive);
+                ${_styledcomponents.rangeTokens.backgroundError}: var(--surface-solid-primary);
+                ${_styledcomponents.rangeTokens.backgroundSuccess}: var(--surface-solid-primary);
+
+                ${_styledcomponents.rangeTokens.borderColor}: var(--outline-clear);
+                ${_styledcomponents.rangeTokens.borderColorError}: var(--outline-negative);
+                ${_styledcomponents.rangeTokens.borderColorSuccess}: var(--outline-positive);
 
                 ${_styledcomponents.rangeTokens.dividerColor}: var(--text-primary);
                 ${_styledcomponents.rangeTokens.labelColor}: var(--text-primary);
@@ -52,14 +56,24 @@ const config = {
                 ${_styledcomponents.rangeTokens.textFieldPlaceholderColor}: var(--text-secondary);
                 ${_styledcomponents.rangeTokens.textFieldCaretColor}: var(--text-accent);
 
-                ${_styledcomponents.rangeTokens.textFieldBackgroundColorHover}: var(--surface-solid-primary-hover);
-                ${_styledcomponents.rangeTokens.textFieldBackgroundColorFocus}: var(--surface-solid-secondary);
-                ${_styledcomponents.rangeTokens.textFieldBackgroundErrorColor}: var(--surface-solid-negative);
-                ${_styledcomponents.rangeTokens.textFieldBackgroundErrorColorHover}: var(--surface-solid-negative-hover);
-                ${_styledcomponents.rangeTokens.textFieldBackgroundErrorColorFocus}: var(--surface-solid-negative-active);
-                ${_styledcomponents.rangeTokens.textFieldBackgroundSuccessColor}: var(--surface-solid-positive);
-                ${_styledcomponents.rangeTokens.textFieldBackgroundSuccessColorHover}: var(--surface-solid-positive-hover);
-                ${_styledcomponents.rangeTokens.textFieldBackgroundSuccessColorFocus}: var(--surface-solid-positive-active);
+                ${_styledcomponents.rangeTokens.textFieldBackgroundColorHover}: var(--surface-solid-primary);
+                ${_styledcomponents.rangeTokens.textFieldBackgroundColorFocus}: var(--surface-solid-primary);
+                ${_styledcomponents.rangeTokens.textFieldBackgroundErrorColor}: var(--surface-solid-primary);
+                ${_styledcomponents.rangeTokens.textFieldBackgroundErrorColorHover}: var(--surface-solid-primary);
+                ${_styledcomponents.rangeTokens.textFieldBackgroundErrorColorFocus}: var(--surface-solid-primary);
+                ${_styledcomponents.rangeTokens.textFieldBackgroundSuccessColor}: var(--surface-solid-primary);
+                ${_styledcomponents.rangeTokens.textFieldBackgroundSuccessColorHover}: var(--surface-solid-primary);
+                ${_styledcomponents.rangeTokens.textFieldBackgroundSuccessColorFocus}: var(--surface-solid-primary);
+
+                ${_styledcomponents.rangeTokens.textFieldBorderColor}: var(--outline-clear);
+                ${_styledcomponents.rangeTokens.textFieldBorderColorHover}: var(--on-light-outline-solid-primary-hover);
+                ${_styledcomponents.rangeTokens.textFieldBorderColorFocus}: var(--outline-primary);
+                ${_styledcomponents.rangeTokens.textFieldBorderColorError}: var(--outline-negative);
+                ${_styledcomponents.rangeTokens.textFieldBorderColorErrorHover}: var(--outline-negative-hover);
+                ${_styledcomponents.rangeTokens.textFieldBorderColorErrorFocus}: var(--outline-negative-active);
+                ${_styledcomponents.rangeTokens.textFieldBorderColorSuccess}: var(--outline-positive);
+                ${_styledcomponents.rangeTokens.textFieldBorderColorSuccessHover}: var(--outline-positive-hover);
+                ${_styledcomponents.rangeTokens.textFieldBorderColorSuccessFocus}: var(--outline-positive-active);
 
                 ${_styledcomponents.rangeTokens.textFieldTextBeforeColor}: var(--text-tertiary);
                 ${_styledcomponents.rangeTokens.textFieldTextAfterColor}: var(--text-tertiary);
@@ -73,6 +87,7 @@ const config = {
         size: {
             m: (0, _styledcomponents.css)`
                 ${_styledcomponents.rangeTokens.borderRadius}: 0.75rem;
+                ${_styledcomponents.rangeTokens.borderWidth}: 0.0625rem;
 
                 ${_styledcomponents.rangeTokens.dividerPadding}: 0 0.375rem;
                 ${_styledcomponents.rangeTokens.dividerFontFamily}: var(--plasma-typo-body-m-font-family);
@@ -86,6 +101,7 @@ const config = {
                 ${_styledcomponents.rangeTokens.rightContentMargin}: 0;
 
                 ${_styledcomponents.rangeTokens.textFieldHeight}: 3rem;
+                ${_styledcomponents.rangeTokens.textFieldBorderWidth}: 0.0625rem;
                 ${_styledcomponents.rangeTokens.textFieldBorderRadius}: 0.75rem;
                 ${_styledcomponents.rangeTokens.textFieldPadding}: 0.875rem 1rem 0.875rem 1rem;
                 ${_styledcomponents.rangeTokens.textFieldFontFamily}: var(--plasma-typo-body-m-font-family);
@@ -149,6 +165,7 @@ const config = {
             `,
             s: (0, _styledcomponents.css)`
                 ${_styledcomponents.rangeTokens.borderRadius}: 0.625rem;
+                ${_styledcomponents.rangeTokens.borderWidth}: 0.0625rem;
 
                 ${_styledcomponents.rangeTokens.dividerPadding}: 0 0.375rem;
                 ${_styledcomponents.rangeTokens.dividerFontFamily}: var(--plasma-typo-body-s-font-family);
@@ -162,6 +179,7 @@ const config = {
                 ${_styledcomponents.rangeTokens.rightContentMargin}: 0;
 
                 ${_styledcomponents.rangeTokens.textFieldHeight}: 2.5rem;
+                ${_styledcomponents.rangeTokens.textFieldBorderWidth}: 0.0625rem;
                 ${_styledcomponents.rangeTokens.textFieldBorderRadius}: 0.625rem;
                 ${_styledcomponents.rangeTokens.textFieldPadding}: 0.6875rem 0.875rem 0.6875rem 0.875rem;
                 ${_styledcomponents.rangeTokens.textFieldFontFamily}: var(--plasma-typo-body-s-font-family);
@@ -284,21 +302,55 @@ const config = {
         },
         disabled: {
             true: (0, _styledcomponents.css)`
-                ${_styledcomponents.rangeTokens.disabledOpacity}: 0.4;
+                ${_styledcomponents.rangeTokens.disabledOpacity}: 1;
+                ${_styledcomponents.rangeTokens.disabledBackgroundOpacity}: 1;
+                ${_styledcomponents.rangeTokens.disabledInnerContentOpacity}: 1;
+
+                ${_styledcomponents.rangeTokens.background}: var(--surface-solid-tertiary);
+                ${_styledcomponents.rangeTokens.backgroundError}: var(--surface-solid-tertiary);
+                ${_styledcomponents.rangeTokens.backgroundSuccess}: var(--surface-solid-tertiary);
+                ${_styledcomponents.rangeTokens.borderColor}: transparent;
+                ${_styledcomponents.rangeTokens.borderColorError}: transparent;
+                ${_styledcomponents.rangeTokens.borderColorSuccess}: transparent;
+
+                ${_styledcomponents.rangeTokens.labelColor}: var(--text-secondary);
+                ${_styledcomponents.rangeTokens.titleCaptionColor}: var(--text-tertiary);
+                ${_styledcomponents.rangeTokens.leftHelperColor}: var(--text-tertiary);
+                ${_styledcomponents.rangeTokens.contentSlotColor}: var(--text-tertiary);
+                ${_styledcomponents.rangeTokens.contentSlotRightColor}: var(--text-tertiary);
+
+                ${_styledcomponents.rangeTokens.textFieldColor}: var(--text-secondary);
+                ${_styledcomponents.rangeTokens.textFieldPlaceholderColor}: var(--text-tertiary);
+                ${_styledcomponents.rangeTokens.textFieldBackgroundColor}: var(--surface-solid-tertiary);
+                ${_styledcomponents.rangeTokens.textFieldBackgroundErrorColor}: var(--surface-solid-tertiary);
+                ${_styledcomponents.rangeTokens.textFieldBackgroundSuccessColor}: var(--surface-solid-tertiary);
+                ${_styledcomponents.rangeTokens.textFieldBorderColor}: transparent;
+                ${_styledcomponents.rangeTokens.textFieldBorderColorError}: transparent;
+                ${_styledcomponents.rangeTokens.textFieldBorderColorSuccess}: transparent;
+                ${_styledcomponents.rangeTokens.textFieldContentSlotColor}: var(--text-tertiary);
+                ${_styledcomponents.rangeTokens.textFieldContentSlotRightColor}: var(--text-tertiary);
             `
         },
         readOnly: {
             true: (0, _styledcomponents.css)`
-                ${_styledcomponents.rangeTokens.backgroundReadOnly}: var(--surface-solid-primary);
+                ${_styledcomponents.rangeTokens.backgroundReadOnly}: var(--surface-solid-secondary);
+                ${_styledcomponents.rangeTokens.borderColorReadOnly}: transparent;
+
+                ${_styledcomponents.rangeTokens.labelColorReadOnly}: var(--text-primary);
+                ${_styledcomponents.rangeTokens.titleCaptionColorReadOnly}: var(--text-secondary);
+                ${_styledcomponents.rangeTokens.leftHelperColorReadOnly}: var(--text-secondary);
+                ${_styledcomponents.rangeTokens.rightHelperColorReadOnly}: var(--text-secondary);
 
-                ${_styledcomponents.rangeTokens.dividerColorReadOnly}: var(--text-secondary);
-                ${_styledcomponents.rangeTokens.readOnlyOpacity}: 0.1;
-                ${_styledcomponents.rangeTokens.dividerOpacityReadOnly}: 0.4;
-                ${_styledcomponents.rangeTokens.rightContentOpacityReadOnly}: 0.4;
+                ${_styledcomponents.rangeTokens.dividerColorReadOnly}: var(--text-tertiary);
+                ${_styledcomponents.rangeTokens.readOnlyOpacity}: 1;
+                ${_styledcomponents.rangeTokens.dividerOpacityReadOnly}: 1;
+                ${_styledcomponents.rangeTokens.rightContentOpacityReadOnly}: 1;
 
                 ${_styledcomponents.rangeTokens.textFieldColorReadOnly}: var(--text-primary);
                 ${_styledcomponents.rangeTokens.textFieldBackgroundColorReadOnly}: transparent;
+                ${_styledcomponents.rangeTokens.textFieldBorderColorReadOnly}: transparent;
                 ${_styledcomponents.rangeTokens.textFieldPlaceholderColorReadOnly}: var(--text-secondary);
+                ${_styledcomponents.rangeTokens.textFieldContentSlotRightColor}: var(--text-tertiary);
             `
         }
     }