@salutejs/plasma-new-hope 0.322.0-canary.1933.14614537450.0 → 0.322.0-canary.1939.14642328722.0

package/styled-components/es/components/DatePicker/hooks/useDatePicker.js

@@ -1,147 +1,203 @@
+import { customDayjs } from "../../../utils/datejs";
+import { QUARTER_NAMES } from "../../Calendar/utils";
 import { classes } from "../DatePicker.tokens";
-import { formatCalendarValue, formatInputValue, getDateFromFormat, getMaskedDateOnInput, validateDateWithFullMonth } from "../utils/dateHelper";
+import { getFormattedDates, getMaskedDateOnInput } from "../utils";
 export var useDatePicker = function useDatePicker(_ref) {
   var currentValue = _ref.currentValue,
-    setInputValue = _ref.setInputValue,
-    setCalendarValue = _ref.setCalendarValue,
-    dateFormatDelimiter = _ref.dateFormatDelimiter,
     format = _ref.format,
     _ref$lang = _ref.lang,
     lang = _ref$lang === void 0 ? 'ru' : _ref$lang,
     disabled = _ref.disabled,
     readOnly = _ref.readOnly,
-    maskWithFormat = _ref.maskWithFormat,
     valueError = _ref.valueError,
     valueSuccess = _ref.valueSuccess,
     name = _ref.name,
+    type = _ref.type,
+    min = _ref.min,
+    max = _ref.max,
+    includeEdgeDates = _ref.includeEdgeDates,
+    maskWithFormat = _ref.maskWithFormat,
+    setCorrectDates = _ref.setCorrectDates,
+    setInputValue = _ref.setInputValue,
+    setCalendarValue = _ref.setCalendarValue,
+    dateFormatDelimiter = _ref.dateFormatDelimiter,
     onChangeValue = _ref.onChangeValue,
     onCommitDate = _ref.onCommitDate,
     onChange = _ref.onChange;
   var datePickerErrorClass = valueError ? classes.datePickerError : undefined;
   var datePickerSuccessClass = valueSuccess ? classes.datePickerSuccess : undefined;
+  var getQuarterInfo = function getQuarterInfo(originalDate) {
+    if (type !== 'Quarters') {
+      return;
+    }
+    var endQuarter = new Date(originalDate);
+    endQuarter.setMonth(originalDate.getMonth() + 3);
+    endQuarter.setDate(0);
+    customDayjs.locale(lang);
+    var quarterIndex = customDayjs(originalDate).quarter() - 1;
+    return {
+      name: QUARTER_NAMES[quarterIndex],
+      fullValue: [originalDate, endQuarter]
+    };
+  };
   var handleChangeValue = function handleChangeValue(event) {
     if (disabled || readOnly) {
       return;
     }
     var value = event.target.value;
     var newValue = maskWithFormat ? getMaskedDateOnInput(value, format, dateFormatDelimiter(), currentValue) : value;
-    if (!format) {
-      setCalendarValue(formatCalendarValue(newValue));
-      setInputValue(formatInputValue({
+    var _getFormattedDates = getFormattedDates({
         value: newValue,
+        lang: lang,
+        delimiter: dateFormatDelimiter(),
         format: format,
-        lang: lang
-      }));
-      onChangeValue === null || onChangeValue === void 0 || onChangeValue(event, newValue);
+        includeEdgeDates: includeEdgeDates,
+        min: min,
+        max: max
+      }),
+      formattedDate = _getFormattedDates.formattedDate,
+      isoDate = _getFormattedDates.isoDate,
+      originalDate = _getFormattedDates.originalDate;
+    if (originalDate) {
+      setCorrectDates({
+        calendar: originalDate,
+        input: formattedDate
+      });
+      var dateInfo = getQuarterInfo(originalDate);
+      onCommitDate === null || onCommitDate === void 0 || onCommitDate(formattedDate, false, true, dateInfo, originalDate, isoDate);
+      setCalendarValue(originalDate);
+      setInputValue(formattedDate);
+      onChangeValue === null || onChangeValue === void 0 || onChangeValue(event, formattedDate, originalDate, isoDate);
       onChange === null || onChange === void 0 || onChange({
         target: {
-          value: newValue,
+          value: formattedDate,
+          originalDate: originalDate,
+          isoDate: isoDate,
           name: name
         }
       });
       return;
     }
-    var _validateDateWithFull = validateDateWithFullMonth({
-        currentValue: newValue,
-        format: format,
-        lang: lang
-      }),
-      hasMonthFullName = _validateDateWithFull.hasMonthFullName,
-      isValidMonth = _validateDateWithFull.isValidMonth,
-      isLengthEqual = _validateDateWithFull.isLengthEqual;
-    if (!hasMonthFullName && (newValue === null || newValue === void 0 ? void 0 : newValue.length) === (format === null || format === void 0 ? void 0 : format.length) || isValidMonth && isLengthEqual) {
-      setCalendarValue(formatCalendarValue(newValue, format, lang));
+    if (formattedDate === '') {
+      setCorrectDates({
+        calendar: undefined,
+        input: ''
+      });
     }
-    setInputValue(formatInputValue({
-      value: newValue,
-      format: format,
-      lang: lang,
-      hasMonthFullName: hasMonthFullName,
-      isValidMonth: isValidMonth,
-      isLengthEqual: isLengthEqual
-    }));
-    onChangeValue === null || onChangeValue === void 0 || onChangeValue(event, newValue);
+    setCalendarValue(originalDate);
+    setInputValue(formattedDate);
+    onChangeValue === null || onChangeValue === void 0 || onChangeValue(event, formattedDate, originalDate, isoDate);
     onChange === null || onChange === void 0 || onChange({
       target: {
-        value: newValue,
+        value: formattedDate,
+        originalDate: originalDate,
+        isoDate: isoDate,
         name: name
       }
     });
   };
-  var handleCommitDate = function handleCommitDate(date, applyFormat, isCalendarValue, dateInfo) {
+  var handleSearch = function handleSearch(date) {
     if (disabled || readOnly) {
       return;
     }
     if (!date) {
       setCalendarValue(undefined);
       setInputValue('');
-      return onCommitDate === null || onCommitDate === void 0 ? void 0 : onCommitDate('', false, true);
+      return onCommitDate === null || onCommitDate === void 0 ? void 0 : onCommitDate('', false, true, undefined, undefined, '');
     }
-    if (isCalendarValue) {
-      var _formattedInputValue = formatInputValue({
+    var _getFormattedDates2 = getFormattedDates({
         value: date,
+        lang: lang,
+        delimiter: dateFormatDelimiter(),
         format: format,
-        lang: lang
+        includeEdgeDates: includeEdgeDates,
+        min: min,
+        max: max
+      }),
+      formattedDate = _getFormattedDates2.formattedDate,
+      isoDate = _getFormattedDates2.isoDate,
+      originalDate = _getFormattedDates2.originalDate;
+    if (originalDate) {
+      var dateInfo = getQuarterInfo(originalDate);
+      onCommitDate === null || onCommitDate === void 0 || onCommitDate(formattedDate, false, true, dateInfo, originalDate, isoDate);
+    }
+  };
+  var handleCalendarPick = function handleCalendarPick(date, dateInfo) {
+    if (disabled || readOnly) {
+      return;
+    }
+    if (!date) {
+      setInputValue('');
+      setCalendarValue(date);
+      setCorrectDates({
+        calendar: date || undefined,
+        input: ''
       });
-      setCalendarValue(formatCalendarValue(date, format, lang));
-      setInputValue(_formattedInputValue);
-      onCommitDate === null || onCommitDate === void 0 || onCommitDate(date, false, true, dateInfo);
-      onChangeValue === null || onChangeValue === void 0 || onChangeValue(null, _formattedInputValue);
+      onChangeValue === null || onChangeValue === void 0 || onChangeValue(null, '', date, '');
       onChange === null || onChange === void 0 || onChange({
         target: {
-          value: _formattedInputValue,
+          value: '',
+          originalDate: date,
+          isoDate: '',
           name: name
         }
       });
+      onCommitDate === null || onCommitDate === void 0 || onCommitDate('', false, true, dateInfo, date || undefined, '');
       return;
     }
-    var formatString = applyFormat ? format : undefined;
-    var _getDateFromFormat = getDateFromFormat(date, formatString, lang),
-      newDate = _getDateFromFormat.value,
-      isError = _getDateFromFormat.isError,
-      isSuccess = _getDateFromFormat.isSuccess;
-    var formattedInputValue = formatInputValue({
-      value: newDate,
-      format: format,
-      lang: lang
+    customDayjs.locale(lang);
+    var formattedDate = customDayjs(date).format(format);
+    var isoDate = date.toISOString();
+    setCalendarValue(date);
+    setInputValue(formattedDate);
+    setCorrectDates({
+      calendar: date,
+      input: formattedDate
     });
-    setCalendarValue(formatCalendarValue(newDate, format, lang));
-    setInputValue(formattedInputValue);
-    onCommitDate === null || onCommitDate === void 0 || onCommitDate(newDate, isError, isSuccess);
-    onChangeValue === null || onChangeValue === void 0 || onChangeValue(null, formattedInputValue);
+    onChangeValue === null || onChangeValue === void 0 || onChangeValue(null, formattedDate, date, isoDate);
     onChange === null || onChange === void 0 || onChange({
       target: {
-        value: formattedInputValue,
+        value: formattedDate,
+        originalDate: date,
+        isoDate: isoDate,
         name: name
       }
     });
+    onCommitDate === null || onCommitDate === void 0 || onCommitDate(formattedDate, false, true, dateInfo, date, isoDate);
   };
-  var updateExternalDate = function updateExternalDate(externalDate, inputSetter, calendarSetter) {
-    inputSetter(formatInputValue({
-      value: externalDate,
-      format: format,
-      lang: lang
-    }));
-    if (!format) {
-      calendarSetter(formatCalendarValue(externalDate, undefined, lang));
-      return;
-    }
-    if (!externalDate) {
-      calendarSetter(undefined);
-      return;
+  var updateExternalDate = function updateExternalDate(externalDate) {
+    var _getFormattedDates3 = getFormattedDates({
+        value: externalDate || null,
+        lang: lang,
+        delimiter: dateFormatDelimiter(),
+        format: format,
+        includeEdgeDates: includeEdgeDates,
+        min: min,
+        max: max
+      }),
+      formattedDate = _getFormattedDates3.formattedDate,
+      originalDate = _getFormattedDates3.originalDate;
+    setInputValue(formattedDate);
+    setCalendarValue(originalDate);
+    if (originalDate) {
+      setCorrectDates({
+        calendar: originalDate,
+        input: formattedDate
+      });
     }
-    var _getDateFromFormat2 = getDateFromFormat(externalDate, undefined, lang),
-      newDate = _getDateFromFormat2.value,
-      isError = _getDateFromFormat2.isError;
-    if (!isError) {
-      calendarSetter(formatCalendarValue(newDate, format, lang));
+    if (formattedDate === '') {
+      setCorrectDates({
+        calendar: undefined,
+        input: ''
+      });
     }
   };
   return {
     datePickerErrorClass: datePickerErrorClass,
     datePickerSuccessClass: datePickerSuccessClass,
     handleChangeValue: handleChangeValue,
-    handleCommitDate: handleCommitDate,
+    handleSearch: handleSearch,
+    handleCalendarPick: handleCalendarPick,
     updateExternalDate: updateExternalDate
   };
 };

package/styled-components/es/components/DatePicker/hooks/useKeyboardNavigation.js

@@ -1,3 +1,4 @@
+import { needFullMonth } from "../utils/dateHelper";
 export var keys = {
   Space: 'Space',
   Escape: 'Escape'
@@ -5,8 +6,15 @@ export var keys = {
 export var useKeyNavigation = function useKeyNavigation(_ref) {
   var isCalendarOpen = _ref.isCalendarOpen,
     closeOnEsc = _ref.closeOnEsc,
+    format = _ref.format,
+    maskWithFormat = _ref.maskWithFormat,
+    delimiter = _ref.delimiter,
     onToggle = _ref.onToggle;
   var onKeyDown = function onKeyDown(event) {
+    if (event.key === delimiter && maskWithFormat && format && !needFullMonth(format)) {
+      event.preventDefault();
+      return;
+    }
     switch (event.code) {
       case keys.Space:
         {

package/styled-components/es/components/DatePicker/utils/dateHelper.js

@@ -1,57 +1,5 @@
-import { customDayjs } from "../../../utils/datejs";
-export var formatInputValue = function formatInputValue(_ref) {
-  var value = _ref.value,
-    format = _ref.format,
-    lang = _ref.lang,
-    hasMonthFullName = _ref.hasMonthFullName,
-    isValidMonth = _ref.isValidMonth,
-    isLengthEqual = _ref.isLengthEqual;
-  if (!value || !lang) {
-    return '';
-  }
-  if (hasMonthFullName && (!isValidMonth || !isLengthEqual)) {
-    return String(value);
-  }
-  if (format && customDayjs(value, format, true).isValid()) {
-    return customDayjs(value, format).locale(lang).format(format);
-  }
-  if (format && String(value).length >= 10 && String(new Date(value)) !== 'Invalid Date') {
-    return customDayjs(value).locale(lang).format(format);
-  }
-  return String(value);
-};
-export var formatCalendarValue = function formatCalendarValue(value, format, lang) {
-  if (!value || !lang) {
-    return undefined;
-  }
-  if (format && customDayjs(value, format, true).isValid()) {
-    return customDayjs(value, format, true).locale(lang).toDate();
-  }
-  if (String(new Date(value)) !== 'Invalid Date') {
-    return customDayjs(value).locale(lang).toDate();
-  }
-  return undefined;
-};
-export var getDateFromFormat = function getDateFromFormat(value, format, lang) {
-  if (format && customDayjs(value, format, true).isValid() && lang) {
-    return {
-      value: customDayjs(value, format, true).locale(lang).toDate(),
-      isError: false,
-      isSuccess: true
-    };
-  }
-  if (!format && String(new Date(value)) !== 'Invalid Date' && lang) {
-    return {
-      value: customDayjs(value).locale(lang).toDate(),
-      isError: false,
-      isSuccess: true
-    };
-  }
-  return {
-    value: value,
-    isError: true,
-    isSuccess: false
-  };
+export var needFullMonth = function needFullMonth(format) {
+  return /M{3,4}/g.test(format);
 };
 export var getDateFormatDelimiter = function getDateFormatDelimiter(format) {
   var _format$match;
@@ -60,52 +8,4 @@ export var getDateFormatDelimiter = function getDateFormatDelimiter(format) {
   }
   var delimiter = (_format$match = format.match(/[^a-zA-Z0-9]/)) === null || _format$match === void 0 ? void 0 : _format$match[0];
   return delimiter !== null && delimiter !== void 0 ? delimiter : '';
-};
-export var getMaskedDateOnInput = function getMaskedDateOnInput(value, format, delimiter, prevValue) {
-  if (!value) {
-    return '';
-  }
-  if (!format || !delimiter || /M{3,4}/g.test(format)) {
-    return value;
-  }
-  if (value.length >= format.length) {
-    return value.slice(0, format.length);
-  }
-  if (prevValue && value.length < prevValue.length && (prevValue === null || prevValue === void 0 ? void 0 : prevValue[value.length]) === delimiter) {
-    return value.slice(0, -1);
-  }
-  if ((format === null || format === void 0 ? void 0 : format[value.length]) === delimiter) {
-    return value + delimiter;
-  }
-  return value;
-};
-export var validateDateWithFullMonth = function validateDateWithFullMonth(_ref2) {
-  var currentValue = _ref2.currentValue,
-    format = _ref2.format,
-    lang = _ref2.lang;
-  /**
-   * NOTE: если в формате даты есть месяц в полном названии или сокращенном,
-   * нужно дополнительно проводить валидацию на полноту введенной даты.
-   * Иначе dayjs циклически будет пытаться отформатировать некорректную дату.
-   */
-  var hasMonthFullName = /M{3,4}/g.test(format);
-  if (!hasMonthFullName) {
-    return {
-      hasMonthFullName: hasMonthFullName,
-      isValidMonth: false,
-      isLengthEqual: false
-    };
-  }
-  customDayjs.locale(lang);
-  var firstIndexOfMonth = format.indexOf('M');
-  var lastIndexOfMonth = currentValue.indexOf(getDateFormatDelimiter(format), firstIndexOfMonth);
-  var fullMonthName = !lastIndexOfMonth ? currentValue.slice(firstIndexOfMonth) : currentValue.slice(firstIndexOfMonth, lastIndexOfMonth);
-  var monthFormatting = format.replace(/[^M]/g, '');
-  var isValidMonth = customDayjs("01 ".concat(fullMonthName, " 1970"), "DD ".concat(monthFormatting, " YYYY"), true).isValid();
-  var isLengthEqual = format.length - monthFormatting.length === currentValue.length - fullMonthName.length;
-  return {
-    hasMonthFullName: hasMonthFullName,
-    isValidMonth: isValidMonth,
-    isLengthEqual: isLengthEqual
-  };
 };

package/styled-components/es/components/DatePicker/utils/getFormattedDates.js

@@ -0,0 +1,38 @@
+import { needFullMonth } from "./dateHelper";
+import { getOriginalDates } from "./getOriginalDates";
+import { normalizeDates } from "./normalizeDates";
+export var getFormattedDates = function getFormattedDates(_ref) {
+  var value = _ref.value,
+    lang = _ref.lang,
+    format = _ref.format,
+    includeEdgeDates = _ref.includeEdgeDates,
+    min = _ref.min,
+    max = _ref.max;
+  var _getOriginalDates = getOriginalDates(value, lang, format),
+    formattedDate = _getOriginalDates.formattedDate,
+    isoDate = _getOriginalDates.isoDate,
+    originalDate = _getOriginalDates.originalDate;
+  if (!originalDate) {
+    var innerValue = format && (needFullMonth(format) ? formattedDate : formattedDate.slice(0, format.length));
+    return {
+      formattedDate: innerValue || '',
+      isoDate: isoDate,
+      originalDate: originalDate
+    };
+  }
+  var _normalizeDates = normalizeDates({
+      originalDate: originalDate,
+      lang: lang,
+      format: format,
+      includeEdgeDates: includeEdgeDates,
+      min: min,
+      max: max
+    }),
+    normalizedDate = _normalizeDates.normalizedDate,
+    formattedNormalizedDate = _normalizeDates.formattedNormalizedDate;
+  return {
+    formattedDate: formattedNormalizedDate,
+    isoDate: normalizedDate.toISOString(),
+    originalDate: normalizedDate
+  };
+};

package/styled-components/es/components/DatePicker/utils/getMaskedDateOnInput.js

@@ -0,0 +1,21 @@
+import { needFullMonth } from "./dateHelper";
+export var getMaskedDateOnInput = function getMaskedDateOnInput(value, format, delimiter, prevValue) {
+  if (!value) {
+    return '';
+  }
+  if (!format || !delimiter || needFullMonth(format)) {
+    return value;
+  }
+  var dateRegExp = new RegExp("[^0-9".concat(delimiter, "]"), 'g');
+  var formattedValue = value.replace(dateRegExp, '');
+  if (formattedValue.length >= format.length) {
+    return formattedValue.slice(0, format.length);
+  }
+  if (prevValue && formattedValue.length < prevValue.length && (prevValue === null || prevValue === void 0 ? void 0 : prevValue[formattedValue.length]) === delimiter) {
+    return formattedValue.slice(0, -1);
+  }
+  if ((format === null || format === void 0 ? void 0 : format[formattedValue.length]) === delimiter) {
+    return formattedValue + delimiter;
+  }
+  return formattedValue;
+};

package/styled-components/es/components/DatePicker/utils/getOriginalDates.js

@@ -0,0 +1,30 @@
+import { customDayjs } from "../../../utils/datejs";
+var initialValueStructure = {
+  isoDate: '',
+  originalDate: undefined,
+  formattedDate: ''
+};
+export var getOriginalDates = function getOriginalDates(value, lang, format) {
+  if (!value || !lang || !format) {
+    return initialValueStructure;
+  }
+  customDayjs.locale(lang);
+  if (value instanceof Date) {
+    return {
+      formattedDate: customDayjs(value).format(format),
+      isoDate: new Date(value).toISOString(),
+      originalDate: new Date(value)
+    };
+  }
+  if (customDayjs(value, format).isValid()) {
+    var isoDate = customDayjs(value, format).toISOString();
+    var originalDate = customDayjs(value, format).toDate();
+    var formattedDate = customDayjs(value, format).format(format);
+    return {
+      formattedDate: formattedDate,
+      isoDate: isoDate,
+      originalDate: originalDate
+    };
+  }
+  return initialValueStructure;
+};

package/styled-components/es/components/DatePicker/utils/index.js

@@ -0,0 +1,4 @@
+export { getFormattedDates } from "./getFormattedDates";
+export { getOriginalDates } from "./getOriginalDates";
+export { normalizeDates } from "./normalizeDates";
+export { getMaskedDateOnInput } from "./getMaskedDateOnInput";

package/styled-components/es/components/DatePicker/utils/normalizeDates.js

@@ -0,0 +1,28 @@
+import { customDayjs } from "../../../utils/datejs";
+export var normalizeDates = function normalizeDates(_ref) {
+  var originalDate = _ref.originalDate,
+    lang = _ref.lang,
+    format = _ref.format,
+    includeEdgeDates = _ref.includeEdgeDates,
+    min = _ref.min,
+    max = _ref.max;
+  var dateCandidate = originalDate;
+  customDayjs.locale(lang);
+  if (min && includeEdgeDates && min > originalDate) {
+    dateCandidate = min;
+  }
+  if (min && !includeEdgeDates && min >= originalDate) {
+    dateCandidate = customDayjs(min).add(1, 'd').toDate();
+  }
+  if (max && includeEdgeDates && max < originalDate) {
+    dateCandidate = max;
+  }
+  if (max && !includeEdgeDates && max <= originalDate) {
+    dateCandidate = customDayjs(max).subtract(1, 'd').toDate();
+  }
+  var formattedDateCandidate = format ? customDayjs(dateCandidate).format(format) : dateCandidate.toString();
+  return {
+    normalizedDate: dateCandidate,
+    formattedNormalizedDate: formattedDateCandidate
+  };
+};

package/styled-components/es/examples/plasma_b2c/components/DatePicker/DatePicker.config.js

@@ -7,7 +7,7 @@ export var config = {
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/css(["", ":var(--surface-transparent-primary);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-positive);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-negative);", ":var(--text-positive);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-accent);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--surface-negative);", ":var(--surface-transparent-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-negative-active);", ":var(--surface-transparent-positive);", ":var(--surface-transparent-positive-active);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-accent);", ":var(--text-tertiary);", ":var(--shadow-down-soft-s);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-card);", ":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(--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);"], tokens.background, tokens.backgroundError, tokens.backgroundSuccess, tokens.dividerColor, tokens.labelColor, tokens.leftHelperColor, tokens.leftHelperColorError, tokens.leftHelperColorSuccess, tokens.textFieldColor, tokens.textFieldPlaceholderColor, tokens.textFieldCaretColor, tokens.labelInnerFontFamily, tokens.labelInnerFontSize, tokens.labelInnerFontStyle, tokens.labelInnerFontWeight, tokens.labelInnerLetterSpacing, tokens.labelInnerLineHeight, tokens.indicatorColor, tokens.textFieldBackgroundColor, tokens.textFieldBackgroundColorFocus, tokens.textFieldBackgroundErrorColor, tokens.textFieldBackgroundErrorColorFocus, tokens.textFieldBackgroundSuccessColor, tokens.textFieldBackgroundSuccessColorFocus, tokens.textFieldTextBeforeColor, tokens.textFieldTextAfterColor, tokens.focusColor, tokens.textFieldPlaceholderColorFocus, tokens.calendarShadow, tokens.calendarSeparatorBackground, tokens.calendarBackgroundColor, tokens.calendarSelectedItemBackground, tokens.calendarSelectedItemColor, tokens.calendarSelectableItemBackgroundHover, tokens.calendarCurrentItemBorderColor, tokens.calendarCurrentItemBackgroundHover, tokens.calendarCurrentItemColorHover, tokens.calendarCurrentItemChildBackgroundHover, tokens.calendarActiveItemBackground, tokens.calendarActiveItemColor, tokens.calendarHoveredItemBackground, tokens.calendarHoveredItemColor, tokens.calendarRangeBackground, tokens.calendarOutlineFocusColor, tokens.calendarContentPrimaryColor, tokens.calendarContentPrimaryDisabledColor, tokens.calendarHeaderArrowColor, tokens.calendarContentPrimaryColor, tokens.calendarContentSecondaryColor, tokens.calendarContentSecondaryDisabledColor, tokens.iconButtonColor, tokens.iconButtonBackgroundColor, tokens.iconButtonColorHover, tokens.iconButtonBackgroundColorHover, tokens.iconButtonColorActive, tokens.iconButtonBackgroundColorActive, tokens.iconButtonFocusColor)
+      "default": /*#__PURE__*/css(["", ":var(--surface-transparent-primary);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-positive);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-negative);", ":var(--text-positive);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-accent);", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":var(--surface-negative);", ":var(--surface-transparent-primary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-negative-active);", ":var(--surface-transparent-positive);", ":var(--surface-transparent-positive-active);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-accent);", ":var(--text-tertiary);", ":var(--shadow-down-soft-s);", ":var(--surface-transparent-secondary);", ":var(--surface-solid-card);", ":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(--surface-solid-default);", ":", ";", ":var(--text-secondary);", ":var(--text-secondary);", ":0.4;", ":var(--text-primary);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--surface-accent);"], tokens.background, tokens.backgroundError, tokens.backgroundSuccess, tokens.dividerColor, tokens.labelColor, tokens.leftHelperColor, tokens.leftHelperColorError, tokens.leftHelperColorSuccess, tokens.textFieldColor, tokens.textFieldPlaceholderColor, tokens.textFieldCaretColor, tokens.labelInnerFontFamily, tokens.labelInnerFontSize, tokens.labelInnerFontStyle, tokens.labelInnerFontWeight, tokens.labelInnerLetterSpacing, tokens.labelInnerLineHeight, tokens.indicatorColor, tokens.textFieldBackgroundColor, tokens.textFieldBackgroundColorFocus, tokens.textFieldBackgroundErrorColor, tokens.textFieldBackgroundErrorColorFocus, tokens.textFieldBackgroundSuccessColor, tokens.textFieldBackgroundSuccessColorFocus, tokens.textFieldTextBeforeColor, tokens.textFieldTextAfterColor, tokens.focusColor, tokens.textFieldPlaceholderColorFocus, tokens.calendarShadow, tokens.calendarSeparatorBackground, tokens.calendarBackgroundColor, tokens.calendarSelectedItemBackground, tokens.calendarSelectedItemColor, tokens.calendarSelectableItemBackgroundHover, tokens.calendarCurrentItemBorderColor, tokens.calendarCurrentItemBackgroundHover, tokens.calendarCurrentItemColorHover, tokens.calendarCurrentItemChildBackgroundHover, tokens.calendarActiveItemBackground, tokens.calendarActiveItemColor, tokens.calendarHoveredItemBackground, tokens.calendarHoveredItemColor, tokens.calendarRangeBackground, tokens.calendarOutlineFocusColor, tokens.calendarContentPrimaryColor, tokens.calendarContentPrimaryDisabledColor, tokens.calendarHeaderArrowColor, tokens.calendarContentPrimaryColor, tokens.calendarContentSecondaryColor, tokens.calendarContentSecondaryDisabledColor, tokens.calendarDisabledOpacity, tokens.iconButtonColor, tokens.iconButtonBackgroundColor, tokens.iconButtonColorHover, tokens.iconButtonBackgroundColorHover, tokens.iconButtonColorActive, tokens.iconButtonBackgroundColorActive, tokens.iconButtonFocusColor)
     },
     size: {
       l: /*#__PURE__*/css(["", ":26.5rem;", ":0.875rem;", ":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.75rem;", ":0.5625rem 0 0.125rem 0;", ":1.5625rem 0 0.5625rem 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);", ":0.5rem;", ":0.375rem;", ":0 0 0 0;", ":0.5rem auto auto -0.75rem;", ":0 0 auto auto;", ":0.25rem -0.625rem auto auto;", ":3.5rem;", ":0.875rem;", ":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;", ":0.875rem;", ":26.5rem;", ":0.5rem 1rem 1.125rem 1rem;", ":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 1rem 1.125rem 1rem;", ":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;", ":11.75rem;", ":10.5rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-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 1rem 1.125rem 1rem;", ":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.063rem;", ":0.875rem 1rem 0 1rem;", ":0.5rem;", ":0 0 0 1rem;", ":0.5rem;", ":var(--plasma-typo-h3-font-family);", ":var(--plasma-typo-h3-font-size);", ":var(--plasma-typo-h3-font-style);", ":var(--plasma-typo-h3-letter-spacing);", ":var(--plasma-typo-h3-line-height);", ":var(--plasma-typo-h3-font-weight);", ":var(--plasma-typo-h3-bold-font-weight);", ":3.5rem;", ":3.5rem;", ":1.5rem;", ":0.875rem;"], tokens.width, tokens.borderRadius, tokens.dividerPadding, tokens.dividerFontFamily, tokens.dividerFontStyle, tokens.dividerFontSize, tokens.dividerFontWeight, tokens.dividerLetterSpacing, tokens.dividerLineHeight, tokens.leftContentMargin, tokens.rightContentMargin, tokens.labelOffset, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.labelFontFamily, tokens.labelFontStyle, tokens.labelFontSize, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.indicatorSize, tokens.indicatorSizeOuter, tokens.indicatorPlacement, tokens.indicatorOuterPlacement, tokens.indicatorPlacementRight, tokens.indicatorOuterPlacementRight, tokens.textFieldHeight, tokens.textFieldBorderRadius, 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, tokens.calendarBorderRadius, tokens.calendarWidth, tokens.calendarYearsPadding, tokens.calendarYearItemBorderRadius, tokens.calendarYearItemWidth, tokens.calendarYearItemHeight, tokens.calendarYearFontFamily, tokens.calendarYearFontSize, tokens.calendarYearFontStyle, tokens.calendarYearFontLetterSpacing, tokens.calendarYearFontLineHeight, tokens.calendarYearFontWeight, tokens.calendarYearSelectedFontWeight, tokens.calendarMonthsPadding, tokens.calendarMonthItemBorderRadius, tokens.calendarMonthItemWidth, tokens.calendarMonthItemHeight, tokens.calendarMonthFontFamily, tokens.calendarMonthFontSize, tokens.calendarMonthFontStyle, tokens.calendarMonthFontLetterSpacing, tokens.calendarMonthFontLineHeight, tokens.calendarMonthFontWeight, tokens.calendarMonthSelectedFontWeight, tokens.calendarQuartersPadding, tokens.calendarQuarterItemBorderRadius, tokens.calendarQuarterItemWidth, tokens.calendarQuarterItemHeight, tokens.calendarQuarterFontFamily, tokens.calendarQuarterFontSize, tokens.calendarQuarterFontStyle, tokens.calendarQuarterFontLetterSpacing, tokens.calendarQuarterFontLineHeight, tokens.calendarQuarterFontWeight, tokens.calendarQuarterSelectedFontWeight, tokens.calendarDaysPadding, tokens.calendarDayItemBorderRadius, tokens.calendarDayItemWidth, tokens.calendarDayItemHeight, tokens.calendarDayFontFamily, tokens.calendarDayFontSize, tokens.calendarDayFontStyle, tokens.calendarDayFontLetterSpacing, tokens.calendarDayFontLineHeight, tokens.calendarDayFontWeight, tokens.calendarDaySelectedFontWeight, tokens.calendarCurrentItemBorderWidth, tokens.calendarHeaderWrapperPadding, tokens.calendarHeaderArrowGap, tokens.calendarHeaderPadding, tokens.calendarHeaderDateGap, tokens.calendarHeaderFontFamily, tokens.calendarHeaderFontSize, tokens.calendarHeaderFontStyle, tokens.calendarHeaderFontLetterSpacing, tokens.calendarHeaderFontLineHeight, tokens.calendarHeaderFontWeight, tokens.calendarHeaderFontWeightBold, tokens.iconButtonHeight, tokens.iconButtonWidth, tokens.iconButtonPadding, tokens.iconButtonRadius),