@skbkontur/react-ui 6.1.6 → 6.1.7-65057.0

package/components/TimePicker/hooks/useTimePickerSelection.js

@@ -0,0 +1,66 @@
+import { useCallback, useLayoutEffect, useState } from 'react';
+export var useTimePickerSelection = function (options) {
+    var isInputFocused = options.isInputFocused, format = options.format, displayValue = options.displayValue, getInput = options.getInput;
+    var _a = useState('hours'), selection = _a[0], setSelectionState = _a[1];
+    var selectedSegment = selection === 'all' ? 'hours' : selection;
+    var applySelectionToInput = useCallback(function (nextSelection) {
+        var currentInput = getInput();
+        if (!currentInput) {
+            return;
+        }
+        var node = currentInput.getNode();
+        var isInputActive = (node === null || node === void 0 ? void 0 : node.ownerDocument.activeElement) === node;
+        var applySelection = function (input) {
+            if (nextSelection === 'all') {
+                input.selectAll();
+                return;
+            }
+            input.selectSegment(nextSelection);
+        };
+        if (isInputActive) {
+            applySelection(currentInput);
+            return;
+        }
+        setTimeout(function () {
+            var nextInput = getInput();
+            if (!nextInput) {
+                return;
+            }
+            nextInput.focus();
+            applySelection(nextInput);
+        }, 0);
+    }, [getInput]);
+    var selectSegment = useCallback(function (segment) {
+        if (segment === 'seconds' && format === 'HH:mm') {
+            return;
+        }
+        setSelectionState(segment);
+        applySelectionToInput(segment);
+    }, [applySelectionToInput, format]);
+    var selectAll = useCallback(function () {
+        setSelectionState('all');
+        applySelectionToInput('all');
+    }, [applySelectionToInput]);
+    var syncSelectionWithDOM = useCallback(function () {
+        var _a;
+        if (!((_a = getInput()) === null || _a === void 0 ? void 0 : _a.isAllSelected())) {
+            return false;
+        }
+        setSelectionState('all');
+        return true;
+    }, [getInput]);
+    useLayoutEffect(function () {
+        if (!isInputFocused || !getInput()) {
+            return;
+        }
+        applySelectionToInput(selection);
+    }, [applySelectionToInput, displayValue, getInput, isInputFocused, selection]);
+    return {
+        selection: selection,
+        selectedSegment: selectedSegment,
+        selectSegment: selectSegment,
+        selectAll: selectAll,
+        syncSelectionWithDOM: syncSelectionWithDOM,
+    };
+};
+//# sourceMappingURL=useTimePickerSelection.js.map

package/components/TimePicker/hooks/useTimePickerSelection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTimePickerSelection.js","sourceRoot":"","sources":["useTimePickerSelection.ts"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useLayoutEffect, useState } from 'react';\n\nimport type { TimeInputRef } from '../../../internal/TimeInput/index.js';\nimport type { TimeFormat, TimeSegment } from '../helpers/TimePicker.shared.js';\n\ntype TimePickerSelection = TimeSegment | 'all';\n\ninterface UseTimePickerSelectionOptions {\n  isInputFocused: boolean;\n  format: TimeFormat;\n  getInput: () => TimeInputRef | null;\n  displayValue: string;\n}\ninterface UseTimePickerSelectionResult {\n  selection: TimePickerSelection;\n  selectedSegment: TimeSegment;\n  selectSegment: (segment: TimeSegment) => void;\n  selectAll: () => void;\n  syncSelectionWithDOM: () => boolean;\n}\nexport const useTimePickerSelection = (options: UseTimePickerSelectionOptions): UseTimePickerSelectionResult => {\n  const { isInputFocused, format, displayValue, getInput } = options;\n\n  const [selection, setSelectionState] = useState<TimePickerSelection>('hours');\n\n  const selectedSegment = selection === 'all' ? 'hours' : selection;\n\n  const applySelectionToInput = useCallback(\n    (nextSelection: TimePickerSelection) => {\n      const currentInput = getInput();\n\n      if (!currentInput) {\n        return;\n      }\n\n      const node = currentInput.getNode();\n      const isInputActive = node?.ownerDocument.activeElement === node;\n\n      const applySelection = (input: TimeInputRef) => {\n        if (nextSelection === 'all') {\n          input.selectAll();\n          return;\n        }\n\n        input.selectSegment(nextSelection);\n      };\n\n      if (isInputActive) {\n        applySelection(currentInput);\n        return;\n      }\n\n      setTimeout(() => {\n        const nextInput = getInput();\n\n        if (!nextInput) {\n          return;\n        }\n\n        nextInput.focus();\n        applySelection(nextInput);\n      }, 0);\n    },\n    [getInput],\n  );\n\n  const selectSegment = useCallback(\n    (segment: TimeSegment) => {\n      if (segment === 'seconds' && format === 'HH:mm') {\n        return;\n      }\n\n      setSelectionState(segment);\n      applySelectionToInput(segment);\n    },\n    [applySelectionToInput, format],\n  );\n\n  const selectAll = useCallback(() => {\n    setSelectionState('all');\n    applySelectionToInput('all');\n  }, [applySelectionToInput]);\n\n  const syncSelectionWithDOM = useCallback(() => {\n    if (!getInput()?.isAllSelected()) {\n      return false;\n    }\n\n    setSelectionState('all');\n    return true;\n  }, [getInput]);\n\n  useLayoutEffect(() => {\n    if (!isInputFocused || !getInput()) {\n      return;\n    }\n\n    applySelectionToInput(selection);\n  }, [applySelectionToInput, displayValue, getInput, isInputFocused, selection]);\n\n  return {\n    selection,\n    selectedSegment,\n    selectSegment,\n    selectAll,\n    syncSelectionWithDOM,\n  };\n};\n"]}

