@gravity-ui/date-components 3.4.1 → 4.0.0

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

@@ -1,35 +1,24 @@
 import type { DateTime } from '@gravity-ui/date-utils';
 import type { ValidationState } from "../../types/index.js";
+import type { IncompleteDate } from "../IncompleteDate.js";
 import type { DateFieldSection, FormatInfo } from "../types.js";
-export type BaseDateFieldStateOptions<T = DateTime> = {
+interface BaseDateFieldStateOptions<T = DateTime, V = IncompleteDate> {
     value: T | null;
     displayValue: T;
-    placeholderValue?: DateTime;
-    timeZone: string;
     validationState?: ValidationState;
     editableSections: DateFieldSection[];
     formatInfo: FormatInfo;
     readOnly?: boolean;
     disabled?: boolean;
-    selectedSectionIndexes: {
-        startIndex: number;
-        endIndex: number;
-    } | null;
-    selectedSections: number | 'all';
     isEmpty: boolean;
-    flushAllValidSections: () => void;
-    flushValidSection: (sectionIndex: number) => void;
-    setSelectedSections: (position: number | 'all') => void;
-    setValue: (value: T) => void;
-    setDate: (value: T | null) => void;
+    setValue: (value: T | V | null) => void;
     adjustSection: (sectionIndex: number, amount: number) => void;
     setSection: (sectionIndex: number, amount: number) => void;
-    getSectionValue: (sectionIndex: number) => DateTime;
-    setSectionValue: (sectionIndex: number, currentValue: DateTime) => void;
-    createPlaceholder: () => T;
+    clearSection: (sectionIndex: number) => void;
     setValueFromString: (str: string) => boolean;
-};
-export type DateFieldState<T = DateTime> = {
+    confirmPlaceholder: () => void;
+}
+export interface DateFieldState<T = DateTime> {
     /** The current field value. */
     value: T | null;
     /** Is no part of value is filled. */
@@ -37,72 +26,49 @@ export type DateFieldState<T = DateTime> = {
     /** The current used value. value or placeholderValue */
     displayValue: T;
     /** Sets the field's value. */
-    setValue: (value: T) => void;
-    /** Sets the date value. */
-    setDate: (value: T | null) => void;
-    /** Formatted value */
-    text: string;
+    setValue: (value: T | null) => void;
+    /** Updates the remaining unfilled sections with the placeholder value. */
+    confirmPlaceholder: () => void;
     /** Whether the field is read only. */
     readOnly?: boolean;
     /** Whether the field is disabled. */
     disabled?: boolean;
-    /** A list of segments for the current value. */
+    /** A list of sections for the current value. */
     sections: DateFieldSection[];
     /** Some info about available sections */
     formatInfo: FormatInfo;
-    /**
-     * @deprecated use formatInfo.hasDate instead.
-     * Whether the the format is containing date parts
-     */
-    hasDate: boolean;
-    /**
-     * @deprecated use formatInfo.hasTime instead.
-     * Whether the the format is containing time parts
-     */
-    hasTime: boolean;
-    /** Selected sections */
-    selectedSectionIndexes: {
-        startIndex: number;
-        endIndex: number;
-    } | null;
     /** The current validation state of the date field, based on the `validationState`, `minValue`, and `maxValue` props. */
     validationState?: ValidationState;
-    /** Sets selection for segment in position. */
-    setSelectedSections: (position: number | 'all') => void;
-    /** Focuses segment in position */
-    focusSectionInPosition: (position: number) => void;
-    /** Focuses the next segment if present */
-    focusNextSection: () => void;
-    /** Focuses the previous segment if present */
-    focusPreviousSection: () => void;
-    /** Focuses the first segment */
-    focusFirstSection: () => void;
-    /** Focuses the last segment */
-    focusLastSection: () => void;
-    /** Increments the currently selected segment. Upon reaching the minimum or maximum value, the value wraps around to the opposite limit. */
-    increment: () => void;
-    /** Decrements the currently selected segment. Upon reaching the minimum or maximum value, the value wraps around to the opposite limit. */
-    decrement: () => void;
+    /** Increments the currently selected section. Upon reaching the minimum or maximum value, the value wraps around to the opposite limit. */
+    increment: (sectionIndex: number) => void;
+    /** Decrements the currently selected section. Upon reaching the minimum or maximum value, the value wraps around to the opposite limit. */
+    decrement: (sectionIndex: number) => void;
     /**
-     * Increments the currently selected segment by a larger amount, rounding it to the nearest increment.
+     * Increments the currently selected section by a larger amount, rounding it to the nearest increment.
      * The amount to increment by depends on the field, for example 15 minutes, 7 days, and 5 years.
      * Upon reaching the minimum or maximum value, the value wraps around to the opposite limit.
      */
-    incrementPage: () => void;
+    incrementPage: (sectionIndex: number) => void;
     /**
-     * Decrements the currently selected segment by a larger amount, rounding it to the nearest decrement.
+     * Decrements the currently selected section by a larger amount, rounding it to the nearest decrement.
      * The amount to increment by depends on the field, for example 15 minutes, 7 days, and 5 years.
      * Upon reaching the minimum or maximum value, the value wraps around to the opposite limit.
      */
-    decrementPage: () => void;
-    incrementToMax: () => void;
-    decrementToMin: () => void;
-    /** Clears the value of the currently selected segment, reverting it to the placeholder. */
-    clearSection: () => void;
-    /** Clears all segments, reverting them to the placeholder. */
+    decrementPage: (sectionIndex: number) => void;
+    incrementToMax: (sectionIndex: number) => void;
+    decrementToMin: (sectionIndex: number) => void;
+    /** Clears the value of the currently selected section, reverting it to the placeholder. */
+    clearSection: (sectionIndex: number) => void;
+    /** Clears all sections, reverting them to the placeholder. */
     clearAll: () => void;
-    /** Handles input key in the currently selected segment */
-    onInput: (key: string) => void;
+    /** Sets the value of the given section. */
+    setSection: (sectionIndex: number, amount: number) => void;
+    /** Tries to set value from str. Supports date in input format or ISO */
     setValueFromString: (str: string) => boolean;
-};
-export declare function useBaseDateFieldState<T = DateTime>(props: BaseDateFieldStateOptions<T>): DateFieldState<T>;
+    /** Is date filed active now */
+    isActive: boolean;
+    /** Sets active state of the date field */
+    setActive: (isActive: boolean) => void;
+}
+export declare function useBaseDateFieldState<T = DateTime, V = IncompleteDate>(props: BaseDateFieldStateOptions<T, V>): DateFieldState<T>;
+export {};

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

@@ -1,122 +1,56 @@
 import React from 'react';
-import { createPlaceholderValue } from "../../utils/dates.js";
-import { EDITABLE_SEGMENTS, formatSections, getCurrentEditableSectionIndex, getDurationUnitFromSectionType, } from "../utils.js";
-const PAGE_STEP = {
-    year: 5,
-    quarter: 2,
-    month: 2,
-    weekday: 3,
-    day: 7,
-    hour: 2,
-    minute: 15,
-    second: 15,
-};
+import { PAGE_STEP } from "../utils.js";
 export function useBaseDateFieldState(props) {
-    const { value, validationState, displayValue, editableSections, formatInfo, selectedSectionIndexes, selectedSections, isEmpty, flushAllValidSections, flushValidSection, setSelectedSections, setValue, setDate, adjustSection, setSection, getSectionValue, setSectionValue, createPlaceholder, setValueFromString, } = props;
-    const enteredKeys = React.useRef('');
+    const { value, validationState, displayValue, editableSections, formatInfo, isEmpty, setValue, adjustSection, setSection, clearSection, setValueFromString, confirmPlaceholder, } = props;
+    const [isActive, setActive] = React.useState(false);
     return {
         value,
         isEmpty,
         displayValue,
         setValue,
-        setDate,
-        text: formatSections(editableSections),
+        confirmPlaceholder,
         readOnly: props.readOnly,
         disabled: props.disabled,
         sections: editableSections,
         formatInfo,
-        hasDate: formatInfo.hasDate,
-        hasTime: formatInfo.hasTime,
-        selectedSectionIndexes,
         validationState,
-        setSelectedSections(position) {
-            enteredKeys.current = '';
-            setSelectedSections(position);
-        },
-        focusSectionInPosition(position) {
-            const nextSectionIndex = this.sections.findIndex((s) => s.end >= position);
-            const index = nextSectionIndex === -1 ? 0 : nextSectionIndex;
-            const nextSection = this.sections[index];
-            if (nextSection) {
-                this.setSelectedSections(EDITABLE_SEGMENTS[nextSection.type] ? index : nextSection.nextEditableSection);
-            }
-        },
-        focusNextSection() {
-            var _a, _b;
-            const currentIndex = selectedSections === 'all' ? 0 : selectedSections;
-            const newIndex = (_b = (_a = this.sections[currentIndex]) === null || _a === void 0 ? void 0 : _a.nextEditableSection) !== null && _b !== void 0 ? _b : -1;
-            if (newIndex !== -1) {
-                this.setSelectedSections(newIndex);
-            }
-        },
-        focusPreviousSection() {
-            var _a, _b;
-            const currentIndex = selectedSections === 'all' ? 0 : selectedSections;
-            const newIndex = (_b = (_a = this.sections[currentIndex]) === null || _a === void 0 ? void 0 : _a.previousEditableSection) !== null && _b !== void 0 ? _b : -1;
-            if (newIndex !== -1) {
-                this.setSelectedSections(newIndex);
-            }
-        },
-        focusFirstSection() {
-            var _a, _b;
-            const newIndex = (_b = (_a = this.sections[0]) === null || _a === void 0 ? void 0 : _a.previousEditableSection) !== null && _b !== void 0 ? _b : -1;
-            if (newIndex !== -1) {
-                setSelectedSections(newIndex);
-            }
-        },
-        focusLastSection() {
-            var _a, _b;
-            const newIndex = (_b = (_a = this.sections[this.sections.length - 1]) === null || _a === void 0 ? void 0 : _a.nextEditableSection) !== null && _b !== void 0 ? _b : -1;
-            if (newIndex !== -1) {
-                this.setSelectedSections(newIndex);
-            }
-        },
-        increment() {
+        setSection,
+        increment(sectionIndex) {
             if (this.readOnly || this.disabled) {
                 return;
             }
-            enteredKeys.current = '';
-            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);
             if (sectionIndex !== -1) {
                 adjustSection(sectionIndex, 1);
             }
         },
-        decrement() {
+        decrement(sectionIndex) {
             if (this.readOnly || this.disabled) {
                 return;
             }
-            enteredKeys.current = '';
-            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);
             if (sectionIndex !== -1) {
                 adjustSection(sectionIndex, -1);
             }
         },
-        incrementPage() {
+        incrementPage(sectionIndex) {
             if (this.readOnly || this.disabled) {
                 return;
             }
-            enteredKeys.current = '';
-            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);
             if (sectionIndex !== -1) {
                 adjustSection(sectionIndex, PAGE_STEP[this.sections[sectionIndex].type] || 1);
             }
         },
-        decrementPage() {
+        decrementPage(sectionIndex) {
             if (this.readOnly || this.disabled) {
                 return;
             }
-            enteredKeys.current = '';
-            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);
             if (sectionIndex !== -1) {
                 adjustSection(sectionIndex, -(PAGE_STEP[this.sections[sectionIndex].type] || 1));
             }
         },
-        incrementToMax() {
+        incrementToMax(sectionIndex) {
             if (this.readOnly || this.disabled) {
                 return;
             }
-            enteredKeys.current = '';
-            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);
             if (sectionIndex !== -1) {
                 const section = this.sections[sectionIndex];
                 if (typeof section.maxValue === 'number') {
@@ -124,12 +58,10 @@ export function useBaseDateFieldState(props) {
                 }
             }
         },
-        decrementToMin() {
+        decrementToMin(sectionIndex) {
             if (this.readOnly || this.disabled) {
                 return;
             }
-            enteredKeys.current = '';
-            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);
             if (sectionIndex !== -1) {
                 const section = this.sections[sectionIndex];
                 if (typeof section.minValue === 'number') {
@@ -137,187 +69,24 @@ export function useBaseDateFieldState(props) {
                 }
             }
         },
-        clearSection() {
+        clearSection(sectionIndex) {
             if (this.readOnly || this.disabled) {
                 return;
             }
-            enteredKeys.current = '';
-            if (selectedSections === 'all') {
-                this.clearAll();
-                return;
-            }
-            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);
             if (sectionIndex === -1) {
                 return;
             }
-            flushValidSection(sectionIndex);
-            const section = this.sections[sectionIndex];
-            const placeholder = createPlaceholderValue({
-                placeholderValue: props.placeholderValue,
-                timeZone: props.timeZone,
-            }).timeZone(props.timeZone);
-            const displayPortion = getSectionValue(sectionIndex);
-            let currentValue = displayPortion;
-            // Reset day period to default without changing the hour.
-            if (section.type === 'dayPeriod') {
-                const isPM = displayPortion.hour() >= 12;
-                const shouldBePM = placeholder.hour() >= 12;
-                if (isPM && !shouldBePM) {
-                    currentValue = displayPortion.set('hour', displayPortion.hour() - 12);
-                }
-                else if (!isPM && shouldBePM) {
-                    currentValue = displayPortion.set('hour', displayPortion.hour() + 12);
-                }
-            }
-            else {
-                const type = getDurationUnitFromSectionType(section.type);
-                currentValue = displayPortion.set(type, placeholder[type]());
-            }
-            setSectionValue(sectionIndex, currentValue);
+            clearSection(sectionIndex);
         },
         clearAll() {
             if (this.readOnly || this.disabled) {
                 return;
             }
-            enteredKeys.current = '';
-            flushAllValidSections();
-            if (value !== null) {
-                setDate(null);
-            }
-            const date = createPlaceholder();
-            setValue(date);
-        },
-        onInput(key) {
-            if (this.readOnly || this.disabled) {
-                return;
-            }
-            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);
-            if (sectionIndex === -1) {
-                return;
-            }
-            const section = this.sections[sectionIndex];
-            const isLastSection = section.nextEditableSection === sectionIndex;
-            let newValue = enteredKeys.current + key;
-            const onInputNumber = (numberValue) => {
-                var _a;
-                let sectionValue = section.type === 'month' ? numberValue - 1 : numberValue;
-                const sectionMaxValue = (_a = section.maxValue) !== null && _a !== void 0 ? _a : 0;
-                const allowsZero = section.minValue === 0;
-                let shouldResetUserInput;
-                if (
-                // 12-hour clock format with AM/PM
-                section.type === 'hour' &&
-                    (sectionMaxValue === 11 || section.minValue === 12)) {
-                    if (sectionValue > 12) {
-                        sectionValue = Number(key);
-                        newValue = key;
-                    }
-                    if (sectionValue === 0) {
-                        sectionValue = -Infinity;
-                    }
-                    if (sectionValue === 12) {
-                        sectionValue = 0;
-                    }
-                    if (section.minValue === 12) {
-                        sectionValue += 12;
-                    }
-                    shouldResetUserInput = Number(newValue + '0') > 12;
-                }
-                else if (sectionValue > sectionMaxValue) {
-                    sectionValue = Number(key) - (section.type === 'month' ? 1 : 0);
-                    newValue = key;
-                    if (sectionValue > sectionMaxValue) {
-                        enteredKeys.current = '';
-                        return;
-                    }
-                }
-                const shouldSetValue = sectionValue > 0 || (sectionValue === 0 && allowsZero);
-                if (shouldSetValue) {
-                    setSection(sectionIndex, sectionValue);
-                }
-                if (shouldResetUserInput === undefined) {
-                    shouldResetUserInput = Number(newValue + '0') > sectionMaxValue;
-                }
-                const isMaxLength = newValue.length >= String(sectionMaxValue).length;
-                if (shouldResetUserInput) {
-                    enteredKeys.current = '';
-                    if (shouldSetValue) {
-                        this.focusNextSection();
-                    }
-                }
-                else if (isMaxLength && shouldSetValue && !isLastSection) {
-                    this.focusNextSection();
-                }
-                else {
-                    enteredKeys.current = newValue;
-                }
-            };
-            const onInputString = (stringValue) => {
-                var _a;
-                const options = (_a = section.options) !== null && _a !== void 0 ? _a : [];
-                let sectionValue = stringValue.toLocaleUpperCase();
-                let foundOptions = options.filter((v) => v.startsWith(sectionValue));
-                if (foundOptions.length === 0) {
-                    if (stringValue !== key) {
-                        sectionValue = key.toLocaleUpperCase();
-                        foundOptions = options.filter((v) => v.startsWith(sectionValue));
-                    }
-                    if (foundOptions.length === 0) {
-                        enteredKeys.current = '';
-                        return;
-                    }
-                }
-                const foundValue = foundOptions[0];
-                const index = options.indexOf(foundValue);
-                if (section.type === 'dayPeriod') {
-                    setSection(sectionIndex, index === 1 ? 12 : 0);
-                }
-                else {
-                    setSection(sectionIndex, index);
-                }
-                if (foundOptions.length > 1) {
-                    enteredKeys.current = newValue;
-                }
-                else {
-                    enteredKeys.current = '';
-                    this.focusNextSection();
-                }
-            };
-            switch (section.type) {
-                case 'day':
-                case 'hour':
-                case 'minute':
-                case 'second':
-                case 'quarter':
-                case 'year': {
-                    if (!Number.isInteger(Number(newValue))) {
-                        return;
-                    }
-                    const numberValue = Number(newValue);
-                    onInputNumber(numberValue);
-                    break;
-                }
-                case 'dayPeriod': {
-                    onInputString(newValue);
-                    break;
-                }
-                case 'weekday':
-                case 'month': {
-                    if (Number.isInteger(Number(newValue))) {
-                        const numberValue = Number(newValue);
-                        onInputNumber(numberValue);
-                    }
-                    else {
-                        onInputString(newValue);
-                    }
-                    break;
-                }
-            }
-        },
-        setValueFromString(str) {
-            enteredKeys.current = '';
-            return setValueFromString(str);
+            setValue(null);
         },
+        setValueFromString,
+        isActive,
+        setActive,
     };
 }
 //# sourceMappingURL=useBaseDateFieldState.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"useBaseDateFieldState.js","sourceRoot":"../../../../../src","sources":["components/DateField/hooks/useBaseDateFieldState.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport type {DateTime} from '@gravity-ui/date-utils';\n\nimport type {ValidationState} from '../../types';\nimport {createPlaceholderValue} from '../../utils/dates';\nimport type {DateFieldSection, DateFieldSectionType, FormatInfo} from '../types';\nimport {\n    EDITABLE_SEGMENTS,\n    formatSections,\n    getCurrentEditableSectionIndex,\n    getDurationUnitFromSectionType,\n} from '../utils';\n\nconst PAGE_STEP: Partial<Record<DateFieldSectionType, number>> = {\n    year: 5,\n    quarter: 2,\n    month: 2,\n    weekday: 3,\n    day: 7,\n    hour: 2,\n    minute: 15,\n    second: 15,\n};\n\nexport type BaseDateFieldStateOptions<T = DateTime> = {\n    value: T | null;\n    displayValue: T;\n    placeholderValue?: DateTime;\n    timeZone: string;\n    validationState?: ValidationState;\n    editableSections: DateFieldSection[];\n    formatInfo: FormatInfo;\n    readOnly?: boolean;\n    disabled?: boolean;\n    selectedSectionIndexes: {startIndex: number; endIndex: number} | null;\n    selectedSections: number | 'all';\n    isEmpty: boolean;\n    flushAllValidSections: () => void;\n    flushValidSection: (sectionIndex: number) => void;\n    setSelectedSections: (position: number | 'all') => void;\n    setValue: (value: T) => void;\n    setDate: (value: T | null) => void;\n    adjustSection: (sectionIndex: number, amount: number) => void;\n    setSection: (sectionIndex: number, amount: number) => void;\n    getSectionValue: (sectionIndex: number) => DateTime;\n    setSectionValue: (sectionIndex: number, currentValue: DateTime) => void;\n    createPlaceholder: () => T;\n    setValueFromString: (str: string) => boolean;\n};\n\nexport type DateFieldState<T = DateTime> = {\n    /** The current field value. */\n    value: T | null;\n    /** Is no part of value is filled. */\n    isEmpty: boolean;\n    /** The current used value. value or placeholderValue */\n    displayValue: T;\n    /** Sets the field's value. */\n    setValue: (value: T) => void;\n    /** Sets the date value. */\n    setDate: (value: T | null) => void;\n    /** Formatted value */\n    text: string;\n    /** Whether the field is read only. */\n    readOnly?: boolean;\n    /** Whether the field is disabled. */\n    disabled?: boolean;\n    /** A list of segments for the current value. */\n    sections: DateFieldSection[];\n    /** Some info about available sections */\n    formatInfo: FormatInfo;\n    /**\n     * @deprecated use formatInfo.hasDate instead.\n     * Whether the the format is containing date parts\n     */\n    hasDate: boolean;\n    /**\n     * @deprecated use formatInfo.hasTime instead.\n     * Whether the the format is containing time parts\n     */\n    hasTime: boolean;\n    /** Selected sections */\n    selectedSectionIndexes: {startIndex: number; endIndex: number} | null;\n    /** The current validation state of the date field, based on the `validationState`, `minValue`, and `maxValue` props. */\n    validationState?: ValidationState;\n    /** Sets selection for segment in position. */\n    setSelectedSections: (position: number | 'all') => void;\n    /** Focuses segment in position */\n    focusSectionInPosition: (position: number) => void;\n    /** Focuses the next segment if present */\n    focusNextSection: () => void;\n    /** Focuses the previous segment if present */\n    focusPreviousSection: () => void;\n    /** Focuses the first segment */\n    focusFirstSection: () => void;\n    /** Focuses the last segment */\n    focusLastSection: () => void;\n    /** Increments the currently selected segment. Upon reaching the minimum or maximum value, the value wraps around to the opposite limit. */\n    increment: () => void;\n    /** Decrements the currently selected segment. Upon reaching the minimum or maximum value, the value wraps around to the opposite limit. */\n    decrement: () => void;\n    /**\n     * Increments the currently selected segment by a larger amount, rounding it to the nearest increment.\n     * The amount to increment by depends on the field, for example 15 minutes, 7 days, and 5 years.\n     * Upon reaching the minimum or maximum value, the value wraps around to the opposite limit.\n     */\n    incrementPage: () => void;\n    /**\n     * Decrements the currently selected segment by a larger amount, rounding it to the nearest decrement.\n     * The amount to increment by depends on the field, for example 15 minutes, 7 days, and 5 years.\n     * Upon reaching the minimum or maximum value, the value wraps around to the opposite limit.\n     */\n    decrementPage: () => void;\n    incrementToMax: () => void;\n    decrementToMin: () => void;\n    /** Clears the value of the currently selected segment, reverting it to the placeholder. */\n    clearSection: () => void;\n    /** Clears all segments, reverting them to the placeholder. */\n    clearAll: () => void;\n    /** Handles input key in the currently selected segment */\n    onInput: (key: string) => void;\n    //** Tries to set value from str. Supports date in input format or ISO */\n    setValueFromString: (str: string) => boolean;\n};\n\nexport function useBaseDateFieldState<T = DateTime>(\n    props: BaseDateFieldStateOptions<T>,\n): DateFieldState<T> {\n    const {\n        value,\n        validationState,\n        displayValue,\n        editableSections,\n        formatInfo,\n        selectedSectionIndexes,\n        selectedSections,\n        isEmpty,\n        flushAllValidSections,\n        flushValidSection,\n        setSelectedSections,\n        setValue,\n        setDate,\n        adjustSection,\n        setSection,\n        getSectionValue,\n        setSectionValue,\n        createPlaceholder,\n        setValueFromString,\n    } = props;\n\n    const enteredKeys = React.useRef('');\n\n    return {\n        value,\n        isEmpty,\n        displayValue,\n        setValue,\n        setDate,\n        text: formatSections(editableSections),\n        readOnly: props.readOnly,\n        disabled: props.disabled,\n        sections: editableSections,\n        formatInfo,\n        hasDate: formatInfo.hasDate,\n        hasTime: formatInfo.hasTime,\n        selectedSectionIndexes,\n        validationState,\n        setSelectedSections(position) {\n            enteredKeys.current = '';\n            setSelectedSections(position);\n        },\n        focusSectionInPosition(position) {\n            const nextSectionIndex = this.sections.findIndex((s) => s.end >= position);\n            const index = nextSectionIndex === -1 ? 0 : nextSectionIndex;\n            const nextSection = this.sections[index];\n            if (nextSection) {\n                this.setSelectedSections(\n                    EDITABLE_SEGMENTS[nextSection.type] ? index : nextSection.nextEditableSection,\n                );\n            }\n        },\n        focusNextSection() {\n            const currentIndex = selectedSections === 'all' ? 0 : selectedSections;\n            const newIndex = this.sections[currentIndex]?.nextEditableSection ?? -1;\n            if (newIndex !== -1) {\n                this.setSelectedSections(newIndex);\n            }\n        },\n        focusPreviousSection() {\n            const currentIndex = selectedSections === 'all' ? 0 : selectedSections;\n            const newIndex = this.sections[currentIndex]?.previousEditableSection ?? -1;\n            if (newIndex !== -1) {\n                this.setSelectedSections(newIndex);\n            }\n        },\n        focusFirstSection() {\n            const newIndex = this.sections[0]?.previousEditableSection ?? -1;\n            if (newIndex !== -1) {\n                setSelectedSections(newIndex);\n            }\n        },\n        focusLastSection() {\n            const newIndex = this.sections[this.sections.length - 1]?.nextEditableSection ?? -1;\n            if (newIndex !== -1) {\n                this.setSelectedSections(newIndex);\n            }\n        },\n        increment() {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n\n            enteredKeys.current = '';\n            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);\n            if (sectionIndex !== -1) {\n                adjustSection(sectionIndex, 1);\n            }\n        },\n        decrement() {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n\n            enteredKeys.current = '';\n            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);\n            if (sectionIndex !== -1) {\n                adjustSection(sectionIndex, -1);\n            }\n        },\n        incrementPage() {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n\n            enteredKeys.current = '';\n            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);\n            if (sectionIndex !== -1) {\n                adjustSection(sectionIndex, PAGE_STEP[this.sections[sectionIndex].type] || 1);\n            }\n        },\n        decrementPage() {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n\n            enteredKeys.current = '';\n            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);\n            if (sectionIndex !== -1) {\n                adjustSection(sectionIndex, -(PAGE_STEP[this.sections[sectionIndex].type] || 1));\n            }\n        },\n        incrementToMax() {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n            enteredKeys.current = '';\n            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);\n            if (sectionIndex !== -1) {\n                const section = this.sections[sectionIndex];\n                if (typeof section.maxValue === 'number') {\n                    setSection(sectionIndex, section.maxValue);\n                }\n            }\n        },\n        decrementToMin() {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n            enteredKeys.current = '';\n            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);\n            if (sectionIndex !== -1) {\n                const section = this.sections[sectionIndex];\n                if (typeof section.minValue === 'number') {\n                    setSection(sectionIndex, section.minValue);\n                }\n            }\n        },\n        clearSection() {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n\n            enteredKeys.current = '';\n            if (selectedSections === 'all') {\n                this.clearAll();\n                return;\n            }\n\n            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);\n            if (sectionIndex === -1) {\n                return;\n            }\n\n            flushValidSection(sectionIndex);\n\n            const section = this.sections[sectionIndex];\n\n            const placeholder = createPlaceholderValue({\n                placeholderValue: props.placeholderValue,\n                timeZone: props.timeZone,\n            }).timeZone(props.timeZone);\n\n            const displayPortion = getSectionValue(sectionIndex);\n            let currentValue = displayPortion;\n\n            // Reset day period to default without changing the hour.\n            if (section.type === 'dayPeriod') {\n                const isPM = displayPortion.hour() >= 12;\n                const shouldBePM = placeholder.hour() >= 12;\n                if (isPM && !shouldBePM) {\n                    currentValue = displayPortion.set('hour', displayPortion.hour() - 12);\n                } else if (!isPM && shouldBePM) {\n                    currentValue = displayPortion.set('hour', displayPortion.hour() + 12);\n                }\n            } else {\n                const type = getDurationUnitFromSectionType(section.type);\n                currentValue = displayPortion.set(type, placeholder[type]());\n            }\n\n            setSectionValue(sectionIndex, currentValue);\n        },\n        clearAll() {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n\n            enteredKeys.current = '';\n            flushAllValidSections();\n            if (value !== null) {\n                setDate(null);\n            }\n\n            const date = createPlaceholder();\n\n            setValue(date);\n        },\n        onInput(key: string) {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n\n            const sectionIndex = getCurrentEditableSectionIndex(this.sections, selectedSections);\n            if (sectionIndex === -1) {\n                return;\n            }\n\n            const section = this.sections[sectionIndex];\n            const isLastSection = section.nextEditableSection === sectionIndex;\n            let newValue = enteredKeys.current + key;\n\n            const onInputNumber = (numberValue: number) => {\n                let sectionValue = section.type === 'month' ? numberValue - 1 : numberValue;\n                const sectionMaxValue = section.maxValue ?? 0;\n                const allowsZero = section.minValue === 0;\n                let shouldResetUserInput;\n                if (\n                    // 12-hour clock format with AM/PM\n                    section.type === 'hour' &&\n                    (sectionMaxValue === 11 || section.minValue === 12)\n                ) {\n                    if (sectionValue > 12) {\n                        sectionValue = Number(key);\n                        newValue = key;\n                    }\n                    if (sectionValue === 0) {\n                        sectionValue = -Infinity;\n                    }\n                    if (sectionValue === 12) {\n                        sectionValue = 0;\n                    }\n                    if (section.minValue === 12) {\n                        sectionValue += 12;\n                    }\n                    shouldResetUserInput = Number(newValue + '0') > 12;\n                } else if (sectionValue > sectionMaxValue) {\n                    sectionValue = Number(key) - (section.type === 'month' ? 1 : 0);\n                    newValue = key;\n                    if (sectionValue > sectionMaxValue) {\n                        enteredKeys.current = '';\n                        return;\n                    }\n                }\n\n                const shouldSetValue = sectionValue > 0 || (sectionValue === 0 && allowsZero);\n                if (shouldSetValue) {\n                    setSection(sectionIndex, sectionValue);\n                }\n\n                if (shouldResetUserInput === undefined) {\n                    shouldResetUserInput = Number(newValue + '0') > sectionMaxValue;\n                }\n                const isMaxLength = newValue.length >= String(sectionMaxValue).length;\n                if (shouldResetUserInput) {\n                    enteredKeys.current = '';\n                    if (shouldSetValue) {\n                        this.focusNextSection();\n                    }\n                } else if (isMaxLength && shouldSetValue && !isLastSection) {\n                    this.focusNextSection();\n                } else {\n                    enteredKeys.current = newValue;\n                }\n            };\n\n            const onInputString = (stringValue: string) => {\n                const options = section.options ?? [];\n                let sectionValue = stringValue.toLocaleUpperCase();\n                let foundOptions = options.filter((v) => v.startsWith(sectionValue));\n                if (foundOptions.length === 0) {\n                    if (stringValue !== key) {\n                        sectionValue = key.toLocaleUpperCase();\n                        foundOptions = options.filter((v) => v.startsWith(sectionValue));\n                    }\n                    if (foundOptions.length === 0) {\n                        enteredKeys.current = '';\n                        return;\n                    }\n                }\n                const foundValue = foundOptions[0];\n                const index = options.indexOf(foundValue);\n\n                if (section.type === 'dayPeriod') {\n                    setSection(sectionIndex, index === 1 ? 12 : 0);\n                } else {\n                    setSection(sectionIndex, index);\n                }\n\n                if (foundOptions.length > 1) {\n                    enteredKeys.current = newValue;\n                } else {\n                    enteredKeys.current = '';\n                    this.focusNextSection();\n                }\n            };\n\n            switch (section.type) {\n                case 'day':\n                case 'hour':\n                case 'minute':\n                case 'second':\n                case 'quarter':\n                case 'year': {\n                    if (!Number.isInteger(Number(newValue))) {\n                        return;\n                    }\n                    const numberValue = Number(newValue);\n                    onInputNumber(numberValue);\n                    break;\n                }\n                case 'dayPeriod': {\n                    onInputString(newValue);\n                    break;\n                }\n                case 'weekday':\n                case 'month': {\n                    if (Number.isInteger(Number(newValue))) {\n                        const numberValue = Number(newValue);\n                        onInputNumber(numberValue);\n                    } else {\n                        onInputString(newValue);\n                    }\n                    break;\n                }\n            }\n        },\n        setValueFromString(str: string) {\n            enteredKeys.current = '';\n            return setValueFromString(str);\n        },\n    };\n}\n"]}
+{"version":3,"file":"useBaseDateFieldState.js","sourceRoot":"../../../../../src","sources":["components/DateField/hooks/useBaseDateFieldState.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport type {DateTime} from '@gravity-ui/date-utils';\n\nimport type {ValidationState} from '../../types';\nimport type {IncompleteDate} from '../IncompleteDate';\nimport type {DateFieldSection, FormatInfo} from '../types';\nimport {PAGE_STEP} from '../utils';\n\ninterface BaseDateFieldStateOptions<T = DateTime, V = IncompleteDate> {\n    value: T | null;\n    displayValue: T;\n    validationState?: ValidationState;\n    editableSections: DateFieldSection[];\n    formatInfo: FormatInfo;\n    readOnly?: boolean;\n    disabled?: boolean;\n    isEmpty: boolean;\n    setValue: (value: T | V | null) => void;\n    adjustSection: (sectionIndex: number, amount: number) => void;\n    setSection: (sectionIndex: number, amount: number) => void;\n    clearSection: (sectionIndex: number) => void;\n    setValueFromString: (str: string) => boolean;\n    confirmPlaceholder: () => void;\n}\n\nexport interface DateFieldState<T = DateTime> {\n    /** The current field value. */\n    value: T | null;\n    /** Is no part of value is filled. */\n    isEmpty: boolean;\n    /** The current used value. value or placeholderValue */\n    displayValue: T;\n    /** Sets the field's value. */\n    setValue: (value: T | null) => void;\n    /** Updates the remaining unfilled sections with the placeholder value. */\n    confirmPlaceholder: () => void;\n    /** Whether the field is read only. */\n    readOnly?: boolean;\n    /** Whether the field is disabled. */\n    disabled?: boolean;\n    /** A list of sections for the current value. */\n    sections: DateFieldSection[];\n    /** Some info about available sections */\n    formatInfo: FormatInfo;\n    /** The current validation state of the date field, based on the `validationState`, `minValue`, and `maxValue` props. */\n    validationState?: ValidationState;\n    /** Increments the currently selected section. Upon reaching the minimum or maximum value, the value wraps around to the opposite limit. */\n    increment: (sectionIndex: number) => void;\n    /** Decrements the currently selected section. Upon reaching the minimum or maximum value, the value wraps around to the opposite limit. */\n    decrement: (sectionIndex: number) => void;\n    /**\n     * Increments the currently selected section by a larger amount, rounding it to the nearest increment.\n     * The amount to increment by depends on the field, for example 15 minutes, 7 days, and 5 years.\n     * Upon reaching the minimum or maximum value, the value wraps around to the opposite limit.\n     */\n    incrementPage: (sectionIndex: number) => void;\n    /**\n     * Decrements the currently selected section by a larger amount, rounding it to the nearest decrement.\n     * The amount to increment by depends on the field, for example 15 minutes, 7 days, and 5 years.\n     * Upon reaching the minimum or maximum value, the value wraps around to the opposite limit.\n     */\n    decrementPage: (sectionIndex: number) => void;\n    incrementToMax: (sectionIndex: number) => void;\n    decrementToMin: (sectionIndex: number) => void;\n    /** Clears the value of the currently selected section, reverting it to the placeholder. */\n    clearSection: (sectionIndex: number) => void;\n    /** Clears all sections, reverting them to the placeholder. */\n    clearAll: () => void;\n    /** Sets the value of the given section. */\n    setSection: (sectionIndex: number, amount: number) => void;\n    /** Tries to set value from str. Supports date in input format or ISO */\n    setValueFromString: (str: string) => boolean;\n    /** Is date filed active now */\n    isActive: boolean;\n    /** Sets active state of the date field */\n    setActive: (isActive: boolean) => void;\n}\n\nexport function useBaseDateFieldState<T = DateTime, V = IncompleteDate>(\n    props: BaseDateFieldStateOptions<T, V>,\n): DateFieldState<T> {\n    const {\n        value,\n        validationState,\n        displayValue,\n        editableSections,\n        formatInfo,\n        isEmpty,\n        setValue,\n        adjustSection,\n        setSection,\n        clearSection,\n        setValueFromString,\n        confirmPlaceholder,\n    } = props;\n\n    const [isActive, setActive] = React.useState(false);\n\n    return {\n        value,\n        isEmpty,\n        displayValue,\n        setValue,\n        confirmPlaceholder,\n        readOnly: props.readOnly,\n        disabled: props.disabled,\n        sections: editableSections,\n        formatInfo,\n        validationState,\n        setSection,\n        increment(sectionIndex) {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n\n            if (sectionIndex !== -1) {\n                adjustSection(sectionIndex, 1);\n            }\n        },\n        decrement(sectionIndex) {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n\n            if (sectionIndex !== -1) {\n                adjustSection(sectionIndex, -1);\n            }\n        },\n        incrementPage(sectionIndex) {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n\n            if (sectionIndex !== -1) {\n                adjustSection(sectionIndex, PAGE_STEP[this.sections[sectionIndex].type] || 1);\n            }\n        },\n        decrementPage(sectionIndex) {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n\n            if (sectionIndex !== -1) {\n                adjustSection(sectionIndex, -(PAGE_STEP[this.sections[sectionIndex].type] || 1));\n            }\n        },\n        incrementToMax(sectionIndex) {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n            if (sectionIndex !== -1) {\n                const section = this.sections[sectionIndex];\n                if (typeof section.maxValue === 'number') {\n                    setSection(sectionIndex, section.maxValue);\n                }\n            }\n        },\n        decrementToMin(sectionIndex) {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n            if (sectionIndex !== -1) {\n                const section = this.sections[sectionIndex];\n                if (typeof section.minValue === 'number') {\n                    setSection(sectionIndex, section.minValue);\n                }\n            }\n        },\n        clearSection(sectionIndex) {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n\n            if (sectionIndex === -1) {\n                return;\n            }\n\n            clearSection(sectionIndex);\n        },\n        clearAll() {\n            if (this.readOnly || this.disabled) {\n                return;\n            }\n\n            setValue(null);\n        },\n        setValueFromString,\n        isActive,\n        setActive,\n    };\n}\n"]}

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { DateTime } from '@gravity-ui/date-utils';
 import type { TextInputProps } from '@gravity-ui/uikit';
 import type { AccessibilityProps, DateFieldBase, TextInputProps as DateFieldTextInputProps, DomProps, FocusableProps, InputDOMProps, KeyboardEvents, StyleProps, TextInputExtendProps } from "../../types/index.js";
@@ -5,5 +6,6 @@ import type { DateFieldState } from "./useBaseDateFieldState.js";
 export interface DateFieldProps<T = DateTime> extends DateFieldBase<T>, DateFieldTextInputProps, TextInputExtendProps, DomProps, InputDOMProps, FocusableProps, KeyboardEvents, StyleProps, AccessibilityProps {
 }
 export declare function useDateFieldProps<T = DateTime>(state: DateFieldState<T>, props: DateFieldProps<T>): {
+    groupProps: React.HTMLAttributes<unknown>;
     inputProps: TextInputProps;
 };