@salutejs/plasma-new-hope 0.192.0-canary.1539.11802074105.0 → 0.192.0-canary.1550.11799501370.0

package/styled-components/cjs/examples/plasma_b2c/components/Switch/Switch.stories.tsx

@@ -18,7 +18,7 @@ const meta: Meta<SwitchProps> = {
     decorators: [WithTheme],
     component: Switch,
     argTypes: {
-        ...argTypesFromConfig(mergeConfig(switchConfig, config), ['view', 'focused']),
+        ...argTypesFromConfig(mergeConfig(switchConfig, config), ['size', 'view', 'focused']),
         labelPosition: {
             options: ['before', 'after'],
             control: { type: 'select' },
@@ -26,7 +26,6 @@ const meta: Meta<SwitchProps> = {
     },
     args: {
         label: 'Label',
-        description: 'Description',
         labelPosition: 'before',
     },
 };
@@ -65,10 +64,5 @@ const StoryDefault = (args: SwitchProps) => {
 };
 
 export const Default: StoryObj<SwitchProps> = {
-    args: {
-        size: 'm',
-        toggleSize: 'l',
-        disabled: false,
-    },
     render: (args) => <StoryDefault {...args} />,
 };

package/styled-components/cjs/examples/plasma_b2c/components/Tabs/Tabs.stories.tsx

@@ -25,7 +25,6 @@ type CustomStoryTabsProps = {
     contentRight: string;
     stretch: boolean;
     helperText: string;
-    maxItemWidth: string;
 };
 
 const contentLeftOptions = ['none', 'icon'];
@@ -60,6 +59,17 @@ const meta: Meta<StoryTabsProps> = {
     component: Tabs,
     decorators: [WithTheme],
     argTypes: {
+        ...disableProps([
+            'orientation',
+            'tabItemContentLeft',
+            'pilled',
+            'animated',
+            'view',
+            'as',
+            'forwardedAs',
+            'outsideScroll',
+            'index',
+        ]),
         contentRight: {
             options: contentRightOptions,
             control: {
@@ -73,17 +83,6 @@ const meta: Meta<StoryTabsProps> = {
             },
             if: { arg: 'stretch', truthy: false },
         },
-        ...disableProps([
-            'orientation',
-            'tabItemContentLeft',
-            'pilled',
-            'animated',
-            'view',
-            'as',
-            'forwardedAs',
-            'outsideScroll',
-            'index',
-        ]),
     },
 };
 
@@ -100,13 +99,12 @@ const StoryHorizontalDefault = (props: HorizontalStoryTabsProps) => {
         stretch,
         maxItemWidth,
         helperText,
-        clip,
     } = props;
     const items = Array(itemQuantity).fill(0);
     const [index, setIndex] = useState(0);
 
     return (
-        <Tabs clip={clip} view="divider" hasDivider={hasDivider} stretch={stretch} disabled={disabled} size={size}>
+        <Tabs clip="none" view="divider" hasDivider={hasDivider} stretch={stretch} disabled={disabled} size={size}>
             {items.map((_, i) => {
                 if (helperText !== '') {
                     return (
@@ -653,7 +651,7 @@ const StoryHeaderDefault = (props: HorizontalStoryTabsProps) => {
                     size={size as HeaderSize}
                     maxItemWidth={maxItemWidth}
                 >
-                    {`${labels[i % labels.length]} ${i + 1}`}
+                    {`Label${i + 1}`}
                 </TabItem>
             ))}
         </Tabs>

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

@@ -9,32 +9,40 @@ var _ = /*#__PURE__*/require("../../../..");
 var config = exports.config = {
   defaults: {
     view: 'default',
-    chipView: 'default',
-    size: 'm'
+    size: 'm',
+    labelPlacement: 'outer',
+    chipView: 'default'
   },
   variations: {
+    view: {
+      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--surface-clear);", ":var(--surface-clear);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--surface-transparent-tertiary);", ":var(--inverse-text-primary);", ":var(--inverse-text-primary-hover);", ":var(--inverse-text-primary-active);", ":var(--inverse-text-secondary);", ":var(--inverse-text-secondary-hover);", ":var(--inverse-text-secondary-hover);", ":var(--surface-solid-default);", ":var(--surface-solid-default-hover);", ":var(--surface-solid-default-hover);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--surface-transparent-secondary);"], _.selectTokens.textFieldColor, _.selectTokens.textFieldPlaceholderColor, _.selectTokens.textFieldPlaceholderColorFocus, _.selectTokens.textFieldBackgroundColor, _.selectTokens.textFieldBackgroundColorFocus, _.selectTokens.textFieldTextBeforeColor, _.selectTokens.textFieldTextAfterColor, _.selectTokens.textFieldLabelColor, _.selectTokens.textFieldLeftHelperColor, _.selectTokens.textFieldFocusColor, _.selectTokens.textFieldContentSlotColor, _.selectTokens.textFieldContentSlotColorHover, _.selectTokens.textFieldContentSlotColorActive, _.selectTokens.textFieldBorderColor, _.selectTokens.buttonColor, _.selectTokens.buttonColorHover, _.selectTokens.buttonColorActive, _.selectTokens.buttonArrowColor, _.selectTokens.buttonArrowColorHover, _.selectTokens.buttonArrowColorActive, _.selectTokens.buttonBackgroundColor, _.selectTokens.buttonBackgroundColorHover, _.selectTokens.buttonBackgroundColorActive, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.itemBackgroundHover),
+      positive: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--surface-clear);", ":var(--surface-clear);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-primary);", ":var(--text-positive);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--surface-positive);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-primary-hover);", ":var(--on-dark-text-primary-active);", ":var(--on-dark-text-secondary);", ":var(--on-dark-text-secondary-hover);", ":var(--on-dark-text-secondary-hover);", ":var(--surface-positive);", ":var(--surface-positive-hover);", ":var(--surface-positive-active);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--surface-transparent-secondary);"], _.selectTokens.textFieldColor, _.selectTokens.textFieldPlaceholderColor, _.selectTokens.textFieldPlaceholderColorFocus, _.selectTokens.textFieldBackgroundColor, _.selectTokens.textFieldBackgroundColorFocus, _.selectTokens.textFieldTextBeforeColor, _.selectTokens.textFieldTextAfterColor, _.selectTokens.textFieldLabelColor, _.selectTokens.textFieldLeftHelperColor, _.selectTokens.textFieldFocusColor, _.selectTokens.textFieldContentSlotColor, _.selectTokens.textFieldContentSlotColorHover, _.selectTokens.textFieldContentSlotColorActive, _.selectTokens.textFieldBorderColor, _.selectTokens.buttonColor, _.selectTokens.buttonColorHover, _.selectTokens.buttonColorActive, _.selectTokens.buttonArrowColor, _.selectTokens.buttonArrowColorHover, _.selectTokens.buttonArrowColorActive, _.selectTokens.buttonBackgroundColor, _.selectTokens.buttonBackgroundColorHover, _.selectTokens.buttonBackgroundColorActive, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.itemBackgroundHover),
+      warning: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--surface-clear);", ":var(--surface-clear);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-primary);", ":var(--text-warning);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--surface-warning);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-primary-hover);", ":var(--on-dark-text-primary-active);", ":var(--on-dark-text-secondary);", ":var(--on-dark-text-secondary-hover);", ":var(--on-dark-text-secondary-hover);", ":var(--surface-warning);", ":var(--surface-warning-hover);", ":var(--surface-warning-active);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--surface-transparent-secondary);"], _.selectTokens.textFieldColor, _.selectTokens.textFieldPlaceholderColor, _.selectTokens.textFieldPlaceholderColorFocus, _.selectTokens.textFieldBackgroundColor, _.selectTokens.textFieldBackgroundColorFocus, _.selectTokens.textFieldTextBeforeColor, _.selectTokens.textFieldTextAfterColor, _.selectTokens.textFieldLabelColor, _.selectTokens.textFieldLeftHelperColor, _.selectTokens.textFieldFocusColor, _.selectTokens.textFieldContentSlotColor, _.selectTokens.textFieldContentSlotColorHover, _.selectTokens.textFieldContentSlotColorActive, _.selectTokens.textFieldBorderColor, _.selectTokens.buttonColor, _.selectTokens.buttonColorHover, _.selectTokens.buttonColorActive, _.selectTokens.buttonArrowColor, _.selectTokens.buttonArrowColorHover, _.selectTokens.buttonArrowColorActive, _.selectTokens.buttonBackgroundColor, _.selectTokens.buttonBackgroundColorHover, _.selectTokens.buttonBackgroundColorActive, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.itemBackgroundHover),
+      negative: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--surface-clear);", ":var(--surface-clear);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-primary);", ":var(--text-negative);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--surface-negative);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-primary-hover);", ":var(--on-dark-text-primary-active);", ":var(--on-dark-text-secondary);", ":var(--on-dark-text-secondary-hover);", ":var(--on-dark-text-secondary-hover);", ":var(--surface-negative);", ":var(--surface-negative-hover);", ":var(--surface-negative-active);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--surface-transparent-secondary);"], _.selectTokens.textFieldColor, _.selectTokens.textFieldPlaceholderColor, _.selectTokens.textFieldPlaceholderColorFocus, _.selectTokens.textFieldBackgroundColor, _.selectTokens.textFieldBackgroundColorFocus, _.selectTokens.textFieldTextBeforeColor, _.selectTokens.textFieldTextAfterColor, _.selectTokens.textFieldLabelColor, _.selectTokens.textFieldLeftHelperColor, _.selectTokens.textFieldFocusColor, _.selectTokens.textFieldContentSlotColor, _.selectTokens.textFieldContentSlotColorHover, _.selectTokens.textFieldContentSlotColorActive, _.selectTokens.textFieldBorderColor, _.selectTokens.buttonColor, _.selectTokens.buttonColorHover, _.selectTokens.buttonColorActive, _.selectTokens.buttonArrowColor, _.selectTokens.buttonArrowColorHover, _.selectTokens.buttonArrowColorActive, _.selectTokens.buttonBackgroundColor, _.selectTokens.buttonBackgroundColorHover, _.selectTokens.buttonBackgroundColorActive, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.itemBackgroundHover),
+      accent: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--on-dark-text-primary-hover);", ":var(--on-dark-text-primary-active);", ":var(--on-dark-text-secondary);", ":var(--on-dark-text-secondary-hover);", ":var(--on-dark-text-secondary-hover);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-accent-active);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--surface-transparent-secondary);"], _.selectTokens.buttonColor, _.selectTokens.buttonColorHover, _.selectTokens.buttonColorActive, _.selectTokens.buttonArrowColor, _.selectTokens.buttonArrowColorHover, _.selectTokens.buttonArrowColorActive, _.selectTokens.buttonBackgroundColor, _.selectTokens.buttonBackgroundColorHover, _.selectTokens.buttonBackgroundColorActive, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.itemBackgroundHover),
+      secondary: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-primary-hover);", ":var(--text-primary-active);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-hover);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary-hover);", ":var(--surface-transparent-secondary-active);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--surface-transparent-secondary);"], _.selectTokens.buttonColor, _.selectTokens.buttonColorHover, _.selectTokens.buttonColorActive, _.selectTokens.buttonArrowColor, _.selectTokens.buttonArrowColorHover, _.selectTokens.buttonArrowColorActive, _.selectTokens.buttonBackgroundColor, _.selectTokens.buttonBackgroundColorHover, _.selectTokens.buttonBackgroundColorActive, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.itemBackgroundHover),
+      clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-primary-hover);", ":var(--text-primary-active);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--surface-clear);", ":var(--surface-clear);", ":var(--surface-clear);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--surface-transparent-secondary);"], _.selectTokens.buttonColor, _.selectTokens.buttonColorHover, _.selectTokens.buttonColorActive, _.selectTokens.buttonArrowColor, _.selectTokens.buttonArrowColorHover, _.selectTokens.buttonArrowColorActive, _.selectTokens.buttonBackgroundColor, _.selectTokens.buttonBackgroundColorHover, _.selectTokens.buttonBackgroundColorActive, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.itemBackgroundHover),
+      dark: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--on-dark-text-primary-hover);", ":var(--on-dark-text-primary-active);", ":var(--on-dark-text-secondary);", ":var(--on-dark-text-secondary-hover);", ":var(--on-dark-text-secondary-active);", ":var(--on-light-surface-transparent-deep);", ":var(--on-light-surface-transparent-deep-hover);", ":var(--on-light-surface-transparent-deep-active);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--surface-transparent-secondary);"], _.selectTokens.buttonColor, _.selectTokens.buttonColorHover, _.selectTokens.buttonColorActive, _.selectTokens.buttonArrowColor, _.selectTokens.buttonArrowColorHover, _.selectTokens.buttonArrowColorActive, _.selectTokens.buttonBackgroundColor, _.selectTokens.buttonBackgroundColorHover, _.selectTokens.buttonBackgroundColorActive, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.itemBackgroundHover),
+      black: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--on-dark-text-primary-hover);", ":var(--on-dark-text-primary-active);", ":var(--on-dark-text-secondary);", ":var(--on-dark-text-secondary-hover);", ":var(--on-dark-text-secondary-active);", ":var(--on-light-surface-solid-default);", ":var(--on-light-surface-solid-default-hover);", ":var(--on-light-surface-solid-default-active);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--surface-transparent-secondary);"], _.selectTokens.buttonColor, _.selectTokens.buttonColorHover, _.selectTokens.buttonColorActive, _.selectTokens.buttonArrowColor, _.selectTokens.buttonArrowColorHover, _.selectTokens.buttonArrowColorActive, _.selectTokens.buttonBackgroundColor, _.selectTokens.buttonBackgroundColorHover, _.selectTokens.buttonBackgroundColorActive, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.itemBackgroundHover),
+      white: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-light-text-primary);", ":var(--on-light-text-primary-hover);", ":var(--on-light-text-primary-active);", ":var(--on-light-text-secondary);", ":var(--on-light-text-secondary-hover);", ":var(--on-light-text-secondary-active);", ":var(--on-dark-surface-solid-default);", ":var(--on-dark-surface-solid-default-hover);", ":var(--on-dark-surface-solid-default-active);", ":var(--surface-transparent-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);"], _.selectTokens.buttonColor, _.selectTokens.buttonColorHover, _.selectTokens.buttonColorActive, _.selectTokens.buttonArrowColor, _.selectTokens.buttonArrowColorHover, _.selectTokens.buttonArrowColorActive, _.selectTokens.buttonBackgroundColor, _.selectTokens.buttonBackgroundColorHover, _.selectTokens.buttonBackgroundColorActive, _.selectTokens.itemBackgroundHover, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover)
+    },
     size: {
-      xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.125rem;", ":0.5rem;", ":0.125rem;", ":1rem;", ":0.5rem 0.5rem 0.5rem 0.375rem;", ":0.25rem 0.5rem 0.25rem 0.375rem;", ":0.375rem;", ":1rem;", ":1rem;", ":0 0.25rem 0 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);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0.875rem;", ":0.875rem;", ":0.25rem;", ":0.25rem;", ":var(--text-accent);", ":var(--on-dark-text-primary);", ":var(--text-secondary);", ":0.375rem;", ":0.25rem;", ":0.125rem;", ":1.25rem;", ":0.375rem;", ":0.625rem;", ":0.25rem;", ":0rem;", ":0.75rem;", ":0 -0.125rem 0 0.25rem;", ":0 0 0 0.375rem;", ":2rem;", ":0.75rem 0 0.75rem;", ":0.5rem 0 0.625rem;", ":0.5rem 0 0.25rem;", ":0.375rem;", ":0;", ":0.25rem;", ":1rem;", ":1rem;"], _.selectTokens.padding, _.selectTokens.borderRadius, _.selectTokens.focusOffset, _.selectTokens.itemHeight, _.selectTokens.itemPadding, _.selectTokens.itemPaddingTight, _.selectTokens.itemBorderRadius, _.selectTokens.itemIconSize, _.selectTokens.itemIconSizeTight, _.selectTokens.itemIconMargin, _.selectTokens.fontFamily, _.selectTokens.fontSize, _.selectTokens.fontStyle, _.selectTokens.fontWeight, _.selectTokens.fontLetterSpacing, _.selectTokens.fontLineHeight, _.selectTokens.labelFontFamily, _.selectTokens.labelFontSize, _.selectTokens.labelFontStyle, _.selectTokens.labelFontWeight, _.selectTokens.labelFontLetterSpacing, _.selectTokens.labelFontLineHeight, _.selectTokens.helperTextFontFamily, _.selectTokens.helperTextFontSize, _.selectTokens.helperTextFontStyle, _.selectTokens.helperTextFontWeight, _.selectTokens.helperTextFontLetterSpacing, _.selectTokens.helperTextFontLineHeight, _.selectTokens.checkboxTriggerSize, _.selectTokens.checkboxTriggerSizeTight, _.selectTokens.checkboxTriggerBorderRadius, _.selectTokens.checkboxTriggerBorderRadiusTight, _.selectTokens.checkboxFillColor, _.selectTokens.checkboxIconColor, _.selectTokens.checkboxTriggerBorderColor, _.selectTokens.indicatorSize, _.selectTokens.chipGap, _.selectTokens.chipBorderRadius, _.selectTokens.chipHeight, _.selectTokens.chipPaddingRight, _.selectTokens.chipPaddingLeft, _.selectTokens.chipClearContentMarginLeft, _.selectTokens.chipClearContentMarginRight, _.selectTokens.chipCloseIconSize, _.selectTokens.targetButtonArrowMargin, _.selectTokens.targetTextfieldArrowMargin, _.selectTokens.targetHeight, _.selectTokens.targetButtonPadding, _.selectTokens.targetTextfieldPadding, _.selectTokens.targetTextfieldChipPadding, _.selectTokens.labelOffset, _.selectTokens.innerLabelGap, _.selectTokens.helperTextOffset, _.selectTokens.spinnerSize, _.selectTokens.spinnerSizeTight),
-      s: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.125rem;", ":0.625rem;", ":0.125rem;", ":1.5rem;", ":0.5rem 0.75rem 0.5rem 0.675rem;", ":0.25rem 0.75rem 0.25rem 0.675rem;", ":0.5rem;", ":1.5rem;", ":1rem;", ":0 0.375rem 0 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);", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":1.25rem;", ":0.875rem;", ":0.375rem;", ":0.25rem;", ":var(--text-accent);", ":var(--on-dark-text-primary);", ":var(--text-secondary);", ":0.375rem;", ":0.25rem;", ":0.25rem;", ":1.75rem;", ":0.5rem;", ":0.75rem;", ":0.375rem;", ":0rem;", ":0.75rem;", ":0 -0.125rem 0 0.25rem;", ":0 0 0 0.375rem;", ":2.5rem;", ":1rem 0 1rem;", ":0.75rem 0 0.875rem;", ":0.75rem 0 0.25rem;", ":0.5rem;", ":0;", ":0.25rem;", ":1.5rem;", ":1rem;"], _.selectTokens.padding, _.selectTokens.borderRadius, _.selectTokens.focusOffset, _.selectTokens.itemHeight, _.selectTokens.itemPadding, _.selectTokens.itemPaddingTight, _.selectTokens.itemBorderRadius, _.selectTokens.itemIconSize, _.selectTokens.itemIconSizeTight, _.selectTokens.itemIconMargin, _.selectTokens.fontFamily, _.selectTokens.fontSize, _.selectTokens.fontStyle, _.selectTokens.fontWeight, _.selectTokens.fontLetterSpacing, _.selectTokens.fontLineHeight, _.selectTokens.labelFontFamily, _.selectTokens.labelFontSize, _.selectTokens.labelFontStyle, _.selectTokens.labelFontWeight, _.selectTokens.labelFontLetterSpacing, _.selectTokens.labelFontLineHeight, _.selectTokens.helperTextFontFamily, _.selectTokens.helperTextFontSize, _.selectTokens.helperTextFontStyle, _.selectTokens.helperTextFontWeight, _.selectTokens.helperTextFontLetterSpacing, _.selectTokens.helperTextFontLineHeight, _.selectTokens.checkboxTriggerSize, _.selectTokens.checkboxTriggerSizeTight, _.selectTokens.checkboxTriggerBorderRadius, _.selectTokens.checkboxTriggerBorderRadiusTight, _.selectTokens.checkboxFillColor, _.selectTokens.checkboxIconColor, _.selectTokens.checkboxTriggerBorderColor, _.selectTokens.indicatorSize, _.selectTokens.chipGap, _.selectTokens.chipBorderRadius, _.selectTokens.chipHeight, _.selectTokens.chipPaddingRight, _.selectTokens.chipPaddingLeft, _.selectTokens.chipClearContentMarginLeft, _.selectTokens.chipClearContentMarginRight, _.selectTokens.chipCloseIconSize, _.selectTokens.targetButtonArrowMargin, _.selectTokens.targetTextfieldArrowMargin, _.selectTokens.targetHeight, _.selectTokens.targetButtonPadding, _.selectTokens.targetTextfieldPadding, _.selectTokens.targetTextfieldChipPadding, _.selectTokens.labelOffset, _.selectTokens.innerLabelGap, _.selectTokens.helperTextOffset, _.selectTokens.spinnerSize, _.selectTokens.spinnerSizeTight),
-      m: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.125rem;", ":0.75rem;", ":0.125rem;", ":1.5rem;", ":0.75rem 0.75rem 0.75rem 0.75rem;", ":0.5rem 0.75rem 0.5rem 0.75rem;", ":0.625rem;", ":0 0.375rem 0 0;", ":1.5rem;", ":1.5rem;", ":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);", ":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);", ":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);", ":1.25rem;", ":1.25rem;", ":0.375rem;", ":0.375rem;", ":var(--text-accent);", ":var(--on-dark-text-primary);", ":var(--text-secondary);", ":0.375rem;", ":0.25rem;", ":0.375rem;", ":2.25rem;", ":0.875rem;", ":0.625rem;", ":0.5rem;", ":0rem;", ":1rem;", ":0 -0.125rem 0 0.375rem;", ":0 0 0 0.625rem;", ":3rem;", ":1.25rem 0 1.25rem;", ":0.875rem 0 1rem;", ":0.875rem 0 0.25rem;", ":0.625rem;", ":0.125rem;", ":0.25rem;", ":1.5rem;", ":1.5rem;"], _.selectTokens.padding, _.selectTokens.borderRadius, _.selectTokens.focusOffset, _.selectTokens.itemHeight, _.selectTokens.itemPadding, _.selectTokens.itemPaddingTight, _.selectTokens.itemBorderRadius, _.selectTokens.itemIconMargin, _.selectTokens.itemIconSize, _.selectTokens.itemIconSizeTight, _.selectTokens.fontFamily, _.selectTokens.fontSize, _.selectTokens.fontStyle, _.selectTokens.fontWeight, _.selectTokens.fontLetterSpacing, _.selectTokens.fontLineHeight, _.selectTokens.labelFontFamily, _.selectTokens.labelFontSize, _.selectTokens.labelFontStyle, _.selectTokens.labelFontWeight, _.selectTokens.labelFontLetterSpacing, _.selectTokens.labelFontLineHeight, _.selectTokens.helperTextFontFamily, _.selectTokens.helperTextFontSize, _.selectTokens.helperTextFontStyle, _.selectTokens.helperTextFontWeight, _.selectTokens.helperTextFontLetterSpacing, _.selectTokens.helperTextFontLineHeight, _.selectTokens.checkboxTriggerSize, _.selectTokens.checkboxTriggerSizeTight, _.selectTokens.checkboxTriggerBorderRadius, _.selectTokens.checkboxTriggerBorderRadiusTight, _.selectTokens.checkboxFillColor, _.selectTokens.checkboxIconColor, _.selectTokens.checkboxTriggerBorderColor, _.selectTokens.indicatorSize, _.selectTokens.chipGap, _.selectTokens.chipBorderRadius, _.selectTokens.chipHeight, _.selectTokens.chipPaddingRight, _.selectTokens.chipPaddingLeft, _.selectTokens.chipClearContentMarginLeft, _.selectTokens.chipClearContentMarginRight, _.selectTokens.chipCloseIconSize, _.selectTokens.targetButtonArrowMargin, _.selectTokens.targetTextfieldArrowMargin, _.selectTokens.targetHeight, _.selectTokens.targetButtonPadding, _.selectTokens.targetTextfieldPadding, _.selectTokens.targetTextfieldChipPadding, _.selectTokens.labelOffset, _.selectTokens.innerLabelGap, _.selectTokens.helperTextOffset, _.selectTokens.spinnerSize, _.selectTokens.spinnerSizeTight),
-      l: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.125rem;", ":0.875rem;", ":0.125rem;", ":1.5rem;", ":1rem 1rem 1rem 0.875rem;", ":0.75rem 1rem 0.75rem 0.875rem;", ":0.75rem;", ":0 0.5rem 0 0;", ":1.5rem;", ":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-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);", ":1.25rem;", ":1.25rem;", ":0.375rem;", ":0.375rem;", ":var(--text-accent);", ":var(--on-dark-text-primary);", ":var(--text-secondary);", ":0.375rem;", ":0.25rem;", ":0.5rem;", ":2.75rem;", ":0.75rem;", ":1rem;", ":0.625rem;", ":0rem;", ":1rem;", ":0 -0.125rem 0 0.5rem;", ":0 0 0 0.75rem;", ":3.5rem;", ":1.5rem 0 1.5rem;", ":1rem 0 1.125rem;", ":1rem 0 0.25rem;", ":0.75rem;", ":0.125rem;", ":0.25rem;", ":1.5rem;", ":1.5rem;"], _.selectTokens.padding, _.selectTokens.borderRadius, _.selectTokens.focusOffset, _.selectTokens.itemHeight, _.selectTokens.itemPadding, _.selectTokens.itemPaddingTight, _.selectTokens.itemBorderRadius, _.selectTokens.itemIconMargin, _.selectTokens.itemIconSize, _.selectTokens.itemIconSizeTight, _.selectTokens.fontFamily, _.selectTokens.fontSize, _.selectTokens.fontStyle, _.selectTokens.fontWeight, _.selectTokens.fontLetterSpacing, _.selectTokens.fontLineHeight, _.selectTokens.labelFontFamily, _.selectTokens.labelFontSize, _.selectTokens.labelFontStyle, _.selectTokens.labelFontWeight, _.selectTokens.labelFontLetterSpacing, _.selectTokens.labelFontLineHeight, _.selectTokens.helperTextFontFamily, _.selectTokens.helperTextFontSize, _.selectTokens.helperTextFontStyle, _.selectTokens.helperTextFontWeight, _.selectTokens.helperTextFontLetterSpacing, _.selectTokens.helperTextFontLineHeight, _.selectTokens.checkboxTriggerSize, _.selectTokens.checkboxTriggerSizeTight, _.selectTokens.checkboxTriggerBorderRadius, _.selectTokens.checkboxTriggerBorderRadiusTight, _.selectTokens.checkboxFillColor, _.selectTokens.checkboxIconColor, _.selectTokens.checkboxTriggerBorderColor, _.selectTokens.indicatorSize, _.selectTokens.chipGap, _.selectTokens.chipBorderRadius, _.selectTokens.chipHeight, _.selectTokens.chipPaddingRight, _.selectTokens.chipPaddingLeft, _.selectTokens.chipClearContentMarginLeft, _.selectTokens.chipClearContentMarginRight, _.selectTokens.chipCloseIconSize, _.selectTokens.targetButtonArrowMargin, _.selectTokens.targetTextfieldArrowMargin, _.selectTokens.targetHeight, _.selectTokens.targetButtonPadding, _.selectTokens.targetTextfieldPadding, _.selectTokens.targetTextfieldChipPadding, _.selectTokens.labelOffset, _.selectTokens.innerLabelGap, _.selectTokens.helperTextOffset, _.selectTokens.spinnerSize, _.selectTokens.spinnerSizeTight)
+      l: /*#__PURE__*/(0, _styledComponents.css)(["", ":3.5rem;", ":1.0625rem 1.125rem 1.0625rem 1.125rem;", ":0.375rem;", ":0.875rem;", ":0.0625rem;", ":-0.0625rem 0.5rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 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.75rem;", ":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-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.25rem;", ":0.5rem;", ":auto;", ":2.75rem;", ":0.75rem;", ":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 -0.125rem 0 0.5rem;", ":3.5rem;", ":1.5rem 0 1.5rem;", ":0.125rem;", ":0.875rem;", ":1.5rem;", ":1rem 1.125rem;", ":0.75rem 1.125rem;", ":0.75rem;", ":0 0.5rem 0 0;", ":1.5rem;", ":1.5rem;", ":0rem;", ":0rem;", ":0rem;", ":0rem;", ":0.125rem;", ":0.375rem;", ":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-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);", ":1.25rem;", ":1.25rem;", ":0.375rem;", ":0.375rem;", ":var(--text-accent);", ":var(--on-dark-text-primary);", ":var(--text-secondary);", ":0.375rem;"], _.selectTokens.textFieldHeight, _.selectTokens.textFieldPadding, _.selectTokens.textFieldPaddingWithChips, _.selectTokens.textFieldBorderRadius, _.selectTokens.textFieldBorderWidth, _.selectTokens.textFieldLeftContentMargin, _.selectTokens.textFieldRightContentMargin, _.selectTokens.textFieldTextBeforeMargin, _.selectTokens.textFieldTextAfterMargin, _.selectTokens.textFieldFontFamily, _.selectTokens.textFieldFontSize, _.selectTokens.textFieldFontStyle, _.selectTokens.textFieldFontWeight, _.selectTokens.textFieldLetterSpacing, _.selectTokens.textFieldLineHeight, _.selectTokens.textFieldLabelOffset, _.selectTokens.textFieldLabelFontFamily, _.selectTokens.textFieldLabelFontSize, _.selectTokens.textFieldLabelFontStyle, _.selectTokens.textFieldLabelFontWeight, _.selectTokens.textFieldLabelLetterSpacing, _.selectTokens.textFieldLabelLineHeight, _.selectTokens.textFieldLeftHelperOffset, _.selectTokens.textFieldLeftHelperFontFamily, _.selectTokens.textFieldLeftHelperFontSize, _.selectTokens.textFieldLeftHelperFontStyle, _.selectTokens.textFieldLeftHelperFontWeight, _.selectTokens.textFieldLeftHelperLetterSpacing, _.selectTokens.textFieldLeftHelperLineHeight, _.selectTokens.textFieldLabelInnerPadding, _.selectTokens.textFieldContentLabelInnerPadding, _.selectTokens.textFieldChipGap, _.selectTokens.textFieldChipBorderRadius, _.selectTokens.textFieldChipWidth, _.selectTokens.textFieldChipHeight, _.selectTokens.textFieldChipPaddingRight, _.selectTokens.textFieldChipPaddingLeft, _.selectTokens.textFieldChipClearContentMarginLeft, _.selectTokens.textFieldChipClearContentMarginRight, _.selectTokens.textFieldChipCloseIconSize, _.selectTokens.textFieldChipFontFamily, _.selectTokens.textFieldChipFontSize, _.selectTokens.textFieldChipFontStyle, _.selectTokens.textFieldChipFontWeight, _.selectTokens.textFieldChipLetterSpacing, _.selectTokens.textFieldChipLineHeight, _.selectTokens.buttonArrowMargin, _.selectTokens.targetHeight, _.selectTokens.buttonPadding, _.selectTokens.padding, _.selectTokens.borderRadius, _.selectTokens.itemHeight, _.selectTokens.itemPadding, _.selectTokens.itemPaddingTight, _.selectTokens.itemBorderRadius, _.selectTokens.itemIconMargin, _.selectTokens.itemIconSize, _.selectTokens.itemIconSizeTight, _.selectTokens.cellPadding, _.selectTokens.cellPaddingLeftContent, _.selectTokens.cellPaddingContent, _.selectTokens.cellPaddingRightContent, _.selectTokens.cellTextboxGap, _.selectTokens.cellGap, _.selectTokens.cellTitleFontFamily, _.selectTokens.cellTitleFontSize, _.selectTokens.cellTitleFontStyle, _.selectTokens.cellTitleFontWeight, _.selectTokens.cellTitleLetterSpacing, _.selectTokens.cellTitleLineHeight, _.selectTokens.fontFamily, _.selectTokens.fontSize, _.selectTokens.fontStyle, _.selectTokens.fontWeight, _.selectTokens.fontLetterSpacing, _.selectTokens.fontLineHeight, _.selectTokens.checkboxTriggerSize, _.selectTokens.checkboxTriggerSizeTight, _.selectTokens.checkboxTriggerBorderRadius, _.selectTokens.checkboxTriggerBorderRadiusTight, _.selectTokens.checkboxFillColor, _.selectTokens.checkboxIconColor, _.selectTokens.checkboxTriggerBorderColor, _.selectTokens.indicatorSize),
+      m: /*#__PURE__*/(0, _styledComponents.css)(["", ":3rem;", ":0.875rem 1rem 0.875rem 1rem;", ":0.375rem;", ":0.75rem;", ":0.0625rem;", ":-0.125rem 0.375rem -0.125rem -0.125rem;", ":-0.125rem -0.125rem -0.125rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 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.625rem;", ":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-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.25rem;", ":0.375rem;", ":auto;", ":2.25rem;", ":0.625rem;", ":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 -0.125rem 0 0.375rem;", ":3rem;", ":1.25rem 0 1.25rem;", ":0.125rem;", ":0.75rem;", ":1.5rem;", ":0.75rem 0.875rem;", ":0.5rem 0.875rem;", ":0.625rem;", ":0 0.375rem 0 0;", ":1.5rem;", ":1.5rem;", ":0rem;", ":0rem;", ":0rem;", ":0rem;", ":0.125rem;", ":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);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":1.25rem;", ":1.25rem;", ":0.375rem;", ":0.375rem;", ":var(--text-accent);", ":var(--on-dark-text-primary);", ":var(--text-secondary);", ":0.375rem;"], _.selectTokens.textFieldHeight, _.selectTokens.textFieldPadding, _.selectTokens.textFieldPaddingWithChips, _.selectTokens.textFieldBorderRadius, _.selectTokens.textFieldBorderWidth, _.selectTokens.textFieldLeftContentMargin, _.selectTokens.textFieldRightContentMargin, _.selectTokens.textFieldTextBeforeMargin, _.selectTokens.textFieldTextAfterMargin, _.selectTokens.textFieldFontFamily, _.selectTokens.textFieldFontSize, _.selectTokens.textFieldFontStyle, _.selectTokens.textFieldFontWeight, _.selectTokens.textFieldLetterSpacing, _.selectTokens.textFieldLineHeight, _.selectTokens.textFieldLabelOffset, _.selectTokens.textFieldLabelFontFamily, _.selectTokens.textFieldLabelFontSize, _.selectTokens.textFieldLabelFontStyle, _.selectTokens.textFieldLabelFontWeight, _.selectTokens.textFieldLabelLetterSpacing, _.selectTokens.textFieldLabelLineHeight, _.selectTokens.textFieldLeftHelperOffset, _.selectTokens.textFieldLeftHelperFontFamily, _.selectTokens.textFieldLeftHelperFontSize, _.selectTokens.textFieldLeftHelperFontStyle, _.selectTokens.textFieldLeftHelperFontWeight, _.selectTokens.textFieldLeftHelperLetterSpacing, _.selectTokens.textFieldLeftHelperLineHeight, _.selectTokens.textFieldLabelInnerPadding, _.selectTokens.textFieldContentLabelInnerPadding, _.selectTokens.textFieldChipGap, _.selectTokens.textFieldChipBorderRadius, _.selectTokens.textFieldChipWidth, _.selectTokens.textFieldChipHeight, _.selectTokens.textFieldChipPaddingRight, _.selectTokens.textFieldChipPaddingLeft, _.selectTokens.textFieldChipClearContentMarginLeft, _.selectTokens.textFieldChipClearContentMarginRight, _.selectTokens.textFieldChipCloseIconSize, _.selectTokens.textFieldChipFontFamily, _.selectTokens.textFieldChipFontSize, _.selectTokens.textFieldChipFontStyle, _.selectTokens.textFieldChipFontWeight, _.selectTokens.textFieldChipLetterSpacing, _.selectTokens.textFieldChipLineHeight, _.selectTokens.buttonArrowMargin, _.selectTokens.targetHeight, _.selectTokens.buttonPadding, _.selectTokens.padding, _.selectTokens.borderRadius, _.selectTokens.itemHeight, _.selectTokens.itemPadding, _.selectTokens.itemPaddingTight, _.selectTokens.itemBorderRadius, _.selectTokens.itemIconMargin, _.selectTokens.itemIconSize, _.selectTokens.itemIconSizeTight, _.selectTokens.cellPadding, _.selectTokens.cellPaddingLeftContent, _.selectTokens.cellPaddingContent, _.selectTokens.cellPaddingRightContent, _.selectTokens.cellTextboxGap, _.selectTokens.cellGap, _.selectTokens.cellTitleFontFamily, _.selectTokens.cellTitleFontSize, _.selectTokens.cellTitleFontStyle, _.selectTokens.cellTitleFontWeight, _.selectTokens.cellTitleLetterSpacing, _.selectTokens.cellTitleLineHeight, _.selectTokens.fontFamily, _.selectTokens.fontSize, _.selectTokens.fontStyle, _.selectTokens.fontWeight, _.selectTokens.fontLetterSpacing, _.selectTokens.fontLineHeight, _.selectTokens.checkboxTriggerSize, _.selectTokens.checkboxTriggerSizeTight, _.selectTokens.checkboxTriggerBorderRadius, _.selectTokens.checkboxTriggerBorderRadiusTight, _.selectTokens.checkboxFillColor, _.selectTokens.checkboxIconColor, _.selectTokens.checkboxTriggerBorderColor, _.selectTokens.indicatorSize),
+      s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.5rem;", ":0.6875rem 0.875rem 0.6875rem 0.875rem;", ":0.375rem;", ":0.625rem;", ":0.0625rem;", ":-0.1875rem 0.25rem -0.1875rem -0.125rem;", ":-0.1875rem -0.125rem -0.1875rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 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.5rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-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.25rem;", ":0.25rem;", ":auto;", ":1.75rem;", ":0.5rem;", ":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 -0.125rem 0 0.25rem;", ":2.5rem;", ":1rem 0 1rem;", ":0.125rem;", ":0.625rem;", ":1.5rem;", ":0.5rem 0.75rem;", ":0.25rem 0.75rem;", ":0.5rem;", ":1.5rem;", ":1rem;", ":0 0.375rem 0 0;", ":0rem;", ":0rem;", ":0rem;", ":0rem;", ":0.125rem;", ":0.375rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":1.25rem;", ":0.875rem;", ":0.375rem;", ":0.25rem;", ":var(--text-accent);", ":var(--on-dark-text-primary);", ":var(--text-secondary);", ":0.375rem;"], _.selectTokens.textFieldHeight, _.selectTokens.textFieldPadding, _.selectTokens.textFieldPaddingWithChips, _.selectTokens.textFieldBorderRadius, _.selectTokens.textFieldBorderWidth, _.selectTokens.textFieldLeftContentMargin, _.selectTokens.textFieldRightContentMargin, _.selectTokens.textFieldTextBeforeMargin, _.selectTokens.textFieldTextAfterMargin, _.selectTokens.textFieldFontFamily, _.selectTokens.textFieldFontSize, _.selectTokens.textFieldFontStyle, _.selectTokens.textFieldFontWeight, _.selectTokens.textFieldLetterSpacing, _.selectTokens.textFieldLineHeight, _.selectTokens.textFieldLabelOffset, _.selectTokens.textFieldLabelFontFamily, _.selectTokens.textFieldLabelFontSize, _.selectTokens.textFieldLabelFontStyle, _.selectTokens.textFieldLabelFontWeight, _.selectTokens.textFieldLabelLetterSpacing, _.selectTokens.textFieldLabelLineHeight, _.selectTokens.textFieldLeftHelperOffset, _.selectTokens.textFieldLeftHelperFontFamily, _.selectTokens.textFieldLeftHelperFontSize, _.selectTokens.textFieldLeftHelperFontStyle, _.selectTokens.textFieldLeftHelperFontWeight, _.selectTokens.textFieldLeftHelperLetterSpacing, _.selectTokens.textFieldLeftHelperLineHeight, _.selectTokens.textFieldLabelInnerPadding, _.selectTokens.textFieldContentLabelInnerPadding, _.selectTokens.textFieldChipGap, _.selectTokens.textFieldChipBorderRadius, _.selectTokens.textFieldChipWidth, _.selectTokens.textFieldChipHeight, _.selectTokens.textFieldChipPaddingRight, _.selectTokens.textFieldChipPaddingLeft, _.selectTokens.textFieldChipClearContentMarginLeft, _.selectTokens.textFieldChipClearContentMarginRight, _.selectTokens.textFieldChipCloseIconSize, _.selectTokens.textFieldChipFontFamily, _.selectTokens.textFieldChipFontSize, _.selectTokens.textFieldChipFontStyle, _.selectTokens.textFieldChipFontWeight, _.selectTokens.textFieldChipLetterSpacing, _.selectTokens.textFieldChipLineHeight, _.selectTokens.buttonArrowMargin, _.selectTokens.targetHeight, _.selectTokens.buttonPadding, _.selectTokens.padding, _.selectTokens.borderRadius, _.selectTokens.itemHeight, _.selectTokens.itemPadding, _.selectTokens.itemPaddingTight, _.selectTokens.itemBorderRadius, _.selectTokens.itemIconSize, _.selectTokens.itemIconSizeTight, _.selectTokens.itemIconMargin, _.selectTokens.cellPadding, _.selectTokens.cellPaddingLeftContent, _.selectTokens.cellPaddingContent, _.selectTokens.cellPaddingRightContent, _.selectTokens.cellTextboxGap, _.selectTokens.cellGap, _.selectTokens.cellTitleFontFamily, _.selectTokens.cellTitleFontSize, _.selectTokens.cellTitleFontStyle, _.selectTokens.cellTitleFontWeight, _.selectTokens.cellTitleLetterSpacing, _.selectTokens.cellTitleLineHeight, _.selectTokens.fontFamily, _.selectTokens.fontSize, _.selectTokens.fontStyle, _.selectTokens.fontWeight, _.selectTokens.fontLetterSpacing, _.selectTokens.fontLineHeight, _.selectTokens.checkboxTriggerSize, _.selectTokens.checkboxTriggerSizeTight, _.selectTokens.checkboxTriggerBorderRadius, _.selectTokens.checkboxTriggerBorderRadiusTight, _.selectTokens.checkboxFillColor, _.selectTokens.checkboxIconColor, _.selectTokens.checkboxTriggerBorderColor, _.selectTokens.indicatorSize),
+      xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":0.5625rem 0.625rem 0.5625rem 0.625rem;", ":0.375rem;", ":0.5rem;", ":0.0625rem;", ":-0.0625rem 0.25rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 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;", ":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.25rem;", ":0.125rem;", ":auto;", ":1.25rem;", ":0.375rem;", ":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 -0.125rem 0 0.25rem;", ":2rem;", ":0.75rem 0 0.75rem;", ":0.125rem;", ":0.5rem;", ":1rem;", ":0.5rem;", ":0.25rem 0.5rem;", ":0.375rem;", ":1rem;", ":1rem;", ":0 0.25rem 0 0;", ":0rem;", ":0rem;", ":0rem;", ":0rem;", ":0.125rem;", ":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);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0.875rem;", ":0.875rem;", ":0.25rem;", ":0.25rem;", ":var(--text-accent);", ":var(--on-dark-text-primary);", ":var(--text-secondary);", ":0.375rem;"], _.selectTokens.textFieldHeight, _.selectTokens.textFieldPadding, _.selectTokens.textFieldPaddingWithChips, _.selectTokens.textFieldBorderRadius, _.selectTokens.textFieldBorderWidth, _.selectTokens.textFieldLeftContentMargin, _.selectTokens.textFieldRightContentMargin, _.selectTokens.textFieldTextBeforeMargin, _.selectTokens.textFieldTextAfterMargin, _.selectTokens.textFieldFontFamily, _.selectTokens.textFieldFontSize, _.selectTokens.textFieldFontStyle, _.selectTokens.textFieldFontWeight, _.selectTokens.textFieldLetterSpacing, _.selectTokens.textFieldLineHeight, _.selectTokens.textFieldLabelOffset, _.selectTokens.textFieldLabelFontFamily, _.selectTokens.textFieldLabelFontSize, _.selectTokens.textFieldLabelFontStyle, _.selectTokens.textFieldLabelFontWeight, _.selectTokens.textFieldLabelLetterSpacing, _.selectTokens.textFieldLabelLineHeight, _.selectTokens.textFieldLeftHelperOffset, _.selectTokens.textFieldLeftHelperFontFamily, _.selectTokens.textFieldLeftHelperFontSize, _.selectTokens.textFieldLeftHelperFontStyle, _.selectTokens.textFieldLeftHelperFontWeight, _.selectTokens.textFieldLeftHelperLetterSpacing, _.selectTokens.textFieldLeftHelperLineHeight, _.selectTokens.textFieldLabelInnerPadding, _.selectTokens.textFieldContentLabelInnerPadding, _.selectTokens.textFieldChipGap, _.selectTokens.textFieldChipBorderRadius, _.selectTokens.textFieldChipWidth, _.selectTokens.textFieldChipHeight, _.selectTokens.textFieldChipPaddingRight, _.selectTokens.textFieldChipPaddingLeft, _.selectTokens.textFieldChipClearContentMarginLeft, _.selectTokens.textFieldChipClearContentMarginRight, _.selectTokens.textFieldChipCloseIconSize, _.selectTokens.textFieldChipFontFamily, _.selectTokens.textFieldChipFontSize, _.selectTokens.textFieldChipFontStyle, _.selectTokens.textFieldChipFontWeight, _.selectTokens.textFieldChipLetterSpacing, _.selectTokens.textFieldChipLineHeight, _.selectTokens.buttonArrowMargin, _.selectTokens.targetHeight, _.selectTokens.buttonPadding, _.selectTokens.padding, _.selectTokens.borderRadius, _.selectTokens.itemHeight, _.selectTokens.itemPadding, _.selectTokens.itemPaddingTight, _.selectTokens.itemBorderRadius, _.selectTokens.itemIconSize, _.selectTokens.itemIconSizeTight, _.selectTokens.itemIconMargin, _.selectTokens.cellPadding, _.selectTokens.cellPaddingLeftContent, _.selectTokens.cellPaddingContent, _.selectTokens.cellPaddingRightContent, _.selectTokens.cellTextboxGap, _.selectTokens.cellGap, _.selectTokens.cellTitleFontFamily, _.selectTokens.cellTitleFontSize, _.selectTokens.cellTitleFontStyle, _.selectTokens.cellTitleFontWeight, _.selectTokens.cellTitleLetterSpacing, _.selectTokens.cellTitleLineHeight, _.selectTokens.fontFamily, _.selectTokens.fontSize, _.selectTokens.fontStyle, _.selectTokens.fontWeight, _.selectTokens.fontLetterSpacing, _.selectTokens.fontLineHeight, _.selectTokens.checkboxTriggerSize, _.selectTokens.checkboxTriggerSizeTight, _.selectTokens.checkboxTriggerBorderRadius, _.selectTokens.checkboxTriggerBorderRadiusTight, _.selectTokens.checkboxFillColor, _.selectTokens.checkboxIconColor, _.selectTokens.checkboxTriggerBorderColor, _.selectTokens.indicatorSize)
     },
