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

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

@@ -19,10 +19,10 @@ var useDatePicker = function useDatePicker(_ref) {
     max = _ref.max,
     includeEdgeDates = _ref.includeEdgeDates,
     maskWithFormat = _ref.maskWithFormat,
+    dateFormatDelimiter = _ref.dateFormatDelimiter,
     setCorrectDates = _ref.setCorrectDates,
     setInputValue = _ref.setInputValue,
     setCalendarValue = _ref.setCalendarValue,
-    dateFormatDelimiter = _ref.dateFormatDelimiter,
     onChangeValue = _ref.onChangeValue,
     onCommitDate = _ref.onCommitDate,
     onChange = _ref.onChange;
@@ -47,11 +47,11 @@ var useDatePicker = function useDatePicker(_ref) {
       return;
     }
     var value = event.target.value;
-    var newValue = maskWithFormat ? getMaskedDateOnInput(value, format, dateFormatDelimiter(), currentValue) : value;
+    var newValue = maskWithFormat ? getMaskedDateOnInput(value, format, dateFormatDelimiter, currentValue) : value;
     var _getFormattedDates = getFormattedDates({
         value: newValue,
         lang: lang,
-        delimiter: dateFormatDelimiter(),
+        delimiter: dateFormatDelimiter,
         format: format,
         includeEdgeDates: includeEdgeDates,
         min: min,
@@ -66,18 +66,24 @@ var useDatePicker = function useDatePicker(_ref) {
         input: formattedDate
       });
       var dateInfo = getQuarterInfo(originalDate);
-      onCommitDate === null || onCommitDate === void 0 || onCommitDate(formattedDate, false, true, dateInfo, originalDate, isoDate);
+      if (onCommitDate) {
+        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: formattedDate,
-          originalDate: originalDate,
-          isoDate: isoDate,
-          name: name
-        }
-      });
+      if (onChangeValue) {
+        onChangeValue(event, formattedDate, originalDate, isoDate);
+      }
+      if (onChange) {
+        onChange({
+          target: {
+            value: formattedDate,
+            originalDate: originalDate,
+            isoDate: isoDate,
+            name: name
+          }
+        });
+      }
       return;
     }
     if (formattedDate === '') {
@@ -88,15 +94,19 @@ var useDatePicker = function useDatePicker(_ref) {
     }
     setCalendarValue(originalDate);
     setInputValue(formattedDate);
-    onChangeValue === null || onChangeValue === void 0 || onChangeValue(event, formattedDate, originalDate, isoDate);
-    onChange === null || onChange === void 0 || onChange({
-      target: {
-        value: formattedDate,
-        originalDate: originalDate,
-        isoDate: isoDate,
-        name: name
-      }
-    });
+    if (onChangeValue) {
+      onChangeValue(event, formattedDate, originalDate, isoDate);
+    }
+    if (onChange) {
+      onChange({
+        target: {
+          value: formattedDate,
+          originalDate: originalDate,
+          isoDate: isoDate,
+          name: name
+        }
+      });
+    }
   };
   var handleSearch = function handleSearch(date) {
     if (disabled || readOnly) {
@@ -105,12 +115,15 @@ var useDatePicker = function useDatePicker(_ref) {
     if (!date) {
       setCalendarValue(undefined);
       setInputValue('');
-      return onCommitDate === null || onCommitDate === void 0 ? void 0 : onCommitDate('', false, true, undefined, undefined, '');
+      if (onCommitDate) {
+        onCommitDate('', false, true, undefined, undefined, '');
+      }
+      return;
     }
     var _getFormattedDates2 = getFormattedDates({
         value: date,
         lang: lang,
-        delimiter: dateFormatDelimiter(),
+        delimiter: dateFormatDelimiter,
         format: format,
         includeEdgeDates: includeEdgeDates,
         min: min,
@@ -121,7 +134,9 @@ var useDatePicker = function useDatePicker(_ref) {
       originalDate = _getFormattedDates2.originalDate;
     if (originalDate) {
       var dateInfo = getQuarterInfo(originalDate);
-      onCommitDate === null || onCommitDate === void 0 || onCommitDate(formattedDate, false, true, dateInfo, originalDate, isoDate);
+      if (onCommitDate) {
+        onCommitDate(formattedDate, false, true, dateInfo, originalDate, isoDate);
+      }
     }
   };
   var handleCalendarPick = function handleCalendarPick(date, dateInfo) {
@@ -135,16 +150,22 @@ var useDatePicker = function useDatePicker(_ref) {
         calendar: date || undefined,
         input: ''
       });
-      onChangeValue === null || onChangeValue === void 0 || onChangeValue(null, '', date, '');
-      onChange === null || onChange === void 0 || onChange({
-        target: {
-          value: '',
-          originalDate: date,
-          isoDate: '',
-          name: name
-        }
-      });
-      onCommitDate === null || onCommitDate === void 0 || onCommitDate('', false, true, dateInfo, date || undefined, '');
+      if (onChangeValue) {
+        onChangeValue(null, '', date, '');
+      }
+      if (onChange) {
+        onChange({
+          target: {
+            value: '',
+            originalDate: date,
+            isoDate: '',
+            name: name
+          }
+        });
+      }
+      if (onCommitDate) {
+        onCommitDate('', false, true, dateInfo, date || undefined, '');
+      }
       return;
     }
     customDayjs.locale(lang);
@@ -156,22 +177,28 @@ var useDatePicker = function useDatePicker(_ref) {
       calendar: date,
       input: formattedDate
     });
-    onChangeValue === null || onChangeValue === void 0 || onChangeValue(null, formattedDate, date, isoDate);
-    onChange === null || onChange === void 0 || onChange({
-      target: {
-        value: formattedDate,
-        originalDate: date,
-        isoDate: isoDate,
-        name: name
-      }
-    });
-    onCommitDate === null || onCommitDate === void 0 || onCommitDate(formattedDate, false, true, dateInfo, date, isoDate);
+    if (onChangeValue) {
+      onChangeValue(null, formattedDate, date, isoDate);
+    }
+    if (onChange) {
+      onChange({
+        target: {
+          value: formattedDate,
+          originalDate: date,
+          isoDate: isoDate,
+          name: name
+        }
+      });
+    }
+    if (onCommitDate) {
+      onCommitDate(formattedDate, false, true, dateInfo, date, isoDate);
+    }
   };
   var updateExternalDate = function updateExternalDate(externalDate) {
     var _getFormattedDates3 = getFormattedDates({
         value: externalDate || null,
         lang: lang,
-        delimiter: dateFormatDelimiter(),
+        delimiter: dateFormatDelimiter,
         format: format,
         includeEdgeDates: includeEdgeDates,
         min: min,

package/es/components/DatePicker/hooks/useDatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDatePicker.js","sources":["../../../../src/components/DatePicker/hooks/useDatePicker.ts"],"sourcesContent":["import type { ChangeEvent } from 'react';\nimport { customDayjs } from 'src/utils/datejs';\nimport { QUARTER_NAMES } from 'src/components/Calendar/utils';\n\nimport { classes } from '../DatePicker.tokens';\nimport type { UseDatePickerProps } from '../DatePickerBase.types';\nimport type { CalendarValueType, DateInfo } from '../../Calendar/Calendar.types';\nimport { getFormattedDates, getMaskedDateOnInput } from '../utils';\n\nexport const useDatePicker = ({\n    currentValue,\n    format,\n    lang = 'ru',\n    disabled,\n    readOnly,\n    valueError,\n    valueSuccess,\n    name,\n    type,\n    min,\n    max,\n    includeEdgeDates,\n    maskWithFormat,\n    setCorrectDates,\n    setInputValue,\n    setCalendarValue,\n    dateFormatDelimiter,\n    onChangeValue,\n    onCommitDate,\n    onChange,\n}: UseDatePickerProps) => {\n    const datePickerErrorClass = valueError ? classes.datePickerError : undefined;\n    const datePickerSuccessClass = valueSuccess ? classes.datePickerSuccess : undefined;\n\n    const getQuarterInfo = (originalDate: Date) => {\n        if (type !== 'Quarters') {\n            return;\n        }\n\n        const endQuarter = new Date(originalDate);\n\n        endQuarter.setMonth(originalDate.getMonth() + 3);\n        endQuarter.setDate(0);\n\n        customDayjs.locale(lang);\n        const quarterIndex = customDayjs(originalDate).quarter() - 1;\n\n        return {\n            name: QUARTER_NAMES[quarterIndex],\n            fullValue: [originalDate, endQuarter] as CalendarValueType,\n        };\n    };\n\n    const handleChangeValue = (event: ChangeEvent<HTMLInputElement>) => {\n        if (disabled || readOnly) {\n            return;\n        }\n        const { value } = event.target;\n\n        const newValue = maskWithFormat\n            ? getMaskedDateOnInput(value, format, dateFormatDelimiter(), currentValue)\n            : value;\n\n        const { formattedDate, isoDate, originalDate } = getFormattedDates({\n            value: newValue,\n            lang,\n            delimiter: dateFormatDelimiter(),\n            format,\n            includeEdgeDates,\n            min,\n            max,\n        });\n\n        if (originalDate) {\n            setCorrectDates({ calendar: originalDate, input: formattedDate });\n\n            const dateInfo = getQuarterInfo(originalDate);\n\n            onCommitDate?.(formattedDate, false, true, dateInfo, originalDate, isoDate);\n\n            setCalendarValue(originalDate);\n            setInputValue(formattedDate);\n\n            onChangeValue?.(event, formattedDate, originalDate, isoDate);\n            onChange?.({\n                target: {\n                    value: formattedDate,\n                    originalDate,\n                    isoDate,\n                    name,\n                },\n            });\n\n            return;\n        }\n\n        if (formattedDate === '') {\n            setCorrectDates({ calendar: undefined, input: '' });\n        }\n\n        setCalendarValue(originalDate);\n        setInputValue(formattedDate);\n\n        onChangeValue?.(event, formattedDate, originalDate, isoDate);\n        onChange?.({ target: { value: formattedDate, originalDate, isoDate, name } });\n    };\n\n    const handleSearch = (date: string) => {\n        if (disabled || readOnly) {\n            return;\n        }\n\n        if (!date) {\n            setCalendarValue(undefined);\n            setInputValue('');\n\n            return onCommitDate?.('', false, true, undefined, undefined, '');\n        }\n\n        const { formattedDate, isoDate, originalDate } = getFormattedDates({\n            value: date,\n            lang,\n            delimiter: dateFormatDelimiter(),\n            format,\n            includeEdgeDates,\n            min,\n            max,\n        });\n\n        if (originalDate) {\n            const dateInfo = getQuarterInfo(originalDate);\n\n            onCommitDate?.(formattedDate, false, true, dateInfo, originalDate, isoDate);\n        }\n    };\n\n    const handleCalendarPick = (date?: Date | null, dateInfo?: DateInfo) => {\n        if (disabled || readOnly) {\n            return;\n        }\n\n        if (!date) {\n            setInputValue('');\n            setCalendarValue(date);\n            setCorrectDates({ calendar: date || undefined, input: '' });\n\n            onChangeValue?.(null, '', date, '');\n            onChange?.({ target: { value: '', originalDate: date, isoDate: '', name } });\n            onCommitDate?.('', false, true, dateInfo, date || undefined, '');\n\n            return;\n        }\n\n        customDayjs.locale(lang);\n        const formattedDate = customDayjs(date).format(format);\n        const isoDate = date.toISOString();\n\n        setCalendarValue(date);\n        setInputValue(formattedDate);\n        setCorrectDates({ calendar: date, input: formattedDate });\n\n        onChangeValue?.(null, formattedDate, date, isoDate);\n        onChange?.({ target: { value: formattedDate, originalDate: date, isoDate, name } });\n        onCommitDate?.(formattedDate, false, true, dateInfo, date, isoDate);\n    };\n\n    const updateExternalDate = (externalDate: Date | string | undefined) => {\n        const { formattedDate, originalDate } = getFormattedDates({\n            value: externalDate || null,\n            lang,\n            delimiter: dateFormatDelimiter(),\n            format,\n            includeEdgeDates,\n            min,\n            max,\n        });\n\n        setInputValue(formattedDate);\n        setCalendarValue(originalDate);\n\n        if (originalDate) {\n            setCorrectDates({ calendar: originalDate, input: formattedDate });\n        }\n\n        if (formattedDate === '') {\n            setCorrectDates({ calendar: undefined, input: '' });\n        }\n    };\n\n    return {\n        datePickerErrorClass,\n        datePickerSuccessClass,\n        handleChangeValue,\n        handleSearch,\n        handleCalendarPick,\n        updateExternalDate,\n    };\n};\n"],"names":["useDatePicker","_ref","currentValue","format","_ref$lang","lang","disabled","readOnly","valueError","valueSuccess","name","type","min","max","includeEdgeDates","maskWithFormat","setCorrectDates","setInputValue","setCalendarValue","dateFormatDelimiter","onChangeValue","onCommitDate","onChange","datePickerErrorClass","classes","datePickerError","undefined","datePickerSuccessClass","datePickerSuccess","getQuarterInfo","originalDate","endQuarter","Date","setMonth","getMonth","setDate","customDayjs","locale","quarterIndex","quarter","QUARTER_NAMES","fullValue","handleChangeValue","event","value","target","newValue","getMaskedDateOnInput","_getFormattedDates","getFormattedDates","delimiter","formattedDate","isoDate","calendar","input","dateInfo","handleSearch","date","_getFormattedDates2","handleCalendarPick","toISOString","updateExternalDate","externalDate","_getFormattedDates3"],"mappings":"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"}
+{"version":3,"file":"useDatePicker.js","sources":["../../../../src/components/DatePicker/hooks/useDatePicker.ts"],"sourcesContent":["import type { ChangeEvent } from 'react';\nimport { customDayjs } from 'src/utils/datejs';\nimport { QUARTER_NAMES } from 'src/components/Calendar/utils';\n\nimport { classes } from '../DatePicker.tokens';\nimport type { UseDatePickerProps } from '../DatePickerBase.types';\nimport type { CalendarValueType, DateInfo } from '../../Calendar/Calendar.types';\nimport { getFormattedDates, getMaskedDateOnInput } from '../utils';\n\nexport const useDatePicker = ({\n    currentValue,\n    format,\n    lang = 'ru',\n    disabled,\n    readOnly,\n    valueError,\n    valueSuccess,\n    name,\n    type,\n    min,\n    max,\n    includeEdgeDates,\n    maskWithFormat,\n    dateFormatDelimiter,\n    setCorrectDates,\n    setInputValue,\n    setCalendarValue,\n    onChangeValue,\n    onCommitDate,\n    onChange,\n}: UseDatePickerProps) => {\n    const datePickerErrorClass = valueError ? classes.datePickerError : undefined;\n    const datePickerSuccessClass = valueSuccess ? classes.datePickerSuccess : undefined;\n\n    const getQuarterInfo = (originalDate: Date) => {\n        if (type !== 'Quarters') {\n            return;\n        }\n\n        const endQuarter = new Date(originalDate);\n\n        endQuarter.setMonth(originalDate.getMonth() + 3);\n        endQuarter.setDate(0);\n\n        customDayjs.locale(lang);\n        const quarterIndex = customDayjs(originalDate).quarter() - 1;\n\n        return {\n            name: QUARTER_NAMES[quarterIndex],\n            fullValue: [originalDate, endQuarter] as CalendarValueType,\n        };\n    };\n\n    const handleChangeValue = (event: ChangeEvent<HTMLInputElement>) => {\n        if (disabled || readOnly) {\n            return;\n        }\n        const { value } = event.target;\n\n        const newValue = maskWithFormat\n            ? getMaskedDateOnInput(value, format, dateFormatDelimiter, currentValue)\n            : value;\n\n        const { formattedDate, isoDate, originalDate } = getFormattedDates({\n            value: newValue,\n            lang,\n            delimiter: dateFormatDelimiter,\n            format,\n            includeEdgeDates,\n            min,\n            max,\n        });\n\n        if (originalDate) {\n            setCorrectDates({ calendar: originalDate, input: formattedDate });\n\n            const dateInfo = getQuarterInfo(originalDate);\n\n            if (onCommitDate) {\n                onCommitDate(formattedDate, false, true, dateInfo, originalDate, isoDate);\n            }\n\n            setCalendarValue(originalDate);\n            setInputValue(formattedDate);\n\n            if (onChangeValue) {\n                onChangeValue(event, formattedDate, originalDate, isoDate);\n            }\n\n            if (onChange) {\n                onChange({\n                    target: {\n                        value: formattedDate,\n                        originalDate,\n                        isoDate,\n                        name,\n                    },\n                });\n            }\n\n            return;\n        }\n\n        if (formattedDate === '') {\n            setCorrectDates({ calendar: undefined, input: '' });\n        }\n\n        setCalendarValue(originalDate);\n        setInputValue(formattedDate);\n\n        if (onChangeValue) {\n            onChangeValue(event, formattedDate, originalDate, isoDate);\n        }\n\n        if (onChange) {\n            onChange({ target: { value: formattedDate, originalDate, isoDate, name } });\n        }\n    };\n\n    const handleSearch = (date: string) => {\n        if (disabled || readOnly) {\n            return;\n        }\n\n        if (!date) {\n            setCalendarValue(undefined);\n            setInputValue('');\n\n            if (onCommitDate) {\n                onCommitDate('', false, true, undefined, undefined, '');\n            }\n\n            return;\n        }\n\n        const { formattedDate, isoDate, originalDate } = getFormattedDates({\n            value: date,\n            lang,\n            delimiter: dateFormatDelimiter,\n            format,\n            includeEdgeDates,\n            min,\n            max,\n        });\n\n        if (originalDate) {\n            const dateInfo = getQuarterInfo(originalDate);\n\n            if (onCommitDate) {\n                onCommitDate(formattedDate, false, true, dateInfo, originalDate, isoDate);\n            }\n        }\n    };\n\n    const handleCalendarPick = (date?: Date | null, dateInfo?: DateInfo) => {\n        if (disabled || readOnly) {\n            return;\n        }\n\n        if (!date) {\n            setInputValue('');\n            setCalendarValue(date);\n            setCorrectDates({ calendar: date || undefined, input: '' });\n\n            if (onChangeValue) {\n                onChangeValue(null, '', date, '');\n            }\n            if (onChange) {\n                onChange({ target: { value: '', originalDate: date, isoDate: '', name } });\n            }\n            if (onCommitDate) {\n                onCommitDate('', false, true, dateInfo, date || undefined, '');\n            }\n\n            return;\n        }\n\n        customDayjs.locale(lang);\n        const formattedDate = customDayjs(date).format(format);\n        const isoDate = date.toISOString();\n\n        setCalendarValue(date);\n        setInputValue(formattedDate);\n        setCorrectDates({ calendar: date, input: formattedDate });\n\n        if (onChangeValue) {\n            onChangeValue(null, formattedDate, date, isoDate);\n        }\n        if (onChange) {\n            onChange({ target: { value: formattedDate, originalDate: date, isoDate, name } });\n        }\n        if (onCommitDate) {\n            onCommitDate(formattedDate, false, true, dateInfo, date, isoDate);\n        }\n    };\n\n    const updateExternalDate = (externalDate: Date | string | undefined) => {\n        const { formattedDate, originalDate } = getFormattedDates({\n            value: externalDate || null,\n            lang,\n            delimiter: dateFormatDelimiter,\n            format,\n            includeEdgeDates,\n            min,\n            max,\n        });\n\n        setInputValue(formattedDate);\n        setCalendarValue(originalDate);\n\n        if (originalDate) {\n            setCorrectDates({ calendar: originalDate, input: formattedDate });\n        }\n\n        if (formattedDate === '') {\n            setCorrectDates({ calendar: undefined, input: '' });\n        }\n    };\n\n    return {\n        datePickerErrorClass,\n        datePickerSuccessClass,\n        handleChangeValue,\n        handleSearch,\n        handleCalendarPick,\n        updateExternalDate,\n    };\n};\n"],"names":["useDatePicker","_ref","currentValue","format","_ref$lang","lang","disabled","readOnly","valueError","valueSuccess","name","type","min","max","includeEdgeDates","maskWithFormat","dateFormatDelimiter","setCorrectDates","setInputValue","setCalendarValue","onChangeValue","onCommitDate","onChange","datePickerErrorClass","classes","datePickerError","undefined","datePickerSuccessClass","datePickerSuccess","getQuarterInfo","originalDate","endQuarter","Date","setMonth","getMonth","setDate","customDayjs","locale","quarterIndex","quarter","QUARTER_NAMES","fullValue","handleChangeValue","event","value","target","newValue","getMaskedDateOnInput","_getFormattedDates","getFormattedDates","delimiter","formattedDate","isoDate","calendar","input","dateInfo","handleSearch","date","_getFormattedDates2","handleCalendarPick","toISOString","updateExternalDate","externalDate","_getFormattedDates3"],"mappings":"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"}

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

@@ -1,3 +1,4 @@
+import { objectSpread2 as _objectSpread2 } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import { customDayjs } from '../../../utils/datejs.js';
 
 var initialValueStructure = {
@@ -27,7 +28,9 @@ var getOriginalDates = function getOriginalDates(value, lang, format) {
       originalDate: originalDate
     };
   }
-  return initialValueStructure;
+  return _objectSpread2(_objectSpread2({}, initialValueStructure), {}, {
+    formattedDate: value
+  });
 };
 
 export { getOriginalDates };

package/es/components/DatePicker/utils/getOriginalDates.js.map

@@ -1 +1 @@
-{"version":3,"file":"getOriginalDates.js","sources":["../../../../src/components/DatePicker/utils/getOriginalDates.ts"],"sourcesContent":["import { customDayjs } from 'src/utils/datejs';\n\nconst initialValueStructure = {\n    isoDate: '',\n    originalDate: undefined,\n    formattedDate: '',\n};\n\nexport const getOriginalDates = (value: Date | string | null, lang?: string, format?: string) => {\n    if (!value || !lang || !format) {\n        return initialValueStructure;\n    }\n\n    customDayjs.locale(lang);\n\n    if (value instanceof Date) {\n        return {\n            formattedDate: customDayjs(value).format(format),\n            isoDate: new Date(value).toISOString(),\n            originalDate: new Date(value),\n        };\n    }\n\n    if (customDayjs(value, format).isValid()) {\n        const isoDate = customDayjs(value, format).toISOString();\n        const originalDate = customDayjs(value, format).toDate();\n        const formattedDate = customDayjs(value, format).format(format);\n\n        return { formattedDate, isoDate, originalDate };\n    }\n\n    return initialValueStructure;\n};\n"],"names":["initialValueStructure","isoDate","originalDate","undefined","formattedDate","getOriginalDates","value","lang","format","customDayjs","locale","Date","toISOString","isValid","toDate"],"mappings":";;AAEA,IAAMA,qBAAqB,GAAG;AAC1BC,EAAAA,OAAO,EAAE,EAAE;AACXC,EAAAA,YAAY,EAAEC,SAAS;AACvBC,EAAAA,aAAa,EAAE,EAAA;AACnB,CAAC,CAAA;AAEM,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAIC,KAA2B,EAAEC,IAAa,EAAEC,MAAe,EAAK;EAC7F,IAAI,CAACF,KAAK,IAAI,CAACC,IAAI,IAAI,CAACC,MAAM,EAAE;AAC5B,IAAA,OAAOR,qBAAqB,CAAA;AAChC,GAAA;AAEAS,EAAAA,WAAW,CAACC,MAAM,CAACH,IAAI,CAAC,CAAA;EAExB,IAAID,KAAK,YAAYK,IAAI,EAAE;IACvB,OAAO;MACHP,aAAa,EAAEK,WAAW,CAACH,KAAK,CAAC,CAACE,MAAM,CAACA,MAAM,CAAC;MAChDP,OAAO,EAAE,IAAIU,IAAI,CAACL,KAAK,CAAC,CAACM,WAAW,EAAE;AACtCV,MAAAA,YAAY,EAAE,IAAIS,IAAI,CAACL,KAAK,CAAA;KAC/B,CAAA;AACL,GAAA;EAEA,IAAIG,WAAW,CAACH,KAAK,EAAEE,MAAM,CAAC,CAACK,OAAO,EAAE,EAAE;IACtC,IAAMZ,OAAO,GAAGQ,WAAW,CAACH,KAAK,EAAEE,MAAM,CAAC,CAACI,WAAW,EAAE,CAAA;IACxD,IAAMV,YAAY,GAAGO,WAAW,CAACH,KAAK,EAAEE,MAAM,CAAC,CAACM,MAAM,EAAE,CAAA;AACxD,IAAA,IAAMV,aAAa,GAAGK,WAAW,CAACH,KAAK,EAAEE,MAAM,CAAC,CAACA,MAAM,CAACA,MAAM,CAAC,CAAA;IAE/D,OAAO;AAAEJ,MAAAA,aAAa,EAAbA,aAAa;AAAEH,MAAAA,OAAO,EAAPA,OAAO;AAAEC,MAAAA,YAAY,EAAZA,YAAAA;KAAc,CAAA;AACnD,GAAA;AAEA,EAAA,OAAOF,qBAAqB,CAAA;AAChC;;;;"}
+{"version":3,"file":"getOriginalDates.js","sources":["../../../../src/components/DatePicker/utils/getOriginalDates.ts"],"sourcesContent":["import { customDayjs } from 'src/utils/datejs';\n\nconst initialValueStructure = {\n    isoDate: '',\n    originalDate: undefined,\n    formattedDate: '',\n};\n\nexport const getOriginalDates = (value: Date | string | null, lang?: string, format?: string) => {\n    if (!value || !lang || !format) {\n        return initialValueStructure;\n    }\n\n    customDayjs.locale(lang);\n\n    if (value instanceof Date) {\n        return {\n            formattedDate: customDayjs(value).format(format),\n            isoDate: new Date(value).toISOString(),\n            originalDate: new Date(value),\n        };\n    }\n\n    if (customDayjs(value, format).isValid()) {\n        const isoDate = customDayjs(value, format).toISOString();\n        const originalDate = customDayjs(value, format).toDate();\n        const formattedDate = customDayjs(value, format).format(format);\n\n        return { formattedDate, isoDate, originalDate };\n    }\n\n    return { ...initialValueStructure, formattedDate: value };\n};\n"],"names":["initialValueStructure","isoDate","originalDate","undefined","formattedDate","getOriginalDates","value","lang","format","customDayjs","locale","Date","toISOString","isValid","toDate","_objectSpread"],"mappings":";;;AAEA,IAAMA,qBAAqB,GAAG;AAC1BC,EAAAA,OAAO,EAAE,EAAE;AACXC,EAAAA,YAAY,EAAEC,SAAS;AACvBC,EAAAA,aAAa,EAAE,EAAA;AACnB,CAAC,CAAA;AAEM,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAIC,KAA2B,EAAEC,IAAa,EAAEC,MAAe,EAAK;EAC7F,IAAI,CAACF,KAAK,IAAI,CAACC,IAAI,IAAI,CAACC,MAAM,EAAE;AAC5B,IAAA,OAAOR,qBAAqB,CAAA;AAChC,GAAA;AAEAS,EAAAA,WAAW,CAACC,MAAM,CAACH,IAAI,CAAC,CAAA;EAExB,IAAID,KAAK,YAAYK,IAAI,EAAE;IACvB,OAAO;MACHP,aAAa,EAAEK,WAAW,CAACH,KAAK,CAAC,CAACE,MAAM,CAACA,MAAM,CAAC;MAChDP,OAAO,EAAE,IAAIU,IAAI,CAACL,KAAK,CAAC,CAACM,WAAW,EAAE;AACtCV,MAAAA,YAAY,EAAE,IAAIS,IAAI,CAACL,KAAK,CAAA;KAC/B,CAAA;AACL,GAAA;EAEA,IAAIG,WAAW,CAACH,KAAK,EAAEE,MAAM,CAAC,CAACK,OAAO,EAAE,EAAE;IACtC,IAAMZ,OAAO,GAAGQ,WAAW,CAACH,KAAK,EAAEE,MAAM,CAAC,CAACI,WAAW,EAAE,CAAA;IACxD,IAAMV,YAAY,GAAGO,WAAW,CAACH,KAAK,EAAEE,MAAM,CAAC,CAACM,MAAM,EAAE,CAAA;AACxD,IAAA,IAAMV,aAAa,GAAGK,WAAW,CAACH,KAAK,EAAEE,MAAM,CAAC,CAACA,MAAM,CAACA,MAAM,CAAC,CAAA;IAE/D,OAAO;AAAEJ,MAAAA,aAAa,EAAbA,aAAa;AAAEH,MAAAA,OAAO,EAAPA,OAAO;AAAEC,MAAAA,YAAY,EAAZA,YAAAA;KAAc,CAAA;AACnD,GAAA;AAEA,EAAA,OAAAa,cAAA,CAAAA,cAAA,CAAA,EAAA,EAAYf,qBAAqB,CAAA,EAAA,EAAA,EAAA;AAAEI,IAAAA,aAAa,EAAEE,KAAAA;AAAK,GAAA,CAAA,CAAA;AAC3D;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salutejs/plasma-new-hope",
-  "version": "0.322.0-canary.1939.14642328722.0",
+  "version": "0.322.0-canary.1939.14664752830.0",
   "description": "Salute Design System blueprint",
   "main": "cjs/index.js",
   "module": "es/index.js",
@@ -80,8 +80,8 @@
     "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-commonjs": "^25.0.4",
     "@rollup/plugin-node-resolve": "^15.1.0",
-    "@salutejs/plasma-sb-utils": "0.197.0-canary.1939.14642328722.0",
-    "@salutejs/plasma-themes": "0.33.0-canary.1939.14642328722.0",
+    "@salutejs/plasma-sb-utils": "0.197.0-canary.1939.14664752830.0",
+    "@salutejs/plasma-themes": "0.33.0-canary.1939.14664752830.0",
     "@storybook/addon-docs": "8.6.12",
     "@storybook/addon-essentials": "8.6.12",
     "@storybook/manager-api": "8.6.12",
@@ -137,5 +137,5 @@
   "sideEffects": [
     "*.css"
   ],
-  "gitHead": "f1e933c07289688e51bb60e663513417e814664a"
+  "gitHead": "c1fda3441681f107a6e00054db751822cdacb84e"
 }

package/styled-components/cjs/components/Accordion/Accordion.template-doc.mdx

@@ -15,7 +15,7 @@ import TabItem from '@theme/TabItem';
 Компонент выпадающей информации
 <PropsTable name="AccordionItem" exclude={['value']} />
 
-Компонент представляет собой заголовок и контент, который раскрывается при нажатии. 
+Компонент представляет собой заголовок и контент, который раскрывается при нажатии.
 
 ## Примеры Accordion
 
@@ -35,10 +35,10 @@ import TabItem from '@theme/TabItem';
                     </Accordion>
                 </div>
             );
-        }
+    }
         ```
     </TabItem>
-     <TabItem value="view" label="View">
+    <TabItem value="view" label="View">
         ```tsx live
         import React from 'react';
         import { Accordion, AccordionItem } from '@salutejs/{{ package }}';
@@ -61,78 +61,106 @@ import TabItem from '@theme/TabItem';
                         </Accordion>
                     </div>
                 </div>
-            );
-        }
-        ```
-    </TabItem>
-    <TabItem value="size" label="Size">
-        ```tsx live
-        import React from 'react';
-        import { Accordion, AccordionItem } from '@salutejs/{{ package }}';
+        );
+    }
+    ```
+</TabItem>
+<TabItem value="size" label="Size">
+    ```tsx live
+    import React from 'react';
+    import { Accordion, AccordionItem } from '@salutejs/{{ package }}';
 
