@cloud-ru/ds-calendar 1.0.0

package/dist/cjs/helperComponents/YearView/YearView.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.YearView = YearView;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const constants_1 = require("../../constants");
+const hooks_1 = require("../../hooks");
+const utils_1 = require("../../utils");
+const Grid_1 = require("../Grid");
+const utils_2 = require("./utils");
+function YearView() {
+    const { referenceDate, setViewMode, setViewShift, setFocus, preselectedRange, continuePreselect, restartPreselect, locale, setValue, mode, startPreselect, completePreselect, } = (0, hooks_1.useCalendarContext)();
+    const getItemLabel = (0, react_1.useCallback)((date) => (0, utils_1.getMonthName)(date, locale), [locale]);
+    const onSelect = (0, react_1.useCallback)((date) => {
+        if (mode === constants_1.CALENDAR_MODE.Month) {
+            setValue([date, date]);
+            return;
+        }
+        if (mode === constants_1.CALENDAR_MODE.MonthRange) {
+            preselectedRange ? completePreselect(date) : startPreselect(date);
+            return;
+        }
+        setFocus(constants_1.AUTOFOCUS);
+        setViewShift((0, utils_1.getMonthShift)(referenceDate, date));
+        setViewMode(constants_1.VIEW_MODE.Month);
+    }, [
+        completePreselect,
+        mode,
+        preselectedRange,
+        referenceDate,
+        setFocus,
+        setValue,
+        setViewMode,
+        setViewShift,
+        startPreselect,
+    ]);
+    const onPreselect = (0, react_1.useCallback)((date) => {
+        if (preselectedRange) {
+            continuePreselect(date);
+        }
+    }, [continuePreselect, preselectedRange]);
+    const onLeave = (0, react_1.useCallback)(() => {
+        if (preselectedRange) {
+            restartPreselect();
+        }
+    }, [preselectedRange, restartPreselect]);
+    const grid = (0, hooks_1.useGrid)({
+        buildGrid: utils_2.buildYearGrid,
+        isTheSameItem: utils_1.isTheSameMonth,
+        isInPeriod: utils_1.isTheSameYear,
+        getItemLabel,
+        onSelect,
+        onPreselect,
+        onLeave,
+    });
+    return (0, jsx_runtime_1.jsx)(Grid_1.Grid, { grid: grid });
+}

package/dist/cjs/helperComponents/YearView/index.d.ts

@@ -0,0 +1 @@
+export * from './YearView';

package/dist/cjs/helperComponents/YearView/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./YearView"), exports);

package/dist/cjs/helperComponents/YearView/utils.d.ts

@@ -0,0 +1,2 @@
+import { BaseGrid } from '../../types';
+export declare const buildYearGrid: (date: Date) => BaseGrid;

package/dist/cjs/helperComponents/YearView/utils.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildYearGrid = void 0;
+const constants_1 = require("../../constants");
+const buildYearGrid = (date) => {
+    const result = [];
+    const year = date.getFullYear();
+    let month = 0;
+    const { rows, columns } = constants_1.GRID_SIZE[constants_1.VIEW_MODE.Year];
+    for (let i = 0; i < rows; i++) {
+        const row = [];
+        for (let j = 0; j < columns; j++) {
+            row.push({ date: new Date(year, month++, 1), address: [i, j] });
+        }
+        result.push(row);
+    }
+    return result;
+};
+exports.buildYearGrid = buildYearGrid;

package/dist/cjs/helperComponents/index.d.ts

@@ -0,0 +1,4 @@
+export * from './TimePickerBase';
+export * from './CalendarContext';
+export * from './Footer';
+export * from './CalendarBase';

package/dist/cjs/helperComponents/index.js

@@ -0,0 +1,20 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./TimePickerBase"), exports);
+__exportStar(require("./CalendarContext"), exports);
+__exportStar(require("./Footer"), exports);
+__exportStar(require("./CalendarBase"), exports);

package/dist/cjs/hooks/classifyCell.d.ts