-    view: {
-      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--surface-transparent-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--inverse-text-primary);", ":var(--inverse-text-primary-hover);", ":var(--inverse-text-primary-active);", ":var(--inverse-text-secondary);", ":var(--inverse-text-secondary-hover);", ":var(--inverse-text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-hover);", ":var(--surface-solid-default);", ":var(--surface-solid-default-hover);", ":var(--surface-solid-default-hover);", ":var(--surface-clear);", ":var(--surface-clear);", ":var(--surface-transparent-tertiary);"], _.selectTokens.helperTextColor, _.selectTokens.itemBackgroundHover, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.targetButtonColor, _.selectTokens.targetButtonColorHover, _.selectTokens.targetButtonColorActive, _.selectTokens.targetButtonArrowColor, _.selectTokens.targetButtonArrowColorHover, _.selectTokens.targetButtonArrowColorActive, _.selectTokens.targetTextfieldArrowColor, _.selectTokens.targetTextfieldArrowColorHover, _.selectTokens.targetTextfieldArrowColorActive, _.selectTokens.targetButtonBackgroundColor, _.selectTokens.targetButtonBackgroundColorHover, _.selectTokens.targetButtonBackgroundColorActive, _.selectTokens.targetTextfieldBackgroundColor, _.selectTokens.targetTextfieldBackgroundColorOpened, _.selectTokens.targetTextfieldBorderColor),
-      positive: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-positive);", ":var(--surface-transparent-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-primary-hover);", ":var(--on-dark-text-primary-active);", ":var(--on-dark-text-secondary);", ":var(--on-dark-text-secondary-hover);", ":var(--on-dark-text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-hover);", ":var(--surface-positive);", ":var(--surface-positive-hover);", ":var(--surface-positive-active);", ":var(--surface-clear);", ":var(--surface-clear);", ":var(--surface-positive);"], _.selectTokens.helperTextColor, _.selectTokens.itemBackgroundHover, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.targetButtonColor, _.selectTokens.targetButtonColorHover, _.selectTokens.targetButtonColorActive, _.selectTokens.targetButtonArrowColor, _.selectTokens.targetButtonArrowColorHover, _.selectTokens.targetButtonArrowColorActive, _.selectTokens.targetTextfieldArrowColor, _.selectTokens.targetTextfieldArrowColorHover, _.selectTokens.targetTextfieldArrowColorActive, _.selectTokens.targetButtonBackgroundColor, _.selectTokens.targetButtonBackgroundColorHover, _.selectTokens.targetButtonBackgroundColorActive, _.selectTokens.targetTextfieldBackgroundColor, _.selectTokens.targetTextfieldBackgroundColorOpened, _.selectTokens.targetTextfieldBorderColor),
-      warning: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-warning);", ":var(--surface-transparent-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-primary-hover);", ":var(--on-dark-text-primary-active);", ":var(--on-dark-text-secondary);", ":var(--on-dark-text-secondary-hover);", ":var(--on-dark-text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-hover);", ":var(--surface-warning);", ":var(--surface-warning-hover);", ":var(--surface-warning-active);", ":var(--surface-clear);", ":var(--surface-clear);", ":var(--surface-warning);"], _.selectTokens.helperTextColor, _.selectTokens.itemBackgroundHover, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.targetButtonColor, _.selectTokens.targetButtonColorHover, _.selectTokens.targetButtonColorActive, _.selectTokens.targetButtonArrowColor, _.selectTokens.targetButtonArrowColorHover, _.selectTokens.targetButtonArrowColorActive, _.selectTokens.targetTextfieldArrowColor, _.selectTokens.targetTextfieldArrowColorHover, _.selectTokens.targetTextfieldArrowColorActive, _.selectTokens.targetButtonBackgroundColor, _.selectTokens.targetButtonBackgroundColorHover, _.selectTokens.targetButtonBackgroundColorActive, _.selectTokens.targetTextfieldBackgroundColor, _.selectTokens.targetTextfieldBackgroundColorOpened, _.selectTokens.targetTextfieldBorderColor),
-      negative: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-negative);", ":var(--surface-transparent-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-primary-hover);", ":var(--on-dark-text-primary-active);", ":var(--on-dark-text-secondary);", ":var(--on-dark-text-secondary-hover);", ":var(--on-dark-text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-hover);", ":var(--surface-negative);", ":var(--surface-negative-hover);", ":var(--surface-negative-active);", ":var(--surface-clear);", ":var(--surface-clear);", ":var(--surface-negative);"], _.selectTokens.helperTextColor, _.selectTokens.itemBackgroundHover, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.targetButtonColor, _.selectTokens.targetButtonColorHover, _.selectTokens.targetButtonColorActive, _.selectTokens.targetButtonArrowColor, _.selectTokens.targetButtonArrowColorHover, _.selectTokens.targetButtonArrowColorActive, _.selectTokens.targetTextfieldArrowColor, _.selectTokens.targetTextfieldArrowColorHover, _.selectTokens.targetTextfieldArrowColorActive, _.selectTokens.targetButtonBackgroundColor, _.selectTokens.targetButtonBackgroundColorHover, _.selectTokens.targetButtonBackgroundColorActive, _.selectTokens.targetTextfieldBackgroundColor, _.selectTokens.targetTextfieldBackgroundColorOpened, _.selectTokens.targetTextfieldBorderColor),
-      accent: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-transparent-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-primary-hover);", ":var(--on-dark-text-primary-active);", ":var(--on-dark-text-secondary);", ":var(--on-dark-text-secondary-hover);", ":var(--on-dark-text-secondary-hover);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-accent-active);"], _.selectTokens.itemBackgroundHover, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.targetButtonColor, _.selectTokens.targetButtonColorHover, _.selectTokens.targetButtonColorActive, _.selectTokens.targetButtonArrowColor, _.selectTokens.targetButtonArrowColorHover, _.selectTokens.targetButtonArrowColorActive, _.selectTokens.targetButtonBackgroundColor, _.selectTokens.targetButtonBackgroundColorHover, _.selectTokens.targetButtonBackgroundColorActive),
-      secondary: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-transparent-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-primary);", ":var(--text-primary-hover);", ":var(--text-primary-active);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-hover);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary-hover);", ":var(--surface-transparent-secondary-active);"], _.selectTokens.itemBackgroundHover, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.targetButtonColor, _.selectTokens.targetButtonColorHover, _.selectTokens.targetButtonColorActive, _.selectTokens.targetButtonArrowColor, _.selectTokens.targetButtonArrowColorHover, _.selectTokens.targetButtonArrowColorActive, _.selectTokens.targetButtonBackgroundColor, _.selectTokens.targetButtonBackgroundColorHover, _.selectTokens.targetButtonBackgroundColorActive),
-      clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-transparent-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-primary);", ":var(--text-primary-hover);", ":var(--text-primary-active);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--surface-clear);", ":var(--surface-clear);", ":var(--surface-clear);"], _.selectTokens.itemBackgroundHover, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.targetButtonColor, _.selectTokens.targetButtonColorHover, _.selectTokens.targetButtonColorActive, _.selectTokens.targetButtonArrowColor, _.selectTokens.targetButtonArrowColorHover, _.selectTokens.targetButtonArrowColorActive, _.selectTokens.targetButtonBackgroundColor, _.selectTokens.targetButtonBackgroundColorHover, _.selectTokens.targetButtonBackgroundColorActive),
-      dark: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-transparent-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-primary-hover);", ":var(--on-dark-text-primary-active);", ":var(--on-dark-text-secondary);", ":var(--on-dark-text-secondary-hover);", ":var(--on-dark-text-secondary-active);", ":var(--on-light-surface-transparent-deep);", ":var(--on-light-surface-transparent-deep-hover);", ":var(--on-light-surface-transparent-deep-active);"], _.selectTokens.itemBackgroundHover, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.targetButtonColor, _.selectTokens.targetButtonColorHover, _.selectTokens.targetButtonColorActive, _.selectTokens.targetButtonArrowColor, _.selectTokens.targetButtonArrowColorHover, _.selectTokens.targetButtonArrowColorActive, _.selectTokens.targetButtonBackgroundColor, _.selectTokens.targetButtonBackgroundColorHover, _.selectTokens.targetButtonBackgroundColorActive),
-      black: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-transparent-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-primary-hover);", ":var(--on-dark-text-primary-active);", ":var(--on-dark-text-secondary);", ":var(--on-dark-text-secondary-hover);", ":var(--on-dark-text-secondary-active);", ":var(--on-light-surface-solid-default);", ":var(--on-light-surface-solid-default-hover);", ":var(--on-light-surface-solid-default-active);"], _.selectTokens.itemBackgroundHover, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.targetButtonColor, _.selectTokens.targetButtonColorHover, _.selectTokens.targetButtonColorActive, _.selectTokens.targetButtonArrowColor, _.selectTokens.targetButtonArrowColorHover, _.selectTokens.targetButtonArrowColorActive, _.selectTokens.targetButtonBackgroundColor, _.selectTokens.targetButtonBackgroundColorHover, _.selectTokens.targetButtonBackgroundColorActive),
-      white: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-transparent-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--on-light-text-primary);", ":var(--on-light-text-primary-hover);", ":var(--on-light-text-primary-active);", ":var(--on-light-text-secondary);", ":var(--on-light-text-secondary-hover);", ":var(--on-light-text-secondary-active);", ":var(--on-dark-surface-solid-default);", ":var(--on-dark-surface-solid-default-hover);", ":var(--on-dark-surface-solid-default-active);"], _.selectTokens.itemBackgroundHover, _.selectTokens.disclosureIconColor, _.selectTokens.disclosureIconColorHover, _.selectTokens.targetButtonColor, _.selectTokens.targetButtonColorHover, _.selectTokens.targetButtonColorActive, _.selectTokens.targetButtonArrowColor, _.selectTokens.targetButtonArrowColorHover, _.selectTokens.targetButtonArrowColorActive, _.selectTokens.targetButtonBackgroundColor, _.selectTokens.targetButtonBackgroundColorHover, _.selectTokens.targetButtonBackgroundColorActive)
+    labelPlacement: {
+      inner: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-input-label-color,var(--plasma-input-placeholder-color,var(--plasma-colors-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);"], _.selectTokens.textFieldPlaceholderColor, _.selectTokens.textFieldLabelInnerFontFamily, _.selectTokens.textFieldLabelInnerFontSize, _.selectTokens.textFieldLabelInnerFontStyle, _.selectTokens.textFieldLabelInnerFontWeight, _.selectTokens.textFieldLabelInnerLetterSpacing, _.selectTokens.textFieldLabelInnerLineHeight),
+      outer: /*#__PURE__*/(0, _styledComponents.css)([""])
     },
     chipView: {
-      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--surface-solid-default-hover);", ":var(--surface-solid-default-active);"], _.selectTokens.chipColor, _.selectTokens.chipBackground, _.selectTokens.chipBackgroundHover, _.selectTokens.chipBackgroundActive),
-      secondary: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary-hover);", ":var(--surface-transparent-secondary-active);"], _.selectTokens.chipColor, _.selectTokens.chipBackground, _.selectTokens.chipBackgroundHover, _.selectTokens.chipBackgroundActive),
-      accent: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-accent-active);"], _.selectTokens.chipColor, _.selectTokens.chipBackground, _.selectTokens.chipBackgroundHover, _.selectTokens.chipBackgroundActive)
+      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--surface-solid-default-hover);", ":var(--inverse-text-primary);"], _.selectTokens.textFieldChipColor, _.selectTokens.textFieldChipBackground, _.selectTokens.textFieldChipBackgroundHover, _.selectTokens.textFieldChipCloseIconColor),
+      secondary: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-primary);"], _.selectTokens.textFieldChipColor, _.selectTokens.textFieldChipBackground, _.selectTokens.textFieldChipBackgroundHover, _.selectTokens.textFieldChipCloseIconColor),
+      accent: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--on-dark-text-primary);"], _.selectTokens.textFieldChipColor, _.selectTokens.textFieldChipBackground, _.selectTokens.textFieldChipBackgroundHover, _.selectTokens.textFieldChipCloseIconColor)
+    },
+    disabled: {
+      "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;"], _.selectTokens.textFieldDisabledOpacity)
     }
   }
 };

