@itcase/ui 1.8.148 → 1.8.149

package/dist/{DatePicker_cjs_BOPN9WVz.js → DatePicker_cjs_YWv3CCNF.js}

@@ -100,8 +100,8 @@ function DatePickerInput(props) {
     const { daySize, dayTextColor, dayTextShape, dayTextSize, iconFill, iconFillHover, iconFillSize, iconItemFill, iconLeft, iconRight, iconShape, monthTextColor, monthTextSize, monthTextWeight, popper, popperPlacement, sizeClass, widthClass, yearTextColor, yearTextSize, yearTextWeight, isClearable, } = propsGenerator;
     const datepickerRef = React.useRef(null);
     const [dateStart, dateEnd] = React.useMemo(() => {
-        let dateStart;
-        if (value) {
+        let dateStart = undefined;
+        if (value !== undefined) {
             if (typeof value === 'string') {
                 dateStart = new Date(value);
             }
@@ -109,11 +109,8 @@ function DatePickerInput(props) {
                 dateStart = value;
             }
         }
-        else {
-            dateStart = undefined;
-        }
-        let dateEnd;
-        if (endValue) {
+        let dateEnd = undefined;
+        if (endValue !== undefined) {
             if (typeof endValue === 'string') {
                 dateEnd = new Date(endValue);
             }
@@ -121,9 +118,6 @@ function DatePickerInput(props) {
                 dateEnd = endValue;
             }
         }
-        else {
-            dateEnd = undefined;
-        }
         return [dateStart, dateEnd];
     }, [value, endValue]);
     const handleChange = React.useCallback((selected) => {

package/dist/{DatePicker_es_-aO8EkK8.js → DatePicker_es_CqKPt0Nw.js}

@@ -98,8 +98,8 @@ function DatePickerInput(props) {
     const { daySize, dayTextColor, dayTextShape, dayTextSize, iconFill, iconFillHover, iconFillSize, iconItemFill, iconLeft, iconRight, iconShape, monthTextColor, monthTextSize, monthTextWeight, popper, popperPlacement, sizeClass, widthClass, yearTextColor, yearTextSize, yearTextWeight, isClearable, } = propsGenerator;
     const datepickerRef = useRef(null);
     const [dateStart, dateEnd] = useMemo(() => {
-        let dateStart;
-        if (value) {
+        let dateStart = undefined;
+        if (value !== undefined) {
             if (typeof value === 'string') {
                 dateStart = new Date(value);
             }
@@ -107,11 +107,8 @@ function DatePickerInput(props) {
                 dateStart = value;
             }
         }
-        else {
-            dateStart = undefined;
-        }
-        let dateEnd;
-        if (endValue) {
+        let dateEnd = undefined;
+        if (endValue !== undefined) {
             if (typeof endValue === 'string') {
                 dateEnd = new Date(endValue);
             }
@@ -119,9 +116,6 @@ function DatePickerInput(props) {
                 dateEnd = endValue;
             }
         }
-        else {
-            dateEnd = undefined;
-        }
         return [dateStart, dateEnd];
     }, [value, endValue]);
     const handleChange = useCallback((selected) => {

package/dist/cjs/components/DatePeriod.js

@@ -3,8 +3,9 @@
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
+var luxon = require('luxon');
 var common = require('@itcase/common');
-var DatePicker = require('../../DatePicker_cjs_BOPN9WVz.js');
+var DatePicker = require('../../DatePicker_cjs_YWv3CCNF.js');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var ChipsGroup = require('../../ChipsGroup_cjs_BNfzAmhc.js');
@@ -119,8 +120,16 @@ function DatePeriod(props) {
     const checkIsChipsActive = React.useCallback((targetPeriodItem) => {
         const dateStartIso = targetPeriodItem.dateIntervalsList[0];
         const dateEndIso = targetPeriodItem.dateIntervalsList[1];
-        return (dateStartIso === datePeriodValueStart &&
-            dateEndIso === datePeriodValueEnd);
+        let normalizedDatePeriodValueStart = null;
+        let normalizedDatePeriodValueEnd = null;
+        if (datePeriodValueStart) {
+            normalizedDatePeriodValueStart = luxon.DateTime.fromJSDate(new Date(datePeriodValueStart)).toISODate();
+        }
+        if (datePeriodValueEnd) {
+            normalizedDatePeriodValueEnd = luxon.DateTime.fromJSDate(new Date(datePeriodValueEnd)).toISODate();
+        }
+        return (dateStartIso === normalizedDatePeriodValueStart &&
+            dateEndIso === normalizedDatePeriodValueEnd);
     }, [datePeriodValueEnd, datePeriodValueStart]);
     // const onChangeDatePicker = useCallback(
     //   (dateStart: Date | null, dateEnd: Date | null) => {
@@ -151,9 +160,7 @@ function DatePeriod(props) {
                         fillHover: datePickerInputFillHover,
                         textSize: datePickerInputTextSize,
                         placeholder: 'Выбрать период',
-                    }, value: datePeriodValueStart, 
-                    // onChange={onChangeDatePicker}
-                    onChange: onChangeDatePeriod })] }) }));
+                    }, value: datePeriodValueStart, onChange: onChangeDatePeriod })] }) }));
 }
 
 exports.DatePeriod = DatePeriod;