@@ -0,0 +1,34 @@
+import { BuildCellPropsFunction, CalendarMode, DateAndTime, Range, RangePosition, ViewMode } from '../types';
+/** Чистая классификация ячейки календаря (без побочных эффектов фокуса/`firstNotDisableCell`). */
+export type CellClassification = {
+    disabled: boolean;
+    holiday: boolean;
+    rangePosition: RangePosition;
+    checked: boolean;
+    current: boolean;
+    another: boolean;
+    label: string;
+};
+export type ClassifyCellParams = {
+    date: Date;
+    /** Дата периода, к которому относится сетка ячейки — определяет `another`. */
+    viewDate: Date;
+    viewMode: ViewMode;
+    mode: CalendarMode | 'time';
+    value?: Range;
+    preselectedRange?: Range;
+    dateAndTime?: DateAndTime;
+    isDateFilled(): boolean;
+    showHolidays: boolean;
+    today?: Date;
+    buildCellProps?: BuildCellPropsFunction;
+    isTheSameItem(date1: Date, date2: Date): boolean;
+    isInPeriod(viewDate: Date, date: Date): boolean;
+    getItemLabel(date: Date): string;
+};
+/**
+ * Классифицирует одну ячейку календаря (`checked` / `holiday` / `rangePosition` / `current` / `another` / `label`).
+ * Date-driven и переиспользуемая: один `viewDate` на сетку, без обращения к `CalendarContext`, фокусу и
+ * `firstNotDisableCell`. Используется и десктопным `useGrid`, и мобильными «стопками» сеток.
+ */
+export declare function classifyCell({ date, viewDate, viewMode, mode, value, preselectedRange, dateAndTime, isDateFilled, showHolidays, today, buildCellProps, isTheSameItem, isInPeriod, getItemLabel, }: ClassifyCellParams): CellClassification;

package/dist/cjs/hooks/classifyCell.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.classifyCell = classifyCell;
+const constants_1 = require("../constants");
+const utils_1 = require("../utils");
+/**
+ * Классифицирует одну ячейку календаря (`checked` / `holiday` / `rangePosition` / `current` / `another` / `label`).
+ * Date-driven и переиспользуемая: один `viewDate` на сетку, без обращения к `CalendarContext`, фокусу и
+ * `firstNotDisableCell`. Используется и десктопным `useGrid`, и мобильными «стопками» сеток.
+ */
+function classifyCell({ date, viewDate, viewMode, mode, value, preselectedRange, dateAndTime, isDateFilled, showHolidays, today, buildCellProps, isTheSameItem, isInPeriod, getItemLabel, }) {
+    let disabled = false;
+    let holiday;
+    let cellProps = { isDisabled: false };
+    if (buildCellProps) {
+        cellProps = buildCellProps(date, viewMode);
+        disabled = cellProps?.isDisabled ?? false;
+        holiday = cellProps.isHoliday;
+    }
+    if (holiday === undefined) {
+        holiday = showHolidays && (0, utils_1.isWeekend)(date, viewMode);
+    }
+    const dateTimeSelectedValue = isDateFilled()
+        ? new Date(dateAndTime?.year ?? 0, dateAndTime?.month ?? 0, dateAndTime?.day ?? 0)
+        : undefined;
+    const isRangeMode = mode === constants_1.CALENDAR_MODE.DateRange || mode === constants_1.CALENDAR_MODE.MonthRange || mode === constants_1.CALENDAR_MODE.YearRange;
+    const rangePosition = isRangeMode
+        ? (0, utils_1.getInRangePosition)(date, viewMode, preselectedRange || value)
+        : constants_1.RANGE_POSITION.Out;
+    const isSelectedValue = value && !preselectedRange && !dateTimeSelectedValue
+        ? isTheSameItem(value[0], date) || isTheSameItem(value[1], date)
+        : false;
+    const isPreselected = preselectedRange ? isTheSameItem(preselectedRange[0], date) : false;
+    const isDateTimeValueSelected = dateTimeSelectedValue ? isTheSameItem(dateTimeSelectedValue, date) : false;
+    const current = isTheSameItem(today || new Date(), date);
+    return {
+        disabled,
+        holiday: holiday ?? false,
+        rangePosition,
+        current,
+        another: !isInPeriod(viewDate, date),
+        label: getItemLabel(date),
+        checked: isSelectedValue || isPreselected || isDateTimeValueSelected || rangePosition !== constants_1.RANGE_POSITION.Out,
+    };
+}

package/dist/cjs/hooks/index.d.ts

@@ -0,0 +1,7 @@
+export * from './classifyCell';
+export * from './useDateAndTime';
+export * from './useGrid';
+export * from './useCalendarContext';
+export * from './useOpenTrigger';
+export * from './useTimeDrumHandlers';
+export * from './useTimePickerValueBridge';

package/dist/cjs/hooks/index.js