package/components/TimePicker/hooks/useTimePickerSource.d.ts

@@ -0,0 +1,27 @@
+import type { TimeFormat, TimeItemValue, TimePickerExtendedItem, TimePickerSource } from '../helpers/TimePicker.shared.js';
+interface UseTimePickerSourceOptions<T extends TimeItemValue> {
+    source?: TimePickerSource<T>;
+    format: TimeFormat;
+    isDropdownOpened: boolean;
+    /** Текущий запрос: введенные цифры сегментов с сохранением их позиций. */
+    filterQuery: string;
+}
+interface UseTimePickerSourceResult<T extends TimeItemValue> {
+    /** Элементы источника, готовые к фильтрации и отрисовке. */
+    items: Array<TimePickerExtendedItem<T>>;
+    /** Запрос, для которого получены текущие элементы функции-источника. */
+    fetchedQuery: string | null;
+    isLoading: boolean;
+}
+/**
+ * Отдает элементы выпадающего списка из массива или функции-источника.
+ *
+ * Функция вызывается только для открытого меню и на каждый новый запрос;
+ * ответ на устаревший запрос отбрасывается, а отказ трактуется как пустой результат.
+ * При закрытии меню результаты функции сбрасываются, чтобы следующее открытие
+ * не показывало элементы для старого запроса.
+ * Замена самой функции уже открытый список не перезапрашивает: актуальная функция
+ * используется при следующем запросе.
+ */
+export declare const useTimePickerSource: <T extends TimeItemValue>(options: UseTimePickerSourceOptions<T>) => UseTimePickerSourceResult<T>;
+export {};

package/components/TimePicker/hooks/useTimePickerSource.js

@@ -0,0 +1,59 @@
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { sanitizeTimeItems } from '../helpers/TimePicker.value.js';
+/** Общая пустая коллекция элементов: не создает новую ссылку на каждый рендер. */
+var EMPTY_ITEMS = [];
+/**
+ * Отдает элементы выпадающего списка из массива или функции-источника.
+ *
+ * Функция вызывается только для открытого меню и на каждый новый запрос;
+ * ответ на устаревший запрос отбрасывается, а отказ трактуется как пустой результат.
+ * При закрытии меню результаты функции сбрасываются, чтобы следующее открытие
+ * не показывало элементы для старого запроса.
+ * Замена самой функции уже открытый список не перезапрашивает: актуальная функция
+ * используется при следующем запросе.
+ */
+export var useTimePickerSource = function (options) {
+    var source = options.source, format = options.format, isDropdownOpened = options.isDropdownOpened, filterQuery = options.filterQuery;
+    var isSourceFunction = typeof source === 'function';
+    var _a = useState([]), fetchedItems = _a[0], setFetchedItems = _a[1];
+    var _b = useState(null), fetchedQuery = _b[0], setFetchedQuery = _b[1];
+    var _c = useState(false), isLoading = _c[0], setIsLoading = _c[1];
+    var sourceRef = useRef(source);
+    sourceRef.current = source;
+    useEffect(function () {
+        var currentSource = sourceRef.current;
+        if (typeof currentSource !== 'function' || !isDropdownOpened) {
+            setIsLoading(false);
+            return;
+        }
+        var cancelled = false;
+        setIsLoading(true);
+        new Promise(function (resolve) { return resolve(currentSource(filterQuery)); }).then(function (nextItems) {
+            if (!cancelled) {
+                setFetchedItems(nextItems);
+                setFetchedQuery(filterQuery);
+                setIsLoading(false);
+            }
+        }, function () {
+            if (!cancelled) {
+                setFetchedItems([]);
+                setFetchedQuery(filterQuery);
+                setIsLoading(false);
+            }
+        });
+        return function () {
+            cancelled = true;
+        };
+    }, [filterQuery, isDropdownOpened, isSourceFunction]);
+    useEffect(function () {
+        if (isDropdownOpened || !isSourceFunction) {
+            return;
+        }
+        setFetchedItems(EMPTY_ITEMS);
+        setFetchedQuery(null);
+    }, [isDropdownOpened, isSourceFunction]);
+    var sourceItems = useMemo(function () { return (Array.isArray(source) ? source : EMPTY_ITEMS); }, [source]);
+    var items = useMemo(function () { return sanitizeTimeItems(isSourceFunction ? fetchedItems : sourceItems, format); }, [fetchedItems, format, isSourceFunction, sourceItems]);
+    return { items: items, fetchedQuery: fetchedQuery, isLoading: isLoading };
+};
+//# sourceMappingURL=useTimePickerSource.js.map

