@salutejs/plasma-new-hope 0.343.0-canary.2357.19712161711.0 → 0.343.0-canary.2358.19738569895.0

package/styled-components/es/examples/components/TextField/TextField.clear.config.js

@@ -0,0 +1,660 @@
+import { css } from "styled-components";
+import { textFieldTokens as tokens } from "../../../components/TextField";
+export var config = {
+    defaults: {
+        view: 'default',
+        size: 'l',
+        labelPlacement: 'outer'
+    },
+    variations: {
+        view: {
+            default: css([
+                "",
+                ":var(--text-primary);",
+                ":var(--text-secondary);",
+                ":var(--text-tertiary);",
+                ":transparent;",
+                ":transparent;",
+                ":transparent;",
+                ":var(--text-accent);",
+                ":var(--text-tertiary);",
+                ":var(--text-tertiary);",
+                ":var(--text-primary);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary-hover);",
+                ":var(--text-secondary-active);",
+                ":var(--surface-transparent-tertiary);",
+                ":var(--text-secondary);",
+                ":var(--surface-accent);",
+                ":var(--text-accent);",
+                ":var(--surface-negative);",
+                ":var(--text-tertiary);"
+            ], tokens.color, tokens.placeholderColor, tokens.placeholderColorFocus, tokens.backgroundColor, tokens.backgroundColorHover, tokens.backgroundColorFocus, tokens.caretColor, tokens.textBeforeColor, tokens.textAfterColor, tokens.labelColor, tokens.leftHelperColor, tokens.titleCaptionColor, tokens.hintIconColor, tokens.contentSlotColor, tokens.contentSlotColorHover, tokens.contentSlotColorActive, tokens.dividerColor, tokens.dividerColorHover, tokens.dividerColorFocus, tokens.focusColor, tokens.indicatorColor, tokens.optionalColor),
+            positive: css([
+                "",
+                ":var(--text-positive);",
+                ":var(--text-positive);",
+                ":var(--text-positive);",
+                ":transparent;",
+                ":transparent;",
+                ":transparent;",
+                ":var(--text-accent);",
+                ":var(--text-tertiary);",
+                ":var(--text-tertiary);",
+                ":var(--text-primary);",
+                ":var(--text-positive);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary);",
+                ":var(--text-positive);",
+                ":var(--text-positive-hover);",
+                ":var(--text-positive-active);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary-hover);",
+                ":var(--text-secondary-active);",
+                ":var(--surface-positive);",
+                ":var(--surface-positive);",
+                ":var(--surface-accent);",
+                ":var(--text-accent);",
+                ":var(--surface-negative);",
+                ":var(--text-tertiary);"
+            ], tokens.color, tokens.placeholderColor, tokens.placeholderColorFocus, tokens.backgroundColor, tokens.backgroundColorHover, tokens.backgroundColorFocus, tokens.caretColor, tokens.textBeforeColor, tokens.textAfterColor, tokens.labelColor, tokens.leftHelperColor, tokens.titleCaptionColor, tokens.hintIconColor, tokens.contentSlotColor, tokens.contentSlotColorHover, tokens.contentSlotColorActive, tokens.contentSlotRightColor, tokens.contentSlotRightColorHover, tokens.contentSlotRightColorActive, tokens.dividerColor, tokens.dividerColorHover, tokens.dividerColorFocus, tokens.focusColor, tokens.indicatorColor, tokens.optionalColor),
+            warning: css([
+                "",
+                ":var(--text-warning);",
+                ":var(--text-warning);",
+                ":var(--text-warning);",
+                ":transparent;",
+                ":transparent;",
+                ":transparent;",
+                ":var(--text-accent);",
+                ":var(--text-tertiary);",
+                ":var(--text-tertiary);",
+                ":var(--text-primary);",
+                ":var(--text-warning);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary);",
+                ":var(--text-warning);",
+                ":var(--text-warning-hover);",
+                ":var(--text-warning-active);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary-hover);",
+                ":var(--text-secondary-active);",
+                ":var(--surface-warning);",
+                ":var(--surface-warning);",
+                ":var(--surface-accent);",
+                ":var(--text-accent);",
+                ":var(--surface-negative);",
+                ":var(--text-tertiary);"
+            ], tokens.clearColor, tokens.placeholderColor, tokens.placeholderColorFocus, tokens.backgroundColor, tokens.backgroundColorHover, tokens.backgroundColorFocus, tokens.caretColor, tokens.textBeforeColor, tokens.textAfterColor, tokens.labelColor, tokens.leftHelperColor, tokens.titleCaptionColor, tokens.hintIconColor, tokens.contentSlotColor, tokens.contentSlotColorHover, tokens.contentSlotColorActive, tokens.contentSlotRightColor, tokens.contentSlotRightColorHover, tokens.contentSlotRightColorActive, tokens.dividerColor, tokens.dividerColorHover, tokens.dividerColorFocus, tokens.focusColor, tokens.indicatorColor, tokens.optionalColor),
+            negative: css([
+                "",
+                ":var(--text-negative);",
+                ":var(--text-negative);",
+                ":var(--text-negative);",
+                ":transparent;",
+                ":transparent;",
+                ":transparent;",
+                ":var(--text-accent);",
+                ":var(--text-tertiary);",
+                ":var(--text-tertiary);",
+                ":var(--text-primary);",
+                ":var(--text-negative);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary);",
+                ":var(--text-negative);",
+                ":var(--text-negative-hover);",
+                ":var(--text-negative-active);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary-hover);",
+                ":var(--text-secondary-active);",
+                ":var(--surface-negative);",
+                ":var(--surface-negative);",
+                ":var(--surface-accent);",
+                ":var(--text-accent);",
+                ":var(--surface-negative);",
+                ":var(--text-tertiary);"
+            ], tokens.color, tokens.placeholderColor, tokens.placeholderColorFocus, tokens.backgroundColor, tokens.backgroundColorHover, tokens.backgroundColorFocus, tokens.caretColor, tokens.textBeforeColor, tokens.textAfterColor, tokens.labelColor, tokens.leftHelperColor, tokens.titleCaptionColor, tokens.hintIconColor, tokens.contentSlotColor, tokens.contentSlotColorHover, tokens.contentSlotColorActive, tokens.contentSlotRightColor, tokens.contentSlotRightColorHover, tokens.contentSlotRightColorActive, tokens.dividerColor, tokens.dividerColorHover, tokens.dividerColorFocus, tokens.focusColor, tokens.indicatorColor, tokens.optionalColor)
+        },
+        size: {
+            xl: css([
+                "",
+                ":4rem;",
+                ":1.3125rem 0;",
+                ":0.375rem 0;",
+                ":0;",
+                ":-0.0625rem 0.5rem -0.0625rem 0rem;",
+                ":-0.0625rem 0rem -0.0625rem 0.75rem;",
+                ":-0.0625rem -0.438rem -0.0625rem 0.75rem;",
+                ":0.25rem;",
+                ":-0.438rem -0.438rem -0.438rem 0;",
+                ":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);",
+                ":0.25rem;",
+                ":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);",
+                ":-0.688rem -0.5rem;",
+                ":2.375rem;",
+                ":0.82rem -2.063rem auto auto;",
+                ":0.25rem;",
+                ":var(--plasma-typo-body-xs-font-family);",
+                ":var(--plasma-typo-body-xs-font-size);",
+                ":var(--plasma-typo-body-xs-font-style);",
+                ":var(--plasma-typo-body-xs-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0.25rem;",
+                ":var(--plasma-typo-body-xs-font-family);",
+                ":var(--plasma-typo-body-xs-font-size);",
+                ":var(--plasma-typo-body-xs-font-style);",
+                ":var(--plasma-typo-body-xs-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0.8125rem 0 0.125rem 0;",
+                ":1.813rem 0 0.813rem 0;",
+                ":0 0.25rem 0 0;",
+                ":0 0 0 0.25rem;",
+                ":0.125rem;",
+                ":1rem;",
+                ":0.625rem;",
+                ":auto;",
+                ":3.25rem;",
+                ":0 0.75rem 0 1rem;",
+                ":0.625rem;",
+                ":0rem;",
+                ":1.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);",
+                ":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.5rem;",
+                ":0.375rem;",
+                ":1.75rem auto auto -0.875rem;",
+                ":0.5rem auto auto -0.75rem;",
+                ":1.75rem -0.875rem auto auto;",
+                ":0.25rem -0.625rem auto auto;",
+                ":1.75rem -2.488rem auto auto;"
+            ], tokens.height, tokens.padding, tokens.paddingWithChips, tokens.borderRadius, tokens.leftContentMargin, tokens.rightContentMargin, tokens.rightContentWithHintMargin, tokens.contentRightWrapperGap, tokens.contentRightWrapperMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.hintMargin, tokens.hintTargetSize, tokens.hintInnerLabelPlacementOffset, tokens.titleCaptionInnerLabelOffset, tokens.titleCaptionFontFamily, tokens.titleCaptionFontSize, tokens.titleCaptionFontStyle, tokens.titleCaptionFontWeight, tokens.titleCaptionLetterSpacing, tokens.titleCaptionLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.chipGap, tokens.chipMarginRight, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPadding, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight, tokens.labelInnerFontFamily, tokens.labelInnerFontSize, tokens.labelInnerFontStyle, tokens.labelInnerFontWeight, tokens.labelInnerLetterSpacing, tokens.labelInnerLineHeight, tokens.indicatorSizeInner, tokens.indicatorSizeOuter, tokens.indicatorLabelPlacementInner, tokens.indicatorLabelPlacementOuter, tokens.indicatorLabelPlacementInnerRight, tokens.indicatorLabelPlacementOuterRight, tokens.clearIndicatorHintInnerRight),
+            l: css([
+                "",
+                ":3.5rem;",
+                ":1.0625rem 0;",
+                ":0.375rem 0;",
+                ":0;",
+                ":-0.0625rem 0.5rem -0.0625rem 0;",
+                ":-0.0625rem 0 -0.0625rem 0.75rem;",
+                ":-0.0625rem -0.438rem -0.0625rem 0.75rem;",
+                ":0.25rem;",
+                ":-0.438rem -0.438rem -0.438rem 0;",
+                ":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);",
+                ":0.25rem;",
+                ":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);",
+                ":-0.688rem -0.5rem;",
+                ":2.375rem;",
+                ":0.563rem -2.188rem auto auto;",
+                ":0.25rem;",
+                ":var(--plasma-typo-body-xs-font-family);",
+                ":var(--plasma-typo-body-xs-font-size);",
+                ":var(--plasma-typo-body-xs-font-style);",
+                ":var(--plasma-typo-body-xs-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0.25rem;",
+                ":var(--plasma-typo-body-xs-font-family);",
+                ":var(--plasma-typo-body-xs-font-size);",
+                ":var(--plasma-typo-body-xs-font-style);",
+                ":var(--plasma-typo-body-xs-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0.5625rem 0 0.125rem 0;",
+                ":1.5625rem 0 0.5625rem 0;",
+                ":0 0.25rem 0 0;",
+                ":0 0 0 0.25rem;",
+                ":0.25rem;",
+                ":0.5rem;",
+                ":auto;",
+                ":2.75rem;",
+                ":0 0.75rem 0 1rem;",
+                ":0.625rem;",
+                ":0rem;",
+                ":1.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);",
+                ":0.5rem;",
+                ":0.375rem;",
+                ":1.5rem auto auto -0.875rem;",
+                ":0.5rem auto auto -0.75rem;",
+                ":1.5rem -0.875rem auto auto;",
+                ":0.25rem -0.625rem auto auto;",
+                ":1.5rem -2.488rem auto auto;"
+            ], tokens.height, tokens.padding, tokens.paddingWithChips, tokens.borderRadius, tokens.leftContentMargin, tokens.rightContentMargin, tokens.rightContentWithHintMargin, tokens.contentRightWrapperGap, tokens.contentRightWrapperMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.hintMargin, tokens.hintTargetSize, tokens.hintInnerLabelPlacementOffset, tokens.titleCaptionInnerLabelOffset, tokens.titleCaptionFontFamily, tokens.titleCaptionFontSize, tokens.titleCaptionFontStyle, tokens.titleCaptionFontWeight, tokens.titleCaptionLetterSpacing, tokens.titleCaptionLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.chipGap, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPadding, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight, tokens.indicatorSizeInner, tokens.indicatorSizeOuter, tokens.indicatorLabelPlacementInner, tokens.indicatorLabelPlacementOuter, tokens.indicatorLabelPlacementInnerRight, tokens.indicatorLabelPlacementOuterRight, tokens.clearIndicatorHintInnerRight),
+            m: css([
+                "",
+                ":3rem;",
+                ":0.875rem 0;",
+                ":0.375rem 0;",
+                ":0;",
+                ":-0.125rem 0.375rem -0.125rem 0;",
+                ":-0.125rem 0 -0.125rem 0.75rem;",
+                ":-0.125rem -0.438rem -0.125rem 0.75rem;",
+                ":0.25rem;",
+                ":-0.438rem -0.438rem -0.438rem 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);",
+                ":0.25rem;",
+                ":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.688rem -0.5rem;",
+                ":2.375rem;",
+                ":0.312rem -2.188rem auto auto;",
+                ":0.25rem;",
+                ":var(--plasma-typo-body-xs-font-family);",
+                ":var(--plasma-typo-body-xs-font-size);",
+                ":var(--plasma-typo-body-xs-font-style);",
+                ":var(--plasma-typo-body-xs-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0.25rem;",
+                ":var(--plasma-typo-body-xs-font-family);",
+                ":var(--plasma-typo-body-xs-font-size);",
+                ":var(--plasma-typo-body-xs-font-style);",
+                ":var(--plasma-typo-body-xs-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0.375rem 0 0.125rem 0;",
+                ":1.375rem 0 0.375rem 0;",
+                ":0 0.25rem 0 0;",
+                ":0 0 0 0.25rem;",
+                ":0.25rem;",
+                ":0.375rem;",
+                ":auto;",
+                ":2.25rem;",
+                ":0 0.625rem 0 0.875rem;",
+                ":0.5rem;",
+                ":0rem;",
+                ":1.25rem;",
+                ":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.5rem;",
+                ":0.375rem;",
+                ":1.25rem auto auto -0.875rem;",
+                ":0.375rem auto auto -0.75rem;",
+                ":1.25rem -0.875rem auto auto;",
+                ":0.25rem -0.6875rem auto auto;",
+                ":1.25rem -2.488rem auto auto;"
+            ], tokens.height, tokens.padding, tokens.paddingWithChips, tokens.borderRadius, tokens.leftContentMargin, tokens.rightContentMargin, tokens.rightContentWithHintMargin, tokens.contentRightWrapperGap, tokens.contentRightWrapperMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.hintMargin, tokens.hintTargetSize, tokens.hintInnerLabelPlacementOffset, tokens.titleCaptionInnerLabelOffset, tokens.titleCaptionFontFamily, tokens.titleCaptionFontSize, tokens.titleCaptionFontStyle, tokens.titleCaptionFontWeight, tokens.titleCaptionLetterSpacing, tokens.titleCaptionLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.chipGap, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPadding, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight, tokens.indicatorSizeInner, tokens.indicatorSizeOuter, tokens.indicatorLabelPlacementInner, tokens.indicatorLabelPlacementOuter, tokens.indicatorLabelPlacementInnerRight, tokens.indicatorLabelPlacementOuterRight, tokens.clearIndicatorHintInnerRight),
+            s: css([
+                "",
+                ":2.5rem;",
+                ":0.6875rem 0;",
+                ":0.375rem 0;",
+                ":0;",
+                ":-0.1875rem 0.25rem -0.1875rem 0;",
+                ":-0.1875rem 0 -0.1875rem 0.75rem;",
+                ":-0.1875rem -0.438rem -0.1875rem 0.75rem;",
+                ":0.25rem;",
+                ":-0.438rem -0.438rem -0.438rem 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);",
+                ":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);",
+                ":-0.688rem -0.5rem;",
+                ":2.375rem;",
+                ":0.062rem -2.188rem auto auto;",
+                ":0.25rem;",
+                ":var(--plasma-typo-body-xs-font-family);",
+                ":var(--plasma-typo-body-xs-font-size);",
+                ":var(--plasma-typo-body-xs-font-style);",
+                ":var(--plasma-typo-body-xs-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0.25rem;",
+                ":var(--plasma-typo-body-xs-font-family);",
+                ":var(--plasma-typo-body-xs-font-size);",
+                ":var(--plasma-typo-body-xs-font-style);",
+                ":var(--plasma-typo-body-xs-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0.3125rem 0 0 0;",
+                ":1.0625rem 0 0.3125rem 0;",
+                ":0 0.25rem 0 0;",
+                ":0 0 0 0.25rem;",
+                ":0.25rem;",
+                ":0.25rem;",
+                ":auto;",
+                ":1.75rem;",
+                ":0 0.5rem 0 0.75rem;",
+                ":0.375rem;",
+                ":0rem;",
+                ":1rem;",
+                ":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);",
+                ":0.375rem;",
+                ":0.375rem;",
+                ":1.063rem auto auto -0.75rem;",
+                ":0.3125rem auto auto -0.6875rem;",
+                ":1.063rem -0.75rem auto auto;",
+                ":0.25rem -0.625rem auto auto;",
+                ":1.063rem -2.238rem auto auto;"
+            ], tokens.height, tokens.padding, tokens.paddingWithChips, tokens.borderRadius, tokens.leftContentMargin, tokens.rightContentMargin, tokens.rightContentWithHintMargin, tokens.contentRightWrapperGap, tokens.contentRightWrapperMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.hintMargin, tokens.hintTargetSize, tokens.hintInnerLabelPlacementOffset, tokens.titleCaptionInnerLabelOffset, tokens.titleCaptionFontFamily, tokens.titleCaptionFontSize, tokens.titleCaptionFontStyle, tokens.titleCaptionFontWeight, tokens.titleCaptionLetterSpacing, tokens.titleCaptionLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.chipGap, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPadding, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight, tokens.indicatorSizeInner, tokens.indicatorSizeOuter, tokens.indicatorLabelPlacementInner, tokens.indicatorLabelPlacementOuter, tokens.indicatorLabelPlacementInnerRight, tokens.indicatorLabelPlacementOuterRight, tokens.clearIndicatorHintInnerRight),
+            xs: css([
+                "",
+                ":2rem;",
+                ":0.5625rem 0;",
+                ":0.375rem 0;",
+                ":0;",
+                ":-0.0625rem 0.25rem -0.0625rem 0;",
+                ":-0.0625rem 0 -0.0625rem 0.75rem;",
+                ":-0.0625rem -0.688rem -0.0625rem 0.75rem;",
+                ":0.25rem;",
+                ":-0.688rem -0.688rem -0.688rem 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.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);",
+                ":-0.75rem -0.625rem -0.75rem -0.5rem;",
+                ":2.375rem;",
+                ":-0.188rem -1.938rem auto auto;",
+                ":0.25rem;",
+                ":var(--plasma-typo-body-xs-font-family);",
+                ":var(--plasma-typo-body-xs-font-size);",
+                ":var(--plasma-typo-body-xs-font-style);",
+                ":var(--plasma-typo-body-xs-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0.25rem;",
+                ":var(--plasma-typo-body-xs-font-family);",
+                ":var(--plasma-typo-body-xs-font-size);",
+                ":var(--plasma-typo-body-xs-font-style);",
+                ":var(--plasma-typo-body-xs-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0.3125rem 0 0 0;",
+                ":1.0625rem 0 0.3125rem 0;",
+                ":0 0.25rem 0 0;",
+                ":0 0 0 0.25rem;",
+                ":0.25rem;",
+                ":0.125rem;",
+                ":auto;",
+                ":1.25rem;",
+                ":0 0.375rem 0 0.625rem;",
+                ":0.25rem;",
+                ":0rem;",
+                ":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);",
+                ":0.375rem;",
+                ":0.375rem;",
+                ":0 0 0 0;",
+                ":0.25rem auto auto -0.625rem;",
+                ":0 0 auto auto;",
+                ":0.125rem -0.6875rem auto auto;",
+                ":0.813rem auto auto -0.625rem;",
+                ":0.813rem -0.625rem auto auto;",
+                ":0.813rem -1.988rem auto auto;"
+            ], tokens.height, tokens.padding, tokens.paddingWithChips, tokens.borderRadius, tokens.leftContentMargin, tokens.rightContentMargin, tokens.rightContentWithHintMargin, tokens.contentRightWrapperGap, tokens.contentRightWrapperMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.hintMargin, tokens.hintTargetSize, tokens.hintInnerLabelPlacementOffset, tokens.titleCaptionInnerLabelOffset, tokens.titleCaptionFontFamily, tokens.titleCaptionFontSize, tokens.titleCaptionFontStyle, tokens.titleCaptionFontWeight, tokens.titleCaptionLetterSpacing, tokens.titleCaptionLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.chipGap, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPadding, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight, tokens.indicatorSizeInner, tokens.indicatorSizeOuter, tokens.indicatorLabelPlacementInner, tokens.indicatorLabelPlacementOuter, tokens.indicatorLabelPlacementInnerRight, tokens.indicatorLabelPlacementOuterRight, tokens.clearIndicatorLabelPlacementInner, tokens.clearIndicatorLabelPlacementInnerRight, tokens.clearIndicatorHintInnerRight)
+        },
+        labelPlacement: {
+            inner: css([
+                "",
+                ":var(--text-secondary);",
+                ":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);"
+            ], tokens.placeholderColor, tokens.labelInnerFontFamily, tokens.labelInnerFontSize, tokens.labelInnerFontStyle, tokens.labelInnerFontWeight, tokens.labelInnerLetterSpacing, tokens.labelInnerLineHeight),
+            outer: css([
+                ""
+            ])
+        },
+        chipView: {
+            default: css([
+                "",
+                ":var(--inverse-text-primary);",
+                ":var(--surface-solid-default);",
+                ":var(--inverse-text-primary);",
+                ":var(--surface-solid-default-hover);",
+                ":var(--inverse-text-primary);",
+                ":var(--surface-solid-default-active);",
+                ":var(--surface-solid-default);",
+                ":var(--inverse-text-primary);",
+                ":var(--surface-solid-default);",
+                ":var(--inverse-text-primary);",
+                ":var(--inverse-text-secondary);",
+                ":var(--inverse-text-secondary);",
+                ":var(--inverse-text-secondary-hover);",
+                ":1;"
+            ], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipCloseIconColorReadonly, tokens.chipCloseIconColorHover, tokens.chipOpacityReadonly),
+            secondary: css([
+                "",
+                ":var(--text-primary);",
+                ":var(--surface-transparent-secondary);",
+                ":var(--text-primary);",
+                ":var(--surface-transparent-secondary-hover);",
+                ":var(--text-primary);",
+                ":var(--surface-transparent-secondary-active);",
+                ":var(--surface-transparent-secondary);",
+                ":var(--text-primary);",
+                ":var(--surface-transparent-secondary);",
+                ":var(--text-primary);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary-hover);",
+                ":1;"
+            ], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipCloseIconColorReadonly, tokens.chipCloseIconColorHover, tokens.chipOpacityReadonly),
+            accent: css([
+                "",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-accent);",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-accent-hover);",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-accent-active);",
+                ":var(--surface-accent);",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-accent);",
+                ":var(--on-dark-text-primary);",
+                ":var(--on-dark-text-secondary);",
+                ":var(--on-dark-text-secondary);",
+                ":var(--on-dark-text-secondary-hover);",
+                ":1;"
+            ], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipCloseIconColorReadonly, tokens.chipCloseIconColorHover, tokens.chipOpacityReadonly),
+            positive: css([
+                "",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-positive);",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-positive-hover);",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-positive-active);",
+                ":var(--surface-positive);",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-positive);",
+                ":var(--on-dark-text-primary);",
+                ":var(--on-dark-text-secondary);",
+                ":var(--on-dark-text-secondary);",
+                ":var(--on-dark-text-secondary-hover);",
+                ":1;"
+            ], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipCloseIconColorReadonly, tokens.chipCloseIconColorHover, tokens.chipOpacityReadonly),
+            warning: css([
+                "",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-warning);",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-warning-hover);",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-warning-active);",
+                ":var(--surface-warning);",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-warning);",
+                ":var(--on-dark-text-primary);",
+                ":var(--on-dark-text-secondary);",
+                ":var(--on-dark-text-secondary);",
+                ":var(--on-dark-text-secondary-hover);",
+                ":1;"
+            ], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipCloseIconColorReadonly, tokens.chipCloseIconColorHover, tokens.chipOpacityReadonly),
+            negative: css([
+                "",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-negative);",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-negative-hover);",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-negative-active);",
+                ":var(--surface-negative);",
+                ":var(--on-dark-text-primary);",
+                ":var(--surface-negative);",
+                ":var(--on-dark-text-primary);",
+                ":var(--on-dark-text-secondary);",
+                ":var(--on-dark-text-secondary);",
+                ":var(--on-dark-text-secondary-hover);",
+                ":1;"
+            ], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipCloseIconColorReadonly, tokens.chipCloseIconColorHover, tokens.chipOpacityReadonly)
+        },
+        hintView: {
+            default: css([
+                "",
+                ":var(--surface-solid-card-brightness);",
+                ":var(--shadow-down-hard-m,0px 4px 12px 0px rgba(0,0,0,0.16),0px 1px 4px 0px rgba(0,0,0,0.08));",
+                ":var(--text-primary);",
+                ":var(--surface-solid-card-brightness);"
+            ], tokens.tooltipBackgroundColor, tokens.tooltipBoxShadow, tokens.tooltipColor, tokens.tooltipArrowBackground)
+        },
+        hintSize: {
+            m: css([
+                "",
+                ":0.6875rem;",
+                ":0.875rem;",
+                ":0.6875rem;",
+                ":0.875rem;",
+                ":2.5rem;",
+                ":0.625rem;",
+                ":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);",
+                ":0.375rem;",
+                ":1.25rem;",
+                ":1.25rem;",
+                ':url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggY2xpcC1ydWxlPSJldmVub2RkIiBkPSJtMC4xNywxMS44M2wyMCwwYy01LjUyLDAgLTEwLDMuNTkgLTEwLDhjMCwtNC40MSAtNC40OCwtOCAtMTAsLTh6IiBmaWxsPSIjMTcxNzE3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGlkPSJUYWlsIi8+Cjwvc3ZnPg==");',
+                ":0.5rem;",
+                ":0.625rem;"
+            ], tokens.tooltipPaddingTop, tokens.tooltipPaddingRight, tokens.tooltipPaddingBottom, tokens.tooltipPaddingLeft, tokens.tooltipMinHeight, tokens.tooltipBorderRadius, tokens.tooltipTextFontFamily, tokens.tooltipTextFontSize, tokens.tooltipTextFontStyle, tokens.tooltipTextFontWeight, tokens.tooltipTextFontLetterSpacing, tokens.tooltipTextFontLineHeight, tokens.tooltipContentLeftMargin, tokens.tooltipArrowMaskWidth, tokens.tooltipArrowMaskHeight, tokens.tooltipArrowMaskImage, tokens.tooltipArrowHeight, tokens.tooltipArrowEdgeMargin),
+            s: css([
+                "",
+                ":0.5rem;",
+                ":0.75rem;",
+                ":0.5rem;",
+                ":0.75rem;",
+                ":2rem;",
+                ":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);",
+                ":0.25rem;",
+                ":1rem;",
+                ":1rem;",
+                ':url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggY2xpcC1ydWxlPSJldmVub2RkIiBkPSJtMCw5Ljg1bDE2LDBjLTQuNDEsMCAtOCwyLjY5IC04LDZjMCwtMy4zMSAtMy41OSwtNiAtOCwtNnoiIGZpbGw9IiMxNzE3MTciIGZpbGwtcnVsZT0iZXZlbm9kZCIgaWQ9IlRhaWwiLz4KPC9zdmc+");',
+                ":0.375rem;",
+                ":0.5625rem;"
+            ], tokens.tooltipPaddingTop, tokens.tooltipPaddingRight, tokens.tooltipPaddingBottom, tokens.tooltipPaddingLeft, tokens.tooltipMinHeight, tokens.tooltipBorderRadius, tokens.tooltipTextFontFamily, tokens.tooltipTextFontSize, tokens.tooltipTextFontStyle, tokens.tooltipTextFontWeight, tokens.tooltipTextFontLetterSpacing, tokens.tooltipTextFontLineHeight, tokens.tooltipContentLeftMargin, tokens.tooltipArrowMaskWidth, tokens.tooltipArrowMaskHeight, tokens.tooltipArrowMaskImage, tokens.tooltipArrowHeight, tokens.tooltipArrowEdgeMargin)
+        },
+        disabled: {
+            true: css([
+                "",
+                ":0.4;"
+            ], tokens.disabledOpacity)
+        },
+        readOnly: {
+            true: css([
+                "",
+                ":0.1;",
+                ":var(--text-primary);",
+                ":transparent;",
+                ":var(--text-secondary);",
+                ":var(--text-secondary);",
+                ":var(--text-secondary);",
+                ":var(--text-primary);",
+                ":var(--surface-transparent-primary);",
+                ":0.4;"
+            ], tokens.readOnlyOpacity, tokens.colorReadOnly, tokens.backgroundColorReadOnly, tokens.placeholderColorReadOnly, tokens.leftHelperColorReadOnly, tokens.titleCaptionColorReadOnly, tokens.labelColorReadOnly, tokens.dividerColorReadOnly, tokens.contentSlotRightOpacityReadOnly)
+        }
+    }
+};