@@ -0,0 +1,23 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./classifyCell"), exports);
+__exportStar(require("./useDateAndTime"), exports);
+__exportStar(require("./useGrid"), exports);
+__exportStar(require("./useCalendarContext"), exports);
+__exportStar(require("./useOpenTrigger"), exports);
+__exportStar(require("./useTimeDrumHandlers"), exports);
+__exportStar(require("./useTimePickerValueBridge"), exports);

package/dist/cjs/hooks/useCalendarContext.d.ts

@@ -0,0 +1 @@
+export declare function useCalendarContext(): import("../helperComponents").CalendarContextType;

package/dist/cjs/hooks/useCalendarContext.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCalendarContext = useCalendarContext;
+const react_1 = require("react");
+const helperComponents_1 = require("../helperComponents");
+function useCalendarContext() {
+    return (0, react_1.useContext)(helperComponents_1.CalendarContext);
+}

package/dist/cjs/hooks/useDateAndTime.d.ts

@@ -0,0 +1,14 @@
+import { DateAndTime, Range, TimeValue } from '../types';
+export declare function useDateAndTime({ showSeconds, value, }: {
+    showSeconds?: boolean;
+    value: Range | TimeValue | undefined;
+}): {
+    dateAndTime: DateAndTime;
+    setDateAndTime: import("react").Dispatch<import("react").SetStateAction<DateAndTime>>;
+    isDateAndTimeFilled: () => boolean;
+    isTimeFilled: () => boolean;
+    isDateFilled: () => boolean;
+    onDateChange: (value: Pick<DateAndTime, "year" | "month" | "day"> | Date) => void;
+    onTimeChange: (value: TimeValue | Date) => void;
+    onDateAndTimeChange: (value: DateAndTime | Date) => void;
+};

package/dist/cjs/hooks/useDateAndTime.js

@@ -0,0 +1,111 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDateAndTime = useDateAndTime;
+const react_1 = require("react");
+const utils_1 = require("../utils");
+function useDateAndTime({ showSeconds, value, }) {
+    const [dateAndTime, setDateAndTime] = (0, react_1.useState)(() => {
+        if (Array.isArray(value)) {
+            const initialValue = value[0];
+            return {
+                year: initialValue.getFullYear(),
+                month: initialValue.getMonth(),
+                day: initialValue.getDate(),
+                hours: initialValue.getHours(),
+                minutes: initialValue.getMinutes(),
+                seconds: initialValue.getSeconds(),
+            };
+        }
+        return {
+            year: undefined,
+            month: undefined,
+            day: undefined,
+            hours: value?.hours,
+            minutes: value?.minutes,
+            seconds: value?.seconds,
+        };
+    });
+    const isDateFilled = (0, react_1.useCallback)(() => {
+        const { year, month, day } = dateAndTime;
+        return [year, month, day].every(value => value !== undefined);
+    }, [dateAndTime]);
+    const isTimeFilled = (0, react_1.useCallback)(() => (0, utils_1.isTimePortionComplete)(dateAndTime, showSeconds), [dateAndTime, showSeconds]);
+    const isDateAndTimeFilled = (0, react_1.useCallback)(() => isTimeFilled() && isDateFilled(), [isDateFilled, isTimeFilled]);
+    const onDateChange = (0, react_1.useCallback)((value) => {
+        if (value instanceof Date) {
+            setDateAndTime(prevDate => ({
+                ...prevDate,
+                year: value.getFullYear(),
+                month: value.getMonth(),
+                day: value.getDate(),
+            }));
+        }
+        else {
+            setDateAndTime(prevDate => ({ ...prevDate, ...value }));
+        }
+    }, []);
+    const onTimeChange = (0, react_1.useCallback)((value) => {
+        if (value instanceof Date) {
+            setDateAndTime(prevDate => ({
+                ...prevDate,
+                hours: value.getHours(),
+                minutes: value.getMinutes(),
+                seconds: value.getSeconds(),
+            }));
+        }
+        else {
+            setDateAndTime(prevDate => ({ ...prevDate, ...value }));
+        }
+    }, []);
+    const onDateAndTimeChange = (0, react_1.useCallback)((value) => {
+        if (value instanceof Date) {
+            setDateAndTime({
+                year: value.getFullYear(),
+                month: value.getMonth(),
+                day: value.getDate(),
+                hours: value.getHours(),
+                minutes: value.getMinutes(),
+                seconds: value.getSeconds(),
+            });
+        }
+        else {
+            setDateAndTime(value);
+        }
+    }, []);
+    /** Левый конец Range из пропа: полный sync только при новом instant, иначе не затираем время до onChange. */
+    const lastSyncedRangeStartMs = (0, react_1.useRef)(null);
+    const lastSyncedTimeValueKey = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        if (!value) {
+            lastSyncedRangeStartMs.current = null;
+            lastSyncedTimeValueKey.current = null;
+            setDateAndTime({});
+            return;
+        }
+        if (Array.isArray(value)) {
+            lastSyncedTimeValueKey.current = null;
+            const rangeStartMs = value[0].getTime();
+            if (lastSyncedRangeStartMs.current !== rangeStartMs) {
+                lastSyncedRangeStartMs.current = rangeStartMs;
+                onDateAndTimeChange(value[0]);
+            }
+            return;
+        }
+        lastSyncedRangeStartMs.current = null;
+        const timeKey = `${value.hours ?? ''}:${value.minutes ?? ''}:${value.seconds ?? ''}`;
+        if (lastSyncedTimeValueKey.current !== timeKey) {
+            lastSyncedTimeValueKey.current = timeKey;
+            onTimeChange(value);
+        }
+    }, [onDateAndTimeChange, onTimeChange, value]);
+    return {
+        dateAndTime,
+        setDateAndTime,
+        isDateAndTimeFilled,
+        isTimeFilled,
+        isDateFilled,
+        onDateChange,
+        onTimeChange,
+        onDateAndTimeChange,
+    };
+}