package/components/TimePicker/hooks/useTimePickerSource.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTimePickerSource.js","sourceRoot":"","sources":["useTimePickerSource.ts"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useMemo, useRef, useState } from 'react';\n\nimport type {\n  TimeFormat,\n  TimeItemValue,\n  TimePickerExtendedItem,\n  TimePickerSource,\n} from '../helpers/TimePicker.shared.js';\nimport { sanitizeTimeItems } from '../helpers/TimePicker.value.js';\n\n/** Общая пустая коллекция элементов: не создает новую ссылку на каждый рендер. */\nconst EMPTY_ITEMS: never[] = [];\n\ninterface UseTimePickerSourceOptions<T extends TimeItemValue> {\n  source?: TimePickerSource<T>;\n  format: TimeFormat;\n  isDropdownOpened: boolean;\n  /** Текущий запрос: введенные цифры сегментов с сохранением их позиций. */\n  filterQuery: string;\n}\n\ninterface UseTimePickerSourceResult<T extends TimeItemValue> {\n  /** Элементы источника, готовые к фильтрации и отрисовке. */\n  items: Array<TimePickerExtendedItem<T>>;\n  /** Запрос, для которого получены текущие элементы функции-источника. */\n  fetchedQuery: string | null;\n  isLoading: boolean;\n}\n\n/**\n * Отдает элементы выпадающего списка из массива или функции-источника.\n *\n * Функция вызывается только для открытого меню и на каждый новый запрос;\n * ответ на устаревший запрос отбрасывается, а отказ трактуется как пустой результат.\n * При закрытии меню результаты функции сбрасываются, чтобы следующее открытие\n * не показывало элементы для старого запроса.\n * Замена самой функции уже открытый список не перезапрашивает: актуальная функция\n * используется при следующем запросе.\n */\nexport const useTimePickerSource = <T extends TimeItemValue>(\n  options: UseTimePickerSourceOptions<T>,\n): UseTimePickerSourceResult<T> => {\n  const { source, format, isDropdownOpened, filterQuery } = options;\n\n  const isSourceFunction = typeof source === 'function';\n\n  const [fetchedItems, setFetchedItems] = useState<Array<TimePickerExtendedItem<T>>>([]);\n  const [fetchedQuery, setFetchedQuery] = useState<string | null>(null);\n  const [isLoading, setIsLoading] = useState(false);\n\n  const sourceRef = useRef(source);\n  sourceRef.current = source;\n\n  useEffect(() => {\n    const currentSource = sourceRef.current;\n\n    if (typeof currentSource !== 'function' || !isDropdownOpened) {\n      setIsLoading(false);\n      return;\n    }\n\n    let cancelled = false;\n\n    setIsLoading(true);\n\n    new Promise<Array<TimePickerExtendedItem<T>>>((resolve) => resolve(currentSource(filterQuery))).then(\n      (nextItems) => {\n        if (!cancelled) {\n          setFetchedItems(nextItems);\n          setFetchedQuery(filterQuery);\n          setIsLoading(false);\n        }\n      },\n      () => {\n        if (!cancelled) {\n          setFetchedItems([]);\n          setFetchedQuery(filterQuery);\n          setIsLoading(false);\n        }\n      },\n    );\n\n    return () => {\n      cancelled = true;\n    };\n  }, [filterQuery, isDropdownOpened, isSourceFunction]);\n\n  useEffect(() => {\n    if (isDropdownOpened || !isSourceFunction) {\n      return;\n    }\n\n    setFetchedItems(EMPTY_ITEMS);\n    setFetchedQuery(null);\n  }, [isDropdownOpened, isSourceFunction]);\n\n  const sourceItems = useMemo(() => (Array.isArray(source) ? source : EMPTY_ITEMS), [source]);\n\n  const items = useMemo(\n    () => sanitizeTimeItems(isSourceFunction ? fetchedItems : sourceItems, format),\n    [fetchedItems, format, isSourceFunction, sourceItems],\n  );\n\n  return { items, fetchedQuery, isLoading };\n};\n"]}

package/components/TimePicker/hooks/useTimePickerValue.d.ts

@@ -0,0 +1,33 @@
+import type { RefObject } from 'react';
+import { type TimeFormat, type TimeItemValue } from '../helpers/TimePicker.shared.js';
+interface UseTimePickerValueOptions {
+    isInputFocused: boolean;
+    /** Внешнее значение, приведенное к строке времени. */
+    externalValue: string;
+    /**
+     * Значением управляет родитель: проп `value` задан.
+     * Если проп не задан, компонент неконтролируемый и хранит значение сам,
+     * поэтому внешнее пустое значение не должно затирать введенное пользователем.
+     */
+    isValueControlled: boolean;
+    format: TimeFormat;
+    /**
+     * Вызывается при коммите значения: получает нормализованное время
+     * и элемент из `source`, если значение выбрано в выпадающем меню.
+     */
+    onCommitValue(value: string, item: TimeItemValue | null): void;
+    onInputValueChange?(value: string): void;
+}
+interface UseTimePickerValueResult {
+    editingValue: string;
+    editingValueRef: RefObject<string>;
+    setEditingValue(value: string): void;
+    updateEditingValue(value: string): void;
+    commitEditingValue(): string;
+    /** Коммитит значение, введенное пользователем. Не эмитит повторно то же самое время. */
+    commitValue(value: string, item?: TimeItemValue | null): string;
+    /** Коммитит элемент, выбранный в выпадающем меню. Эмитит всегда, так как это явное действие пользователя. */
+    commitItem(item: TimeItemValue): string;
+}
+export declare const useTimePickerValue: (options: UseTimePickerValueOptions) => UseTimePickerValueResult;
+export {};

