@moysklad/uikit 28.1.0 → 31.20.0

package/dist/components/{FieldRow → _shared/FieldRow}/FieldRow.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from 'react';
-import { type IHasTestId } from '../../common';
+import { type IHasTestId } from '../../../common';
 interface RowProps extends IHasTestId {
     children: ReactNode;
     helpComponent?: ReactNode;

package/dist/components/{FieldRow → _shared/FieldRow}/FieldRow.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { cn } from "../../common/index.js";
+import { cn } from "../../../common/index.js";
 import FieldRow_module from "./FieldRow.module.js";
 const FieldRow = ({ children, helpComponent, className, controlClassName, helpClassName })=>/*#__PURE__*/ jsxs("div", {
         className: cn(FieldRow_module.main, className),

package/dist/components/{FieldRow → _shared/FieldRow}/FieldRow.module.js

@@ -1,7 +1,7 @@
 import "./FieldRow_module.css";
 const FieldRow_module = {
-    main: "main-FJxMD5",
-    control: "control-I_nQoE",
-    help: "help-dIvToq"
+    main: "main-sxY40U",
+    control: "control-H2iwSf",
+    help: "help-M7JGK9"
 };
 export default FieldRow_module;

package/dist/components/{FieldRow → _shared/FieldRow}/FieldRow_module.css

@@ -1,17 +1,17 @@
-.main-FJxMD5 {
+.main-sxY40U {
   align-items: center;
   width: 100%;
   display: flex;
   position: relative;
 }
 
-.control-I_nQoE {
+.control-H2iwSf {
   flex-direction: column;
   flex: 1;
   display: flex;
 }
 
-.help-dIvToq {
+.help-M7JGK9 {
   flex-direction: column;
   align-items: flex-end;
   width: 32px;

package/dist/components/{EditableTitle → _shared/HintWithSkip}/HintWithSkip.d.ts

@@ -1,5 +1,5 @@
 import type { FC } from 'react';
-import { type HintProps } from '../Hint/Hint';
+import { type HintProps } from '../../Hint/Hint';
 interface HintWithSkipProps extends HintProps {
     skip?: boolean;
 }

package/dist/components/{EditableTitle → _shared/HintWithSkip}/HintWithSkip.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { Hint } from "../Hint/Hint.js";
+import { Hint } from "../../Hint/Hint.js";
 const HintWithSkip = ({ skip = false, ...hintProps })=>{
     if (skip) return hintProps.children;
     return /*#__PURE__*/ jsx(Hint, {

package/dist/components/_shared/Info/Info.d.ts

@@ -0,0 +1,12 @@
+import { type IHasTestId } from '../../../common/types';
+import { type InfoSizeValue } from './types';
+export interface InfoProps extends IHasTestId {
+    info?: string;
+    error?: boolean;
+    warning?: boolean;
+    disabled?: boolean;
+    isEllipsis?: boolean;
+    className?: string;
+    size?: InfoSizeValue;
+}
+export declare const Info: import("react").ForwardRefExoticComponent<InfoProps & import("react").RefAttributes<HTMLElement>>;

package/dist/components/_shared/Info/Info.js

@@ -0,0 +1,46 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef, useState } from "react";
+import { cn } from "../../../common/css/cn.js";
+import { Hint } from "../../Hint/Hint.js";
+import { Text, TextColor, TextVariant } from "../../Text/Text.js";
+import { useIsElementOverflowing } from "../../../hooks/useIsElementOverflowing/index.js";
+import { InfoSize } from "./types/index.js";
+import Info_module from "./Info.module.js";
+const Info = /*#__PURE__*/ forwardRef(({ info, error, warning, disabled, testId, isEllipsis, className, size = InfoSize.M }, ref)=>{
+    const { ref: infoRef, isOverflowing: isOverflowingInfo } = useIsElementOverflowing([
+        info
+    ], isEllipsis ? ref : null);
+    const [isHintVisible, setIsHintVisible] = useState(false);
+    if (!info) return null;
+    const getColor = ()=>{
+        if (!disabled && error) return TextColor.critical;
+        if (!disabled && warning) return TextColor.attention;
+        return TextColor.secondary;
+    };
+    const textVariant = size === InfoSize.M ? TextVariant.caption : TextVariant.body;
+    const caption = /*#__PURE__*/ jsx(Text, {
+        variant: textVariant,
+        ref: isEllipsis ? infoRef : void 0,
+        className: cn(Info_module.info, isEllipsis ? Info_module.ellipsis : Info_module.wrap, className),
+        colorToken: getColor(),
+        testId: `${testId}-info`,
+        children: info
+    });
+    if (!isEllipsis) return caption;
+    return /*#__PURE__*/ jsx(Hint, {
+        visible: isHintVisible,
+        placement: "bottom",
+        onVisibleChange: setIsHintVisible,
+        overlay: /*#__PURE__*/ jsx(Text.Body, {
+            testId: `${testId}-info`,
+            colorToken: "invert",
+            className: Info_module.hintText,
+            children: info
+        }),
+        trigger: isOverflowingInfo ? 'hover' : [],
+        overlayClassName: Info_module.hint,
+        children: caption
+    });
+});
+Info.displayName = 'Info';
+export { Info };

package/dist/components/_shared/Info/Info.module.js

@@ -0,0 +1,9 @@
+import "./Info_module.css";
+const Info_module = {
+    info: "info-ZKbH17",
+    wrap: "wrap-iIsMFE",
+    ellipsis: "ellipsis-TRaKmy",
+    hint: "hint-GMnBBU",
+    hintText: "hintText-Y3plcB"
+};
+export default Info_module;

package/dist/components/_shared/Info/Info_module.css

@@ -0,0 +1,32 @@
+.info-ZKbH17 {
+  margin: 0;
+  position: relative;
+}
+
+.wrap-iIsMFE {
+  overflow-wrap: break-word;
+}
+
+.ellipsis-TRaKmy {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-width: 100%;
+  display: block;
+  overflow: hidden;
+}
+
+.ellipsis-TRaKmy:after {
+  content: "";
+  display: block;
+}
+
+.hint-GMnBBU {
+  box-sizing: border-box;
+  overflow-wrap: break-word;
+  max-width: 300px;
+}
+
+.hintText-Y3plcB {
+  overflow-wrap: break-word;
+}
+

package/dist/components/_shared/Info/types/index.d.ts

@@ -0,0 +1,6 @@
+import type { ValueOf } from '../../../../common';
+export declare const InfoSize: {
+    readonly M: "m";
+    readonly L: "l";
+};
+export type InfoSizeValue = ValueOf<typeof InfoSize>;

package/dist/components/_shared/Info/types/index.js

@@ -0,0 +1,5 @@
+const InfoSize = {
+    M: 'm',
+    L: 'l'
+};
+export { InfoSize };

package/dist/components/_shared/InputClear/InputClear.d.ts

@@ -0,0 +1,14 @@
+import type React from 'react';
+import { type IHasTestId } from '../../../common/types';
+interface InputClearProps extends IHasTestId {
+    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    onMouseDown?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    tabIndex?: number;
+    className?: string;
+    size?: 'L' | 'M';
+}
+export declare const InputClear: {
+    ({ testId, tabIndex, className, onClick, onMouseDown, size, }: InputClearProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/components/_shared/InputClear/InputClear.js

@@ -0,0 +1,18 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../../common/css/cn.js";
+import { RemoveClose12Icon, RemoveCloseIcon16Icon } from "../../../icon/index.js";
+import InputClear_module from "./InputClear.module.js";
+const InputClear = ({ testId, tabIndex, className, onClick, onMouseDown, size = 'M' })=>/*#__PURE__*/ jsx("button", {
+        type: "button",
+        className: cn(InputClear_module.main, 'L' === size && InputClear_module.large, className),
+        onClick: onClick,
+        onMouseDown: onMouseDown,
+        tabIndex: tabIndex,
+        "data-test-id": testId ? `${testId}-input-clear` : 'input-clear',
+        children: /*#__PURE__*/ jsx("span", {
+            className: InputClear_module.icon,
+            children: 'L' === size ? /*#__PURE__*/ jsx(RemoveCloseIcon16Icon, {}) : /*#__PURE__*/ jsx(RemoveClose12Icon, {})
+        })
+    });
+InputClear.displayName = 'InputClear';
+export { InputClear };

package/dist/components/{InputClear → _shared/InputClear}/InputClear.module.js

@@ -1,5 +1,7 @@
 import "./InputClear_module.css";
 const InputClear_module = {
-    main: "main-hfNd9I"
+    main: "main-wavOVy",
+    icon: "icon-dcuwJd",
+    large: "large-crUG9g"
 };
 export default InputClear_module;

package/dist/components/_shared/InputClear/InputClear_module.css

@@ -0,0 +1,34 @@
+.main-wavOVy {
+  all: unset;
+  box-sizing: border-box;
+  cursor: pointer;
+  width: 20px;
+  height: 20px;
+  color: var(--elements-normal, #5f6d79);
+  flex-shrink: 0;
+  justify-content: center;
+  align-items: center;
+  display: flex;
+}
+
+.icon-dcuwJd {
+  justify-content: center;
+  align-items: center;
+  display: flex;
+}
+
+.large-crUG9g {
+  width: 28px;
+  height: 28px;
+}
+
+.main-wavOVy:hover, .main-wavOVy:active {
+  color: var(--elements-hover, #091739);
+}
+
+.main-wavOVy:focus-visible {
+  color: var(--elements-hover, #091739);
+  border: 1px solid var(--border-focused, #091739);
+  border-radius: 4px;
+}
+

package/dist/components/_shared/utils/polymorphicClickableTypes.d.ts

@@ -0,0 +1,17 @@
+import { type ComponentPropsWithRef, type ElementType, type PropsWithoutRef, type ReactElement } from 'react';
+import type { ValueOf } from '../../../common';
+export declare const ClickableTag: {
+    readonly a: "a";
+    readonly button: "button";
+};
+export type ClickableTagValue = ValueOf<typeof ClickableTag>;
+type MergeProps<Props extends object, As extends ElementType> = Props & Omit<ComponentPropsWithRef<As>, keyof Props>;
+export type PolymorphicClickableProps<Props extends object, As extends ClickableTagValue> = {
+    as?: As;
+} & MergeProps<Props, As>;
+export interface ClickableComponent<Props extends object, DefaultAs extends ClickableTagValue> {
+    <As extends ClickableTagValue = DefaultAs>(props: PolymorphicClickableProps<Props, As>): ReactElement | null;
+    displayName?: string;
+}
+export declare const polymorphicClickableRef: <Props extends object, As extends ClickableTagValue>(render: (props: PropsWithoutRef<PolymorphicClickableProps<Props, As>>, ref: ComponentPropsWithRef<As>["ref"]) => ReactElement | null) => ClickableComponent<Props, As>;
+export {};

package/dist/components/_shared/utils/polymorphicClickableTypes.js

@@ -0,0 +1,7 @@
+import { forwardRef } from "react";
+const ClickableTag = {
+    a: 'a',
+    button: 'button'
+};
+const polymorphicClickableRef = forwardRef;
+export { ClickableTag, polymorphicClickableRef };

package/dist/data-grid/Filters/DateRangeFilter/DropdownContent/index.js

@@ -90,7 +90,7 @@ const DropdownContent = (props)=>{
                     isTimeToggleVisible && /*#__PURE__*/ jsx(Hint, {
                         overlay: /*#__PURE__*/ jsx(Text.Body, {
                             colorToken: TextColor.invert,
-                            children: locale.footer.timeSelectionToggleHint
+                            children: locale.translate.footer.timeSelectionToggleHint
                         }),
                         trigger: isTimeToggleDisabled ? 'hover' : [],
                         overlayClassName: DropdownContent_module.toggleTooltipOverlay,
@@ -106,7 +106,7 @@ const DropdownContent = (props)=>{
                                 checked: props.withTime,
                                 disabled: isTimeToggleDisabled,
                                 onChange: handleChangeTimeSelection,
-                                label: locale.footer.timeSelectionToggle
+                                label: locale.translate.footer.timeSelectionToggle
                             })
                         })
                     }),
@@ -116,7 +116,7 @@ const DropdownContent = (props)=>{
                         onClick: props.onClearButtonClick,
                         children: [
                             /*#__PURE__*/ jsx(FilterUpdate20Icon, {}),
-                            locale.footer.clearFilterButton
+                            locale.translate.footer.clearFilterButton
                         ]
                     })
                 ]

package/dist/data-grid/Filters/DateRangeFilter/InputContent/index.js

@@ -3,7 +3,7 @@ import { format, isSameMonth, isToday, isYesterday } from "date-fns";
 import { cn } from "../../../../common/css/index.js";
 import { Text, TextTag } from "../../../../components/Text/Text.js";
 import { useLocaleContext } from "../../../../context/contexts/index.js";
-import { useLocale } from "../../../locale/index.js";
+import { LocaleKey, useLocale } from "../../../locale/index.js";
 import { Left12Icon, Right12Icon } from "../../../../icon/index.js";
 import { ArrowButton } from "../ArrowButton/index.js";
 import { CalendarVariant } from "../consts.js";
@@ -14,32 +14,32 @@ const removeDots = (str)=>str.replace(/\./g, '');
 const getWeekIntervalText = ({ startDate, endDate }, localeOptions)=>{
     const formatOptions = getFormatOptions(localeOptions.lang);
     if (isSameMonth(startDate, endDate)) {
-        const formatedStartDate = format(startDate, localeOptions.locale.slider.week.dateFormat.sameMonth.firstDate, formatOptions);
-        const formatedTooltipStartDate = format(startDate, localeOptions.locale.slider.week.tooltipDateFormat.sameMonth.firstDate, formatOptions);
-        const formatedEndDate = format(endDate, localeOptions.locale.slider.week.dateFormat.sameMonth.endDate, formatOptions);
-        const formatedTooltipEndDate = format(endDate, localeOptions.locale.slider.week.tooltipDateFormat.sameMonth.endDate, formatOptions);
+        const formatedStartDate = format(startDate, localeOptions.dateFormats.format.slider.week.dateFormat.sameMonth.firstDate, formatOptions);
+        const formatedTooltipStartDate = format(startDate, localeOptions.dateFormats.format.slider.week.tooltipDateFormat.sameMonth.firstDate, formatOptions);
+        const formatedEndDate = format(endDate, localeOptions.dateFormats.format.slider.week.dateFormat.sameMonth.endDate, formatOptions);
+        const formatedTooltipEndDate = format(endDate, localeOptions.dateFormats.format.slider.week.tooltipDateFormat.sameMonth.endDate, formatOptions);
         return {
             text: `${formatedStartDate}–${formatedEndDate}`,
             tooltipText: `${formatedTooltipStartDate}–${formatedTooltipEndDate}`
         };
     }
-    const formatedStartDate = format(startDate, localeOptions.locale.slider.week.dateFormat.differentMonth.firstDate, formatOptions);
-    const formatedTooltipStartDate = format(startDate, localeOptions.locale.slider.week.tooltipDateFormat.differentMonth.firstDate, formatOptions);
-    const formatedEndDate = format(endDate, localeOptions.locale.slider.week.dateFormat.differentMonth.endDate, formatOptions);
-    const formatedTooltipEndDate = format(endDate, localeOptions.locale.slider.week.tooltipDateFormat.differentMonth.endDate, formatOptions);
+    const formatedStartDate = format(startDate, localeOptions.dateFormats.format.slider.week.dateFormat.differentMonth.firstDate, formatOptions);
+    const formatedTooltipStartDate = format(startDate, localeOptions.dateFormats.format.slider.week.tooltipDateFormat.differentMonth.firstDate, formatOptions);
+    const formatedEndDate = format(endDate, localeOptions.dateFormats.format.slider.week.dateFormat.differentMonth.endDate, formatOptions);
+    const formatedTooltipEndDate = format(endDate, localeOptions.dateFormats.format.slider.week.tooltipDateFormat.differentMonth.endDate, formatOptions);
     return {
         text: removeDots(`${formatedStartDate} — ${formatedEndDate}`),
         tooltipText: `${formatedTooltipStartDate} — ${formatedTooltipEndDate}`
     };
 };
 const getDayText = (options, localeOptions)=>{
-    if (!options.value) return localeOptions.locale.slider.day.placeholder;
-    return format(options.value, localeOptions.locale.slider.day.dateFormat, getFormatOptions(localeOptions.lang));
+    if (!options.value) return localeOptions.translates.translate.slider.day.placeholder;
+    return format(options.value, localeOptions.dateFormats.format.slider.day.dateFormat, getFormatOptions(localeOptions.lang));
 };
 const getWeekText = (options, localeOptions)=>{
     const unselectedTexts = {
-        text: localeOptions.locale.slider.week.placeholder,
-        tooltipText: localeOptions.locale.slider.week.placeholder
+        text: localeOptions.translates.translate.slider.week.placeholder,
+        tooltipText: localeOptions.translates.translate.slider.week.placeholder
     };
     if (!options.value) return unselectedTexts;
     const { startDate, endDate } = getRangeDates(options);
@@ -50,11 +50,11 @@ const getWeekText = (options, localeOptions)=>{
     }, localeOptions);
 };
 const getMonthText = (options, localeOptions)=>{
-    const unselectedText = localeOptions.locale.slider.month.placeholder;
+    const unselectedText = localeOptions.translates.translate.slider.month.placeholder;
     if (!options.value) return unselectedText;
     const { startDate, endDate } = getRangeDates(options);
     if (!startDate || !endDate) return unselectedText;
-    const text = format(startDate, localeOptions.locale.slider.month.dateFormat, getFormatOptions(localeOptions.lang));
+    const text = format(startDate, localeOptions.dateFormats.format.slider.month.dateFormat, getFormatOptions(localeOptions.lang));
     return capitalizeFirstLetter(text);
 };
 const getPeriodText = (value, localeOptions)=>{
@@ -76,16 +76,16 @@ const getPeriodText = (value, localeOptions)=>{
     return null;
 };
 const getDayPeriodName = (options, locale)=>{
-    if (options.value && isToday(options.value)) return locale.dayQuickFilters.today;
-    if (options.value && isYesterday(options.value)) return locale.dayQuickFilters.yesterday;
-    return locale.slider.day.title;
+    if (options.value && isToday(options.value)) return locale.translate.dayQuickFilters.today;
+    if (options.value && isYesterday(options.value)) return locale.translate.dayQuickFilters.yesterday;
+    return locale.translate.slider.day.title;
 };
 const getPeriodName = (value, locale)=>{
     if (isDayValue(value)) return getDayPeriodName(value, locale);
-    if (isWeekValue(value)) return locale.slider.week.title;
-    if (isMonthValue(value)) return locale.slider.month.title;
-    if (isAnyDateValue(value)) return locale.radiobuttons.anyDate;
-    if (isNoDateValue(value)) return locale.radiobuttons.noDate;
+    if (isWeekValue(value)) return locale.translate.slider.week.title;
+    if (isMonthValue(value)) return locale.translate.slider.month.title;
+    if (isAnyDateValue(value)) return locale.translate.radiobuttons.anyDate;
+    if (isNoDateValue(value)) return locale.translate.radiobuttons.noDate;
     return null;
 };
 const InputContent = (props)=>{
@@ -94,11 +94,14 @@ const InputContent = (props)=>{
         CalendarVariant.week,
         CalendarVariant.month
     ].includes(props.value.type);
-    const { lang } = useLocaleContext();
-    const locale = useLocale('DateRangeFilter');
+    const { lang, locale } = useLocaleContext();
+    const translates = useLocale('DateRangeFilter');
+    const dateFormats = useLocale('DateRangeFilter', LocaleKey.Locale);
     const periodText = getPeriodText(props.value, {
+        translates,
+        lang,
         locale,
-        lang
+        dateFormats
     });
     return /*#__PURE__*/ jsxs("div", {
         className: cn(InputContent_module.container, showArrowButtons && InputContent_module.withButtons),
@@ -124,7 +127,7 @@ const InputContent = (props)=>{
                 children: [
                     /*#__PURE__*/ jsx(Text.Body, {
                         as: TextTag.span,
-                        children: getPeriodName(props.value, locale)
+                        children: getPeriodName(props.value, translates)
                     }),
                     /*#__PURE__*/ jsx(TooltipedText, {
                         className: InputContent_module.periodValue,

package/dist/data-grid/Filters/DateRangeFilter/PeriodVariantList/index.js

@@ -53,14 +53,16 @@ const PeriodVariantList = /*#__PURE__*/ forwardRef((props, ref)=>{
                                     props.onClickYestardayButton?.();
                                 },
                                 small: true,
-                                children: locale.dayQuickFilters.yesterday
+                                children: locale.translate.dayQuickFilters.yesterday
                             }),
                             /*#__PURE__*/ jsx(Chip, {
                                 className: cn(PeriodVariantList_module.chip, props.todaySelected && PeriodVariantList_module.active),
                                 isActive: props.todaySelected ?? false,
-                                onClick: props.onClickTodayButton ?? (()=>{}),
+                                onClick: ()=>{
+                                    props.onClickTodayButton?.();
+                                },
                                 small: true,
-                                children: locale.dayQuickFilters.today
+                                children: locale.translate.dayQuickFilters.today
                             })
                         ]
                     })

package/dist/data-grid/Filters/DateRangeFilter/Year/index.js

@@ -3,12 +3,12 @@ import { format, isSameMonth, startOfDay } from "date-fns";
 import { cn } from "../../../../common/index.js";
 import { Text } from "../../../../components/Text/Text.js";
 import { useLocaleContext } from "../../../../context/contexts/index.js";
-import { useLocale } from "../../../locale/index.js";
+import { LocaleKey, useLocale } from "../../../locale/index.js";
 import { capitalizeFirstLetter, getFormatOptions, getRangeDates, isMonthValue } from "../utils.js";
 import Year_module from "./Year.module.js";
 const Year = (props)=>{
     const { lang } = useLocaleContext();
-    const locale = useLocale('DateRangeFilter');
+    const locale = useLocale('DateRangeFilter', LocaleKey.Locale);
     const year = props.year.getFullYear();
     const isSelectedMonth = (monthStartDate)=>{
         if (!isMonthValue(props.value)) return false;
@@ -37,7 +37,7 @@ const Year = (props)=>{
                         },
                         children: /*#__PURE__*/ jsx(Text.Body, {
                             className: Year_module.monthText,
-                            children: capitalizeFirstLetter(format(date, locale.monthCalendarFormat, getFormatOptions(lang)))
+                            children: capitalizeFirstLetter(format(date, locale.format.monthCalendarFormat, getFormatOptions(lang)))
                         })
                     }, +date);
                 })

package/dist/data-grid/Filters/DateRangeFilter/consts.js

@@ -9,19 +9,19 @@ const CalendarVariant = {
 const calendarVariants = [
     {
         value: CalendarVariant.period,
-        labelGetter: (locale)=>locale.radiobuttons.period
+        labelGetter: (locale)=>locale.translate.radiobuttons.period
     },
     {
         value: CalendarVariant.day,
-        labelGetter: (locale)=>locale.radiobuttons.day
+        labelGetter: (locale)=>locale.translate.radiobuttons.day
     },
     {
         value: CalendarVariant.week,
-        labelGetter: (locale)=>locale.radiobuttons.week
+        labelGetter: (locale)=>locale.translate.radiobuttons.week
     },
     {
         value: CalendarVariant.month,
-        labelGetter: (locale)=>locale.radiobuttons.month
+        labelGetter: (locale)=>locale.translate.radiobuttons.month
     }
 ];
 const getCalendarVariants = (locale)=>calendarVariants.map((variant)=>({
@@ -31,11 +31,11 @@ const getCalendarVariants = (locale)=>calendarVariants.map((variant)=>({
 const additionalCalendarVariants = [
     {
         value: CalendarVariant.anyDate,
-        labelGetter: (locale)=>locale.radiobuttons.anyDate
+        labelGetter: (locale)=>locale.translate.radiobuttons.anyDate
     },
     {
         value: CalendarVariant.noDate,
-        labelGetter: (locale)=>locale.radiobuttons.noDate
+        labelGetter: (locale)=>locale.translate.radiobuttons.noDate
     }
 ];
 const getAdditionalCalendarVariants = (locale)=>additionalCalendarVariants.map((variant)=>({

package/dist/data-grid/Filters/DateRangeFilter/hooks/useMaskInput.js

@@ -1,20 +1,20 @@
 import { useEffect, useState } from "react";
 import { format, isBefore, isEqual, isValid, parse } from "date-fns";
-import { useLocale } from "../../../locale/index.js";
+import { LocaleKey, useLocale } from "../../../locale/index.js";
 import { getEndOfDay, getPeriodValue, getRangeDates as external_utils_js_getRangeDates, getStartOfDay, isRangeValue } from "../utils.js";
 const DATES_DELIMETER = ' — ';
-const getEmptyMask = (withTime, locale)=>withTime ? locale.emptyDate.withTime : locale.emptyDate.withoutTime;
+const getEmptyMask = (withTime, locale)=>withTime ? locale.format.emptyDate.withTime : locale.format.emptyDate.withoutTime;
 const isDateValuesEqual = (value1, value2)=>{
     if (value1 && value2) return isEqual(value1, value2);
     return value1 === value2;
 };
 const useMaskInput = (args)=>{
-    const locale = useLocale('DateRangeFilter');
-    const getDateFormat = (withTime)=>withTime ? locale.dateWithTimeFormat : locale.dateFormat;
-    const inputMask = args.withTime ? `${locale.inputMask.withTime} — ${locale.inputMask.withTime}` : `${locale.inputMask.withoutTime} — ${locale.inputMask.withoutTime}`;
+    const locale = useLocale('DateRangeFilter', LocaleKey.Locale);
+    const getDateFormat = (withTime)=>withTime ? locale.format.dateWithTimeFormat : locale.format.dateFormat;
+    const inputMask = args.withTime ? `${locale.format.inputMask.withTime} — ${locale.format.inputMask.withTime}` : `${locale.format.inputMask.withoutTime} — ${locale.format.inputMask.withoutTime}`;
     const formatDate = (date, withTime)=>{
         const timeString = format(date, 'HH:mm');
-        return `${format(date, locale.dateFormat)}${withTime ? ` ${timeString}` : ''}`;
+        return `${format(date, locale.format.dateFormat)}${withTime ? ` ${timeString}` : ''}`;
     };
     const getFormatedDate = (date, withTime = false)=>date ? formatDate(date, withTime) : getEmptyMask(withTime, locale);
     const getRangeDates = (options, withTime)=>{

package/dist/data-grid/Filters/DateRangeFilter/hooks/useSideMenu.js

@@ -51,10 +51,7 @@ const useSideMenu = (args)=>{
                 });
                 break;
             default:
-                {
-                    const unknownVariant = variant;
-                    console.error(`неизвестный вариант ${unknownVariant}`);
-                }
+                throw new Error(`неизвестный вариант ${variant}`);
         }
     };
     const yesterdayButtonClickHandler = ()=>{