package/dist/cjs/hooks/useGrid.d.ts

@@ -0,0 +1,13 @@
+import { KeyboardEventHandler } from 'react';
+import { BaseGrid, Cell } from '../types';
+export type UseGridParams = {
+    buildGrid(viewDate: Date): BaseGrid;
+    isTheSameItem(date1: Date, date2: Date): boolean;
+    isInPeriod(viewDate: Date, date: Date): boolean;
+    getItemLabel(date: Date): string;
+    onSelect?(date: Date): void;
+    onPreselect?(date: Date): void;
+    onLeave?(): void;
+    onKeyDown?: KeyboardEventHandler;
+};
+export declare function useGrid({ onSelect, onPreselect, onLeave, buildGrid, isTheSameItem, getItemLabel, isInPeriod, onKeyDown, }: UseGridParams): Cell[][];

package/dist/cjs/hooks/useGrid.js

@@ -0,0 +1,80 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useGrid = useGrid;
+const react_1 = require("react");
+const utils_1 = require("../utils");
+const classifyCell_1 = require("./classifyCell");
+const useCalendarContext_1 = require("./useCalendarContext");
+function useGrid({ onSelect, onPreselect, onLeave, buildGrid, isTheSameItem, getItemLabel, isInPeriod, onKeyDown, }) {
+    const { today, showHolidays, preselectedRange, value, dateAndTime, mode, viewDate, viewMode, focus, buildCellProps, firstNotDisableCell, isDateFilled, } = (0, useCalendarContext_1.useCalendarContext)();
+    return (0, react_1.useMemo)(() => {
+        let hasFocusInGrid = false;
+        let currentItem;
+        let hasFoundFirstNotDisableCell = false;
+        const result = buildGrid(viewDate).map(row => row.map(({ date, address }) => {
+            const classification = (0, classifyCell_1.classifyCell)({
+                date,
+                viewDate,
+                viewMode,
+                mode,
+                value,
+                preselectedRange,
+                dateAndTime,
+                isDateFilled,
+                showHolidays,
+                today,
+                buildCellProps,
+                isTheSameItem,
+                isInPeriod,
+                getItemLabel,
+            });
+            if (!classification.disabled) {
+                if (firstNotDisableCell && !hasFoundFirstNotDisableCell) {
+                    firstNotDisableCell.current = address;
+                    hasFoundFirstNotDisableCell = true;
+                }
+            }
+            const tabIndex = focus && (0, utils_1.stringifyAddress)(address) === focus ? 0 : -1;
+            hasFocusInGrid = tabIndex === 0 || hasFocusInGrid;
+            const cell = {
+                ...classification,
+                date,
+                onLeave,
+                address,
+                tabIndex,
+                onSelect,
+                onPreselect,
+                onKeyDown,
+            };
+            if (classification.current) {
+                currentItem = cell;
+            }
+            return cell;
+        }));
+        if (!hasFocusInGrid) {
+            (currentItem || result[0][0]).tabIndex = 0;
+        }
+        return result;
+    }, [
+        buildCellProps,
+        buildGrid,
+        dateAndTime,
+        firstNotDisableCell,
+        focus,
+        getItemLabel,
+        isDateFilled,
+        isInPeriod,
+        isTheSameItem,
+        mode,
+        onKeyDown,
+        onLeave,
+        onPreselect,
+        onSelect,
+        preselectedRange,
+        showHolidays,
+        today,
+        value,
+        viewDate,
+        viewMode,
+    ]);
+}