package/components/TimePicker/hooks/useTimePickerValue.js

@@ -0,0 +1,97 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+import warning from 'warning';
+import { EMPTY_VALUE } from '../helpers/TimePicker.constants.js';
+import { getTimeItemValue } from '../helpers/TimePicker.shared.js';
+import { getExternalTimeDisplayValue, isTimeDisplayEmpty, normalizeTimeValue, serializeTimeValue, } from '../helpers/TimePicker.value.js';
+export var useTimePickerValue = function (options) {
+    var externalValue = options.externalValue, isValueControlled = options.isValueControlled, format = options.format, isInputFocused = options.isInputFocused, onCommitValue = options.onCommitValue, onInputValueChange = options.onInputValueChange;
+    var externalEditingValue = getExternalTimeDisplayValue(externalValue, format);
+    var _a = useState(externalEditingValue), editingValue = _a[0], setEditingValueState = _a[1];
+    var editingValueRef = useRef(editingValue);
+    var emittedInputValueRef = useRef(externalValue);
+    var emittedValueRef = useRef(externalValue);
+    var lastEmittedValueRef = useRef(externalValue);
+    /**
+     * Синхронизирует счетчики отданных значений с внешним значением.
+     * Коммит сравнивает время в нормализованной форме, поэтому счетчик закоммиченного значения хранит ее:
+     * иначе внешнее `9:00` или `09:00:00` в формате `HH:mm` выглядело бы как изменение
+     * и поле коммитило бы его заново, собирая элемент вместо исходного.
+     * Остальные счетчики хранят значение как есть: с ними сравнивают частичное значение и то,
+     * что вернул родитель.
+     */
+    var syncEmittedValues = useCallback(function (nextValue) {
+        emittedInputValueRef.current = nextValue;
+        emittedValueRef.current = normalizeTimeValue(nextValue, format);
+        lastEmittedValueRef.current = nextValue;
+    }, [format]);
+    var setEditingValue = useCallback(function (nextEditingValue) {
+        editingValueRef.current = nextEditingValue;
+        setEditingValueState(nextEditingValue);
+    }, []);
+    var emitInputValue = useCallback(function (nextValue) {
+        if (emittedInputValueRef.current !== nextValue) {
+            emittedInputValueRef.current = nextValue;
+            lastEmittedValueRef.current = nextValue;
+            onInputValueChange === null || onInputValueChange === void 0 ? void 0 : onInputValueChange(nextValue);
+        }
+    }, [onInputValueChange]);
+    var emitValue = useCallback(function (nextValue, item) {
+        emittedInputValueRef.current = nextValue;
+        emittedValueRef.current = nextValue;
+        lastEmittedValueRef.current = nextValue;
+        onCommitValue(nextValue, item);
+    }, [onCommitValue]);
+    var updateEditingValue = useCallback(function (nextEditingValue) {
+        setEditingValue(nextEditingValue);
+        emitInputValue(serializeTimeValue(nextEditingValue, format));
+    }, [emitInputValue, format, setEditingValue]);
+    var commitValue = useCallback(function (nextValue, item) {
+        if (item === void 0) { item = null; }
+        var normalizedValue = normalizeTimeValue(nextValue, format);
+        setEditingValue(normalizedValue);
+        if (emittedValueRef.current !== normalizedValue) {
+            emitValue(normalizedValue, item);
+        }
+        return normalizedValue;
+    }, [emitValue, format, setEditingValue]);
+    var commitItem = useCallback(function (item) {
+        var normalizedValue = normalizeTimeValue(getTimeItemValue(item), format);
+        setEditingValue(normalizedValue);
+        emitValue(normalizedValue, item);
+        return normalizedValue;
+    }, [emitValue, format, setEditingValue]);
+    var commitEditingValue = useCallback(function () {
+        var currentEditingValue = editingValueRef.current;
+        if (isTimeDisplayEmpty(currentEditingValue)) {
+            return commitValue(EMPTY_VALUE);
+        }
+        return commitValue(currentEditingValue);
+    }, [commitValue, editingValueRef]);
+    var initialIsValueControlledRef = useRef(isValueControlled);
+    useEffect(function () {
+        warning(initialIsValueControlledRef.current === isValueControlled, isValueControlled
+            ? '[TimePicker]: a component is changing an uncontrolled value to be controlled. ' +
+                'Decide between using a controlled or uncontrolled value for the lifetime of the component.'
+            : '[TimePicker]: a component is changing a controlled value to be uncontrolled. ' +
+                'Pass an empty string or null instead of undefined to keep the value controlled.');
+    }, [isValueControlled]);
+    useEffect(function () {
+        if (!isValueControlled) {
+            return;
+        }
+        if (!isInputFocused || externalValue !== lastEmittedValueRef.current) {
+            setEditingValue(externalEditingValue);
+        }
+        syncEmittedValues(externalValue);
+    }, [externalEditingValue, externalValue, isInputFocused, isValueControlled, setEditingValue, syncEmittedValues]);
+    return {
+        editingValue: editingValue,
+        editingValueRef: editingValueRef,
+        setEditingValue: setEditingValue,
+        updateEditingValue: updateEditingValue,
+        commitEditingValue: commitEditingValue,
+        commitValue: commitValue,
+        commitItem: commitItem,
+    };
+};
+//# sourceMappingURL=useTimePickerValue.js.map

