@gravity-ui/date-components 3.4.1 → 4.0.0

package/dist/esm/components/DateField/hooks/useDateFieldState.js

@@ -1,189 +1,157 @@
 import React from 'react';
-import { useControlledState } from '@gravity-ui/uikit';
+import { useControlledState, useLang } from '@gravity-ui/uikit';
 import { createPlaceholderValue, isInvalid } from "../../utils/dates.js";
 import { useDefaultTimeZone } from "../../utils/useDefaultTimeZone.js";
-import { addSegment, adjustDateToFormat, getEditableSections, getFormatInfo, isAllSegmentsValid, markValidSection, parseDateFromString, setSegment, useFormatSections, } from "../utils.js";
+import { IncompleteDate } from "../IncompleteDate.js";
+import { addSegment, adjustDateToFormat, getEditableSections, getFormatInfo, isEditableSectionType, parseDateFromString, setSegment, useFormatSections, } from "../utils.js";
 import { useBaseDateFieldState } from "./useBaseDateFieldState.js";
 export function useDateFieldState(props) {
-    var _a, _b;
-    const [value, setDate] = useControlledState(props.value, (_a = props.defaultValue) !== null && _a !== void 0 ? _a : null, props.onUpdate);
+    const [value, setDate] = useControlledState(props.value, props.defaultValue ?? null, props.onUpdate);
     const inputTimeZone = useDefaultTimeZone(props.value || props.defaultValue || props.placeholderValue);
     const timeZone = props.timeZone || inputTimeZone;
     const handleUpdateDate = (v) => {
         setDate(v ? v.timeZone(inputTimeZone) : v);
     };
-    const [placeholderDate, setPlaceholderDate] = React.useState(() => {
-        return createPlaceholderValue({
-            placeholderValue: props.placeholderValue,
-            timeZone,
-        });
-    });
+    const [lastPlaceholder, setLastPlaceholder] = React.useState(props.placeholderValue);
+    if ((props.placeholderValue &&
+        (!lastPlaceholder || !props.placeholderValue.isSame(lastPlaceholder))) ||
+        (!props.placeholderValue && lastPlaceholder)) {
+        setLastPlaceholder(props.placeholderValue);
+    }
+    const placeholder = React.useMemo(() => createPlaceholderValue({
+        placeholderValue: lastPlaceholder,
+        timeZone,
+    }), [lastPlaceholder, timeZone]);
     const format = props.format || 'L';
     const sections = useFormatSections(format);
     const formatInfo = React.useMemo(() => getFormatInfo(sections), [sections]);
     const allSegments = formatInfo.availableUnits;
-    const validSegmentsState = React.useState(() => value ? Object.assign({}, allSegments) : {});
-    let validSegments = validSegmentsState[0];
-    const setValidSegments = validSegmentsState[1];
-    if (value && !isAllSegmentsValid(allSegments, validSegments)) {
-        setValidSegments(Object.assign({}, allSegments));
-    }
-    if (!value &&
-        Object.keys(allSegments).length > 0 &&
-        isAllSegmentsValid(allSegments, validSegments) &&
-        Object.keys(validSegments).length === Object.keys(allSegments).length) {
-        validSegments = {};
-        setValidSegments(validSegments);
-        setPlaceholderDate(createPlaceholderValue({
-            placeholderValue: props.placeholderValue,
-            timeZone,
-        }));
+    const [displayValue, setDisplayValue] = React.useState(() => {
+        return new IncompleteDate(value && value.isValid() ? value.timeZone(timeZone) : null);
+    });
+    const [lastValue, setLastValue] = React.useState(value);
+    const [lastTimezone, setLastTimezone] = React.useState(timeZone);
+    if ((value && (!lastValue || !value.isSame(lastValue))) ||
+        (value && lastTimezone !== timeZone) ||
+        (value === null && lastValue !== null)) {
+        setLastValue(value);
+        setLastTimezone(timeZone);
+        setDisplayValue(new IncompleteDate(value?.timeZone(timeZone)));
     }
-    const displayValue = value && value.isValid() && isAllSegmentsValid(allSegments, validSegments)
-        ? value.timeZone(timeZone)
-        : placeholderDate.timeZone(timeZone);
-    const sectionsState = useSectionsState(sections, displayValue, validSegments);
-    const [selectedSections, setSelectedSections] = React.useState(-1);
-    const selectedSectionIndexes = React.useMemo(() => {
-        if (selectedSections === -1) {
-            return null;
-        }
-        if (selectedSections === 'all') {
-            return {
-                startIndex: 0,
-                endIndex: sectionsState.editableSections.length - 1,
-            };
-        }
-        if (typeof selectedSections === 'number') {
-            return { startIndex: selectedSections, endIndex: selectedSections };
-        }
-        if (typeof selectedSections === 'string') {
-            const selectedSectionIndex = sectionsState.editableSections.findIndex((section) => section.type === selectedSections);
-            return { startIndex: selectedSectionIndex, endIndex: selectedSectionIndex };
-        }
-        return selectedSections;
-    }, [selectedSections, sectionsState.editableSections]);
+    const { lang } = useLang();
+    const dateValue = React.useMemo(() => {
+        return displayValue
+            .toDateTime(value?.timeZone(timeZone) ?? placeholder, {
+            setDate: formatInfo.hasDate,
+            setTime: formatInfo.hasTime,
+        })
+            .locale(lang);
+    }, [displayValue, value, placeholder, formatInfo, timeZone, lang]);
+    const sectionsState = useSectionsState(sections, displayValue, dateValue);
     function setValue(newValue) {
         if (props.disabled || props.readOnly) {
             return;
         }
-        if (isAllSegmentsValid(allSegments, validSegments)) {
-            if (!value || !newValue.isSame(value)) {
-                handleUpdateDate(adjustDateToFormat(newValue, formatInfo));
-            }
+        if (newValue === null ||
+            (newValue instanceof IncompleteDate && newValue.isCleared(allSegments))) {
+            setDate(null);
+            setDisplayValue(new IncompleteDate());
         }
-        else {
-            if (value) {
-                handleUpdateDate(null);
+        else if (newValue instanceof IncompleteDate) {
+            if (newValue.isComplete(allSegments)) {
+                const newDate = newValue.toDateTime(dateValue, {
+                    setDate: formatInfo.hasDate,
+                    setTime: formatInfo.hasTime,
+                });
+                if (newValue.validate(newDate, allSegments)) {
+                    if (!value || !newDate.isSame(value)) {
+                        handleUpdateDate(adjustDateToFormat(newDate, formatInfo));
+                    }
+                }
             }
-            setPlaceholderDate(newValue);
+            setDisplayValue(newValue);
+        }
+        else if (!value || !newValue.isSame(value)) {
+            handleUpdateDate(newValue);
         }
-    }
-    function markValid(part) {
-        validSegments = markValidSection(allSegments, validSegments, part);
-        setValidSegments(Object.assign({}, validSegments));
     }
     function setSection(sectionIndex, amount) {
         const section = sectionsState.editableSections[sectionIndex];
         if (section) {
-            markValid(section.type);
-            setValue(setSegment(section, displayValue, amount));
+            setValue(setSegment(section, displayValue, amount, dateValue));
         }
     }
     function adjustSection(sectionIndex, amount) {
         const section = sectionsState.editableSections[sectionIndex];
         if (section) {
-            if (validSegments[section.type]) {
-                setValue(addSegment(section, displayValue, amount));
-            }
-            else {
-                markValid(section.type);
-                if (Object.keys(validSegments).length >= Object.keys(allSegments).length) {
-                    setValue(displayValue);
-                }
-            }
+            setValue(addSegment(section, displayValue, amount, dateValue));
         }
     }
-    function flushValidSection(sectionIndex) {
+    function clearSection(sectionIndex) {
         const section = sectionsState.editableSections[sectionIndex];
-        if (section) {
-            delete validSegments[section.type];
+        if (section && isEditableSectionType(section.type)) {
+            setValue(displayValue.clear(section.type));
         }
-        setValidSegments(Object.assign({}, validSegments));
-    }
-    function flushAllValidSections() {
-        validSegments = {};
-        setValidSegments({});
-    }
-    function getSectionValue(_sectionIndex) {
-        return displayValue;
-    }
-    function setSectionValue(_sectionIndex, currentValue) {
-        setValue(currentValue);
-    }
-    function createPlaceholder() {
-        return createPlaceholderValue({
-            placeholderValue: props.placeholderValue,
-            timeZone,
-        }).timeZone(timeZone);
     }
     function setValueFromString(str) {
-        var _a;
-        const parseDate = (_a = props.parseDateFromString) !== null && _a !== void 0 ? _a : parseDateFromString;
+        const parseDate = props.parseDateFromString ?? parseDateFromString;
         const date = parseDate(str, format, timeZone);
         if (date.isValid()) {
-            handleUpdateDate(date);
+            setValue(date);
             return true;
         }
         return false;
     }
+    function confirmPlaceholder() {
+        if (props.disabled || props.readOnly) {
+            return;
+        }
+        // If the display value is complete but invalid, we need to constrain it and emit onChange on blur.
+        if (displayValue.isComplete(allSegments)) {
+            const newValue = displayValue.toDateTime(dateValue, {
+                setDate: formatInfo.hasDate,
+                setTime: formatInfo.hasTime,
+            });
+            setValue(adjustDateToFormat(newValue, formatInfo, 'startOf'));
+        }
+    }
     const validationState = props.validationState ||
         (isInvalid(value, props.minValue, props.maxValue) ? 'invalid' : undefined) ||
-        (value && ((_b = props.isDateUnavailable) === null || _b === void 0 ? void 0 : _b.call(props, value)) ? 'invalid' : undefined);
+        (value && props.isDateUnavailable?.(value) ? 'invalid' : undefined);
     return useBaseDateFieldState({
         value,
-        displayValue,
-        placeholderValue: props.placeholderValue,
-        timeZone,
+        displayValue: dateValue,
         validationState,
         editableSections: sectionsState.editableSections,
         formatInfo,
         readOnly: props.readOnly,
         disabled: props.disabled,
-        selectedSectionIndexes,
-        selectedSections,
-        isEmpty: Object.keys(validSegments).length === 0,
-        flushAllValidSections,
-        flushValidSection,
-        setSelectedSections,
+        isEmpty: displayValue.isCleared(allSegments),
         setValue,
-        setDate: handleUpdateDate,
         adjustSection,
         setSection,
-        getSectionValue,
-        setSectionValue,
-        createPlaceholder,
+        clearSection,
         setValueFromString,
+        confirmPlaceholder,
     });
 }
-function useSectionsState(sections, value, validSegments) {
+function useSectionsState(sections, value, placeholder) {
     const [state, setState] = React.useState(() => {
+        const editableSections = getEditableSections(sections, value, placeholder);
         return {
             value,
             sections,
-            validSegments,
-            editableSections: getEditableSections(sections, value, validSegments),
+            placeholder,
+            editableSections,
         };
     });
-    if (sections !== state.sections ||
-        validSegments !== state.validSegments ||
-        !value.isSame(state.value) ||
-        value.timeZone() !== state.value.timeZone()) {
+    if (sections !== state.sections || placeholder !== state.placeholder || value !== state.value) {
+        const editableSections = getEditableSections(sections, value, placeholder);
         setState({
             value,
             sections,
-            validSegments,
-            editableSections: getEditableSections(sections, value, validSegments),
+            placeholder,
+            editableSections,
         });
     }
     return state;

package/dist/esm/components/DateField/hooks/useDateFieldState.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDateFieldState.js","sourceRoot":"../../../../../src","sources":["components/DateField/hooks/useDateFieldState.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport type {DateTime} from '@gravity-ui/date-utils';\nimport {useControlledState} from '@gravity-ui/uikit';\n\nimport type {DateFieldBase} from '../../types/datePicker';\nimport {createPlaceholderValue, isInvalid} from '../../utils/dates';\nimport {useDefaultTimeZone} from '../../utils/useDefaultTimeZone';\nimport type {\n    AvailableSections,\n    DateFieldSectionType,\n    DateFieldSectionWithoutPosition,\n} from '../types';\nimport {\n    addSegment,\n    adjustDateToFormat,\n    getEditableSections,\n    getFormatInfo,\n    isAllSegmentsValid,\n    markValidSection,\n    parseDateFromString,\n    setSegment,\n    useFormatSections,\n} from '../utils';\n\nimport {useBaseDateFieldState} from './useBaseDateFieldState';\nimport type {DateFieldState} from './useBaseDateFieldState';\n\nexport interface DateFieldStateOptions extends DateFieldBase {}\n\nexport function useDateFieldState(props: DateFieldStateOptions): DateFieldState {\n    const [value, setDate] = useControlledState(\n        props.value,\n        props.defaultValue ?? null,\n        props.onUpdate,\n    );\n\n    const inputTimeZone = useDefaultTimeZone(\n        props.value || props.defaultValue || props.placeholderValue,\n    );\n    const timeZone = props.timeZone || inputTimeZone;\n\n    const handleUpdateDate = (v: DateTime | null) => {\n        setDate(v ? v.timeZone(inputTimeZone) : v);\n    };\n\n    const [placeholderDate, setPlaceholderDate] = React.useState(() => {\n        return createPlaceholderValue({\n            placeholderValue: props.placeholderValue,\n            timeZone,\n        });\n    });\n\n    const format = props.format || 'L';\n    const sections = useFormatSections(format);\n    const formatInfo = React.useMemo(() => getFormatInfo(sections), [sections]);\n    const allSegments = formatInfo.availableUnits;\n\n    const validSegmentsState = React.useState<AvailableSections>(() =>\n        value ? {...allSegments} : {},\n    );\n\n    let validSegments = validSegmentsState[0];\n    const setValidSegments = validSegmentsState[1];\n\n    if (value && !isAllSegmentsValid(allSegments, validSegments)) {\n        setValidSegments({...allSegments});\n    }\n\n    if (\n        !value &&\n        Object.keys(allSegments).length > 0 &&\n        isAllSegmentsValid(allSegments, validSegments) &&\n        Object.keys(validSegments).length === Object.keys(allSegments).length\n    ) {\n        validSegments = {};\n        setValidSegments(validSegments);\n        setPlaceholderDate(\n            createPlaceholderValue({\n                placeholderValue: props.placeholderValue,\n                timeZone,\n            }),\n        );\n    }\n\n    const displayValue =\n        value && value.isValid() && isAllSegmentsValid(allSegments, validSegments)\n            ? value.timeZone(timeZone)\n            : placeholderDate.timeZone(timeZone);\n    const sectionsState = useSectionsState(sections, displayValue, validSegments);\n\n    const [selectedSections, setSelectedSections] = React.useState<number | 'all'>(-1);\n\n    const selectedSectionIndexes = React.useMemo<{\n        startIndex: number;\n        endIndex: number;\n    } | null>(() => {\n        if (selectedSections === -1) {\n            return null;\n        }\n\n        if (selectedSections === 'all') {\n            return {\n                startIndex: 0,\n                endIndex: sectionsState.editableSections.length - 1,\n            };\n        }\n\n        if (typeof selectedSections === 'number') {\n            return {startIndex: selectedSections, endIndex: selectedSections};\n        }\n\n        if (typeof selectedSections === 'string') {\n            const selectedSectionIndex = sectionsState.editableSections.findIndex(\n                (section) => section.type === selectedSections,\n            );\n\n            return {startIndex: selectedSectionIndex, endIndex: selectedSectionIndex};\n        }\n\n        return selectedSections;\n    }, [selectedSections, sectionsState.editableSections]);\n\n    function setValue(newValue: DateTime) {\n        if (props.disabled || props.readOnly) {\n            return;\n        }\n\n        if (isAllSegmentsValid(allSegments, validSegments)) {\n            if (!value || !newValue.isSame(value)) {\n                handleUpdateDate(adjustDateToFormat(newValue, formatInfo));\n            }\n        } else {\n            if (value) {\n                handleUpdateDate(null);\n            }\n            setPlaceholderDate(newValue);\n        }\n    }\n\n    function markValid(part: DateFieldSectionType) {\n        validSegments = markValidSection(allSegments, validSegments, part);\n        setValidSegments({...validSegments});\n    }\n\n    function setSection(sectionIndex: number, amount: number) {\n        const section = sectionsState.editableSections[sectionIndex];\n        if (section) {\n            markValid(section.type);\n            setValue(setSegment(section, displayValue, amount));\n        }\n    }\n\n    function adjustSection(sectionIndex: number, amount: number) {\n        const section = sectionsState.editableSections[sectionIndex];\n        if (section) {\n            if (validSegments[section.type]) {\n                setValue(addSegment(section, displayValue, amount));\n            } else {\n                markValid(section.type);\n                if (Object.keys(validSegments).length >= Object.keys(allSegments).length) {\n                    setValue(displayValue);\n                }\n            }\n        }\n    }\n\n    function flushValidSection(sectionIndex: number) {\n        const section = sectionsState.editableSections[sectionIndex];\n        if (section) {\n            delete validSegments[section.type];\n        }\n        setValidSegments({...validSegments});\n    }\n\n    function flushAllValidSections() {\n        validSegments = {};\n        setValidSegments({});\n    }\n\n    function getSectionValue(_sectionIndex: number) {\n        return displayValue;\n    }\n\n    function setSectionValue(_sectionIndex: number, currentValue: DateTime) {\n        setValue(currentValue);\n    }\n\n    function createPlaceholder() {\n        return createPlaceholderValue({\n            placeholderValue: props.placeholderValue,\n            timeZone,\n        }).timeZone(timeZone);\n    }\n\n    function setValueFromString(str: string) {\n        const parseDate = props.parseDateFromString ?? parseDateFromString;\n        const date = parseDate(str, format, timeZone);\n        if (date.isValid()) {\n            handleUpdateDate(date);\n            return true;\n        }\n        return false;\n    }\n\n    const validationState =\n        props.validationState ||\n        (isInvalid(value, props.minValue, props.maxValue) ? 'invalid' : undefined) ||\n        (value && props.isDateUnavailable?.(value) ? 'invalid' : undefined);\n\n    return useBaseDateFieldState({\n        value,\n        displayValue,\n        placeholderValue: props.placeholderValue,\n        timeZone,\n        validationState,\n        editableSections: sectionsState.editableSections,\n        formatInfo,\n        readOnly: props.readOnly,\n        disabled: props.disabled,\n        selectedSectionIndexes,\n        selectedSections,\n        isEmpty: Object.keys(validSegments).length === 0,\n        flushAllValidSections,\n        flushValidSection,\n        setSelectedSections,\n        setValue,\n        setDate: handleUpdateDate,\n        adjustSection,\n        setSection,\n        getSectionValue,\n        setSectionValue,\n        createPlaceholder,\n        setValueFromString,\n    });\n}\n\nfunction useSectionsState(\n    sections: DateFieldSectionWithoutPosition[],\n    value: DateTime,\n    validSegments: AvailableSections,\n) {\n    const [state, setState] = React.useState(() => {\n        return {\n            value,\n            sections,\n            validSegments,\n            editableSections: getEditableSections(sections, value, validSegments),\n        };\n    });\n\n    if (\n        sections !== state.sections ||\n        validSegments !== state.validSegments ||\n        !value.isSame(state.value) ||\n        value.timeZone() !== state.value.timeZone()\n    ) {\n        setState({\n            value,\n            sections,\n            validSegments,\n            editableSections: getEditableSections(sections, value, validSegments),\n        });\n    }\n\n    return state;\n}\n"]}
+{"version":3,"file":"useDateFieldState.js","sourceRoot":"../../../../../src","sources":["components/DateField/hooks/useDateFieldState.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport type {DateTime} from '@gravity-ui/date-utils';\nimport {useControlledState, useLang} from '@gravity-ui/uikit';\n\nimport type {InputBase, Validation, ValueBase} from '../../types';\nimport {createPlaceholderValue, isInvalid} from '../../utils/dates';\nimport {useDefaultTimeZone} from '../../utils/useDefaultTimeZone';\nimport {IncompleteDate} from '../IncompleteDate';\nimport type {FormatSection} from '../types';\nimport {\n    addSegment,\n    adjustDateToFormat,\n    getEditableSections,\n    getFormatInfo,\n    isEditableSectionType,\n    parseDateFromString,\n    setSegment,\n    useFormatSections,\n} from '../utils';\n\nimport {useBaseDateFieldState} from './useBaseDateFieldState';\nimport type {DateFieldState} from './useBaseDateFieldState';\n\nexport interface DateFieldStateOptions extends ValueBase<DateTime | null>, InputBase, Validation {\n    /** The minimum allowed date that a user may select. */\n    minValue?: DateTime;\n    /** The maximum allowed date that a user may select. */\n    maxValue?: DateTime;\n    /** Callback that is called for each date of the calendar. If it returns true, then the date is unavailable. */\n    isDateUnavailable?: (date: DateTime) => boolean;\n    /** Format of the date when rendered in the input. [Available formats](https://day.js.org/docs/en/display/format) */\n    format?: string;\n    /** A placeholder date that controls the default values of each segment when the user first interacts with them. Defaults to today's date at midnight. */\n    placeholderValue?: DateTime;\n    /**\n     * Which timezone use to show values. Example: 'default', 'system', 'Europe/Amsterdam'.\n     * @default The timezone of the `value` or `defaultValue` or `placeholderValue`, 'default' otherwise.\n     */\n    timeZone?: string;\n    /** Custom parser function for parsing pasted date strings. If not provided, the default parser will be used. */\n    parseDateFromString?: (dateStr: string, format: string, timeZone?: string) => DateTime;\n}\n\nexport function useDateFieldState(props: DateFieldStateOptions): DateFieldState {\n    const [value, setDate] = useControlledState(\n        props.value,\n        props.defaultValue ?? null,\n        props.onUpdate,\n    );\n\n    const inputTimeZone = useDefaultTimeZone(\n        props.value || props.defaultValue || props.placeholderValue,\n    );\n    const timeZone = props.timeZone || inputTimeZone;\n\n    const handleUpdateDate = (v: DateTime | null) => {\n        setDate(v ? v.timeZone(inputTimeZone) : v);\n    };\n\n    const [lastPlaceholder, setLastPlaceholder] = React.useState(props.placeholderValue);\n    if (\n        (props.placeholderValue &&\n            (!lastPlaceholder || !props.placeholderValue.isSame(lastPlaceholder))) ||\n        (!props.placeholderValue && lastPlaceholder)\n    ) {\n        setLastPlaceholder(props.placeholderValue);\n    }\n    const placeholder = React.useMemo(\n        () =>\n            createPlaceholderValue({\n                placeholderValue: lastPlaceholder,\n                timeZone,\n            }),\n        [lastPlaceholder, timeZone],\n    );\n\n    const format = props.format || 'L';\n    const sections = useFormatSections(format);\n    const formatInfo = React.useMemo(() => getFormatInfo(sections), [sections]);\n    const allSegments = formatInfo.availableUnits;\n\n    const [displayValue, setDisplayValue] = React.useState(() => {\n        return new IncompleteDate(value && value.isValid() ? value.timeZone(timeZone) : null);\n    });\n\n    const [lastValue, setLastValue] = React.useState(value);\n    const [lastTimezone, setLastTimezone] = React.useState(timeZone);\n    if (\n        (value && (!lastValue || !value.isSame(lastValue))) ||\n        (value && lastTimezone !== timeZone) ||\n        (value === null && lastValue !== null)\n    ) {\n        setLastValue(value);\n        setLastTimezone(timeZone);\n        setDisplayValue(new IncompleteDate(value?.timeZone(timeZone)));\n    }\n\n    const {lang} = useLang();\n    const dateValue = React.useMemo(() => {\n        return displayValue\n            .toDateTime(value?.timeZone(timeZone) ?? placeholder, {\n                setDate: formatInfo.hasDate,\n                setTime: formatInfo.hasTime,\n            })\n            .locale(lang);\n    }, [displayValue, value, placeholder, formatInfo, timeZone, lang]);\n\n    const sectionsState = useSectionsState(sections, displayValue, dateValue);\n\n    function setValue(newValue: DateTime | IncompleteDate | null) {\n        if (props.disabled || props.readOnly) {\n            return;\n        }\n\n        if (\n            newValue === null ||\n            (newValue instanceof IncompleteDate && newValue.isCleared(allSegments))\n        ) {\n            setDate(null);\n            setDisplayValue(new IncompleteDate());\n        } else if (newValue instanceof IncompleteDate) {\n            if (newValue.isComplete(allSegments)) {\n                const newDate = newValue.toDateTime(dateValue, {\n                    setDate: formatInfo.hasDate,\n                    setTime: formatInfo.hasTime,\n                });\n                if (newValue.validate(newDate, allSegments)) {\n                    if (!value || !newDate.isSame(value)) {\n                        handleUpdateDate(adjustDateToFormat(newDate, formatInfo));\n                    }\n                }\n            }\n            setDisplayValue(newValue);\n        } else if (!value || !newValue.isSame(value)) {\n            handleUpdateDate(newValue);\n        }\n    }\n\n    function setSection(sectionIndex: number, amount: number) {\n        const section = sectionsState.editableSections[sectionIndex];\n        if (section) {\n            setValue(setSegment(section, displayValue, amount, dateValue));\n        }\n    }\n\n    function adjustSection(sectionIndex: number, amount: number) {\n        const section = sectionsState.editableSections[sectionIndex];\n        if (section) {\n            setValue(addSegment(section, displayValue, amount, dateValue));\n        }\n    }\n\n    function clearSection(sectionIndex: number) {\n        const section = sectionsState.editableSections[sectionIndex];\n        if (section && isEditableSectionType(section.type)) {\n            setValue(displayValue.clear(section.type));\n        }\n    }\n\n    function setValueFromString(str: string) {\n        const parseDate = props.parseDateFromString ?? parseDateFromString;\n        const date = parseDate(str, format, timeZone);\n        if (date.isValid()) {\n            setValue(date);\n            return true;\n        }\n        return false;\n    }\n\n    function confirmPlaceholder() {\n        if (props.disabled || props.readOnly) {\n            return;\n        }\n\n        // If the display value is complete but invalid, we need to constrain it and emit onChange on blur.\n        if (displayValue.isComplete(allSegments)) {\n            const newValue = displayValue.toDateTime(dateValue, {\n                setDate: formatInfo.hasDate,\n                setTime: formatInfo.hasTime,\n            });\n            setValue(adjustDateToFormat(newValue, formatInfo, 'startOf'));\n        }\n    }\n\n    const validationState =\n        props.validationState ||\n        (isInvalid(value, props.minValue, props.maxValue) ? 'invalid' : undefined) ||\n        (value && props.isDateUnavailable?.(value) ? 'invalid' : undefined);\n\n    return useBaseDateFieldState({\n        value,\n        displayValue: dateValue,\n        validationState,\n        editableSections: sectionsState.editableSections,\n        formatInfo,\n        readOnly: props.readOnly,\n        disabled: props.disabled,\n        isEmpty: displayValue.isCleared(allSegments),\n        setValue,\n        adjustSection,\n        setSection,\n        clearSection,\n        setValueFromString,\n        confirmPlaceholder,\n    });\n}\n\nfunction useSectionsState(sections: FormatSection[], value: IncompleteDate, placeholder: DateTime) {\n    const [state, setState] = React.useState(() => {\n        const editableSections = getEditableSections(sections, value, placeholder);\n        return {\n            value,\n            sections,\n            placeholder,\n            editableSections,\n        };\n    });\n\n    if (sections !== state.sections || placeholder !== state.placeholder || value !== state.value) {\n        const editableSections = getEditableSections(sections, value, placeholder);\n        setState({\n            value,\n            sections,\n            placeholder,\n            editableSections,\n        });\n    }\n\n    return state;\n}\n"]}

package/dist/esm/components/DateField/hooks/useFocusManager.d.ts

@@ -0,0 +1,29 @@
+import type { DateFieldSection } from "../types.js";
+interface FocusManagerOptions {
+    sections: DateFieldSection[];
+}
+interface FocusManager {
+    /** Active section index */
+    activeSectionIndex: number;
+    /** Selected sections */
+    selectedSectionIndexes: {
+        startIndex: number;
+        endIndex: number;
+    } | null;
+    /** Return true if it is the first section */
+    isFistSection: (position: number) => boolean;
+    /** Return true if it is the last section */
+    isLastSection: (position: number) => boolean;
+    /** Focus section in position or all sections. */
+    focusSection: (position: number | 'all') => void;
+    /** Focuses the next section if present */
+    focusNextSection: () => void;
+    /** Focuses the previous section if present */
+    focusPreviousSection: () => void;
+    /** Focuses the first section */
+    focusFirstSection: () => void;
+    /** Focuses the last section */
+    focusLastSection: () => void;
+}
+export declare function useFocusManager({ sections }: FocusManagerOptions): FocusManager;
+export {};

package/dist/esm/components/DateField/hooks/useFocusManager.js

@@ -0,0 +1,112 @@
+import React from 'react';
+import { isEditableSectionType } from "../utils.js";
+export function useFocusManager({ sections }) {
+    const [selectedSections, setSelectedSections] = React.useState(-1);
+    const connections = React.useMemo(() => connectEditableSections(sections), [sections]);
+    const selectedSectionIndexes = React.useMemo(() => {
+        if (selectedSections === -1) {
+            return null;
+        }
+        if (selectedSections === 'all') {
+            return {
+                startIndex: 0,
+                endIndex: connections.length - 1,
+            };
+        }
+        if (typeof selectedSections === 'number') {
+            return { startIndex: selectedSections, endIndex: selectedSections };
+        }
+        return selectedSections;
+    }, [selectedSections, connections]);
+    const activeSectionIndex = getCurrentEditableSectionIndex(connections, selectedSections);
+    return {
+        activeSectionIndex,
+        selectedSectionIndexes,
+        isFistSection(position) {
+            const p = connections[position];
+            if (!p) {
+                return false;
+            }
+            return position === p.previousEditableSection;
+        },
+        isLastSection(position) {
+            const p = connections[position];
+            if (!p) {
+                return false;
+            }
+            return position === p.nextEditableSection;
+        },
+        focusSection(index) {
+            if (index === 'all' || index === -1) {
+                setSelectedSections(index);
+            }
+            else {
+                setSelectedSections(getCurrentEditableSectionIndex(connections, index));
+            }
+        },
+        focusNextSection() {
+            const currentIndex = selectedSections === 'all' ? 0 : selectedSections;
+            const newIndex = connections[currentIndex]?.nextEditableSection ?? -1;
+            if (newIndex !== -1) {
+                setSelectedSections(newIndex);
+            }
+        },
+        focusPreviousSection() {
+            const currentIndex = selectedSections === 'all' ? 0 : selectedSections;
+            const newIndex = connections[currentIndex]?.previousEditableSection ?? -1;
+            if (newIndex !== -1) {
+                setSelectedSections(newIndex);
+            }
+        },
+        focusFirstSection() {
+            const newIndex = connections[0]?.previousEditableSection ?? -1;
+            if (newIndex !== -1) {
+                setSelectedSections(newIndex);
+            }
+        },
+        focusLastSection() {
+            const newIndex = connections[sections.length - 1]?.nextEditableSection ?? -1;
+            if (newIndex !== -1) {
+                setSelectedSections(newIndex);
+            }
+        },
+    };
+}
+function connectEditableSections(sections) {
+    let previousEditableSection = -1;
+    const connections = new Array(sections.length);
+    for (let i = 0; i < sections.length; i++) {
+        const section = sections[i];
+        if (!section) {
+            throw new Error('section must be defined');
+        }
+        const connection = {
+            type: section.type,
+            previousEditableSection,
+            nextEditableSection: previousEditableSection,
+        };
+        connections[i] = connection;
+        if (isEditableSectionType(connection.type)) {
+            for (let j = Math.max(0, previousEditableSection); j <= i; j++) {
+                const prevSection = connections[j];
+                if (prevSection) {
+                    prevSection.nextEditableSection = i;
+                    if (prevSection.previousEditableSection === -1) {
+                        prevSection.previousEditableSection = i;
+                    }
+                }
+            }
+            previousEditableSection = i;
+        }
+    }
+    return connections;
+}
+function getCurrentEditableSectionIndex(sections, selectedSections) {
+    const currentIndex = selectedSections === 'all' || selectedSections === -1 ? 0 : selectedSections;
+    const section = sections[currentIndex];
+    if (section && !isEditableSectionType(section.type)) {
+        return section.nextEditableSection;
+    }
+    return isEditableSectionType(section?.type) ? currentIndex : -1;
+}
+//# sourceMappingURL=useFocusManager.js.map

package/dist/esm/components/DateField/hooks/useFocusManager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocusManager.js","sourceRoot":"../../../../../src","sources":["components/DateField/hooks/useFocusManager.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAC,qBAAqB,EAAC,oBAAiB;AA2B/C,MAAM,UAAU,eAAe,CAAC,EAAC,QAAQ,EAAsB;IAC3D,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAiB,CAAC,CAAC,CAAC,CAAC;IAEnF,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,uBAAuB,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEvF,MAAM,sBAAsB,GAAG,KAAK,CAAC,OAAO,CAGlC,GAAG,EAAE;QACX,IAAI,gBAAgB,KAAK,CAAC,CAAC,EAAE,CAAC;YAC1B,OAAO,IAAI,CAAC;QAChB,CAAC;QAED,IAAI,gBAAgB,KAAK,KAAK,EAAE,CAAC;YAC7B,OAAO;gBACH,UAAU,EAAE,CAAC;gBACb,QAAQ,EAAE,WAAW,CAAC,MAAM,GAAG,CAAC;aACnC,CAAC;QACN,CAAC;QAED,IAAI,OAAO,gBAAgB,KAAK,QAAQ,EAAE,CAAC;YACvC,OAAO,EAAC,UAAU,EAAE,gBAAgB,EAAE,QAAQ,EAAE,gBAAgB,EAAC,CAAC;QACtE,CAAC;QAED,OAAO,gBAAgB,CAAC;IAC5B,CAAC,EAAE,CAAC,gBAAgB,EAAE,WAAW,CAAC,CAAC,CAAC;IAEpC,MAAM,kBAAkB,GAAG,8BAA8B,CAAC,WAAW,EAAE,gBAAgB,CAAC,CAAC;IAEzF,OAAO;QACH,kBAAkB;QAClB,sBAAsB;QACtB,aAAa,CAAC,QAAQ;YAClB,MAAM,CAAC,GAAG,WAAW,CAAC,QAAQ,CAAC,CAAC;YAChC,IAAI,CAAC,CAAC,EAAE,CAAC;gBACL,OAAO,KAAK,CAAC;YACjB,CAAC;YACD,OAAO,QAAQ,KAAK,CAAC,CAAC,uBAAuB,CAAC;QAClD,CAAC;QACD,aAAa,CAAC,QAAQ;YAClB,MAAM,CAAC,GAAG,WAAW,CAAC,QAAQ,CAAC,CAAC;YAChC,IAAI,CAAC,CAAC,EAAE,CAAC;gBACL,OAAO,KAAK,CAAC;YACjB,CAAC;YACD,OAAO,QAAQ,KAAK,CAAC,CAAC,mBAAmB,CAAC;QAC9C,CAAC;QACD,YAAY,CAAC,KAAqB;YAC9B,IAAI,KAAK,KAAK,KAAK,IAAI,KAAK,KAAK,CAAC,CAAC,EAAE,CAAC;gBAClC,mBAAmB,CAAC,KAAK,CAAC,CAAC;YAC/B,CAAC;iBAAM,CAAC;gBACJ,mBAAmB,CAAC,8BAA8B,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC;YAC5E,CAAC;QACL,CAAC;QACD,gBAAgB;YACZ,MAAM,YAAY,GAAG,gBAAgB,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC;YACvE,MAAM,QAAQ,GAAG,WAAW,CAAC,YAAY,CAAC,EAAE,mBAAmB,IAAI,CAAC,CAAC,CAAC;YACtE,IAAI,QAAQ,KAAK,CAAC,CAAC,EAAE,CAAC;gBAClB,mBAAmB,CAAC,QAAQ,CAAC,CAAC;YAClC,CAAC;QACL,CAAC;QACD,oBAAoB;YAChB,MAAM,YAAY,GAAG,gBAAgB,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC;YACvE,MAAM,QAAQ,GAAG,WAAW,CAAC,YAAY,CAAC,EAAE,uBAAuB,IAAI,CAAC,CAAC,CAAC;YAC1E,IAAI,QAAQ,KAAK,CAAC,CAAC,EAAE,CAAC;gBAClB,mBAAmB,CAAC,QAAQ,CAAC,CAAC;YAClC,CAAC;QACL,CAAC;QACD,iBAAiB;YACb,MAAM,QAAQ,GAAG,WAAW,CAAC,CAAC,CAAC,EAAE,uBAAuB,IAAI,CAAC,CAAC,CAAC;YAC/D,IAAI,QAAQ,KAAK,CAAC,CAAC,EAAE,CAAC;gBAClB,mBAAmB,CAAC,QAAQ,CAAC,CAAC;YAClC,CAAC;QACL,CAAC;QACD,gBAAgB;YACZ,MAAM,QAAQ,GAAG,WAAW,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,mBAAmB,IAAI,CAAC,CAAC,CAAC;YAC7E,IAAI,QAAQ,KAAK,CAAC,CAAC,EAAE,CAAC;gBAClB,mBAAmB,CAAC,QAAQ,CAAC,CAAC;YAClC,CAAC;QACL,CAAC;KACJ,CAAC;AACN,CAAC;AAQD,SAAS,uBAAuB,CAAC,QAA4B;IACzD,IAAI,uBAAuB,GAAG,CAAC,CAAC,CAAC;IACjC,MAAM,WAAW,GAAiB,IAAI,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;IAC7D,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACvC,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;QAC5B,IAAI,CAAC,OAAO,EAAE,CAAC;YACX,MAAM,IAAI,KAAK,CAAC,yBAAyB,CAAC,CAAC;QAC/C,CAAC;QAED,MAAM,UAAU,GAAG;YACf,IAAI,EAAE,OAAO,CAAC,IAAI;YAClB,uBAAuB;YACvB,mBAAmB,EAAE,uBAAuB;SAC/C,CAAC;QACF,WAAW,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC;QAE5B,IAAI,qBAAqB,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YACzC,KAAK,IAAI,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,uBAAuB,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;gBAC7D,MAAM,WAAW,GAAG,WAAW,CAAC,CAAC,CAAC,CAAC;gBACnC,IAAI,WAAW,EAAE,CAAC;oBACd,WAAW,CAAC,mBAAmB,GAAG,CAAC,CAAC;oBACpC,IAAI,WAAW,CAAC,uBAAuB,KAAK,CAAC,CAAC,EAAE,CAAC;wBAC7C,WAAW,CAAC,uBAAuB,GAAG,CAAC,CAAC;oBAC5C,CAAC;gBACL,CAAC;YACL,CAAC;YACD,uBAAuB,GAAG,CAAC,CAAC;QAChC,CAAC;IACL,CAAC;IAED,OAAO,WAAW,CAAC;AACvB,CAAC;AAED,SAAS,8BAA8B,CAAC,QAAsB,EAAE,gBAAgC;IAC5F,MAAM,YAAY,GACd,gBAAgB,KAAK,KAAK,IAAI,gBAAgB,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC;IACjF,MAAM,OAAO,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;IACvC,IAAI,OAAO,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC;QAClD,OAAO,OAAO,CAAC,mBAAmB,CAAC;IACvC,CAAC;IACD,OAAO,qBAAqB,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACpE,CAAC","sourcesContent":["import React from 'react';\n\nimport type {DateFieldSection, DateFieldSectionType} from '../types';\nimport {isEditableSectionType} from '../utils';\n\ninterface FocusManagerOptions {\n    sections: DateFieldSection[];\n}\n\ninterface FocusManager {\n    /** Active section index */\n    activeSectionIndex: number;\n    /** Selected sections */\n    selectedSectionIndexes: {startIndex: number; endIndex: number} | null;\n    /** Return true if it is the first section */\n    isFistSection: (position: number) => boolean;\n    /** Return true if it is the last section */\n    isLastSection: (position: number) => boolean;\n    /** Focus section in position or all sections. */\n    focusSection: (position: number | 'all') => void;\n    /** Focuses the next section if present */\n    focusNextSection: () => void;\n    /** Focuses the previous section if present */\n    focusPreviousSection: () => void;\n    /** Focuses the first section */\n    focusFirstSection: () => void;\n    /** Focuses the last section */\n    focusLastSection: () => void;\n}\n\nexport function useFocusManager({sections}: FocusManagerOptions): FocusManager {\n    const [selectedSections, setSelectedSections] = React.useState<number | 'all'>(-1);\n\n    const connections = React.useMemo(() => connectEditableSections(sections), [sections]);\n\n    const selectedSectionIndexes = React.useMemo<{\n        startIndex: number;\n        endIndex: number;\n    } | null>(() => {\n        if (selectedSections === -1) {\n            return null;\n        }\n\n        if (selectedSections === 'all') {\n            return {\n                startIndex: 0,\n                endIndex: connections.length - 1,\n            };\n        }\n\n        if (typeof selectedSections === 'number') {\n            return {startIndex: selectedSections, endIndex: selectedSections};\n        }\n\n        return selectedSections;\n    }, [selectedSections, connections]);\n\n    const activeSectionIndex = getCurrentEditableSectionIndex(connections, selectedSections);\n\n    return {\n        activeSectionIndex,\n        selectedSectionIndexes,\n        isFistSection(position) {\n            const p = connections[position];\n            if (!p) {\n                return false;\n            }\n            return position === p.previousEditableSection;\n        },\n        isLastSection(position) {\n            const p = connections[position];\n            if (!p) {\n                return false;\n            }\n            return position === p.nextEditableSection;\n        },\n        focusSection(index: number | 'all') {\n            if (index === 'all' || index === -1) {\n                setSelectedSections(index);\n            } else {\n                setSelectedSections(getCurrentEditableSectionIndex(connections, index));\n            }\n        },\n        focusNextSection() {\n            const currentIndex = selectedSections === 'all' ? 0 : selectedSections;\n            const newIndex = connections[currentIndex]?.nextEditableSection ?? -1;\n            if (newIndex !== -1) {\n                setSelectedSections(newIndex);\n            }\n        },\n        focusPreviousSection() {\n            const currentIndex = selectedSections === 'all' ? 0 : selectedSections;\n            const newIndex = connections[currentIndex]?.previousEditableSection ?? -1;\n            if (newIndex !== -1) {\n                setSelectedSections(newIndex);\n            }\n        },\n        focusFirstSection() {\n            const newIndex = connections[0]?.previousEditableSection ?? -1;\n            if (newIndex !== -1) {\n                setSelectedSections(newIndex);\n            }\n        },\n        focusLastSection() {\n            const newIndex = connections[sections.length - 1]?.nextEditableSection ?? -1;\n            if (newIndex !== -1) {\n                setSelectedSections(newIndex);\n            }\n        },\n    };\n}\n\ninterface Connection {\n    type: DateFieldSectionType;\n    previousEditableSection: number;\n    nextEditableSection: number;\n}\n\nfunction connectEditableSections(sections: DateFieldSection[]) {\n    let previousEditableSection = -1;\n    const connections: Connection[] = new Array(sections.length);\n    for (let i = 0; i < sections.length; i++) {\n        const section = sections[i];\n        if (!section) {\n            throw new Error('section must be defined');\n        }\n\n        const connection = {\n            type: section.type,\n            previousEditableSection,\n            nextEditableSection: previousEditableSection,\n        };\n        connections[i] = connection;\n\n        if (isEditableSectionType(connection.type)) {\n            for (let j = Math.max(0, previousEditableSection); j <= i; j++) {\n                const prevSection = connections[j];\n                if (prevSection) {\n                    prevSection.nextEditableSection = i;\n                    if (prevSection.previousEditableSection === -1) {\n                        prevSection.previousEditableSection = i;\n                    }\n                }\n            }\n            previousEditableSection = i;\n        }\n    }\n\n    return connections;\n}\n\nfunction getCurrentEditableSectionIndex(sections: Connection[], selectedSections: 'all' | number) {\n    const currentIndex =\n        selectedSections === 'all' || selectedSections === -1 ? 0 : selectedSections;\n    const section = sections[currentIndex];\n    if (section && !isEditableSectionType(section.type)) {\n        return section.nextEditableSection;\n    }\n    return isEditableSectionType(section?.type) ? currentIndex : -1;\n}\n"]}

package/dist/esm/components/{RangeDateField → DateField}/hooks/useRangeDateFieldState.d.ts

@@ -1,7 +1,7 @@
 import type { DateTime } from '@gravity-ui/date-utils';
-import type { DateFieldState } from "../../DateField/index.js";
 import type { DateFieldBase } from "../../types/datePicker.js";
 import type { RangeValue } from "../../types/inputs.js";
+import type { DateFieldState } from "./useBaseDateFieldState.js";
 export interface RangeDateFieldStateOptions extends DateFieldBase<RangeValue<DateTime>> {
     delimiter?: string;
 }