package/dist/cjs/hooks/useOpenTrigger.d.ts

@@ -0,0 +1,3 @@
+import { ReactNode } from 'react';
+/** Триггер открытия mobile-dropdown'а: valid element клонируется с onClick, остальное — span с Enter/Space. */
+export declare function useOpenTrigger(children: ReactNode, onOpen: () => void): ReactNode;

package/dist/cjs/hooks/useOpenTrigger.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useOpenTrigger = useOpenTrigger;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+/** Триггер открытия mobile-dropdown'а: valid element клонируется с onClick, остальное — span с Enter/Space. */
+function useOpenTrigger(children, onOpen) {
+    if ((0, react_1.isValidElement)(children)) {
+        return (0, react_1.cloneElement)(children, {
+            onClick: (event) => {
+                children.props.onClick?.(event);
+                onOpen();
+            },
+        });
+    }
+    if (children == null) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsx)("span", { role: 'button', tabIndex: 0, onClick: onOpen, onKeyDown: (event) => {
+            if (event.key === 'Enter' || event.key === ' ') {
+                event.preventDefault();
+                onOpen();
+            }
+        }, children: children }));
+}

package/dist/cjs/hooks/useTimeDrumHandlers.d.ts

@@ -0,0 +1,8 @@
+import { DateAndTime, TimeValue } from '../types';
+export type TimeDrumHandlers = {
+    onHoursChange(next: number): void;
+    onMinutesChange(next: number): void;
+    onSecondsChange(next: number): void;
+};
+/** Обработчики колонок `TimePickerDrum`: меняют одну часть в `dateAndTime`, остальные сохраняют. */
+export declare function useTimeDrumHandlers(dateAndTime: DateAndTime | undefined, onTimeChange: (value: TimeValue | Date) => void): TimeDrumHandlers;

package/dist/cjs/hooks/useTimeDrumHandlers.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTimeDrumHandlers = useTimeDrumHandlers;
+const react_1 = require("react");
+/** Обработчики колонок `TimePickerDrum`: меняют одну часть в `dateAndTime`, остальные сохраняют. */
+function useTimeDrumHandlers(dateAndTime, onTimeChange) {
+    const getTimeChangeHandler = (0, react_1.useCallback)((part) => (next) => {
+        onTimeChange({
+            hours: dateAndTime?.hours ?? 0,
+            minutes: dateAndTime?.minutes ?? 0,
+            seconds: dateAndTime?.seconds ?? 0,
+            [part]: next ?? dateAndTime?.[part] ?? 0,
+        });
+    }, [dateAndTime, onTimeChange]);
+    return {
+        onHoursChange: getTimeChangeHandler('hours'),
+        onMinutesChange: getTimeChangeHandler('minutes'),
+        onSecondsChange: getTimeChangeHandler('seconds'),
+    };
+}

package/dist/cjs/hooks/useTimePickerValueBridge.d.ts

@@ -0,0 +1,22 @@
+import { Range, TimeValue } from '../types';
+import { useDateAndTime } from './useDateAndTime';
+export type UseTimePickerValueBridgeParams = {
+    value?: TimeValue;
+    defaultValue?: TimeValue;
+    onChangeValue?(value: TimeValue): void;
+    showSeconds: boolean;
+};
+export type TimePickerValueBridge = {
+    /** Контролируемое/неконтролируемое значение времени (наружу). */
+    value?: TimeValue;
+    /** Внутреннее `Range`-представление выбранного времени для `CalendarContext.value`. */
+    internalValue?: Range;
+    /** `CalendarContext.setValue` — принимает `Range`, обновляет `internalValue`. */
+    setValue(dates: Range): void;
+} & Pick<ReturnType<typeof useDateAndTime>, 'dateAndTime' | 'onTimeChange' | 'onDateChange' | 'onDateAndTimeChange' | 'isDateFilled' | 'isTimeFilled' | 'isDateAndTimeFilled'>;
+/**
+ * Мост значения для time-picker'ов (desktop popover и mobile bottom sheet): связывает публичное `TimeValue`
+ * с внутренним `dateAndTime` через `Range`-буфер `internalValue`, с защитой от цикла обновлений при внешней
+ * смене `value` (см. `lastValueKeyRef`). Выделен из `TimePickerDropdown`, чтобы обе поверхности шарили логику.
+ */
+export declare function useTimePickerValueBridge({ value: valueProp, defaultValue, onChangeValue, showSeconds, }: UseTimePickerValueBridgeParams): TimePickerValueBridge;