package/components/TimePicker/hooks/useTimePickerValue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTimePickerValue.js","sourceRoot":"","sources":["useTimePickerValue.ts"],"names":[],"mappings":"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","sourcesContent":["import type { RefObject } from 'react';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport warning from 'warning';\n\nimport { EMPTY_VALUE } from '../helpers/TimePicker.constants.js';\nimport { getTimeItemValue, type TimeFormat, type TimeItemValue } from '../helpers/TimePicker.shared.js';\nimport {\n  getExternalTimeDisplayValue,\n  isTimeDisplayEmpty,\n  normalizeTimeValue,\n  serializeTimeValue,\n} from '../helpers/TimePicker.value.js';\n\ninterface UseTimePickerValueOptions {\n  isInputFocused: boolean;\n  /** Внешнее значение, приведенное к строке времени. */\n  externalValue: string;\n  /**\n   * Значением управляет родитель: проп `value` задан.\n   * Если проп не задан, компонент неконтролируемый и хранит значение сам,\n   * поэтому внешнее пустое значение не должно затирать введенное пользователем.\n   */\n  isValueControlled: boolean;\n  format: TimeFormat;\n  /**\n   * Вызывается при коммите значения: получает нормализованное время\n   * и элемент из `source`, если значение выбрано в выпадающем меню.\n   */\n  onCommitValue(value: string, item: TimeItemValue | null): void;\n  onInputValueChange?(value: string): void;\n}\n\ninterface UseTimePickerValueResult {\n  editingValue: string;\n  editingValueRef: RefObject<string>;\n  setEditingValue(value: string): void;\n  updateEditingValue(value: string): void;\n  commitEditingValue(): string;\n  /** Коммитит значение, введенное пользователем. Не эмитит повторно то же самое время. */\n  commitValue(value: string, item?: TimeItemValue | null): string;\n  /** Коммитит элемент, выбранный в выпадающем меню. Эмитит всегда, так как это явное действие пользователя. */\n  commitItem(item: TimeItemValue): string;\n}\n\nexport const useTimePickerValue = (options: UseTimePickerValueOptions): UseTimePickerValueResult => {\n  const { externalValue, isValueControlled, format, isInputFocused, onCommitValue, onInputValueChange } = options;\n\n  const externalEditingValue = getExternalTimeDisplayValue(externalValue, format);\n\n  const [editingValue, setEditingValueState] = useState<string>(externalEditingValue);\n\n  const editingValueRef = useRef(editingValue);\n  const emittedInputValueRef = useRef(externalValue);\n  const emittedValueRef = useRef(externalValue);\n  const lastEmittedValueRef = useRef(externalValue);\n\n  /**\n   * Синхронизирует счетчики отданных значений с внешним значением.\n   * Коммит сравнивает время в нормализованной форме, поэтому счетчик закоммиченного значения хранит ее:\n   * иначе внешнее `9:00` или `09:00:00` в формате `HH:mm` выглядело бы как изменение\n   * и поле коммитило бы его заново, собирая элемент вместо исходного.\n   * Остальные счетчики хранят значение как есть: с ними сравнивают частичное значение и то,\n   * что вернул родитель.\n   */\n  const syncEmittedValues = useCallback(\n    (nextValue: string) => {\n      emittedInputValueRef.current = nextValue;\n      emittedValueRef.current = normalizeTimeValue(nextValue, format);\n      lastEmittedValueRef.current = nextValue;\n    },\n    [format],\n  );\n\n  const setEditingValue = useCallback((nextEditingValue: string) => {\n    editingValueRef.current = nextEditingValue;\n    setEditingValueState(nextEditingValue);\n  }, []);\n\n  const emitInputValue = useCallback(\n    (nextValue: string) => {\n      if (emittedInputValueRef.current !== nextValue) {\n        emittedInputValueRef.current = nextValue;\n        lastEmittedValueRef.current = nextValue;\n        onInputValueChange?.(nextValue);\n      }\n    },\n    [onInputValueChange],\n  );\n\n  const emitValue = useCallback(\n    (nextValue: string, item: TimeItemValue | null) => {\n      emittedInputValueRef.current = nextValue;\n      emittedValueRef.current = nextValue;\n      lastEmittedValueRef.current = nextValue;\n      onCommitValue(nextValue, item);\n    },\n    [onCommitValue],\n  );\n\n  const updateEditingValue = useCallback(\n    (nextEditingValue: string) => {\n      setEditingValue(nextEditingValue);\n      emitInputValue(serializeTimeValue(nextEditingValue, format));\n    },\n    [emitInputValue, format, setEditingValue],\n  );\n\n  const commitValue = useCallback(\n    (nextValue: string, item: TimeItemValue | null = null): string => {\n      const normalizedValue = normalizeTimeValue(nextValue, format);\n\n      setEditingValue(normalizedValue);\n\n      if (emittedValueRef.current !== normalizedValue) {\n        emitValue(normalizedValue, item);\n      }\n\n      return normalizedValue;\n    },\n    [emitValue, format, setEditingValue],\n  );\n\n  const commitItem = useCallback(\n    (item: TimeItemValue): string => {\n      const normalizedValue = normalizeTimeValue(getTimeItemValue(item), format);\n\n      setEditingValue(normalizedValue);\n      emitValue(normalizedValue, item);\n\n      return normalizedValue;\n    },\n    [emitValue, format, setEditingValue],\n  );\n\n  const commitEditingValue = useCallback((): string => {\n    const currentEditingValue = editingValueRef.current;\n\n    if (isTimeDisplayEmpty(currentEditingValue)) {\n      return commitValue(EMPTY_VALUE);\n    }\n\n    return commitValue(currentEditingValue);\n  }, [commitValue, editingValueRef]);\n\n  const initialIsValueControlledRef = useRef(isValueControlled);\n\n  useEffect(() => {\n    warning(\n      initialIsValueControlledRef.current === isValueControlled,\n      isValueControlled\n        ? '[TimePicker]: a component is changing an uncontrolled value to be controlled. ' +\n            'Decide between using a controlled or uncontrolled value for the lifetime of the component.'\n        : '[TimePicker]: a component is changing a controlled value to be uncontrolled. ' +\n            'Pass an empty string or null instead of undefined to keep the value controlled.',\n    );\n  }, [isValueControlled]);\n\n  useEffect(() => {\n    if (!isValueControlled) {\n      return;\n    }\n\n    if (!isInputFocused || externalValue !== lastEmittedValueRef.current) {\n      setEditingValue(externalEditingValue);\n    }\n\n    syncEmittedValues(externalValue);\n  }, [externalEditingValue, externalValue, isInputFocused, isValueControlled, setEditingValue, syncEmittedValues]);\n\n  return {\n    editingValue,\n    editingValueRef,\n    setEditingValue,\n    updateEditingValue,\n    commitEditingValue,\n    commitValue,\n    commitItem,\n  };\n};\n"]}