-        export function App() {
-            return (
-                <div style=\{{"width": "100%", "display": "flex", "flex-direction": "column"}}>
-                    <div style=\{{"width": "100%"}}>
-                        <Accordion size="xs">
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                        </Accordion>
-                    </div>
-                    <div style=\{{"width": "100%"}}>
-                        <Accordion size="s">
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                        </Accordion>
-                    </div>
-                    <div style=\{{"width": "100%"}}>
-                        <Accordion size="m">
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                        </Accordion>
-                    </div>
-                    <div style=\{{"width": "100%"}}>
-                        <Accordion size="l">
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                        </Accordion>
-                    </div>
+    export function App() {
+        return (
+            <div style=\{{"width": "100%", "display": "flex", "flex-direction": "column"}}>
+                <div style=\{{"width": "100%"}}>
+                    <Accordion size="xs">
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                    </Accordion>
                 </div>
-            );
-        }
-        ```
-    </TabItem>
-    <TabItem value="stretching" label="Stretching">
-        ```tsx live
-        import React from 'react';
-        import { Accordion, AccordionItem } from '@salutejs/{{ package }}';
+                <div style=\{{"width": "100%"}}>
+                    <Accordion size="s">
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                    </Accordion>
+                </div>
+                <div style=\{{"width": "100%"}}>
+                    <Accordion size="m">
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                    </Accordion>
+                </div>
+                <div style=\{{"width": "100%"}}>
+                    <Accordion size="l">
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                    </Accordion>
+                </div>
+                <div style=\{{"width": "100%"}}>
+                    <Accordion size="h2">
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                    </Accordion>
+                </div>
+                <div style=\{{"width": "100%"}}>
+                    <Accordion size="h3">
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                    </Accordion>
+                </div>
+                <div style=\{{"width": "100%"}}>
+                    <Accordion size="h4">
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                    </Accordion>
+                </div>
+                <div style=\{{"width": "100%"}}>
+                    <Accordion size="h5">
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                    </Accordion>
+                </div>
+        </div>
+    );
+}
+```
+</TabItem>
+<TabItem value="stretching" label="Stretching">
+    ```tsx live
+    import React from 'react';
+    import { Accordion, AccordionItem } from '@salutejs/{{ package }}';
 
-        export function App() {
-            return (
-                <div style=\{{"width": "100%", "display": "flex", "flex-direction": "column"}}>
-                    <div style=\{{"width": "100%"}}>
-                        <Accordion>
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                        </Accordion>
-                    </div>
-                    <div style=\{{"width": "100%"}}>
-                        <Accordion stretching="fixed">
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                            <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
-                        </Accordion>
-                    </div>
+    export function App() {
+        return (
+            <div style=\{{"width": "100%", "display": "flex", "flex-direction": "column"}}>
+                <div style=\{{"width": "100%"}}>
+                    <Accordion>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                    </Accordion>
                 </div>
-            );
-        }
-        ```
-    </TabItem>
+                <div style=\{{"width": "100%"}}>
+                    <Accordion stretching="fixed">
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                        <AccordionItem title="Как оплатить заправку бонусами СберСпасибо?">После указания деталей заправки нажмите кнопку «К оплате». Откроется окно оплаты, где вы сможете списать бонусы и оплатить ими до 99% стоимости топлива</AccordionItem>
+                    </Accordion>
+                </div>
+        </div>
+    );
+}
+```
+</TabItem>
 </Tabs>
 
 ### Использование Accordion в Controlled варианте