package/dist/cjs/hooks/useTimePickerValueBridge.js

@@ -0,0 +1,74 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTimePickerValueBridge = useTimePickerValueBridge;
+const utils_1 = require("@cloud-ru/ds-utils");
+const react_1 = require("react");
+const utils_2 = require("../utils");
+const useDateAndTime_1 = require("./useDateAndTime");
+/**
+ * Мост значения для time-picker'ов (desktop popover и mobile bottom sheet): связывает публичное `TimeValue`
+ * с внутренним `dateAndTime` через `Range`-буфер `internalValue`, с защитой от цикла обновлений при внешней
+ * смене `value` (см. `lastValueKeyRef`). Выделен из `TimePickerDropdown`, чтобы обе поверхности шарили логику.
+ */
+function useTimePickerValueBridge({ value: valueProp, defaultValue, onChangeValue, showSeconds, }) {
+    const [value, setValueState] = (0, utils_1.useUncontrolledProp)(valueProp, defaultValue, onChangeValue);
+    const setValueEventHandler = (0, utils_1.useEventHandler)(setValueState);
+    const [internalValue, setInternalValue] = (0, react_1.useState)();
+    const previousValueRef = (0, react_1.useRef)(value);
+    (0, react_1.useEffect)(() => {
+        if (!internalValue?.[0]) {
+            return;
+        }
+        const hours = internalValue[0].getHours();
+        const minutes = internalValue[0].getMinutes();
+        const seconds = internalValue[0].getSeconds();
+        setValueEventHandler({ hours, minutes, seconds });
+    }, [internalValue, setValueEventHandler]);
+    const setValue = (0, react_1.useCallback)((dates) => {
+        const newDate = dates[0];
+        setInternalValue([newDate, newDate]);
+    }, []);
+    const { dateAndTime, onTimeChange, onDateChange, onDateAndTimeChange, isDateFilled, isTimeFilled, isDateAndTimeFilled, } = (0, useDateAndTime_1.useDateAndTime)({ showSeconds, value });
+    // Этот эффект распространяет правки времени из пикера (dateAndTime) → value. Внешнее изменение
+    // `value` синхронизируется в dateAndTime ОТДЕЛЬНЫМ эффектом (useDateAndTime), который отрабатывает
+    // на рендер позже. Без guard'а в цикле внешней смены value этот эффект видит УСТАРЕВШИЙ dateAndTime
+    // и эмитит его обратно, откатывая внешнее значение → бесконечный ре-рендер. Поэтому в цикл, где
+    // value изменился извне, эмит пропускаем и даём dateAndTime догнаться.
+    const lastValueKeyRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        const wasValueCleared = value === undefined && previousValueRef.current !== undefined;
+        previousValueRef.current = value;
+        // Ключ внешнего value: если он изменился с прошлого рендера, значит value пришёл извне,
+        // а dateAndTime ещё не догнался — эмит в этом цикле пропускаем.
+        const valueKey = value ? `${value.hours}:${value.minutes}:${value.seconds}` : null;
+        const externalValueChanged = valueKey !== lastValueKeyRef.current;
+        lastValueKeyRef.current = valueKey;
+        if (wasValueCleared) {
+            return;
+        }
+        if (!(0, utils_2.isTimePortionComplete)(dateAndTime, showSeconds)) {
+            return;
+        }
+        const next = {
+            hours: dateAndTime.hours ?? 0,
+            minutes: dateAndTime.minutes ?? 0,
+            seconds: dateAndTime.seconds ?? 0,
+        };
+        if ((0, utils_2.timeValuesEqual)(value, next) || externalValueChanged) {
+            return;
+        }
+        setValueEventHandler(next);
+    }, [dateAndTime, showSeconds, setValueEventHandler, value]);
+    return {
+        value,
+        internalValue,
+        setValue,
+        dateAndTime,
+        onTimeChange,
+        onDateChange,
+        onDateAndTimeChange,
+        isDateFilled,
+        isTimeFilled,
+        isDateAndTimeFilled,
+    };
+}

package/dist/cjs/index.d.ts

@@ -0,0 +1,4 @@
+export * from './components';
+export * from './constants';
+export * from './types';
+export * from './locale';