package/components/TimePicker/index.d.ts

@@ -0,0 +1,4 @@
+export * from './TimePicker.js';
+export { TimePickerDataTids } from './helpers/TimePicker.constants.js';
+export type { TimePickerValidationOptions } from './helpers/validateTimePicker.js';
+export type { TimeFormat, TimeSegment, TimeItem, TimeItemValue, TimePickerExtendedItem, TimePickerMenuItem, TimePickerResolvedItem, TimePickerSource, TimePickerValue, TimePickerValueToItem, } from './helpers/TimePicker.shared.js';

package/components/TimePicker/index.js

@@ -0,0 +1,3 @@
+export * from './TimePicker.js';
+export { TimePickerDataTids } from './helpers/TimePicker.constants.js';
+//# sourceMappingURL=index.js.map

package/components/TimePicker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC","sourcesContent":["export * from './TimePicker.js';\nexport { TimePickerDataTids } from './helpers/TimePicker.constants.js';\nexport type { TimePickerValidationOptions } from './helpers/validateTimePicker.js';\nexport type {\n  TimeFormat,\n  TimeSegment,\n  TimeItem,\n  TimeItemValue,\n  TimePickerExtendedItem,\n  TimePickerMenuItem,\n  TimePickerResolvedItem,\n  TimePickerSource,\n  TimePickerValue,\n  TimePickerValueToItem,\n} from './helpers/TimePicker.shared.js';\n"]}

package/components/TimePicker/locale/index.d.ts

@@ -0,0 +1,4 @@
+import { LocaleHelper } from '../../../lib/locale/LocaleHelper.js';
+import type { TimePickerLocale } from './types.js';
+export * from './types.js';
+export declare const TimePickerLocaleHelper: LocaleHelper<TimePickerLocale>;

package/components/TimePicker/locale/index.js

@@ -0,0 +1,9 @@
+import { LocaleHelper } from '../../../lib/locale/LocaleHelper.js';
+import { componentsLocales as en_GB } from './locales/en.js';
+import { componentsLocales as ru_RU } from './locales/ru.js';
+export * from './types.js';
+export var TimePickerLocaleHelper = new LocaleHelper({
+    ru_RU: ru_RU,
+    en_GB: en_GB,
+});
+//# sourceMappingURL=index.js.map