package/dist/cjs/components/DatePicker.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var DatePicker = require('../../DatePicker_cjs_BOPN9WVz.js');
+var DatePicker = require('../../DatePicker_cjs_YWv3CCNF.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');

package/dist/cjs/context/Notifications.js

@@ -156,16 +156,16 @@ function createNotification(notification, onClose) {
     }
     switch (status) {
         case 'success':
-            appearance = 'successPrimary';
+            appearance = 'successPrimary sizeM solid';
             break;
         case 'info':
-            appearance = 'infoPrimary';
+            appearance = 'infoPrimary sizeM solid';
             break;
         case 'error':
-            appearance = 'errorPrimary';
+            appearance = 'errorPrimary sizeM solid';
             break;
         case 'warning':
-            appearance = 'warningPrimary';
+            appearance = 'warningPrimary sizeM solid';
             break;
     }
     return {

package/dist/components/DatePeriod.js

@@ -1,8 +1,9 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useCallback } from 'react';
 import clsx from 'clsx';
+import { DateTime } from 'luxon';
 import { DATE_PERIOD_INTERVALS } from '@itcase/common';
-import { D as DatePickerInput } from '../DatePicker_es_-aO8EkK8.js';
+import { D as DatePickerInput } from '../DatePicker_es_CqKPt0Nw.js';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { b as ChipsGroup, C as Chips } from '../ChipsGroup_es_UTiUhYs7.js';
@@ -117,8 +118,16 @@ function DatePeriod(props) {
     const checkIsChipsActive = useCallback((targetPeriodItem) => {
         const dateStartIso = targetPeriodItem.dateIntervalsList[0];
         const dateEndIso = targetPeriodItem.dateIntervalsList[1];
-        return (dateStartIso === datePeriodValueStart &&
-            dateEndIso === datePeriodValueEnd);
+        let normalizedDatePeriodValueStart = null;
+        let normalizedDatePeriodValueEnd = null;
+        if (datePeriodValueStart) {
+            normalizedDatePeriodValueStart = DateTime.fromJSDate(new Date(datePeriodValueStart)).toISODate();
+        }
+        if (datePeriodValueEnd) {
+            normalizedDatePeriodValueEnd = DateTime.fromJSDate(new Date(datePeriodValueEnd)).toISODate();
+        }
+        return (dateStartIso === normalizedDatePeriodValueStart &&
+            dateEndIso === normalizedDatePeriodValueEnd);
     }, [datePeriodValueEnd, datePeriodValueStart]);
     // const onChangeDatePicker = useCallback(
     //   (dateStart: Date | null, dateEnd: Date | null) => {
@@ -149,9 +158,7 @@ function DatePeriod(props) {
                         fillHover: datePickerInputFillHover,
                         textSize: datePickerInputTextSize,
                         placeholder: 'Выбрать период',
-                    }, value: datePeriodValueStart, 
-                    // onChange={onChangeDatePicker}
-                    onChange: onChangeDatePeriod })] }) }));
+                    }, value: datePeriodValueStart, onChange: onChangeDatePeriod })] }) }));
 }
 
 export { DatePeriod, datePeriodAppearance, datePeriodConfig };

package/dist/components/DatePicker.js