package/styled-components/cjs/examples/plasma_web/components/Select/Select.stories.tsx

@@ -25,54 +25,58 @@ const meta: Meta<StorySelectProps> = {
     component: Select,
     argTypes: {
         target: {
+            control: 'select',
             options: ['button-like', 'textfield-like'],
-            control: {
-                type: 'select',
-            },
         },
         size: {
+            control: 'select',
             options: size,
-            control: {
-                type: 'select',
-            },
         },
         view: {
+            control: 'select',
             options: view,
-            control: {
-                type: 'select',
-            },
         },
         labelPlacement: {
+            control: 'select',
             options: labelPlacement,
-            control: {
-                type: 'select',
+            if: {
+                arg: 'target',
+                eq: 'textfield-like',
             },
         },
         chipView: {
+            control: 'select',
             options: chip,
-            control: {
-                type: 'select',
+            if: {
+                arg: 'target',
+                eq: 'textfield-like',
             },
         },
         variant: {
+            control: 'select',
             options: variant,
-            control: {
-                type: 'select',
-            },
         },
         listWidth: {
-            control: {
-                type: 'text',
-            },
+            control: 'text',
         },
         listOverflow: {
-            control: {
-                type: 'text',
-            },
+            control: 'text',
         },
         listHeight: {
-            control: {
-                type: 'text',
+            control: 'text',
+        },
+        helperText: {
+            control: 'text',
+            if: {
+                arg: 'target',
+                eq: 'textfield-like',
+            },
+        },
+        enableContentLeft: {
+            control: 'boolean',
+            if: {
+                arg: 'target',
+                eq: 'textfield-like',
             },
         },
     },
@@ -84,7 +88,7 @@ const meta: Meta<StorySelectProps> = {
         helperText: 'Helper text',
         size: 'm',
         view: 'default',
-        chipView: 'default',
+        chipView: 'secondary',
         enableContentLeft: false,
         isTargetAmount: false,
         variant: 'normal',
@@ -338,13 +342,18 @@ const SingleStory = (args: StorySelectProps) => {
                 items={items}
                 value={value}
                 onChange={setValue}
-                contentLeft={args.enableContentLeft ? <IconDone size="s" /> : undefined}
+                contentLeft={args.enableContentLeft ? <IconDone size="s" color="inherit" /> : undefined}
             />
         </div>
     );
 };
 
 export const Single: StoryObj<StorySelectProps> = {
+    parameters: {
+        controls: {
+            exclude: ['chipView', 'isTargetAmount'],
+        },
+    },
     render: (args) => <SingleStory {...args} />,
     args: {
         closeAfterSelect: true,
@@ -361,7 +370,7 @@ const MultiselectStory = (args: StorySelectProps) => {
                 items={items}
                 value={value}
                 onChange={setValue}
-                contentLeft={args.enableContentLeft ? <IconDone size="s" /> : undefined}
+                contentLeft={args.enableContentLeft ? <IconDone size="s" color="inherit" /> : undefined}
             />
         </div>
     );
@@ -386,7 +395,7 @@ const PredefinedStory = (args: StorySelectProps) => {
                 items={items}
                 value={valueSingle}
                 onChange={setValueSingle}
-                contentLeft={args.enableContentLeft ? <IconDone size="s" /> : undefined}
+                contentLeft={args.enableContentLeft ? <IconDone size="s" color="inherit" /> : undefined}
             />
 
             <br />
@@ -397,7 +406,7 @@ const PredefinedStory = (args: StorySelectProps) => {
                 multiselect
                 value={valueMultiple}
                 onChange={setValueMultiple}
-                contentLeft={args.enableContentLeft ? <IconDone size="s" /> : undefined}
+                contentLeft={args.enableContentLeft ? <IconDone size="s" color="inherit" /> : undefined}
             />
         </div>
     );
@@ -462,7 +471,7 @@ const CommonStory = (args: StorySelectProps) => {
                                     value={value}
                                     onChange={setValue}
                                     view="default"
-                                    contentLeft={enableContentLeft ? <IconDone size="s" /> : undefined}
+                                    contentLeft={enableContentLeft ? <IconDone size="s" color="inherit" /> : undefined}
                                 />
                             </div>
                         </td>
@@ -475,7 +484,7 @@ const CommonStory = (args: StorySelectProps) => {
                                     value={valueMultiple}
                                     onChange={setValueMultiple}
                                     view="default"
-                                    contentLeft={enableContentLeft ? <IconDone size="s" /> : undefined}
+                                    contentLeft={enableContentLeft ? <IconDone size="s" color="inherit" /> : undefined}
                                 />
                             </div>
                         </td>
@@ -606,7 +615,7 @@ const CommonStory = (args: StorySelectProps) => {
                                     value={value}
                                     onChange={setValue}
                                     view="positive"
-                                    contentLeft={enableContentLeft ? <IconDone size="s" /> : undefined}
+                                    contentLeft={enableContentLeft ? <IconDone size="s" color="inherit" /> : undefined}
                                 />
                             </div>
                         </td>
@@ -619,7 +628,7 @@ const CommonStory = (args: StorySelectProps) => {
                                     value={valueMultiple}
                                     onChange={setValueMultiple}
                                     view="positive"
-                                    contentLeft={enableContentLeft ? <IconDone size="s" /> : undefined}
+                                    contentLeft={enableContentLeft ? <IconDone size="s" color="inherit" /> : undefined}
                                 />
                             </div>
                         </td>
@@ -659,7 +668,7 @@ const CommonStory = (args: StorySelectProps) => {
                                     value={value}
                                     onChange={setValue}
                                     view="warning"
-                                    contentLeft={enableContentLeft ? <IconDone size="s" /> : undefined}
+                                    contentLeft={enableContentLeft ? <IconDone size="s" color="inherit" /> : undefined}
                                 />
                             </div>
                         </td>
@@ -672,7 +681,7 @@ const CommonStory = (args: StorySelectProps) => {
                                     value={valueMultiple}
                                     onChange={setValueMultiple}
                                     view="warning"
-                                    contentLeft={enableContentLeft ? <IconDone size="s" /> : undefined}
+                                    contentLeft={enableContentLeft ? <IconDone size="s" color="inherit" /> : undefined}
                                 />
                             </div>
                         </td>
@@ -712,7 +721,7 @@ const CommonStory = (args: StorySelectProps) => {
                                     value={value}
                                     onChange={setValue}
                                     view="negative"
-                                    contentLeft={enableContentLeft ? <IconDone size="s" /> : undefined}
+                                    contentLeft={enableContentLeft ? <IconDone size="s" color="inherit" /> : undefined}
                                 />
                             </div>
                         </td>
@@ -725,7 +734,7 @@ const CommonStory = (args: StorySelectProps) => {
                                     value={valueMultiple}
                                     onChange={setValueMultiple}
                                     view="negative"
-                                    contentLeft={enableContentLeft ? <IconDone size="s" /> : undefined}
+                                    contentLeft={enableContentLeft ? <IconDone size="s" color="inherit" /> : undefined}
                                 />
                             </div>
                         </td>
@@ -835,9 +844,7 @@ export const Common: StoryObj<StorySelectProps> = {
     argTypes: {
         size: {
             options: size,
-            control: {
-                type: 'select',
-            },
+            control: 'select',
         },
     },
     args: {

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

@@ -10,22 +10,15 @@ var config = exports.config = {
   defaults: {
     view: 'default',
     size: 'm',
-    toggleSize: 'l',
     labelPosition: 'before',
     focused: 'true'
   },
   variations: {
     size: {
-      s: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-line-height);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-letter-spacing);", ":0.25rem;", ":0.75rem;"], _Switch.switchTokens.fontFamily, _Switch.switchTokens.fontStyle, _Switch.switchTokens.fontWeight, _Switch.switchTokens.lineHeight, _Switch.switchTokens.fontSize, _Switch.switchTokens.letterSpacing, _Switch.switchTokens.descriptionFontFamily, _Switch.switchTokens.descriptionFontStyle, _Switch.switchTokens.descriptionFontWeight, _Switch.switchTokens.descriptionLineHeight, _Switch.switchTokens.descriptionFontSize, _Switch.switchTokens.descriptionLetterSpacing, _Switch.switchTokens.verticalGap, _Switch.switchTokens.labelOffset),
-      m: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-xs-letter-spacing);", ":0.25rem;", ":0.75rem;"], _Switch.switchTokens.fontFamily, _Switch.switchTokens.fontStyle, _Switch.switchTokens.fontWeight, _Switch.switchTokens.lineHeight, _Switch.switchTokens.fontSize, _Switch.switchTokens.letterSpacing, _Switch.switchTokens.descriptionFontFamily, _Switch.switchTokens.descriptionFontStyle, _Switch.switchTokens.descriptionFontWeight, _Switch.switchTokens.descriptionLineHeight, _Switch.switchTokens.descriptionFontSize, _Switch.switchTokens.descriptionLetterSpacing, _Switch.switchTokens.verticalGap, _Switch.switchTokens.labelOffset),
-      l: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-xs-letter-spacing);", ":0.25rem;", ":0.75rem;"], _Switch.switchTokens.fontFamily, _Switch.switchTokens.fontStyle, _Switch.switchTokens.fontWeight, _Switch.switchTokens.lineHeight, _Switch.switchTokens.fontSize, _Switch.switchTokens.letterSpacing, _Switch.switchTokens.descriptionFontFamily, _Switch.switchTokens.descriptionFontStyle, _Switch.switchTokens.descriptionFontWeight, _Switch.switchTokens.descriptionLineHeight, _Switch.switchTokens.descriptionFontSize, _Switch.switchTokens.descriptionLetterSpacing, _Switch.switchTokens.verticalGap, _Switch.switchTokens.labelOffset)
-    },
-    toggleSize: {
-      l: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.5rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffset, _Switch.switchTokens.thumbPressScale),
-      s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":1rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffset, _Switch.switchTokens.thumbPressScale)
+      m: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-typo-body1-font-family);", ":var(--plasma-typo-body1-font-style);", ":var(--plasma-typo-body1-font-weight);", ":var(--plasma-typo-body1-font-weight);", ":var(--plasma-typo-body1-line-height);", ":var(--plasma-typo-body1-font-size);", ":var(--plasma-typo-body1-letter-spacing);", ":2.75rem;", ":1.75rem;", ":calc(var(", ") / 2);", ":1.5rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;", ":0.75rem;"], _Switch.switchTokens.fontFamily, _Switch.switchTokens.fontStyle, _Switch.switchTokens.fontWeight, _Switch.switchTokens.fontWeight, _Switch.switchTokens.lineHeight, _Switch.switchTokens.fontSize, _Switch.switchTokens.letterSpacing, _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffset, _Switch.switchTokens.thumbPressScale, _Switch.switchTokens.labelOffset)
     },
     view: {
-      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":var(--on-dark-surface-solid-default);", ":0 1px 1px rgba(0,0,0,0.11);"], _Switch.switchTokens.labelColor, _Switch.switchTokens.descriptionColor, _Switch.switchTokens.trackBackgroundColorOn, _Switch.switchTokens.trackBackgroundColorOnHover, _Switch.switchTokens.trackBackgroundColorOff, _Switch.switchTokens.trackBackgroundColorOffHover, _Switch.switchTokens.thumbBackgroundColor, _Switch.switchTokens.thumbBoxShadow)
+      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":var(--on-dark-surface-solid-default);", ":0 1px 1px rgba(0,0,0,0.11);"], _Switch.switchTokens.trackBackgroundColorOn, _Switch.switchTokens.trackBackgroundColorOnHover, _Switch.switchTokens.trackBackgroundColorOff, _Switch.switchTokens.trackBackgroundColorOffHover, _Switch.switchTokens.thumbBackgroundColor, _Switch.switchTokens.thumbBoxShadow)
     },
     disabled: {
       "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;"], _Switch.switchTokens.disabledOpacity)

package/styled-components/cjs/examples/plasma_web/components/Switch/Switch.stories.tsx

@@ -17,17 +17,9 @@ const meta: Meta<SwitchProps> = {
     title: 'plasma_web/Switch',
     decorators: [WithTheme],
     component: Switch,
-    argTypes: {
-        ...argTypesFromConfig(mergeConfig(switchConfig, config), ['view', 'focused']),
-        labelPosition: {
-            options: ['before', 'after'],
-            control: { type: 'select' },
-        },
-    },
+    argTypes: argTypesFromConfig(mergeConfig(switchConfig, config), ['size', 'view', 'focused']),
     args: {
         label: 'Label',
-        description: 'Description',
-        labelPosition: 'before',
     },
 };
 
@@ -65,10 +57,5 @@ const StoryDefault = (args: SwitchProps) => {
 };
 
 export const Default: StoryObj<SwitchProps> = {
-    args: {
-        size: 'm',
-        toggleSize: 'l',
-        disabled: false,
-    },
     render: (args) => <StoryDefault {...args} />,
 };