package/components/TimePicker/locale/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AACnE,OAAO,EAAE,iBAAiB,IAAI,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,iBAAiB,IAAI,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAG7D,cAAc,YAAY,CAAC;AAE3B,MAAM,CAAC,IAAM,sBAAsB,GAAG,IAAI,YAAY,CAAmB;IACvE,KAAK,OAAA;IACL,KAAK,OAAA;CACN,CAAC,CAAC","sourcesContent":["import { LocaleHelper } from '../../../lib/locale/LocaleHelper.js';\nimport { componentsLocales as en_GB } from './locales/en.js';\nimport { componentsLocales as ru_RU } from './locales/ru.js';\nimport type { TimePickerLocale } from './types.js';\n\nexport * from './types.js';\n\nexport const TimePickerLocaleHelper = new LocaleHelper<TimePickerLocale>({\n  ru_RU,\n  en_GB,\n});\n"]}

package/components/TimePicker/locale/locales/en.d.ts

@@ -0,0 +1,2 @@
+import type { TimePickerLocale } from '../types.js';
+export declare const componentsLocales: TimePickerLocale;

package/components/TimePicker/locale/locales/en.js

@@ -0,0 +1,5 @@
+export var componentsLocales = {
+    ariaPlaceholderHHMM: 'hh:mm',
+    ariaPlaceholderHHMMSS: 'hh:mm:ss',
+};
+//# sourceMappingURL=en.js.map

package/components/TimePicker/locale/locales/en.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"en.js","sourceRoot":"","sources":["en.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,iBAAiB,GAAqB;IACjD,mBAAmB,EAAE,OAAO;IAC5B,qBAAqB,EAAE,UAAU;CAClC,CAAC","sourcesContent":["import type { TimePickerLocale } from '../types.js';\n\nexport const componentsLocales: TimePickerLocale = {\n  ariaPlaceholderHHMM: 'hh:mm',\n  ariaPlaceholderHHMMSS: 'hh:mm:ss',\n};\n"]}

package/components/TimePicker/locale/locales/ru.d.ts

@@ -0,0 +1,2 @@
+import type { TimePickerLocale } from '../types.js';
+export declare const componentsLocales: TimePickerLocale;

package/components/TimePicker/locale/locales/ru.js

@@ -0,0 +1,5 @@
+export var componentsLocales = {
+    ariaPlaceholderHHMM: 'чч:мм',
+    ariaPlaceholderHHMMSS: 'чч:мм:сс',
+};
+//# sourceMappingURL=ru.js.map

package/components/TimePicker/locale/locales/ru.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ru.js","sourceRoot":"","sources":["ru.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,iBAAiB,GAAqB;IACjD,mBAAmB,EAAE,OAAO;IAC5B,qBAAqB,EAAE,UAAU;CAClC,CAAC","sourcesContent":["import type { TimePickerLocale } from '../types.js';\n\nexport const componentsLocales: TimePickerLocale = {\n  ariaPlaceholderHHMM: 'чч:мм',\n  ariaPlaceholderHHMMSS: 'чч:мм:сс',\n};\n"]}

package/components/TimePicker/locale/types.d.ts

@@ -0,0 +1,4 @@
+export interface TimePickerLocale {
+    ariaPlaceholderHHMM: string;
+    ariaPlaceholderHHMMSS: string;
+}

package/components/TimePicker/locale/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/components/TimePicker/locale/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["types.ts"],"names":[],"mappings":"","sourcesContent":["export interface TimePickerLocale {\n  ariaPlaceholderHHMM: string;\n  ariaPlaceholderHHMMSS: string;\n}\n"]}

package/components/Toggle/Toggle.d.ts

@@ -39,6 +39,8 @@ export interface ToggleProps extends Pick<AriaAttributes, 'aria-label' | 'aria-d
     onBlur?: React.FocusEventHandler<HTMLInputElement>;
     /** Отключает анимацию. */
     disableAnimations?: boolean;
