@salutejs/plasma-new-hope 0.94.0-canary.1224.9693519563.0 → 0.94.0-canary.1233.9699006063.0

package/styled-components/es/examples/plasma_b2c/components/Select/style.css

@@ -0,0 +1,38 @@
+
+.container {
+    width: 100%;
+}
+
+table {
+    border-collapse: collapse;
+    box-shadow: 0 0 20px rgba(0,0,0,0.1);
+}
+
+th,
+td {
+    padding: 15px;
+}
+
+th {
+    text-align: left;
+}
+
+table, th, td {
+    border: 1px solid lightgray;
+    border-collapse: collapse;
+}
+
+thead {
+    th {
+        background-color: #55608f;
+        color: #fff;
+    }
+}
+
+tbody {
+
+    td {
+        position: relative;
+
+    }
+}

package/styled-components/es/examples/plasma_web/components/Calendar/Calendar.stories.tsx

@@ -26,12 +26,6 @@ const meta: Meta<typeof CalendarBase> = {
                 type: 'date',
             },
         },
-        size: {
-            options: ['l', 'm', 's', 'xs'],
-            control: {
-                type: 'inline-radio',
-            },
-        },
     },
 };
 
@@ -85,7 +79,7 @@ const baseEvents = [
 ];
 
 const StoryDefault = (args: CalendarProps) => {
-    const { isRange, isDouble, min, max, date, includeEdgeDates, size } = args;
+    const { isRange, isDouble, min, max, date, includeEdgeDates } = args;
     const [value, setValue] = useState(new Date(2023, 10, 16));
     const [valueRange, setValueRange] = useState<[Date, Date?]>([new Date(2023, 10, 16), new Date(2023, 10, 23)]);
 
@@ -108,7 +102,6 @@ const StoryDefault = (args: CalendarProps) => {
 
     return (
         <Calendar
-            size={size}
             isRange={isRange}
             isDouble={isDouble}
             date={date}
@@ -130,13 +123,12 @@ export const Default: StoryObj<CalendarProps> = {
         isDouble: false,
         isRange: false,
         includeEdgeDates: false,
-        size: 'm',
     },
     render: (args) => <StoryDefault {...args} />,
 };
 
 const StoryBase = (args: CalendarBaseProps) => {
-    const { min, max, type, includeEdgeDates, size } = args;
+    const { min, max, type, includeEdgeDates } = args;
     const [value, setValue] = useState(new Date(2023, 10, 16));
 
     const handleOnChange = useCallback((newValue: Date) => {
@@ -155,7 +147,6 @@ const StoryBase = (args: CalendarBaseProps) => {
 
     return (
         <CalendarBase
-            size={size}
             value={value}
             eventList={eventsRange}
             disabledList={disabledDays}
@@ -178,7 +169,6 @@ export const Base: StoryObj<CalendarBaseProps> = {
         },
     },
     args: {
-        size: 'm',
         min: new Date(2023, 10, 1),
         max: new Date(2023, 11, 24),
         includeEdgeDates: false,
@@ -188,7 +178,7 @@ export const Base: StoryObj<CalendarBaseProps> = {
 };
 
 const StoryDouble = (args: CalendarDoubleProps) => {
-    const { min, max, includeEdgeDates, size } = args;
+    const { min, max, includeEdgeDates } = args;
     const [value, setValue] = useState(new Date(2023, 10, 16));
     const handleOnChange = useCallback((newValue: Date) => {
         setValue(newValue);
@@ -206,7 +196,6 @@ const StoryDouble = (args: CalendarDoubleProps) => {
 
     return (
         <CalendarDouble
-            size={size}
             value={value}
             eventList={eventsRange}
             disabledList={disabledDays}
@@ -220,7 +209,6 @@ const StoryDouble = (args: CalendarDoubleProps) => {
 
 export const Double: StoryObj<CalendarDoubleProps> = {
     args: {
-        size: 'm',
         min: new Date(2023, 10, 1),
         max: new Date(2023, 11, 24),
         includeEdgeDates: false,
@@ -229,7 +217,7 @@ export const Double: StoryObj<CalendarDoubleProps> = {
 };
 
 const StoryRange = (args: CalendarBaseRangeProps) => {
-    const { min, max, type, includeEdgeDates, size } = args;
+    const { min, max, type, includeEdgeDates } = args;
     const [values, setValue] = useState<[Date, Date?]>([new Date(2023, 10, 15), new Date(2023, 10, 24)]);
     const handleOnChange = useCallback((newValue: [Date, Date?]) => {
         onChangeValue(newValue);
@@ -250,7 +238,6 @@ const StoryRange = (args: CalendarBaseRangeProps) => {
 
     return (
         <CalendarBaseRange
-            size={size}
             value={values}
             eventList={eventList}
             disabledList={disabledList}
@@ -273,7 +260,6 @@ export const Range: StoryObj<CalendarBaseRangeProps> = {
         },
     },
     args: {
-        size: 'm',
         min: new Date(2023, 10, 1),
         max: new Date(2023, 11, 24),
         includeEdgeDates: false,
@@ -283,7 +269,7 @@ export const Range: StoryObj<CalendarBaseRangeProps> = {
 };
 
 const StoryRangeDouble = (args: CalendarBaseRangeProps) => {
-    const { min, max, includeEdgeDates, size } = args;
+    const { min, max, includeEdgeDates } = args;
     const [values, setValue] = useState<[Date, Date?]>([new Date(2023, 10, 15), new Date(2023, 10, 24)]);
     const handleOnChange = useCallback((newValue: [Date, Date?]) => {
         onChangeValue(newValue);
@@ -304,7 +290,6 @@ const StoryRangeDouble = (args: CalendarBaseRangeProps) => {
 
     return (
         <CalendarDoubleRange
-            size={size}
             value={values}
             eventList={eventList}
             disabledList={disabledList}
@@ -318,7 +303,6 @@ const StoryRangeDouble = (args: CalendarBaseRangeProps) => {
 
 export const RangeDouble: StoryObj<CalendarBaseRangeProps> = {
     args: {
-        size: 'm',
         min: new Date(2023, 10, 1),
         max: new Date(2023, 11, 24),
         includeEdgeDates: false,
@@ -327,7 +311,7 @@ export const RangeDouble: StoryObj<CalendarBaseRangeProps> = {
 };
 
 const StoryWithPopover = (args: CalendarProps) => {
-    const { isDouble, min, max, includeEdgeDates, size } = args;
+    const { isDouble, min, max, includeEdgeDates } = args;
     const [isOpen, setIsOpen] = useState(false);
     const [textValue, setTextValue] = useState('2023-10-16');
     const [value, setValue] = useState(new Date(textValue));
@@ -361,7 +345,6 @@ const StoryWithPopover = (args: CalendarProps) => {
             closeOnOverlayClick
         >
             <StyledCalendar
-                size={size}
                 value={value}
                 eventList={[...baseEvents, ...eventsRange]}
                 disabledList={disabledDays}
@@ -378,7 +361,6 @@ const StoryWithPopover = (args: CalendarProps) => {
 
 export const WithPopover: StoryObj<CalendarProps> = {
     args: {
-        size: 'm',
         min: new Date(2023, 9, 1),
         max: new Date(2023, 11, 24),
         isDouble: false,

package/styled-components/es/examples/plasma_web/components/Calendar/CalendarBase.config.js

@@ -7,13 +7,10 @@ export var config = {
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/css(["", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-default);", ":transparent;", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-accent);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-accent);", ":var(--surface-solid-default);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--surface-accent);"], calendarBaseTokens.calendarSelectedItemBackground, calendarBaseTokens.calendarSelectedItemColor, calendarBaseTokens.calendarSelectableItemBackgroundHover, calendarBaseTokens.calendarCurrentItemBorderColor, calendarBaseTokens.calendarCurrentItemBackgroundHover, calendarBaseTokens.calendarCurrentItemColorHover, calendarBaseTokens.calendarCurrentItemChildBackgroundHover, calendarBaseTokens.calendarActiveItemBackground, calendarBaseTokens.calendarActiveItemColor, calendarBaseTokens.calendarHoveredItemBackground, calendarBaseTokens.calendarHoveredItemColor, calendarBaseTokens.calendarRangeBackground, calendarBaseTokens.calendarOutlineFocusColor, calendarBaseTokens.calendarContentPrimaryColor, calendarBaseTokens.calendarContentSecondaryColor, calendarBaseTokens.calendarDayOfWeekColor, calendarBaseTokens.iconButtonColor, calendarBaseTokens.iconButtonBackgroundColor, calendarBaseTokens.iconButtonColorHover, calendarBaseTokens.iconButtonBackgroundColorHover, calendarBaseTokens.iconButtonColorActive, calendarBaseTokens.iconButtonBackgroundColorActive, calendarBaseTokens.iconButtonFocusColor)
+      "default": /*#__PURE__*/css(["", ":transparent;", ":var(--plasma-colors-primary);", ":var(--plasma-colors-background-primary);", ":var(--plasma-colors-surface-liquid02);", ":var(--plasma-colors-primary);", ":transparent;", ":var(--plasma-colors-primary);", ":var(--plasma-colors-surface-liquid02);", ":var(--plasma-colors-primary);", ":var(--plasma-colors-surface-solid03);", ":var(--plasma-colors-accent);", ":var(--plasma-colors-background-primary);", ":var(--plasma-colors-surface-liquid02);", ":var(--plasma-colors-button-focused);", ":var(--plasma-colors-primary);", ":var(--plasma-colors-secondary);"], calendarBaseTokens.calendarBackgroundColor, calendarBaseTokens.calendarSelectedItemBackground, calendarBaseTokens.calendarSelectedItemColor, calendarBaseTokens.calendarSelectableItemBackgroundHover, calendarBaseTokens.calendarCurrentItemBorderColor, calendarBaseTokens.calendarCurrentItemBackgroundHover, calendarBaseTokens.calendarCurrentItemColorHover, calendarBaseTokens.calendarCurrentItemChildBackgroundHover, calendarBaseTokens.calendarActiveItemBackground, calendarBaseTokens.calendarActiveItemColor, calendarBaseTokens.calendarHoveredItemBackground, calendarBaseTokens.calendarHoveredItemColor, calendarBaseTokens.calendarRangeBackground, calendarBaseTokens.calendarOutlineFocusColor, calendarBaseTokens.calendarContentPrimaryColor, calendarBaseTokens.calendarContentSecondaryColor)
     },
     size: {
-      l: /*#__PURE__*/css(["", ":24.5rem;", ":25rem;", ":0.5rem 0.5rem 0 0.5rem;", ":0.75rem;", ":7.8125rem;", ":5.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-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.5rem 0.5rem 0 0.5rem;", ":0.75rem;", ":7.8125rem;", ":5.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-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.5rem 0 0 0;", ":0.75rem;", ":3.5rem;", ":3rem;", ":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-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.5rem;", ":0 0 0 1rem;", ":0.5rem;", ":var(--plasma-typo-h4-font-family);", ":var(--plasma-typo-h4-font-size);", ":var(--plasma-typo-h4-font-style);", ":var(--plasma-typo-h4-letter-spacing);", ":var(--plasma-typo-h4-line-height);", ":var(--plasma-typo-h4-font-weight);", ":var(--plasma-typo-h4-bold-font-weight);", ":3.5rem;", ":3.5rem;", ":1.5rem;", ":0.875rem;"], calendarBaseTokens.calendarWidth, calendarBaseTokens.calendarHeight, calendarBaseTokens.calendarYearsPadding, calendarBaseTokens.calendarYearItemBorderRadius, calendarBaseTokens.calendarYearItemWidth, calendarBaseTokens.calendarYearItemHeight, calendarBaseTokens.calendarYearFontFamily, calendarBaseTokens.calendarYearFontSize, calendarBaseTokens.calendarYearFontStyle, calendarBaseTokens.calendarYearFontLetterSpacing, calendarBaseTokens.calendarYearFontLineHeight, calendarBaseTokens.calendarYearFontWeight, calendarBaseTokens.calendarYearSelectedFontWeight, calendarBaseTokens.calendarMonthsPadding, calendarBaseTokens.calendarMonthItemBorderRadius, calendarBaseTokens.calendarMonthItemWidth, calendarBaseTokens.calendarMonthItemHeight, calendarBaseTokens.calendarMonthFontFamily, calendarBaseTokens.calendarMonthFontSize, calendarBaseTokens.calendarMonthFontStyle, calendarBaseTokens.calendarMonthFontLetterSpacing, calendarBaseTokens.calendarMonthFontLineHeight, calendarBaseTokens.calendarMonthFontWeight, calendarBaseTokens.calendarMonthSelectedFontWeight, calendarBaseTokens.calendarDaysPadding, calendarBaseTokens.calendarDayItemBorderRadius, calendarBaseTokens.calendarDayItemWidth, calendarBaseTokens.calendarDayItemHeight, calendarBaseTokens.calendarDayFontFamily, calendarBaseTokens.calendarDayFontSize, calendarBaseTokens.calendarDayFontStyle, calendarBaseTokens.calendarDayFontLetterSpacing, calendarBaseTokens.calendarDayFontLineHeight, calendarBaseTokens.calendarDayFontWeight, calendarBaseTokens.calendarDaySelectedFontWeight, calendarBaseTokens.calendarHeaderArrowGap, calendarBaseTokens.calendarHeaderPadding, calendarBaseTokens.calendarHeaderDateGap, calendarBaseTokens.calendarHeaderFontFamily, calendarBaseTokens.calendarHeaderFontSize, calendarBaseTokens.calendarHeaderFontStyle, calendarBaseTokens.calendarHeaderFontLetterSpacing, calendarBaseTokens.calendarHeaderFontLineHeight, calendarBaseTokens.calendarHeaderFontWeight, calendarBaseTokens.calendarHeaderFontWeightBold, calendarBaseTokens.iconButtonHeight, calendarBaseTokens.iconButtonWidth, calendarBaseTokens.iconButtonPadding, calendarBaseTokens.iconButtonRadius),
-      m: /*#__PURE__*/css(["", ":21rem;", ":21rem;", ":0.5rem 0.5rem 0 0.5rem;", ":0.625rem;", ":6.688rem;", ":4.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-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-bold-font-weight);", ":0.5rem 0.5rem 0 0.5rem;", ":0.625rem;", ":6.688rem;", ":4.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-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-bold-font-weight);", ":0.5rem 0 0 0;", ":0.625rem;", ":3rem;", ":2.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-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-bold-font-weight);", ":0.5rem;", ":0 0 0 0.75rem;", ":0.375rem;", ":var(--plasma-typo-h4-font-family);", ":var(--plasma-typo-h4-font-size);", ":var(--plasma-typo-h4-font-style);", ":var(--plasma-typo-h4-letter-spacing);", ":var(--plasma-typo-h4-line-height);", ":var(--plasma-typo-h4-font-weight);", ":var(--plasma-typo-h4-bold-font-weight);", ":3rem;", ":3rem;", ":1.25rem;", ":0.75rem;"], calendarBaseTokens.calendarWidth, calendarBaseTokens.calendarHeight, calendarBaseTokens.calendarYearsPadding, calendarBaseTokens.calendarYearItemBorderRadius, calendarBaseTokens.calendarYearItemWidth, calendarBaseTokens.calendarYearItemHeight, calendarBaseTokens.calendarYearFontFamily, calendarBaseTokens.calendarYearFontSize, calendarBaseTokens.calendarYearFontStyle, calendarBaseTokens.calendarYearFontLetterSpacing, calendarBaseTokens.calendarYearFontLineHeight, calendarBaseTokens.calendarYearFontWeight, calendarBaseTokens.calendarYearSelectedFontWeight, calendarBaseTokens.calendarMonthsPadding, calendarBaseTokens.calendarMonthItemBorderRadius, calendarBaseTokens.calendarMonthItemWidth, calendarBaseTokens.calendarMonthItemHeight, calendarBaseTokens.calendarMonthFontFamily, calendarBaseTokens.calendarMonthFontSize, calendarBaseTokens.calendarMonthFontStyle, calendarBaseTokens.calendarMonthFontLetterSpacing, calendarBaseTokens.calendarMonthFontLineHeight, calendarBaseTokens.calendarMonthFontWeight, calendarBaseTokens.calendarMonthSelectedFontWeight, calendarBaseTokens.calendarDaysPadding, calendarBaseTokens.calendarDayItemBorderRadius, calendarBaseTokens.calendarDayItemWidth, calendarBaseTokens.calendarDayItemHeight, calendarBaseTokens.calendarDayFontFamily, calendarBaseTokens.calendarDayFontSize, calendarBaseTokens.calendarDayFontStyle, calendarBaseTokens.calendarDayFontLetterSpacing, calendarBaseTokens.calendarDayFontLineHeight, calendarBaseTokens.calendarDayFontWeight, calendarBaseTokens.calendarDaySelectedFontWeight, calendarBaseTokens.calendarHeaderArrowGap, calendarBaseTokens.calendarHeaderPadding, calendarBaseTokens.calendarHeaderDateGap, calendarBaseTokens.calendarHeaderFontFamily, calendarBaseTokens.calendarHeaderFontSize, calendarBaseTokens.calendarHeaderFontStyle, calendarBaseTokens.calendarHeaderFontLetterSpacing, calendarBaseTokens.calendarHeaderFontLineHeight, calendarBaseTokens.calendarHeaderFontWeight, calendarBaseTokens.calendarHeaderFontWeightBold, calendarBaseTokens.iconButtonHeight, calendarBaseTokens.iconButtonWidth, calendarBaseTokens.iconButtonPadding, calendarBaseTokens.iconButtonRadius),
-      s: /*#__PURE__*/css(["", ":17.5rem;", ":17rem;", ":0.5rem 0.5rem 0 0.5rem;", ":0.5rem;", ":5.5rem;", ":3.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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-bold-font-weight);", ":0.5rem 0.5rem 0 0.5rem;", ":0.5rem;", ":5.5rem;", ":3.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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-bold-font-weight);", ":0.5rem 0 0 0;", ":0.5rem;", ":2.5rem;", ":2rem;", ":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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-bold-font-weight);", ":0.5rem;", ":0 0 0 0.5rem;", ":0.25rem;", ":var(--plasma-typo-h4-font-family);", ":var(--plasma-typo-h4-font-size);", ":var(--plasma-typo-h4-font-style);", ":var(--plasma-typo-h4-letter-spacing);", ":var(--plasma-typo-h4-line-height);", ":var(--plasma-typo-h4-font-weight);", ":var(--plasma-typo-h4-bold-font-weight);", ":2.5rem;", ":2.5rem;", ":1rem;", ":0.625rem;"], calendarBaseTokens.calendarWidth, calendarBaseTokens.calendarHeight, calendarBaseTokens.calendarYearsPadding, calendarBaseTokens.calendarYearItemBorderRadius, calendarBaseTokens.calendarYearItemWidth, calendarBaseTokens.calendarYearItemHeight, calendarBaseTokens.calendarYearFontFamily, calendarBaseTokens.calendarYearFontSize, calendarBaseTokens.calendarYearFontStyle, calendarBaseTokens.calendarYearFontLetterSpacing, calendarBaseTokens.calendarYearFontLineHeight, calendarBaseTokens.calendarYearFontWeight, calendarBaseTokens.calendarYearSelectedFontWeight, calendarBaseTokens.calendarMonthsPadding, calendarBaseTokens.calendarMonthItemBorderRadius, calendarBaseTokens.calendarMonthItemWidth, calendarBaseTokens.calendarMonthItemHeight, calendarBaseTokens.calendarMonthFontFamily, calendarBaseTokens.calendarMonthFontSize, calendarBaseTokens.calendarMonthFontStyle, calendarBaseTokens.calendarMonthFontLetterSpacing, calendarBaseTokens.calendarMonthFontLineHeight, calendarBaseTokens.calendarMonthFontWeight, calendarBaseTokens.calendarMonthSelectedFontWeight, calendarBaseTokens.calendarDaysPadding, calendarBaseTokens.calendarDayItemBorderRadius, calendarBaseTokens.calendarDayItemWidth, calendarBaseTokens.calendarDayItemHeight, calendarBaseTokens.calendarDayFontFamily, calendarBaseTokens.calendarDayFontSize, calendarBaseTokens.calendarDayFontStyle, calendarBaseTokens.calendarDayFontLetterSpacing, calendarBaseTokens.calendarDayFontLineHeight, calendarBaseTokens.calendarDayFontWeight, calendarBaseTokens.calendarDaySelectedFontWeight, calendarBaseTokens.calendarHeaderArrowGap, calendarBaseTokens.calendarHeaderPadding, calendarBaseTokens.calendarHeaderDateGap, calendarBaseTokens.calendarHeaderFontFamily, calendarBaseTokens.calendarHeaderFontSize, calendarBaseTokens.calendarHeaderFontStyle, calendarBaseTokens.calendarHeaderFontLetterSpacing, calendarBaseTokens.calendarHeaderFontLineHeight, calendarBaseTokens.calendarHeaderFontWeight, calendarBaseTokens.calendarHeaderFontWeightBold, calendarBaseTokens.iconButtonHeight, calendarBaseTokens.iconButtonWidth, calendarBaseTokens.iconButtonPadding, calendarBaseTokens.iconButtonRadius),
-      xs: /*#__PURE__*/css(["", ":17.5rem;", ":15.5rem;", ":0.375rem 0.25rem 0 0.25rem;", ":0.375rem;", ":5.625rem;", ":3.281rem;", ":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-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":0.375rem 0.25rem 0 0.25rem;", ":0.375rem;", ":5.625rem;", ":3.281rem;", ":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-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":0.375rem 0 0 0;", ":0.5rem;", ":2.5rem;", ":1.875rem;", ":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-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":0;", ":0 0 0 0.5rem;", ":0.25rem;", ":var(--plasma-typo-h5-font-family);", ":var(--plasma-typo-h5-font-size);", ":var(--plasma-typo-h5-font-style);", ":var(--plasma-typo-h5-letter-spacing);", ":var(--plasma-typo-h5-line-height);", ":var(--plasma-typo-h5-font-weight);", ":var(--plasma-typo-h5-bold-font-weight);", ":2rem;", ":2rem;", ":0.75rem;", ":0.5rem;"], calendarBaseTokens.calendarWidth, calendarBaseTokens.calendarHeight, calendarBaseTokens.calendarYearsPadding, calendarBaseTokens.calendarYearItemBorderRadius, calendarBaseTokens.calendarYearItemWidth, calendarBaseTokens.calendarYearItemHeight, calendarBaseTokens.calendarYearFontFamily, calendarBaseTokens.calendarYearFontSize, calendarBaseTokens.calendarYearFontStyle, calendarBaseTokens.calendarYearFontLetterSpacing, calendarBaseTokens.calendarYearFontLineHeight, calendarBaseTokens.calendarYearFontWeight, calendarBaseTokens.calendarYearSelectedFontWeight, calendarBaseTokens.calendarMonthsPadding, calendarBaseTokens.calendarMonthItemBorderRadius, calendarBaseTokens.calendarMonthItemWidth, calendarBaseTokens.calendarMonthItemHeight, calendarBaseTokens.calendarMonthFontFamily, calendarBaseTokens.calendarMonthFontSize, calendarBaseTokens.calendarMonthFontStyle, calendarBaseTokens.calendarMonthFontLetterSpacing, calendarBaseTokens.calendarMonthFontLineHeight, calendarBaseTokens.calendarMonthFontWeight, calendarBaseTokens.calendarMonthSelectedFontWeight, calendarBaseTokens.calendarDaysPadding, calendarBaseTokens.calendarDayItemBorderRadius, calendarBaseTokens.calendarDayItemWidth, calendarBaseTokens.calendarDayItemHeight, calendarBaseTokens.calendarDayFontFamily, calendarBaseTokens.calendarDayFontSize, calendarBaseTokens.calendarDayFontStyle, calendarBaseTokens.calendarDayFontLetterSpacing, calendarBaseTokens.calendarDayFontLineHeight, calendarBaseTokens.calendarDayFontWeight, calendarBaseTokens.calendarDaySelectedFontWeight, calendarBaseTokens.calendarHeaderArrowGap, calendarBaseTokens.calendarHeaderPadding, calendarBaseTokens.calendarHeaderDateGap, calendarBaseTokens.calendarHeaderFontFamily, calendarBaseTokens.calendarHeaderFontSize, calendarBaseTokens.calendarHeaderFontStyle, calendarBaseTokens.calendarHeaderFontLetterSpacing, calendarBaseTokens.calendarHeaderFontLineHeight, calendarBaseTokens.calendarHeaderFontWeight, calendarBaseTokens.calendarHeaderFontWeightBold, calendarBaseTokens.iconButtonHeight, calendarBaseTokens.iconButtonWidth, calendarBaseTokens.iconButtonPadding, calendarBaseTokens.iconButtonRadius)
+      m: /*#__PURE__*/css(["", ":5.5rem;", ":0.5rem;", ":var(--plasma-typo-h4-font-family);", ":var(--plasma-typo-h4-font-size);", ":var(--plasma-typo-h4-font-style);", ":var(--plasma-typo-h4-letter-spacing);", ":var(--plasma-typo-h4-line-height);", ":var(--plasma-typo-h4-font-weight);", ":var(--plasma-typo-h4-bold-font-weight);", ":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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-weight);", ":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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-weight);", ":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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-weight);"], calendarBaseTokens.calendarHeaderArrowContainerWidth, calendarBaseTokens.calendarItemBorderRadius, calendarBaseTokens.calendarHeaderFontFamily, calendarBaseTokens.calendarHeaderFontSize, calendarBaseTokens.calendarHeaderFontStyle, calendarBaseTokens.calendarHeaderFontLetterSpacing, calendarBaseTokens.calendarHeaderFontLineHeight, calendarBaseTokens.calendarHeaderFontWeight, calendarBaseTokens.calendarHeaderFontWeightBold, calendarBaseTokens.calendarYearFontFamily, calendarBaseTokens.calendarYearFontSize, calendarBaseTokens.calendarYearFontStyle, calendarBaseTokens.calendarYearFontLetterSpacing, calendarBaseTokens.calendarYearFontLineHeight, calendarBaseTokens.calendarYearFontWeight, calendarBaseTokens.calendarMonthFontFamily, calendarBaseTokens.calendarMonthFontSize, calendarBaseTokens.calendarMonthFontStyle, calendarBaseTokens.calendarMonthFontLetterSpacing, calendarBaseTokens.calendarMonthFontLineHeight, calendarBaseTokens.calendarMonthFontWeight, calendarBaseTokens.calendarDayFontFamily, calendarBaseTokens.calendarDayFontSize, calendarBaseTokens.calendarDayFontStyle, calendarBaseTokens.calendarDayFontLetterSpacing, calendarBaseTokens.calendarDayFontLineHeight, calendarBaseTokens.calendarDayFontWeight)
     }
   }
 };

package/styled-components/es/examples/plasma_web/components/Calendar/CalendarDouble.config.js

@@ -7,13 +7,10 @@ export var config = {
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/css(["", ":var(--surface-transparent-secondary);", ":transparent;", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-default);", ":transparent;", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-accent);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-accent);", ":var(--surface-solid-default);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--surface-accent);"], calendarDoubleTokens.calendarSeparatorBackground, calendarDoubleTokens.calendarBackgroundColor, calendarDoubleTokens.calendarSelectedItemBackground, calendarDoubleTokens.calendarSelectedItemColor, calendarDoubleTokens.calendarSelectableItemBackgroundHover, calendarDoubleTokens.calendarCurrentItemBorderColor, calendarDoubleTokens.calendarCurrentItemBackgroundHover, calendarDoubleTokens.calendarCurrentItemColorHover, calendarDoubleTokens.calendarCurrentItemChildBackgroundHover, calendarDoubleTokens.calendarActiveItemBackground, calendarDoubleTokens.calendarActiveItemColor, calendarDoubleTokens.calendarHoveredItemBackground, calendarDoubleTokens.calendarHoveredItemColor, calendarDoubleTokens.calendarRangeBackground, calendarDoubleTokens.calendarOutlineFocusColor, calendarDoubleTokens.calendarContentPrimaryColor, calendarDoubleTokens.calendarContentSecondaryColor, calendarDoubleTokens.iconButtonColor, calendarDoubleTokens.iconButtonBackgroundColor, calendarDoubleTokens.iconButtonColorHover, calendarDoubleTokens.iconButtonBackgroundColorHover, calendarDoubleTokens.iconButtonColorActive, calendarDoubleTokens.iconButtonBackgroundColorActive, calendarDoubleTokens.iconButtonFocusColor)
+      "default": /*#__PURE__*/css(["", ":transparent;", ":var(--plasma-colors-primary);", ":var(--plasma-colors-background-primary);", ":var(--plasma-colors-surface-liquid02);", ":var(--plasma-colors-primary);", ":transparent;", ":var(--plasma-colors-primary);", ":var(--plasma-colors-surface-liquid02);", ":var(--plasma-colors-primary);", ":var(--plasma-colors-surface-solid03);", ":var(--plasma-colors-accent);", ":var(--plasma-colors-background-primary);", ":var(--plasma-colors-surface-liquid02);", ":var(--plasma-colors-surface-liquid02);", ":var(--plasma-colors-button-focused);", ":var(--plasma-colors-primary);", ":var(--plasma-colors-secondary);"], calendarDoubleTokens.calendarBackgroundColor, calendarDoubleTokens.calendarSelectedItemBackground, calendarDoubleTokens.calendarSelectedItemColor, calendarDoubleTokens.calendarSelectableItemBackgroundHover, calendarDoubleTokens.calendarCurrentItemBorderColor, calendarDoubleTokens.calendarCurrentItemBackgroundHover, calendarDoubleTokens.calendarCurrentItemColorHover, calendarDoubleTokens.calendarCurrentItemChildBackgroundHover, calendarDoubleTokens.calendarActiveItemBackground, calendarDoubleTokens.calendarActiveItemColor, calendarDoubleTokens.calendarHoveredItemBackground, calendarDoubleTokens.calendarHoveredItemColor, calendarDoubleTokens.calendarSeparatorBackground, calendarDoubleTokens.calendarRangeBackground, calendarDoubleTokens.calendarOutlineFocusColor, calendarDoubleTokens.calendarContentPrimaryColor, calendarDoubleTokens.calendarContentSecondaryColor)
     },
     size: {
-      l: /*#__PURE__*/css(["", ":51.063rem;", ":25rem;", ":0.5rem 0.5rem 0 0.5rem;", ":0.75rem;", ":7.8125rem;", ":5.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-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.5rem 0.5rem 0 0.5rem;", ":0.75rem;", ":7.8125rem;", ":5.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-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.75rem;", ":3.5rem;", ":3rem;", ":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-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-bold-font-weight);", ":0.5rem;", ":0.5rem 0 0 0;", ":0 0 0 1rem;", ":0.5rem;", ":var(--plasma-typo-h4-font-family);", ":var(--plasma-typo-h4-font-size);", ":var(--plasma-typo-h4-font-style);", ":var(--plasma-typo-h4-letter-spacing);", ":var(--plasma-typo-h4-line-height);", ":var(--plasma-typo-h4-font-weight);", ":var(--plasma-typo-h4-bold-font-weight);", ":3.5rem;", ":3.5rem;", ":1.5rem;", ":0.875rem;"], calendarDoubleTokens.calendarWidth, calendarDoubleTokens.calendarHeight, calendarDoubleTokens.calendarYearsPadding, calendarDoubleTokens.calendarYearItemBorderRadius, calendarDoubleTokens.calendarYearItemWidth, calendarDoubleTokens.calendarYearItemHeight, calendarDoubleTokens.calendarYearFontFamily, calendarDoubleTokens.calendarYearFontSize, calendarDoubleTokens.calendarYearFontStyle, calendarDoubleTokens.calendarYearFontLetterSpacing, calendarDoubleTokens.calendarYearFontLineHeight, calendarDoubleTokens.calendarYearFontWeight, calendarDoubleTokens.calendarYearSelectedFontWeight, calendarDoubleTokens.calendarMonthsPadding, calendarDoubleTokens.calendarMonthItemBorderRadius, calendarDoubleTokens.calendarMonthItemWidth, calendarDoubleTokens.calendarMonthItemHeight, calendarDoubleTokens.calendarMonthFontFamily, calendarDoubleTokens.calendarMonthFontSize, calendarDoubleTokens.calendarMonthFontStyle, calendarDoubleTokens.calendarMonthFontLetterSpacing, calendarDoubleTokens.calendarMonthFontLineHeight, calendarDoubleTokens.calendarMonthFontWeight, calendarDoubleTokens.calendarMonthSelectedFontWeight, calendarDoubleTokens.calendarDayItemBorderRadius, calendarDoubleTokens.calendarDayItemWidth, calendarDoubleTokens.calendarDayItemHeight, calendarDoubleTokens.calendarDayFontFamily, calendarDoubleTokens.calendarDayFontSize, calendarDoubleTokens.calendarDayFontStyle, calendarDoubleTokens.calendarDayFontLetterSpacing, calendarDoubleTokens.calendarDayFontLineHeight, calendarDoubleTokens.calendarDayFontWeight, calendarDoubleTokens.calendarDaySelectedFontWeight, calendarDoubleTokens.calendarHeaderArrowGap, calendarDoubleTokens.calendarDaysPadding, calendarDoubleTokens.calendarHeaderPadding, calendarDoubleTokens.calendarHeaderDateGap, calendarDoubleTokens.calendarHeaderFontFamily, calendarDoubleTokens.calendarHeaderFontSize, calendarDoubleTokens.calendarHeaderFontStyle, calendarDoubleTokens.calendarHeaderFontLetterSpacing, calendarDoubleTokens.calendarHeaderFontLineHeight, calendarDoubleTokens.calendarHeaderFontWeight, calendarDoubleTokens.calendarHeaderFontWeightBold, calendarDoubleTokens.iconButtonHeight, calendarDoubleTokens.iconButtonWidth, calendarDoubleTokens.iconButtonPadding, calendarDoubleTokens.iconButtonRadius),
-      m: /*#__PURE__*/css(["", ":44.063rem;", ":21rem;", ":0.5rem 0.5rem 0 0.5rem;", ":0.625rem;", ":6.688rem;", ":4.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-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-bold-font-weight);", ":0.5rem 0.5rem 0 0.5rem;", ":0.625rem;", ":6.688rem;", ":4.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-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-bold-font-weight);", ":0.5rem 0 0 0;", ":0.625rem;", ":3rem;", ":2.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-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-bold-font-weight);", ":0.5rem;", ":0.5rem 0 0 0;", ":0 0 0 0.75rem;", ":0.375rem;", ":var(--plasma-typo-h4-font-family);", ":var(--plasma-typo-h4-font-size);", ":var(--plasma-typo-h4-font-style);", ":var(--plasma-typo-h4-letter-spacing);", ":var(--plasma-typo-h4-line-height);", ":var(--plasma-typo-h4-font-weight);", ":var(--plasma-typo-h4-bold-font-weight);", ":3rem;", ":3rem;", ":1.25rem;", ":0.75rem;"], calendarDoubleTokens.calendarWidth, calendarDoubleTokens.calendarHeight, calendarDoubleTokens.calendarYearsPadding, calendarDoubleTokens.calendarYearItemBorderRadius, calendarDoubleTokens.calendarYearItemWidth, calendarDoubleTokens.calendarYearItemHeight, calendarDoubleTokens.calendarYearFontFamily, calendarDoubleTokens.calendarYearFontSize, calendarDoubleTokens.calendarYearFontStyle, calendarDoubleTokens.calendarYearFontLetterSpacing, calendarDoubleTokens.calendarYearFontLineHeight, calendarDoubleTokens.calendarYearFontWeight, calendarDoubleTokens.calendarYearSelectedFontWeight, calendarDoubleTokens.calendarMonthsPadding, calendarDoubleTokens.calendarMonthItemBorderRadius, calendarDoubleTokens.calendarMonthItemWidth, calendarDoubleTokens.calendarMonthItemHeight, calendarDoubleTokens.calendarMonthFontFamily, calendarDoubleTokens.calendarMonthFontSize, calendarDoubleTokens.calendarMonthFontStyle, calendarDoubleTokens.calendarMonthFontLetterSpacing, calendarDoubleTokens.calendarMonthFontLineHeight, calendarDoubleTokens.calendarMonthFontWeight, calendarDoubleTokens.calendarMonthSelectedFontWeight, calendarDoubleTokens.calendarDaysPadding, calendarDoubleTokens.calendarDayItemBorderRadius, calendarDoubleTokens.calendarDayItemWidth, calendarDoubleTokens.calendarDayItemHeight, calendarDoubleTokens.calendarDayFontFamily, calendarDoubleTokens.calendarDayFontSize, calendarDoubleTokens.calendarDayFontStyle, calendarDoubleTokens.calendarDayFontLetterSpacing, calendarDoubleTokens.calendarDayFontLineHeight, calendarDoubleTokens.calendarDayFontWeight, calendarDoubleTokens.calendarDaySelectedFontWeight, calendarDoubleTokens.calendarHeaderArrowGap, calendarDoubleTokens.calendarDaysPadding, calendarDoubleTokens.calendarHeaderPadding, calendarDoubleTokens.calendarHeaderDateGap, calendarDoubleTokens.calendarHeaderFontFamily, calendarDoubleTokens.calendarHeaderFontSize, calendarDoubleTokens.calendarHeaderFontStyle, calendarDoubleTokens.calendarHeaderFontLetterSpacing, calendarDoubleTokens.calendarHeaderFontLineHeight, calendarDoubleTokens.calendarHeaderFontWeight, calendarDoubleTokens.calendarHeaderFontWeightBold, calendarDoubleTokens.iconButtonHeight, calendarDoubleTokens.iconButtonWidth, calendarDoubleTokens.iconButtonPadding, calendarDoubleTokens.iconButtonRadius),
-      s: /*#__PURE__*/css(["", ":37.063rem;", ":17rem;", ":0.5rem 0.5rem 0 0.5rem;", ":0.5rem;", ":5.5rem;", ":3.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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-bold-font-weight);", ":0.5rem 0.5rem 0 0.5rem;", ":0.5rem;", ":5.5rem;", ":3.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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-bold-font-weight);", ":0.5rem;", ":2.5rem;", ":2rem;", ":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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-bold-font-weight);", ":0.5rem;", ":0.5rem 0 0 0;", ":0 0 0 0.5rem;", ":0.25rem;", ":var(--plasma-typo-h4-font-family);", ":var(--plasma-typo-h4-font-size);", ":var(--plasma-typo-h4-font-style);", ":var(--plasma-typo-h4-letter-spacing);", ":var(--plasma-typo-h4-line-height);", ":var(--plasma-typo-h4-font-weight);", ":var(--plasma-typo-h4-bold-font-weight);", ":2.5rem;", ":2.5rem;", ":1rem;", ":0.625rem;"], calendarDoubleTokens.calendarWidth, calendarDoubleTokens.calendarHeight, calendarDoubleTokens.calendarYearsPadding, calendarDoubleTokens.calendarYearItemBorderRadius, calendarDoubleTokens.calendarYearItemWidth, calendarDoubleTokens.calendarYearItemHeight, calendarDoubleTokens.calendarYearFontFamily, calendarDoubleTokens.calendarYearFontSize, calendarDoubleTokens.calendarYearFontStyle, calendarDoubleTokens.calendarYearFontLetterSpacing, calendarDoubleTokens.calendarYearFontLineHeight, calendarDoubleTokens.calendarYearFontWeight, calendarDoubleTokens.calendarYearSelectedFontWeight, calendarDoubleTokens.calendarMonthsPadding, calendarDoubleTokens.calendarMonthItemBorderRadius, calendarDoubleTokens.calendarMonthItemWidth, calendarDoubleTokens.calendarMonthItemHeight, calendarDoubleTokens.calendarMonthFontFamily, calendarDoubleTokens.calendarMonthFontSize, calendarDoubleTokens.calendarMonthFontStyle, calendarDoubleTokens.calendarMonthFontLetterSpacing, calendarDoubleTokens.calendarMonthFontLineHeight, calendarDoubleTokens.calendarMonthFontWeight, calendarDoubleTokens.calendarMonthSelectedFontWeight, calendarDoubleTokens.calendarDayItemBorderRadius, calendarDoubleTokens.calendarDayItemWidth, calendarDoubleTokens.calendarDayItemHeight, calendarDoubleTokens.calendarDayFontFamily, calendarDoubleTokens.calendarDayFontSize, calendarDoubleTokens.calendarDayFontStyle, calendarDoubleTokens.calendarDayFontLetterSpacing, calendarDoubleTokens.calendarDayFontLineHeight, calendarDoubleTokens.calendarDayFontWeight, calendarDoubleTokens.calendarDaySelectedFontWeight, calendarDoubleTokens.calendarHeaderArrowGap, calendarDoubleTokens.calendarDaysPadding, calendarDoubleTokens.calendarHeaderPadding, calendarDoubleTokens.calendarHeaderDateGap, calendarDoubleTokens.calendarHeaderFontFamily, calendarDoubleTokens.calendarHeaderFontSize, calendarDoubleTokens.calendarHeaderFontStyle, calendarDoubleTokens.calendarHeaderFontLetterSpacing, calendarDoubleTokens.calendarHeaderFontLineHeight, calendarDoubleTokens.calendarHeaderFontWeight, calendarDoubleTokens.calendarHeaderFontWeightBold, calendarDoubleTokens.iconButtonHeight, calendarDoubleTokens.iconButtonWidth, calendarDoubleTokens.iconButtonPadding, calendarDoubleTokens.iconButtonRadius),
-      xs: /*#__PURE__*/css(["", ":37.063rem;", ":15.5rem;", ":0.375rem 0.25rem 0 0.25rem;", ":0.375rem;", ":5.625rem;", ":3.281rem;", ":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-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":0.375rem 0.25rem 0 0.25rem;", ":0.375rem;", ":5.625rem;", ":3.281rem;", ":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-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":0.375rem 0 0 0;", ":0.375rem;", ":2.5rem;", ":1.875rem;", ":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-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":0;", ":0 0 0 0.5rem;", ":0.25rem;", ":var(--plasma-typo-h5-font-family);", ":var(--plasma-typo-h5-font-size);", ":var(--plasma-typo-h5-font-style);", ":var(--plasma-typo-h5-letter-spacing);", ":var(--plasma-typo-h5-line-height);", ":var(--plasma-typo-h5-font-weight);", ":var(--plasma-typo-h5-bold-font-weight);", ":2rem;", ":2rem;", ":0.75rem;", ":0.5rem;"], calendarDoubleTokens.calendarWidth, calendarDoubleTokens.calendarHeight, calendarDoubleTokens.calendarYearsPadding, calendarDoubleTokens.calendarYearItemBorderRadius, calendarDoubleTokens.calendarYearItemWidth, calendarDoubleTokens.calendarYearItemHeight, calendarDoubleTokens.calendarYearFontFamily, calendarDoubleTokens.calendarYearFontSize, calendarDoubleTokens.calendarYearFontStyle, calendarDoubleTokens.calendarYearFontLetterSpacing, calendarDoubleTokens.calendarYearFontLineHeight, calendarDoubleTokens.calendarYearFontWeight, calendarDoubleTokens.calendarYearSelectedFontWeight, calendarDoubleTokens.calendarMonthsPadding, calendarDoubleTokens.calendarMonthItemBorderRadius, calendarDoubleTokens.calendarMonthItemWidth, calendarDoubleTokens.calendarMonthItemHeight, calendarDoubleTokens.calendarMonthFontFamily, calendarDoubleTokens.calendarMonthFontSize, calendarDoubleTokens.calendarMonthFontStyle, calendarDoubleTokens.calendarMonthFontLetterSpacing, calendarDoubleTokens.calendarMonthFontLineHeight, calendarDoubleTokens.calendarMonthFontWeight, calendarDoubleTokens.calendarMonthSelectedFontWeight, calendarDoubleTokens.calendarDaysPadding, calendarDoubleTokens.calendarDayItemBorderRadius, calendarDoubleTokens.calendarDayItemWidth, calendarDoubleTokens.calendarDayItemHeight, calendarDoubleTokens.calendarDayFontFamily, calendarDoubleTokens.calendarDayFontSize, calendarDoubleTokens.calendarDayFontStyle, calendarDoubleTokens.calendarDayFontLetterSpacing, calendarDoubleTokens.calendarDayFontLineHeight, calendarDoubleTokens.calendarDayFontWeight, calendarDoubleTokens.calendarDaySelectedFontWeight, calendarDoubleTokens.calendarHeaderArrowGap, calendarDoubleTokens.calendarHeaderPadding, calendarDoubleTokens.calendarHeaderDateGap, calendarDoubleTokens.calendarHeaderFontFamily, calendarDoubleTokens.calendarHeaderFontSize, calendarDoubleTokens.calendarHeaderFontStyle, calendarDoubleTokens.calendarHeaderFontLetterSpacing, calendarDoubleTokens.calendarHeaderFontLineHeight, calendarDoubleTokens.calendarHeaderFontWeight, calendarDoubleTokens.calendarHeaderFontWeightBold, calendarDoubleTokens.iconButtonHeight, calendarDoubleTokens.iconButtonWidth, calendarDoubleTokens.iconButtonPadding, calendarDoubleTokens.iconButtonRadius)
+      m: /*#__PURE__*/css(["", ":0.5rem;", ":var(--plasma-typo-h4-font-family);", ":var(--plasma-typo-h4-font-size);", ":var(--plasma-typo-h4-font-style);", ":var(--plasma-typo-h4-letter-spacing);", ":var(--plasma-typo-h4-line-height);", ":var(--plasma-typo-h4-font-weight);", ":var(--plasma-typo-h4-bold-font-weight);", ":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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-weight);", ":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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-weight);", ":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-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":var(--plasma-typo-body-s-font-weight);"], calendarDoubleTokens.calendarItemBorderRadius, calendarDoubleTokens.calendarHeaderFontFamily, calendarDoubleTokens.calendarHeaderFontSize, calendarDoubleTokens.calendarHeaderFontStyle, calendarDoubleTokens.calendarHeaderFontLetterSpacing, calendarDoubleTokens.calendarHeaderFontLineHeight, calendarDoubleTokens.calendarHeaderFontWeight, calendarDoubleTokens.calendarHeaderFontWeightBold, calendarDoubleTokens.calendarYearFontFamily, calendarDoubleTokens.calendarYearFontSize, calendarDoubleTokens.calendarYearFontStyle, calendarDoubleTokens.calendarYearFontLetterSpacing, calendarDoubleTokens.calendarYearFontLineHeight, calendarDoubleTokens.calendarYearFontWeight, calendarDoubleTokens.calendarMonthFontFamily, calendarDoubleTokens.calendarMonthFontSize, calendarDoubleTokens.calendarMonthFontStyle, calendarDoubleTokens.calendarMonthFontLetterSpacing, calendarDoubleTokens.calendarMonthFontLineHeight, calendarDoubleTokens.calendarMonthFontWeight, calendarDoubleTokens.calendarDayFontFamily, calendarDoubleTokens.calendarDayFontSize, calendarDoubleTokens.calendarDayFontStyle, calendarDoubleTokens.calendarDayFontLetterSpacing, calendarDoubleTokens.calendarDayFontLineHeight, calendarDoubleTokens.calendarDayFontWeight)
     }
   }
 };

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

@@ -8,9 +8,9 @@ export var config = {
   },
   variations: {
     view: {
-      secondary: /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-transparent-secondary) 85% );", ":var(--text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-transparent-secondary) 80% );", ":0.4;", ":var(--surface-clear);", ":var(--surface-solid-secondary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-accent);"], paginationTokens.buttonColor, paginationTokens.buttonBackgroundColor, paginationTokens.buttonHoverColor, paginationTokens.buttonHoverBackgroundColor, paginationTokens.buttonActiveColor, paginationTokens.buttonActiveBackgroundColor, paginationTokens.buttonDisabledOpacity, paginationTokens.inputBackgroundColor, paginationTokens.selectBackgroundColor, paginationTokens.inputBorderColor, paginationTokens.paginationColor, paginationTokens.buttonFocusColor),
-      clear: /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--surface-clear);", ":var(--text-primary);", ":color-mix(in srgb,var(--text-primary),var(--surface-clear) 95%);", ":var(--text-primary);", ":color-mix(in srgb,var(--text-primary),var(--surface-clear) 90%);", ":0.4;", ":var(--surface-clear);", ":var(--surface-solid-card);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-accent);"], paginationTokens.buttonColor, paginationTokens.buttonBackgroundColor, paginationTokens.buttonHoverColor, paginationTokens.buttonHoverBackgroundColor, paginationTokens.buttonActiveColor, paginationTokens.buttonActiveBackgroundColor, paginationTokens.buttonDisabledOpacity, paginationTokens.inputBackgroundColor, paginationTokens.selectBackgroundColor, paginationTokens.inputBorderColor, paginationTokens.paginationColor, paginationTokens.buttonFocusColor),
-      "default": /*#__PURE__*/css(["", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 85% );", ":var(--inverse-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 80% );", ":0.4;", ":var(--surface-clear);", ":var(--surface-transparent-secondary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 85% );", ":var(--text-primary);", ":var(--surface-accent);"], paginationTokens.buttonColor, paginationTokens.buttonBackgroundColor, paginationTokens.buttonHoverColor, paginationTokens.buttonHoverBackgroundColor, paginationTokens.buttonActiveColor, paginationTokens.buttonActiveBackgroundColor, paginationTokens.buttonDisabledOpacity, paginationTokens.inputBackgroundColor, paginationTokens.inputBorderColor, paginationTokens.selectBackgroundColor, paginationTokens.paginationColor, paginationTokens.buttonFocusColor)
+      "default": /*#__PURE__*/css(["", ":var(--inverse-text-primary);", ":var(--inverse-text-primary-hover);", ":var(--inverse-text-primary-active);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--surface-solid-default-hover);", ":var(--surface-solid-default-active);", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--inverse-text-secondary-hover);", ":var(--inverse-text-secondary-hover);", ":0.4;", ":var(--surface-clear);", ":var(--surface-transparent-secondary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 85% );", ":var(--text-primary);", ":var(--surface-accent);"], paginationTokens.buttonColor, paginationTokens.buttonColorHover, paginationTokens.buttonColorActive, paginationTokens.buttonHoverColor, paginationTokens.buttonBackgroundColor, paginationTokens.buttonBackgroundColorHover, paginationTokens.buttonBackgroundColorActive, paginationTokens.buttonActiveColor, paginationTokens.buttonArrowColor, paginationTokens.buttonArrowColorHover, paginationTokens.buttonArrowColorActive, paginationTokens.buttonDisabledOpacity, paginationTokens.inputBackgroundColor, paginationTokens.inputBorderColor, paginationTokens.selectBackgroundColor, paginationTokens.paginationColor, paginationTokens.buttonFocusColor),
+      secondary: /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-primary-hover);", ":var(--text-primary-active);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary-hover);", ":var(--surface-transparent-secondary-active);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-hover);", ":0.4;", ":var(--surface-clear);", ":var(--surface-solid-secondary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-accent);"], paginationTokens.buttonColor, paginationTokens.buttonColorHover, paginationTokens.buttonColorActive, paginationTokens.buttonBackgroundColor, paginationTokens.buttonBackgroundColorHover, paginationTokens.buttonBackgroundColorActive, paginationTokens.buttonHoverColor, paginationTokens.buttonActiveColor, paginationTokens.buttonArrowColor, paginationTokens.buttonArrowColorHover, paginationTokens.buttonArrowColorActive, paginationTokens.buttonDisabledOpacity, paginationTokens.inputBackgroundColor, paginationTokens.selectBackgroundColor, paginationTokens.inputBorderColor, paginationTokens.paginationColor, paginationTokens.buttonFocusColor),
+      clear: /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-primary-hover);", ":var(--text-primary-active);", ":var(--surface-clear);", ":var(--surface-clear);", ":var(--surface-clear);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-hover);", ":0.4;", ":var(--surface-clear);", ":var(--surface-solid-card);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-accent);"], paginationTokens.buttonColor, paginationTokens.buttonColorHover, paginationTokens.buttonColorActive, paginationTokens.buttonBackgroundColor, paginationTokens.buttonBackgroundColorHover, paginationTokens.buttonBackgroundColorActive, paginationTokens.buttonHoverColor, paginationTokens.buttonActiveColor, paginationTokens.buttonArrowColor, paginationTokens.buttonArrowColorHover, paginationTokens.buttonArrowColorActive, paginationTokens.buttonDisabledOpacity, paginationTokens.inputBackgroundColor, paginationTokens.selectBackgroundColor, paginationTokens.inputBorderColor, paginationTokens.paginationColor, paginationTokens.buttonFocusColor)
     },
     viewCurrentPage: {
       "default": /*#__PURE__*/css(["", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 85% );", ":var(--inverse-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 80% );"], paginationTokens.paginationCurrentButtonColor, paginationTokens.paginationCurrentButtonBackgroundColor, paginationTokens.paginationCurrentButtonHoverColor, paginationTokens.paginationCurrentButtonHoverBackgroundColor, paginationTokens.paginationCurrentButtonActiveColor, paginationTokens.paginationCurrentButtonActiveBackgroundColor),
@@ -18,10 +18,10 @@ export var config = {
       clear: /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--surface-clear);", ":var(--text-primary);", ":color-mix(in srgb,var(--text-primary),var(--surface-clear) 95%);", ":var(--text-primary);", ":color-mix(in srgb,var(--text-primary),var(--surface-clear) 90%);"], paginationTokens.paginationCurrentButtonColor, paginationTokens.paginationCurrentButtonBackgroundColor, paginationTokens.paginationCurrentButtonHoverColor, paginationTokens.paginationCurrentButtonHoverBackgroundColor, paginationTokens.paginationCurrentButtonActiveColor, paginationTokens.paginationCurrentButtonActiveBackgroundColor)
     },
     size: {
-      l: /*#__PURE__*/css(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.5rem;", ":3rem;", ":2.25rem;", ":0.875rem;", ":1.2rem;", ":1.45rem;", ":6.375rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":6.375rem;", ":1.5rem;", ":1rem;", ":1rem;", ":1rem;", ":1rem;", ":1.875rem;", ":transparent;", ":1rem;", ":6.375rem;", ":0 3.5rem 0 1.5rem;", ":0 3.625rem 0 0.375rem;", ":0 3.625rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.875rem;", ":4rem;", ":3.5rem;", ":0 0.625rem;", ":0.0625rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.buttonRadius, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.selectWidth, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemWidth, paginationTokens.selectItemHeight, paginationTokens.selectItemPaddingTop, paginationTokens.selectItemPaddingRight, paginationTokens.selectItemPaddingBottom, paginationTokens.selectItemPaddingLeft, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetWidth, paginationTokens.selectTargetPadding, paginationTokens.selectTargetPaddingHasChips, paginationTokens.selectTargetPaddingWithInput, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth),
-      m: /*#__PURE__*/css(["", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":3rem;", ":3rem;", ":2rem;", ":0.75rem;", ":1.05rem;", ":1.3rem;", ":5.875rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":5.875rem;", ":1.5rem;", ":0.75rem;", ":0.75rem;", ":0.75rem;", ":0.75rem;", ":1.75rem;", ":transparent;", ":0.875rem;", ":5.875rem;", ":0 3.25rem 0 1.25rem;", ":0 3.375rem 0 0.375rem;", ":0 3.375rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.75rem;", ":3.5rem;", ":3rem;", ":0 0.625rem;", ":0.0625rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.buttonRadius, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.selectWidth, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemWidth, paginationTokens.selectItemHeight, paginationTokens.selectItemPaddingTop, paginationTokens.selectItemPaddingRight, paginationTokens.selectItemPaddingBottom, paginationTokens.selectItemPaddingLeft, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetWidth, paginationTokens.selectTargetPadding, paginationTokens.selectTargetPaddingHasChips, paginationTokens.selectTargetPaddingWithInput, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth),
-      s: /*#__PURE__*/css(["", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":2.5rem;", ":2.5rem;", ":1.75rem;", ":3rem;", ":0.625rem;", ":0.9rem;", ":1.15rem;", ":5.375rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":5.375rem;", ":1.5rem;", ":0.5rem;", ":0.75rem;", ":0.5rem;", ":0.75rem;", ":1.75rem;", ":transparent;", ":0.75rem;", ":5.375rem;", ":0 3rem 0 1rem;", ":0 3.125rem 0 0.375rem;", ":0 3.125rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.625rem;", ":3rem;", ":2.5rem;", ":0 0.625rem;", ":0.0625rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.paginationInputWidth, paginationTokens.buttonRadius, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.selectWidth, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemWidth, paginationTokens.selectItemHeight, paginationTokens.selectItemPaddingTop, paginationTokens.selectItemPaddingRight, paginationTokens.selectItemPaddingBottom, paginationTokens.selectItemPaddingLeft, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetWidth, paginationTokens.selectTargetPadding, paginationTokens.selectTargetPaddingHasChips, paginationTokens.selectTargetPaddingWithInput, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth),
-      xs: /*#__PURE__*/css(["", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":2rem;", ":2.5rem;", ":0.5rem;", ":2rem;", ":1.5rem;", ":0.75rem;", ":1rem;", ":4.625rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":4.625rem;", ":1rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":1.25rem;", ":transparent;", ":0.5rem;", ":4.625rem;", ":0 2.5rem 0 0.75rem;", ":0 2.625rem 0 0.375rem;", ":0 2.625rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.5rem;", ":2.5rem;", ":2rem;", ":0 0.625rem;", ":0.0625rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.paginationInputWidth, paginationTokens.buttonRadius, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.selectWidth, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemWidth, paginationTokens.selectItemHeight, paginationTokens.selectItemPaddingTop, paginationTokens.selectItemPaddingRight, paginationTokens.selectItemPaddingBottom, paginationTokens.selectItemPaddingLeft, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetWidth, paginationTokens.selectTargetPadding, paginationTokens.selectTargetPaddingHasChips, paginationTokens.selectTargetPaddingWithInput, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth)
+      l: /*#__PURE__*/css(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.5rem;", ":3rem;", ":2.25rem;", ":4rem;", ":0.875rem;", ":1.2rem;", ":1.45rem;", ":0 -0.125rem 0 0.5rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":1.5rem;", ":1rem 1rem 1rem 1rem;", ":1.875rem;", ":transparent;", ":1rem;", ":1.5rem 0 1.5rem;", ":0.5rem;", ":0.375rem;", ":0.875rem;", ":4rem;", ":3.5rem;", ":0 0.625rem;", ":0.0625rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.paginationInputWidth, paginationTokens.buttonRadius, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.buttonArrowMargin, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemHeight, paginationTokens.selectItemPadding, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetPadding, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth),
+      m: /*#__PURE__*/css(["", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":3rem;", ":3rem;", ":2rem;", ":3.5rem;", ":0.75rem;", ":1.05rem;", ":1.3rem;", ":0 -0.125rem 0 0.375rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":1.5rem;", ":0.75rem 0.75rem 0.75rem 0.75rem;", ":1.75rem;", ":transparent;", ":0.875rem;", ":1.25rem 0 1.25rem;", ":0.5rem;", ":0.375rem;", ":0.75rem;", ":3.5rem;", ":3rem;", ":0 0.625rem;", ":0.0625rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.paginationInputWidth, paginationTokens.buttonRadius, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.buttonArrowMargin, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemHeight, paginationTokens.selectItemPadding, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetPadding, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth),
+      s: /*#__PURE__*/css(["", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":2.5rem;", ":2.5rem;", ":1.75rem;", ":3rem;", ":0.625rem;", ":0.9rem;", ":1.15rem;", ":0 -0.125rem 0 0.25rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":1.5rem;", ":0.5rem 0.75rem 0.5rem 0.75rem;", ":1.75rem;", ":transparent;", ":0.75rem;", ":1rem 0 1rem;", ":0.5rem;", ":0.375rem;", ":0.625rem;", ":3rem;", ":2.5rem;", ":0 0.625rem;", ":0.0625rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.paginationInputWidth, paginationTokens.buttonRadius, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.buttonArrowMargin, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemHeight, paginationTokens.selectItemPadding, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetPadding, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth),
+      xs: /*#__PURE__*/css(["", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":2rem;", ":2.5rem;", ":0.5rem;", ":2rem;", ":1.5rem;", ":0.75rem;", ":1rem;", ":0 -0.125rem 0 0.25rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":1rem;", ":0.5rem 0.5rem 0.5rem 0.5rem;", ":1.25rem;", ":transparent;", ":0.5rem;", ":0.75rem 0 0.75rem;", ":0.5rem;", ":0.375rem;", ":0.5rem;", ":2.5rem;", ":2rem;", ":0 0.625rem;", ":0.0625rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.paginationInputWidth, paginationTokens.buttonRadius, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.buttonArrowMargin, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemHeight, paginationTokens.selectItemPadding, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetPadding, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth)
     },
     type: {
       compact: /*#__PURE__*/css([""]),

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

@@ -10,10 +10,10 @@ export var config = {
       "default": /*#__PURE__*/css(["", ":var(--surface-clear);", ":var(--surface-transparent-tertiary);", ":var(--surface-negative);", ":var(--surface-positive);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-accent);", ":var(--surface-accent);", ":var(--surface-negative);", ":var(--surface-accent);", ":var(--surface-positive);", ":var(--surface-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-accent);"], tokens.background, tokens.borderColor, tokens.borderColorError, tokens.borderColorSuccess, tokens.dividerColor, tokens.labelColor, tokens.leftHelperColor, tokens.textFieldColor, tokens.textFieldPlaceholderColor, tokens.textFieldCaretColor, tokens.textFieldBorderColorFocus, tokens.textFieldBorderColorError, tokens.textFieldBorderColorErrorFocus, tokens.textFieldBorderColorSuccess, tokens.textFieldBorderColorSuccessFocus, tokens.textFieldTextBeforeColor, tokens.textFieldTextAfterColor, tokens.focusColor)
     },
     size: {
-      l: /*#__PURE__*/css(["", ":0.875rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0 0 0 1rem;", ":0;", ":0 0 0.75rem 0;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.5rem;", ":0.875rem;", ":0.0625rem;", ":1.0625rem 1.125rem 1.0625rem 1.125rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-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;"], tokens.borderRadius, tokens.borderWidth, tokens.dividerPadding, tokens.dividerFontFamily, tokens.dividerFontStyle, tokens.dividerFontSize, tokens.dividerFontWeight, tokens.dividerLetterSpacing, tokens.dividerLineHeight, tokens.leftContentMargin, tokens.rightContentMargin, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontStyle, tokens.labelFontSize, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.textFieldHeight, tokens.textFieldBorderRadius, tokens.textFieldBorderWidth, tokens.textFieldPadding, tokens.textFieldFontFamily, tokens.textFieldFontStyle, tokens.textFieldFontSize, tokens.textFieldFontWeight, tokens.textFieldLetterSpacing, tokens.textFieldLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontStyle, tokens.leftHelperFontSize, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.textFieldLeftContentMargin, tokens.textFieldRightContentMargin, tokens.textFieldTextBeforeMargin, tokens.textFieldTextAfterMargin),
-      m: /*#__PURE__*/css(["", ":0.75rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0 0 0 0.875rem;", ":0;", ":0 0 0.625rem 0;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":3rem;", ":0.75rem;", ":0.0625rem;", ":0.875rem 1rem 0.875rem 1rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-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;"], tokens.borderRadius, tokens.borderWidth, tokens.dividerPadding, tokens.dividerFontFamily, tokens.dividerFontStyle, tokens.dividerFontSize, tokens.dividerFontWeight, tokens.dividerLetterSpacing, tokens.dividerLineHeight, tokens.leftContentMargin, tokens.rightContentMargin, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontStyle, tokens.labelFontSize, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.textFieldHeight, tokens.textFieldBorderRadius, tokens.textFieldBorderWidth, tokens.textFieldPadding, tokens.textFieldFontFamily, tokens.textFieldFontStyle, tokens.textFieldFontSize, tokens.textFieldFontWeight, tokens.textFieldLetterSpacing, tokens.textFieldLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontStyle, tokens.leftHelperFontSize, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.textFieldLeftContentMargin, tokens.textFieldRightContentMargin, tokens.textFieldTextBeforeMargin, tokens.textFieldTextAfterMargin),
-      s: /*#__PURE__*/css(["", ":0.625rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":0 0 0 0.75rem;", ":0;", ":0 0 0.5rem 0;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":2.5rem;", ":0.625rem;", ":0.0625rem;", ":0.6875rem 0.875rem 0.6875rem 0.875rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-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;"], tokens.borderRadius, tokens.borderWidth, tokens.dividerPadding, tokens.dividerFontFamily, tokens.dividerFontStyle, tokens.dividerFontSize, tokens.dividerFontWeight, tokens.dividerLetterSpacing, tokens.dividerLineHeight, tokens.leftContentMargin, tokens.rightContentMargin, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontStyle, tokens.labelFontSize, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.textFieldHeight, tokens.textFieldBorderRadius, tokens.textFieldBorderWidth, tokens.textFieldPadding, tokens.textFieldFontFamily, tokens.textFieldFontStyle, tokens.textFieldFontSize, tokens.textFieldFontWeight, tokens.textFieldLetterSpacing, tokens.textFieldLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontStyle, tokens.leftHelperFontSize, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.textFieldLeftContentMargin, tokens.textFieldRightContentMargin, tokens.textFieldTextBeforeMargin, tokens.textFieldTextAfterMargin),
-      xs: /*#__PURE__*/css(["", ":0.5rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0 0 0 0.5rem;", ":0;", ":0 0 0.375rem 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":2rem;", ":0.5rem;", ":0.0625rem;", ":0.5625rem 0.625rem 0.5625rem 0.625rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-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;"], tokens.borderRadius, tokens.borderWidth, tokens.dividerPadding, tokens.dividerFontFamily, tokens.dividerFontStyle, tokens.dividerFontSize, tokens.dividerFontWeight, tokens.dividerLetterSpacing, tokens.dividerLineHeight, tokens.leftContentMargin, tokens.rightContentMargin, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontStyle, tokens.labelFontSize, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.textFieldHeight, tokens.textFieldBorderRadius, tokens.textFieldBorderWidth, tokens.textFieldPadding, tokens.textFieldFontFamily, tokens.textFieldFontStyle, tokens.textFieldFontSize, tokens.textFieldFontWeight, tokens.textFieldLetterSpacing, tokens.textFieldLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontStyle, tokens.leftHelperFontSize, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.textFieldLeftContentMargin, tokens.textFieldRightContentMargin, tokens.textFieldTextBeforeMargin, tokens.textFieldTextAfterMargin)
+      l: /*#__PURE__*/css(["", ":0.875rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0 0.375rem 0 1rem;", ":0;", ":0 0 0.75rem 0;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.5rem;", ":0.875rem;", ":0.0625rem;", ":1.0625rem 1.125rem 1.0625rem 1.125rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-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;"], tokens.borderRadius, tokens.borderWidth, tokens.dividerPadding, tokens.dividerFontFamily, tokens.dividerFontStyle, tokens.dividerFontSize, tokens.dividerFontWeight, tokens.dividerLetterSpacing, tokens.dividerLineHeight, tokens.leftContentMargin, tokens.rightContentMargin, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontStyle, tokens.labelFontSize, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.textFieldHeight, tokens.textFieldBorderRadius, tokens.textFieldBorderWidth, tokens.textFieldPadding, tokens.textFieldFontFamily, tokens.textFieldFontStyle, tokens.textFieldFontSize, tokens.textFieldFontWeight, tokens.textFieldLetterSpacing, tokens.textFieldLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontStyle, tokens.leftHelperFontSize, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.textFieldLeftContentMargin, tokens.textFieldRightContentMargin, tokens.textFieldTextBeforeMargin, tokens.textFieldTextAfterMargin),
+      m: /*#__PURE__*/css(["", ":0.75rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0 0.375rem 0 0.875rem;", ":0;", ":0 0 0.625rem 0;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":3rem;", ":0.75rem;", ":0.0625rem;", ":0.875rem 1rem 0.875rem 1rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-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;"], tokens.borderRadius, tokens.borderWidth, tokens.dividerPadding, tokens.dividerFontFamily, tokens.dividerFontStyle, tokens.dividerFontSize, tokens.dividerFontWeight, tokens.dividerLetterSpacing, tokens.dividerLineHeight, tokens.leftContentMargin, tokens.rightContentMargin, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontStyle, tokens.labelFontSize, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.textFieldHeight, tokens.textFieldBorderRadius, tokens.textFieldBorderWidth, tokens.textFieldPadding, tokens.textFieldFontFamily, tokens.textFieldFontStyle, tokens.textFieldFontSize, tokens.textFieldFontWeight, tokens.textFieldLetterSpacing, tokens.textFieldLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontStyle, tokens.leftHelperFontSize, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.textFieldLeftContentMargin, tokens.textFieldRightContentMargin, tokens.textFieldTextBeforeMargin, tokens.textFieldTextAfterMargin),
+      s: /*#__PURE__*/css(["", ":0.625rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":0 0.375rem 0 0.75rem;", ":0;", ":0 0 0.5rem 0;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":2.5rem;", ":0.625rem;", ":0.0625rem;", ":0.6875rem 0.875rem 0.6875rem 0.875rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-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;"], tokens.borderRadius, tokens.borderWidth, tokens.dividerPadding, tokens.dividerFontFamily, tokens.dividerFontStyle, tokens.dividerFontSize, tokens.dividerFontWeight, tokens.dividerLetterSpacing, tokens.dividerLineHeight, tokens.leftContentMargin, tokens.rightContentMargin, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontStyle, tokens.labelFontSize, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.textFieldHeight, tokens.textFieldBorderRadius, tokens.textFieldBorderWidth, tokens.textFieldPadding, tokens.textFieldFontFamily, tokens.textFieldFontStyle, tokens.textFieldFontSize, tokens.textFieldFontWeight, tokens.textFieldLetterSpacing, tokens.textFieldLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontStyle, tokens.leftHelperFontSize, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.textFieldLeftContentMargin, tokens.textFieldRightContentMargin, tokens.textFieldTextBeforeMargin, tokens.textFieldTextAfterMargin),
+      xs: /*#__PURE__*/css(["", ":0.5rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0 0.25rem 0 0.5rem;", ":0;", ":0 0 0.375rem 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":2rem;", ":0.5rem;", ":0.0625rem;", ":0.5625rem 0.625rem 0.5625rem 0.625rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-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;"], tokens.borderRadius, tokens.borderWidth, tokens.dividerPadding, tokens.dividerFontFamily, tokens.dividerFontStyle, tokens.dividerFontSize, tokens.dividerFontWeight, tokens.dividerLetterSpacing, tokens.dividerLineHeight, tokens.leftContentMargin, tokens.rightContentMargin, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontStyle, tokens.labelFontSize, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.textFieldHeight, tokens.textFieldBorderRadius, tokens.textFieldBorderWidth, tokens.textFieldPadding, tokens.textFieldFontFamily, tokens.textFieldFontStyle, tokens.textFieldFontSize, tokens.textFieldFontWeight, tokens.textFieldLetterSpacing, tokens.textFieldLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontStyle, tokens.leftHelperFontSize, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.textFieldLeftContentMargin, tokens.textFieldRightContentMargin, tokens.textFieldTextBeforeMargin, tokens.textFieldTextAfterMargin)
     },
     disabled: {
       "true": /*#__PURE__*/css(["", ":0.4;"], tokens.disabledOpacity)