@@ -1,4 +1,4 @@
-export { D as DatePickerInput, a as datePickerAppearance, d as datePickerConfig } from '../DatePicker_es_-aO8EkK8.js';
+export { D as DatePickerInput, a as datePickerAppearance, d as datePickerConfig } from '../DatePicker_es_CqKPt0Nw.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';

package/dist/context/Notifications.js

@@ -154,16 +154,16 @@ function createNotification(notification, onClose) {
     }
     switch (status) {
         case 'success':
-            appearance = 'successPrimary';
+            appearance = 'successPrimary sizeM solid';
             break;
         case 'info':
-            appearance = 'infoPrimary';
+            appearance = 'infoPrimary sizeM solid';
             break;
         case 'error':
-            appearance = 'errorPrimary';
+            appearance = 'errorPrimary sizeM solid';
             break;
         case 'warning':
-            appearance = 'warningPrimary';
+            appearance = 'warningPrimary sizeM solid';
             break;
     }
     return {

package/dist/types/components/DatePeriod/DatePeriod.interface.d.ts

@@ -20,14 +20,14 @@ type DatePeriodProps = DatePeriodThemeColor & StyleAttributes & {
     chipsShape?: ShapeProps;
     className?: string;
     datePeriodIntervalsList: DatePeriodItem[];
-    datePeriodValueEnd: DateIso | null;
-    datePeriodValueStart: DateIso | null;
+    datePeriodValueEnd: Date | DateIso | null;
+    datePeriodValueStart: Date | DateIso | null;
     datePickerAppearance?: CompositeAppearanceKey;
     datePickerInputAppearance?: CompositeAppearanceKey;
     datePickerInputFillHover?: FillHoverProps;
     datePickerInputSize?: SizeOptionProps;
     datePickerInputTextSize?: TextSizeProps;
     isSkeleton?: boolean;
-    onChangeDatePeriod: (dateStartIso: DateIso | null, dateEndIso: DateIso | null) => void;
+    onChangeDatePeriod: (dateStart: Date | null, dateEnd: Date | null) => void;
 };
-export type { DatePeriodThemeColor, DatePeriodAppearanceType, DatePeriodConfig, DatePeriodProps, };
+export type { DatePeriodAppearanceType, DatePeriodConfig, DatePeriodProps, DatePeriodThemeColor, };

package/dist/types/components/DatePicker/DatePicker.interface.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { DatePickerProps } from 'react-datepicker';
-import { AppearanceKeysDefault, FillHoverProps, FillProps, IconFillSizeProps, IconSizeProps, ItemColorProps, ShapeProps, SizeProps, TextColorHoverProps, TextColorProps, TextSizeProps, TextWeightProps } from '@itcase/types';
+import { AppearanceKeysDefault, DateIso, FillHoverProps, FillProps, IconFillSizeProps, IconSizeProps, ItemColorProps, ShapeProps, SizeProps, TextColorHoverProps, TextColorProps, TextSizeProps, TextWeightProps } from '@itcase/types';
 import { InputProps } from '../Input/Input.interface';
 interface DatePickerProps extends DatePickerProps {
     customTimeInput?: ReactNode;
@@ -64,11 +64,11 @@ export interface DatePickerInputProps extends DatePickerProps {
     clearLabelTextColorHover?: TextColorHoverProps;
     clearLabelTextSize?: TextSizeProps;
     datePickerProps: DatePickerProps;
-    endValue?: string;
+    endValue?: string | Date | DateIso;
     inputProps?: InputProps;
     labelTextSize?: TextSizeProps;
-    value?: string;
-    onChange?: any;
+    value?: string | Date | DateIso;
+    onChange: (dateStart: Date | null, dateEnd: Date | null) => void;
 }
 export interface DatePickerCustomInput {
     clearIcon?: any;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.8.148",
+  "version": "1.8.149",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",
@@ -109,11 +109,11 @@
     "@itcase/tokens-palette": "^1.1.20",
     "clsx": "^2.1.1",
     "date-fns": "^4.1.0",
-    "framer-motion": "^12.23.22",
+    "framer-motion": "^12.23.23",
     "js-cookie": "^3.0.5",
     "lodash": "^4.17.21",
     "luxon": "^3.7.2",
-    "motion": "^12.23.22",
+    "motion": "^12.23.23",
     "rc-slider": "^11.1.9",
     "react": "^18.3.1",
     "react-dadata": "^2.27.4",