+    /** Задаёт второстепенный пояснительный текст под основным текстом тогла. */
+    comment?: React.ReactNode;
 }
 export interface ToggleState {
     checked?: boolean;
@@ -80,7 +82,10 @@ export declare class Toggle extends React.Component<ToggleProps, ToggleState> {
     private getRootSizeClassName;
     private getInputSizeClassName;
     private getCaptionSizeClassName;
+    private getSubcaptionSizeClassName;
     private renderMain;
+    private renderCaption;
+    private renderComment;
     private inputRef;
     private handleChange;
     private handleFocus;

package/components/Toggle/Toggle.js

@@ -181,9 +181,20 @@ var Toggle = /** @class */ (function (_super) {
                 return this.styles.captionSmall(this.theme);
         }
     };
+    Toggle.prototype.getSubcaptionSizeClassName = function () {
+        switch (this.size) {
+            case 'large':
+                return this.styles.subcaptionLarge(this.theme);
+            case 'medium':
+                return this.styles.subcaptionMedium(this.theme);
+            case 'small':
+            default:
+                return this.styles.subcaptionSmall(this.theme);
+        }
+    };
     Toggle.prototype.renderMain = function () {
         var _a, _b, _c, _d, _e;
-        var _f = this.props, children = _f.children, warning = _f.warning, error = _f.error, id = _f.id, name = _f.name, ariaDescribedby = _f["aria-describedby"], ariaLabel = _f["aria-label"];
+        var _f = this.props, children = _f.children, warning = _f.warning, error = _f.error, id = _f.id, name = _f.name, comment = _f.comment, ariaDescribedby = _f["aria-describedby"], ariaLabel = _f["aria-label"];
         var _g = this.getProps(), loading = _g.loading, captionPosition = _g.captionPosition, disableAnimations = _g.disableAnimations;
         var disabled = this.getProps().disabled || loading;
         var checked = this.isUncontrolled() ? this.state.checked : this.props.checked;
@@ -201,32 +212,45 @@ var Toggle = /** @class */ (function (_super) {
             _b[globalClasses.disabled] = !!disabled,
             _b[this.styles.disableAnimation()] = disableAnimations,
             _b));
-        var caption = null;
-        if (children) {
-            var captionClass = this.cx(this.getCaptionSizeClassName(), (_c = {},
-                _c[this.styles.caption(this.theme)] = true,
-                _c[this.styles.captionLeft(this.theme)] = captionPosition === 'left',
-                _c[this.styles.disabledCaption(this.theme)] = !!disabled,
-                _c));
-            caption = React.createElement("span", { className: captionClass }, children);
-        }
         return (React.createElement(CommonWrapper, __assign({ rootNodeRef: this.setRootNode }, this.props),
             React.createElement("label", { "data-tid": ToggleDataTids.root, className: labelClassNames },
-                React.createElement("div", { className: this.cx(this.getButtonSizeClassName(), (_d = {},
-                        _d[this.styles.button(this.theme)] = true,
-                        _d[this.styles.buttonRight()] = captionPosition === 'left',
-                        _d[this.styles.isWarning(this.theme)] = !!warning,
-                        _d[this.styles.isError(this.theme)] = !!error,
-                        _d[this.styles.focused(this.theme)] = !disabled && !!this.state.focusByTab,
-                        _d)) },
+                React.createElement("div", { className: this.cx(this.getButtonSizeClassName(), (_c = {},
+                        _c[this.styles.button(this.theme)] = true,
+                        _c[this.styles.buttonRight()] = captionPosition === 'left',
+                        _c[this.styles.isWarning(this.theme)] = !!warning,
+                        _c[this.styles.isError(this.theme)] = !!error,
+                        _c[this.styles.focused(this.theme)] = !disabled && !!this.state.focusByTab,
+                        _c)) },
                     React.createElement(FocusControlWrapper, { onBlurWhenDisabled: this.resetFocus },
                         React.createElement("input", { type: "checkbox", checked: checked, onChange: this.handleChange, className: this.cx(this.getInputSizeClassName(), this.styles.input(this.theme)), onFocus: this.handleFocus, onBlur: this.handleBlur, ref: this.inputRef, disabled: disabled, id: id, name: name, role: "switch", "aria-label": ariaLabel, "aria-describedby": ariaDescribedby })),
                     React.createElement("div", { className: containerClassNames }),
-                    React.createElement("div", { className: this.cx(this.getHandleSizeClassName(), globalClasses.handle, (_e = {},
-                            _e[this.styles.handle(this.theme)] = true,
-                            _e[this.styles.handleDisabled(this.theme)] = disabled,
-                            _e)) })),
-                caption)));
+                    React.createElement("div", { className: this.cx(this.getHandleSizeClassName(), globalClasses.handle, (_d = {},
+                            _d[this.styles.handle(this.theme)] = true,
+                            _d[this.styles.handleDisabled(this.theme)] = disabled,
+                            _d)) })),
+                children &&
+                    (comment ? (React.createElement("div", { className: this.cx(this.styles.captionWrapper(), (_e = {},
+                            _e[this.styles.captionWrapperGap(this.theme)] = captionPosition !== 'left',
+                            _e[this.styles.captionWrapperGapLeft(this.theme)] = captionPosition === 'left',
+                            _e)) },
+                        this.renderCaption(disabled, captionPosition, true),
+                        this.renderComment(disabled))) : (this.renderCaption(disabled, captionPosition, false))))));
+    };
+    Toggle.prototype.renderCaption = function (disabled, captionPosition, noGap) {
+        var _a;
+        var captionClass = this.cx(this.getCaptionSizeClassName(), (_a = {},
+            _a[this.styles.caption(this.theme)] = true,
+            _a[this.styles.captionLeft(this.theme)] = captionPosition === 'left',
+            _a[this.styles.disabledCaption(this.theme)] = !!disabled,
+            _a[this.styles.captionNoGap()] = noGap,
+            _a));
+        return React.createElement("div", { className: captionClass }, this.props.children);
+    };
+    Toggle.prototype.renderComment = function (disabled) {
+        var _a;
+        return (React.createElement("div", { className: this.cx(this.styles.subcaption(this.theme), this.getSubcaptionSizeClassName(), (_a = {},
+                _a[this.styles.subcaptionDisabled(this.theme)] = !!disabled,
+                _a)) }, this.props.comment));
     };
     Toggle.prototype.isUncontrolled = function () {
         return this.props.checked === undefined;