npm - @ryuzaki13/react-foundation-ui - Versions diffs - 1.0.6 → 1.0.7 - Mend

@ryuzaki13/react-foundation-ui 1.0.6 → 1.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (100) hide show

package/dist/chunks/{SingleDateTimeInput-BmeuVGQT.js → SingleDateTimeInput-D2fDMQnI.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 import { r as e } from "./popover-xJJqy1v6.js";
 import { t } from "./ui.module-BisoTevy.js";
 import { t as n } from "./Button-CCWuggdA.js";
-import { c as r, o as i, r as a } from "./Input-BmjlpA09.js";
+import { c as r, o as i, r as a } from "./Input-BYUl3UFn.js";
 import { t as o } from "./CalendarView-DjeTJkTT.js";
 import { a as s, c, i as l, l as u, n as d, o as f, r as p, s as m, t as h } from "./TimePanel-b4saqoUY.js";
 import { useCallback as g, useEffect as _, useEffectEvent as v, useMemo as y, useRef as b, useState as x } from "react";
@@ -328,4 +328,4 @@ function I({ value: l, onChange: p, label: g, description: b, placeholder: k, di
 //#endregion
 export { I as t };
-//# sourceMappingURL=SingleDateTimeInput-BmeuVGQT.js.map
+//# sourceMappingURL=SingleDateTimeInput-D2fDMQnI.js.map

package/dist/chunks/{SingleDateTimeInput-BmeuVGQT.js.map → SingleDateTimeInput-D2fDMQnI.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SingleDateTimeInput-BmeuVGQT.js","names":[],"sources":["../../src/date-time-input/model/useDateTimeSegments.ts","../../src/date-time-input/ui/SingleDateTimeInput.module.scss","../../src/date-time-input/ui/SingleDateTimeInput.tsx"],"sourcesContent":["import type { ChangeEvent, FocusEvent, KeyboardEvent } from \"react\";\nimport { useCallback, useEffect, useEffectEvent, useMemo, useRef, useState } from \"react\";\n\nimport {\n\tareAllDateSegmentsEmpty,\n\tdateToIndexedSegmentValues,\n\ttype EditableDateSegment,\n\tindexedSegmentsToDate,\n\tparseDateSegmentMask\n} from \"@ryuzaki13/react-foundation-lib/date-segments\";\n\nimport { createTimeOnlyBaseDate, getDateTimeInputFormat, isDateTimeWithinRange, normalizeDateTimeValue } from \"../lib\";\n\nimport type { DateTimeInputMode } from \"../lib\";\n\ninterface UseDateTimeSegmentsOptions {\n\tvalue: Date \| null \| undefined;\n\tonChange: (value: Date \| null) => void;\n\tonClearError?: () => void;\n\tdisabled?: boolean;\n\tminDate?: Date;\n\tmaxDate?: Date;\n\tmode?: DateTimeInputMode;\n}\n\nfunction resolveEditableIndices(segments: readonly { kind: string }[]): number[] {\n\tconst indices: number[] = [];\n\n\tsegments.forEach((segment, index) => {\n\t\tif (segment.kind === \"editable\") {\n\t\t\tindices.push(index);\n\t\t}\n\t});\n\n\treturn indices;\n}\n\n/*\n Управляет сегментным вводом фиксированного формата даты-времени или только времени.\n /\nexport function useDateTimeSegments({\n\tvalue,\n\tonChange,\n\tonClearError,\n\tdisabled,\n\tminDate,\n\tmaxDate,\n\tmode = \"date-time\"\n}: UseDateTimeSegmentsOptions) {\n\tconst inputFormat = useMemo(() => getDateTimeInputFormat(mode), [mode]);\n\tconst segments = useMemo(() => parseDateSegmentMask(inputFormat), [inputFormat]);\n\tconst editableIndices = useMemo(() => resolveEditableIndices(segments), [segments]);\n\tconst committedValues = useMemo(() => dateToIndexedSegmentValues(value ?? null, segments), [segments, value]);\n\tconst [dirtyValues, setDirtyValues] = useState<Map<number, string> \| null>(null);\n\tconst currentValueTime = value?.getTime() ?? null;\n\n\tconst syncDirtyValues = useEffectEvent((values: Map<number, string> \| null) => setDirtyValues(values));\n\n\tuseEffect(() => {\n\t\tsyncDirtyValues(null);\n\t}, [currentValueTime, mode]);\n\n\tconst segmentValues = dirtyValues ?? committedValues;\n\tconst refsMap = useRef<Map<number, HTMLInputElement>>(new Map());\n\tconst blurTimeout = useRef<number>(0);\n\n\t/\n\t Пытается собрать и отдать наружу новое значение поля.\n\t /\n\tconst tryCommit = useCallback(\n\t\t(updatedValues: Map<number, string>) => {\n\t\t\tif (areAllDateSegmentsEmpty(segments, updatedValues)) {\n\t\t\t\tonChange(null);\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst nextDate = indexedSegmentsToDate(segments, updatedValues, {\n\t\t\t\tdefaultDate: mode === \"time\" ? (normalizeDateTimeValue(value, \"time\") ?? createTimeOnlyBaseDate()) : undefined\n\t\t\t});\n\t\t\tif (!nextDate) return null;\n\t\t\tif (!isDateTimeWithinRange(nextDate, minDate, maxDate, mode)) return null;\n\n\t\t\tonChange(nextDate);\n\t\t\treturn nextDate;\n\t\t},\n\t\t[maxDate, minDate, mode, onChange, segments, value]\n\t);\n\n\t/\n\t Фокусирует конкретный редактируемый сегмент.\n\t /\n\tconst focusSegment = useCallback((index: number, selectAll = true) => {\n\t\tconst element = refsMap.current.get(index);\n\t\tif (!element) return;\n\n\t\telement.focus();\n\t\tif (selectAll) {\n\t\t\trequestAnimationFrame(() => element.select());\n\t\t}\n\t}, []);\n\n\t/\n\t Возвращает индекс следующего редактируемого сегмента.\n\t /\n\tconst getNextEditable = useCallback(\n\t\t(currentIndex: number): number \| null => {\n\t\t\tconst position = editableIndices.indexOf(currentIndex);\n\t\t\treturn position < editableIndices.length - 1 ? editableIndices[position + 1] : null;\n\t\t},\n\t\t[editableIndices]\n\t);\n\n\t/\n\t Возвращает индекс предыдущего редактируемого сегмента.\n\t /\n\tconst getPreviousEditable = useCallback(\n\t\t(currentIndex: number): number \| null => {\n\t\t\tconst position = editableIndices.indexOf(currentIndex);\n\t\t\treturn position > 0 ? editableIndices[position - 1] : null;\n\t\t},\n\t\t[editableIndices]\n\t);\n\n\t/\n\t Дополняет неполный сегмент ведущими нулями.\n\t /\n\tconst padValue = useCallback((valueToPad: string, segment: EditableDateSegment) => valueToPad.padStart(segment.length, \"0\"), []);\n\n\t/\n\t Регистрирует DOM-ссылку сегмента по индексу.\n\t /\n\tconst registerRef = useCallback(\n\t\t(index: number) => (element: HTMLInputElement \| null) => {\n\t\t\tif (element) {\n\t\t\t\trefsMap.current.set(index, element);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\trefsMap.current.delete(index);\n\t\t},\n\t\t[]\n\t);\n\n\t/\n\t Обрабатывает печать внутри отдельного сегмента.\n\t /\n\tconst handleInput = useCallback(\n\t\t(index: number) => (event: ChangeEvent<HTMLInputElement>) => {\n\t\t\tif (disabled) return;\n\n\t\t\tconst segment = segments[index];\n\t\t\tif (segment.kind !== \"editable\") return;\n\n\t\t\tconst rawValue = event.target.value.replace(/\\D/g, \"\");\n\t\t\tconst clampedValue = rawValue.slice(0, segment.length);\n\t\t\tconst updatedValues = new Map(segmentValues);\n\t\t\tupdatedValues.set(index, clampedValue);\n\t\t\tsetDirtyValues(updatedValues);\n\t\t\tonClearError?.();\n\n\t\t\tif (clampedValue.length === segment.length) {\n\t\t\t\tconst nextIndex = getNextEditable(index);\n\t\t\t\tif (nextIndex !== null) {\n\t\t\t\t\trequestAnimationFrame(() => focusSegment(nextIndex));\n\t\t\t\t}\n\t\t\t}\n\n\t\t\ttryCommit(updatedValues);\n\t\t},\n\t\t[disabled, focusSegment, getNextEditable, onClearError, segmentValues, segments, tryCommit]\n\t);\n\n\t/\n\t Обрабатывает клавиатурную навигацию и шаговые изменения сегментов.\n\t /\n\tconst handleKeyDown = useCallback(\n\t\t(index: number) => (event: KeyboardEvent<HTMLInputElement>) => {\n\t\t\tif (disabled) return;\n\n\t\t\tconst segment = segments[index];\n\t\t\tif (segment.kind !== \"editable\") return;\n\n\t\t\tconst currentValue = segmentValues.get(index) ?? \"\";\n\t\t\tconst element = event.currentTarget;\n\n\t\t\tswitch (event.key) {\n\t\t\t\tcase \"ArrowRight\": {\n\t\t\t\t\tif (element.selectionStart === currentValue.length \|\| currentValue === \"\") {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tconst nextIndex = getNextEditable(index);\n\t\t\t\t\t\tif (nextIndex !== null) focusSegment(nextIndex);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"ArrowLeft\": {\n\t\t\t\t\tif (element.selectionStart === 0 \|\| currentValue === \"\") {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tconst previousIndex = getPreviousEditable(index);\n\t\t\t\t\t\tif (previousIndex !== null) focusSegment(previousIndex);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"ArrowUp\": {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tlet numericValue = currentValue === \"\" ? segment.min : Number.parseInt(currentValue, 10) + 1;\n\t\t\t\t\tif (numericValue > segment.max) numericValue = segment.min;\n\n\t\t\t\t\tconst updatedValues = new Map(segmentValues);\n\t\t\t\t\tupdatedValues.set(index, padValue(String(numericValue), segment));\n\t\t\t\t\tsetDirtyValues(updatedValues);\n\t\t\t\t\ttryCommit(updatedValues);\n\t\t\t\t\trequestAnimationFrame(() => element.select());\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"ArrowDown\": {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tlet numericValue = currentValue === \"\" ? segment.max : Number.parseInt(currentValue, 10) - 1;\n\t\t\t\t\tif (numericValue < segment.min) numericValue = segment.max;\n\n\t\t\t\t\tconst updatedValues = new Map(segmentValues);\n\t\t\t\t\tupdatedValues.set(index, padValue(String(numericValue), segment));\n\t\t\t\t\tsetDirtyValues(updatedValues);\n\t\t\t\t\ttryCommit(updatedValues);\n\t\t\t\t\trequestAnimationFrame(() => element.select());\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"Backspace\": {\n\t\t\t\t\tif (currentValue === \"\") {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tconst previousIndex = getPreviousEditable(index);\n\t\t\t\t\t\tif (previousIndex !== null) focusSegment(previousIndex);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"Delete\": {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tconst updatedValues = new Map(segmentValues);\n\t\t\t\t\tupdatedValues.set(index, \"\");\n\t\t\t\t\tsetDirtyValues(updatedValues);\n\t\t\t\t\ttryCommit(updatedValues);\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[disabled, focusSegment, getNextEditable, getPreviousEditable, padValue, segmentValues, segments, tryCommit]\n\t);\n\n\t/\n\t Выделяет содержимое сегмента при фокусе.\n\t /\n\tconst handleFocus = useCallback(\n\t\t() => (event: FocusEvent<HTMLInputElement>) => {\n\t\t\tevent.target.select();\n\t\t},\n\t\t[]\n\t);\n\n\t/\n\t Сбрасывает таймер blur, когда контейнер получает фокус.\n\t /\n\tconst handleContainerFocus = useCallback(() => {\n\t\tclearTimeout(blurTimeout.current);\n\t}, []);\n\n\t/\n\t На blur оставляет только committed-значение либо полностью пустое состояние.\n\t /\n\tconst handleContainerBlur = useCallback(() => {\n\t\tconst currentValues = new Map(segmentValues);\n\n\t\tblurTimeout.current = window.setTimeout(() => {\n\t\t\tif (areAllDateSegmentsEmpty(segments, currentValues)) {\n\t\t\t\tonChange(null);\n\t\t\t\tsetDirtyValues(currentValues);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst nextDate = indexedSegmentsToDate(segments, currentValues, {\n\t\t\t\tdefaultDate: mode === \"time\" ? (normalizeDateTimeValue(value, \"time\") ?? createTimeOnlyBaseDate()) : undefined\n\t\t\t});\n\t\t\tif (!nextDate \|\| !isDateTimeWithinRange(nextDate, minDate, maxDate, mode)) {\n\t\t\t\tsetDirtyValues(null);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetDirtyValues(currentValues);\n\t\t}, 0);\n\t}, [maxDate, minDate, mode, onChange, segmentValues, segments, value]);\n\n\t/\n\t Фокусирует первый пустой сегмент либо последний редактируемый.\n\t /\n\tconst focusFirstEmpty = useCallback(() => {\n\t\tconst firstEmpty = editableIndices.find((index) => !(segmentValues.get(index) ?? \"\"));\n\t\tconst targetIndex = firstEmpty ?? editableIndices[editableIndices.length - 1];\n\t\tif (targetIndex !== undefined) {\n\t\t\tfocusSegment(targetIndex);\n\t\t}\n\t}, [editableIndices, focusSegment, segmentValues]);\n\n\treturn {\n\t\tsegments,\n\t\tsegmentValues,\n\t\tregisterRef,\n\t\thandleInput,\n\t\thandleKeyDown,\n\t\thandleFocus,\n\t\thandleContainerFocus,\n\t\thandleContainerBlur,\n\t\tfocusFirstEmpty\n\t};\n}\n","@use \"@/styles/mixins\" as ;\n\n.segmentInput {\n\tborder: none;\n\tborder-radius: var(--radius-xs);\n\tbackground: transparent;\n\toutline: none;\n\tpadding: 0;\n\tmargin: 0;\n\tfont-family: var(--font-family-mono);\n\tcolor: inherit;\n\ttext-align: center;\n\tcaret-color: var(--content-0);\n\tfont-variant-numeric: tabular-nums;\n\n\t&::placeholder {\n\t\tcolor: var(--content-2);\n\t\t// font-size: var(--font-size-sm);\n\t}\n\n\t&::selection {\n\t\tbackground-color: var(--focus-ring);\n\t\tcolor: var(--surface-0);\n\t}\n\n\t&:disabled {\n\t\topacity: 0.25;\n\t}\n}\n\n.separator {\n\tuser-select: none;\n\tcolor: var(--content-1);\n\tflex-shrink: 0;\n\n\t&[data-disabled] {\n\t\topacity: 0.25;\n\t}\n}\n\n.calendarButton {\n\t&:hover {\n\t\tcolor: var(--focus-ring);\n\t}\n}\n\n.popoverContent {\n\tdisplay: grid;\n\tgap: var(--space-md);\n}\n\n.bottom {\n\tgrid-template-columns: minmax(0, 1fr);\n}\n\n.right {\n\tgrid-template-columns: auto calc(9em + var(--width-add));\n\talign-items: stretch;\n}\n\n.calendarPane {\n\tmin-width: 0;\n}\n\n.timePanelPane {\n\tmin-width: 0;\n}\n\n.timeOnlyPopoverContent {\n\tmin-width: calc(9em + var(--width-add));\n}\n\n.timePanelPaneBottom {\n\tpadding-top: var(--space-md);\n\tborder-top: var(--border);\n}\n\n.timePanelPaneRight {\n\tpadding-left: var(--space-md);\n\tborder-left: var(--border);\n}\n","import { JSX, useEffect, useEffectEvent, useMemo, useState } from \"react\";\n\nimport { getStartOfDay, isDateRangeTuple, NullableDateRange } from \"@ryuzaki13/react-foundation-lib/formatters\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { CalendarDaysIcon, Clock3Icon } from \"lucide-react\";\n\nimport { Button } from \"../../button\";\nimport { CalendarView } from \"../../date-input/ui\";\nimport { InputControl, InputUI, useInputFieldIds } from \"../../input\";\nimport { Popover } from \"../../popover\";\nimport { UiBaseProps } from \"../../types\";\nimport uiStyles from \"../../ui.module.scss\";\nimport {\n\tclampTimeForDay,\n\tisDateTimeWithinRange,\n\tmergeDateWithTime,\n\tmergeTimeIntoDate,\n\tnormalizeDateTimeValue,\n\tresolvePickerBaseDate\n} from \"../lib\";\nimport { useDateTimeSegments } from \"../model\";\n\nimport styles from \"./SingleDateTimeInput.module.scss\";\nimport { TimePanel } from \"./TimePanel\";\n\nimport type { DateTimeInputMode } from \"../lib\";\n\ninterface BaseSingleDateTimeInputProps {\n\terror?: string;\n\tonClearError?: () => void;\n\tminDate?: Date;\n\tmaxDate?: Date;\n\ttimePanelPlacement?: \"bottom\" \| \"right\";\n\tmode?: DateTimeInputMode;\n}\n\nexport interface SingleDateTimeInputProps extends BaseSingleDateTimeInputProps, UiBaseProps<Date \| null> {}\n\n/*\n Поле выбора даты-времени со строгой сегментной маской и popover-пикером.\n /\nexport function SingleDateTimeInput({\n\tvalue,\n\tonChange,\n\tlabel,\n\tdescription,\n\tplaceholder,\n\tdisabled,\n\tsize,\n\terror,\n\tonClearError,\n\tminDate,\n\tmaxDate,\n\ttimePanelPlacement = \"right\",\n\tmode = \"date-time\"\n}: SingleDateTimeInputProps): JSX.Element {\n\tconst normalizedValue = normalizeDateTimeValue(value, mode);\n\tconst normalizedValueTime = normalizedValue?.getTime() ?? null;\n\n\tconst fallbackPickerDate = useMemo(() => getStartOfDay(new Date()), []);\n\n\tconst [open, setOpen] = useState(false);\n\tconst [draftValue, setDraftValue] = useState<Date \| null>(normalizedValue ?? null);\n\tconst [calendarView, setCalendarView] = useState<\"day\" \| \"month\" \| \"year\">(\"day\");\n\tconst [pickerDate, setPickerDate] = useState<Date>(() => resolvePickerBaseDate(normalizedValue, fallbackPickerDate, mode));\n\n\tconst { controlId, labelId, descriptionId, errorId, describedBy } = useInputFieldIds({\n\t\thasLabel: label !== undefined && label !== null,\n\t\thasDescription: !!description,\n\t\thasError: !!error\n\t});\n\n\tconst syncDraftDate = useEffectEvent((date: Date \| null) => setDraftValue(date));\n\tconst syncPickerDate = useEffectEvent((date: Date) => setPickerDate(date));\n\n\tuseEffect(() => {\n\t\tif (!open) {\n\t\t\tsyncDraftDate(normalizedValue ?? null);\n\t\t}\n\n\t\tif (normalizedValue) {\n\t\t\tsyncPickerDate(normalizedValue);\n\t\t}\n\t}, [normalizedValue, normalizedValueTime, open]);\n\n\tuseEffect(() => {\n\t\tif (!normalizedValue) return;\n\t\tsyncPickerDate(normalizedValue);\n\t}, [normalizedValue, normalizedValueTime]);\n\n\tconst {\n\t\tsegments,\n\t\tsegmentValues,\n\t\tregisterRef,\n\t\thandleInput,\n\t\thandleKeyDown,\n\t\thandleFocus,\n\t\thandleContainerFocus,\n\t\thandleContainerBlur,\n\t\tfocusFirstEmpty\n\t} = useDateTimeSegments({\n\t\tvalue: normalizedValue,\n\t\tonChange,\n\t\tonClearError,\n\t\tdisabled,\n\t\tminDate,\n\t\tmaxDate,\n\t\tmode\n\t});\n\n\t/\n\t Выбирает дату в календаре и сохраняет текущее время.\n\t /\n\tconst handleCalendarSelect = (nextDate: Date \| NullableDateRange) => {\n\t\tif (mode === \"time\" \|\| isDateRangeTuple(nextDate) \|\| disabled) return;\n\n\t\tconst baseValue = draftValue ?? normalizedValue ?? pickerDate;\n\t\tconst mergedDate = mergeDateWithTime(nextDate, baseValue);\n\t\tconst { hours, minutes } = clampTimeForDay(nextDate, mergedDate.getHours(), mergedDate.getMinutes(), minDate, maxDate, mode);\n\t\tconst nextValue = mergeTimeIntoDate(nextDate, hours, minutes);\n\n\t\tif (!isDateTimeWithinRange(nextValue, minDate, maxDate, mode)) return;\n\n\t\tonClearError?.();\n\t\tsetDraftValue(nextValue);\n\t\tsetPickerDate(nextValue);\n\t};\n\n\t/\n\t Выбирает время для текущего рабочего дня picker-а.\n\t */\n\tconst handleTimeChange = (hours: number, minutes: number) => {\n\t\tif (disabled) return;\n\n\t\tconst baseDate = draftValue ?? normalizedValue ?? pickerDate;\n\t\tconst clampedTime = clampTimeForDay(baseDate, hours, minutes, minDate, maxDate, mode);\n\t\tconst nextValue = mergeTimeIntoDate(baseDate, clampedTime.hours, clampedTime.minutes, mode);\n\n\t\tif (!isDateTimeWithinRange(nextValue, minDate, maxDate, mode)) return;\n\n\t\tonClearError?.();\n\t\tsetDraftValue(nextValue);\n\t\tsetPickerDate(nextValue);\n\t};\n\n\tconst handleOpenChange = (nextOpen: boolean) => {\n\t\tif (nextOpen) {\n\t\t\tsetDraftValue(normalizedValue ?? null);\n\t\t\tsetPickerDate(resolvePickerBaseDate(normalizedValue, fallbackPickerDate, mode));\n\t\t}\n\n\t\tsetOpen(nextOpen);\n\t};\n\n\tconst handlePopoverClose = () => {\n\t\tconst prevTime = normalizedValue?.getTime() ?? null;\n\t\tconst draftTime = draftValue?.getTime() ?? null;\n\n\t\tif (prevTime !== draftTime) {\n\t\t\tonChange(draftValue);\n\t\t}\n\t};\n\n\tconst panelPlacementClass = timePanelPlacement === \"right\" ? styles.timePanelPaneRight : styles.timePanelPaneBottom;\n\tconst buttonAriaLabel = mode === \"time\" ? \"Открыть выбор времени\" : \"Открыть календарь даты и времени\";\n\tconst inputPlaceholder = placeholder ?? (mode === \"time\" ? \"чч:мм\" : \"дд.мм.гггг чч:мм\");\n\tconst pickerValue = draftValue ?? normalizedValue ?? pickerDate;\n\n\treturn (\n\t\t<Popover open={open} onOpenChange={handleOpenChange}>\n\t\t\t<InputUI\n\t\t\t\tlabel={label}\n\t\t\t\tdescription={description}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tsize={size}\n\t\t\t\terror={error}\n\t\t\t\tcontrolId={controlId}\n\t\t\t\tlabelId={labelId}\n\t\t\t\tdescriptionId={descriptionId}\n\t\t\t\terrorId={errorId}>\n\t\t\t\t<InputControl\n\t\t\t\t\tendAdornmentWidth=\"var(--control-height)\"\n\t\t\t\t\tendAdornment={\n\t\t\t\t\t\t<Popover.Trigger>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tvariant=\"transparent\"\n\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\tclassName={styles.calendarButton}\n\t\t\t\t\t\t\t\ticon={mode === \"time\" ? <Clock3Icon /> : <CalendarDaysIcon />}\n\t\t\t\t\t\t\t\taria-label={buttonAriaLabel}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Popover.Trigger>\n\t\t\t\t\t}>\n\t\t\t\t\t{({ controlClassName }) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tid={controlId}\n\t\t\t\t\t\t\tclassName={cn(uiStyles.uiInputControlFake, controlClassName)}\n\t\t\t\t\t\t\tdata-disabled={disabled \|\| undefined}\n\t\t\t\t\t\t\tdata-invalid={error ? \"\" : undefined}\n\t\t\t\t\t\t\trole=\"group\"\n\t\t\t\t\t\t\taria-invalid={!!error \|\| undefined}\n\t\t\t\t\t\t\taria-placeholder={inputPlaceholder}\n\t\t\t\t\t\t\taria-labelledby={labelId}\n\t\t\t\t\t\t\taria-describedby={describedBy}\n\t\t\t\t\t\t\tonFocus={handleContainerFocus}\n\t\t\t\t\t\t\tonBlur={handleContainerBlur}\n\t\t\t\t\t\t\tonClick={(event) => {\n\t\t\t\t\t\t\t\tif (event.target === event.currentTarget) {\n\t\t\t\t\t\t\t\t\tfocusFirstEmpty();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}>\n\t\t\t\t\t\t\t{segments.map((segment, index) => {\n\t\t\t\t\t\t\t\tif (segment.kind === \"literal\") {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<span key={index} className={styles.separator} data-disabled={disabled \|\| undefined}>\n\t\t\t\t\t\t\t\t\t\t\t{segment.text}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\t\t\t\tref={registerRef(index)}\n\t\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\t\tinputMode=\"numeric\"\n\t\t\t\t\t\t\t\t\t\tclassName={styles.segmentInput}\n\t\t\t\t\t\t\t\t\t\tstyle={{ width: `${segment.length + 0.5}ch` }}\n\t\t\t\t\t\t\t\t\t\tvalue={segmentValues.get(index) ?? \"\"}\n\t\t\t\t\t\t\t\t\t\tplaceholder={segment.placeholder}\n\t\t\t\t\t\t\t\t\t\tmaxLength={segment.length}\n\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\taria-label={segment.ariaLabel}\n\t\t\t\t\t\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\t\t\t\t\t\tonChange={handleInput(index)}\n\t\t\t\t\t\t\t\t\t\tonKeyDown={handleKeyDown(index)}\n\t\t\t\t\t\t\t\t\t\tonFocus={handleFocus()}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</InputControl>\n\t\t\t</InputUI>\n\n\t\t\t<Popover.Content background=\"primary\" onClose={handlePopoverClose}>\n\t\t\t\t{mode === \"time\" ? (\n\t\t\t\t\t<div className={styles.timeOnlyPopoverContent}>\n\t\t\t\t\t\t<TimePanel\n\t\t\t\t\t\t\tvalue={pickerValue}\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\tminDate={minDate}\n\t\t\t\t\t\t\tmaxDate={maxDate}\n\t\t\t\t\t\t\tmode={mode}\n\t\t\t\t\t\t\tonChange={handleTimeChange}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<div className={cn(styles.popoverContent, styles[timePanelPlacement])}>\n\t\t\t\t\t\t<div className={styles.calendarPane}>\n\t\t\t\t\t\t\t<CalendarView\n\t\t\t\t\t\t\t\tview={calendarView}\n\t\t\t\t\t\t\t\tdatePickerLevel=\"day\"\n\t\t\t\t\t\t\t\tselectionMode=\"day\"\n\t\t\t\t\t\t\t\tonViewChange={setCalendarView}\n\t\t\t\t\t\t\t\tvalue={pickerValue}\n\t\t\t\t\t\t\t\tonChange={handleCalendarSelect}\n\t\t\t\t\t\t\t\tminDate={minDate}\n\t\t\t\t\t\t\t\tmaxDate={maxDate}\n\t\t\t\t\t\t\t\tcurrentDate={pickerDate}\n\t\t\t\t\t\t\t\tonCurrentDateChange={setPickerDate}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<div className={cn(styles.timePanelPane, panelPlacementClass)}>\n\t\t\t\t\t\t\t<TimePanel\n\t\t\t\t\t\t\t\tvalue={pickerValue}\n\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\tminDate={minDate}\n\t\t\t\t\t\t\t\tmaxDate={maxDate}\n\t\t\t\t\t\t\t\tmode={mode}\n\t\t\t\t\t\t\t\tonChange={handleTimeChange}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Popover.Content>\n\t\t</Popover>\n\t);\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"SingleDateTimeInput-D2fDMQnI.js","names":[],"sources":["../../src/date-time-input/model/useDateTimeSegments.ts","../../src/date-time-input/ui/SingleDateTimeInput.module.scss","../../src/date-time-input/ui/SingleDateTimeInput.tsx"],"sourcesContent":["import type { ChangeEvent, FocusEvent, KeyboardEvent } from \"react\";\nimport { useCallback, useEffect, useEffectEvent, useMemo, useRef, useState } from \"react\";\n\nimport {\n\tareAllDateSegmentsEmpty,\n\tdateToIndexedSegmentValues,\n\ttype EditableDateSegment,\n\tindexedSegmentsToDate,\n\tparseDateSegmentMask\n} from \"@ryuzaki13/react-foundation-lib/date-segments\";\n\nimport { createTimeOnlyBaseDate, getDateTimeInputFormat, isDateTimeWithinRange, normalizeDateTimeValue } from \"../lib\";\n\nimport type { DateTimeInputMode } from \"../lib\";\n\ninterface UseDateTimeSegmentsOptions {\n\tvalue: Date \| null \| undefined;\n\tonChange: (value: Date \| null) => void;\n\tonClearError?: () => void;\n\tdisabled?: boolean;\n\tminDate?: Date;\n\tmaxDate?: Date;\n\tmode?: DateTimeInputMode;\n}\n\nfunction resolveEditableIndices(segments: readonly { kind: string }[]): number[] {\n\tconst indices: number[] = [];\n\n\tsegments.forEach((segment, index) => {\n\t\tif (segment.kind === \"editable\") {\n\t\t\tindices.push(index);\n\t\t}\n\t});\n\n\treturn indices;\n}\n\n/*\n Управляет сегментным вводом фиксированного формата даты-времени или только времени.\n /\nexport function useDateTimeSegments({\n\tvalue,\n\tonChange,\n\tonClearError,\n\tdisabled,\n\tminDate,\n\tmaxDate,\n\tmode = \"date-time\"\n}: UseDateTimeSegmentsOptions) {\n\tconst inputFormat = useMemo(() => getDateTimeInputFormat(mode), [mode]);\n\tconst segments = useMemo(() => parseDateSegmentMask(inputFormat), [inputFormat]);\n\tconst editableIndices = useMemo(() => resolveEditableIndices(segments), [segments]);\n\tconst committedValues = useMemo(() => dateToIndexedSegmentValues(value ?? null, segments), [segments, value]);\n\tconst [dirtyValues, setDirtyValues] = useState<Map<number, string> \| null>(null);\n\tconst currentValueTime = value?.getTime() ?? null;\n\n\tconst syncDirtyValues = useEffectEvent((values: Map<number, string> \| null) => setDirtyValues(values));\n\n\tuseEffect(() => {\n\t\tsyncDirtyValues(null);\n\t}, [currentValueTime, mode]);\n\n\tconst segmentValues = dirtyValues ?? committedValues;\n\tconst refsMap = useRef<Map<number, HTMLInputElement>>(new Map());\n\tconst blurTimeout = useRef<number>(0);\n\n\t/\n\t Пытается собрать и отдать наружу новое значение поля.\n\t /\n\tconst tryCommit = useCallback(\n\t\t(updatedValues: Map<number, string>) => {\n\t\t\tif (areAllDateSegmentsEmpty(segments, updatedValues)) {\n\t\t\t\tonChange(null);\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst nextDate = indexedSegmentsToDate(segments, updatedValues, {\n\t\t\t\tdefaultDate: mode === \"time\" ? (normalizeDateTimeValue(value, \"time\") ?? createTimeOnlyBaseDate()) : undefined\n\t\t\t});\n\t\t\tif (!nextDate) return null;\n\t\t\tif (!isDateTimeWithinRange(nextDate, minDate, maxDate, mode)) return null;\n\n\t\t\tonChange(nextDate);\n\t\t\treturn nextDate;\n\t\t},\n\t\t[maxDate, minDate, mode, onChange, segments, value]\n\t);\n\n\t/\n\t Фокусирует конкретный редактируемый сегмент.\n\t /\n\tconst focusSegment = useCallback((index: number, selectAll = true) => {\n\t\tconst element = refsMap.current.get(index);\n\t\tif (!element) return;\n\n\t\telement.focus();\n\t\tif (selectAll) {\n\t\t\trequestAnimationFrame(() => element.select());\n\t\t}\n\t}, []);\n\n\t/\n\t Возвращает индекс следующего редактируемого сегмента.\n\t /\n\tconst getNextEditable = useCallback(\n\t\t(currentIndex: number): number \| null => {\n\t\t\tconst position = editableIndices.indexOf(currentIndex);\n\t\t\treturn position < editableIndices.length - 1 ? editableIndices[position + 1] : null;\n\t\t},\n\t\t[editableIndices]\n\t);\n\n\t/\n\t Возвращает индекс предыдущего редактируемого сегмента.\n\t /\n\tconst getPreviousEditable = useCallback(\n\t\t(currentIndex: number): number \| null => {\n\t\t\tconst position = editableIndices.indexOf(currentIndex);\n\t\t\treturn position > 0 ? editableIndices[position - 1] : null;\n\t\t},\n\t\t[editableIndices]\n\t);\n\n\t/\n\t Дополняет неполный сегмент ведущими нулями.\n\t /\n\tconst padValue = useCallback((valueToPad: string, segment: EditableDateSegment) => valueToPad.padStart(segment.length, \"0\"), []);\n\n\t/\n\t Регистрирует DOM-ссылку сегмента по индексу.\n\t /\n\tconst registerRef = useCallback(\n\t\t(index: number) => (element: HTMLInputElement \| null) => {\n\t\t\tif (element) {\n\t\t\t\trefsMap.current.set(index, element);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\trefsMap.current.delete(index);\n\t\t},\n\t\t[]\n\t);\n\n\t/\n\t Обрабатывает печать внутри отдельного сегмента.\n\t /\n\tconst handleInput = useCallback(\n\t\t(index: number) => (event: ChangeEvent<HTMLInputElement>) => {\n\t\t\tif (disabled) return;\n\n\t\t\tconst segment = segments[index];\n\t\t\tif (segment.kind !== \"editable\") return;\n\n\t\t\tconst rawValue = event.target.value.replace(/\\D/g, \"\");\n\t\t\tconst clampedValue = rawValue.slice(0, segment.length);\n\t\t\tconst updatedValues = new Map(segmentValues);\n\t\t\tupdatedValues.set(index, clampedValue);\n\t\t\tsetDirtyValues(updatedValues);\n\t\t\tonClearError?.();\n\n\t\t\tif (clampedValue.length === segment.length) {\n\t\t\t\tconst nextIndex = getNextEditable(index);\n\t\t\t\tif (nextIndex !== null) {\n\t\t\t\t\trequestAnimationFrame(() => focusSegment(nextIndex));\n\t\t\t\t}\n\t\t\t}\n\n\t\t\ttryCommit(updatedValues);\n\t\t},\n\t\t[disabled, focusSegment, getNextEditable, onClearError, segmentValues, segments, tryCommit]\n\t);\n\n\t/\n\t Обрабатывает клавиатурную навигацию и шаговые изменения сегментов.\n\t /\n\tconst handleKeyDown = useCallback(\n\t\t(index: number) => (event: KeyboardEvent<HTMLInputElement>) => {\n\t\t\tif (disabled) return;\n\n\t\t\tconst segment = segments[index];\n\t\t\tif (segment.kind !== \"editable\") return;\n\n\t\t\tconst currentValue = segmentValues.get(index) ?? \"\";\n\t\t\tconst element = event.currentTarget;\n\n\t\t\tswitch (event.key) {\n\t\t\t\tcase \"ArrowRight\": {\n\t\t\t\t\tif (element.selectionStart === currentValue.length \|\| currentValue === \"\") {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tconst nextIndex = getNextEditable(index);\n\t\t\t\t\t\tif (nextIndex !== null) focusSegment(nextIndex);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"ArrowLeft\": {\n\t\t\t\t\tif (element.selectionStart === 0 \|\| currentValue === \"\") {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tconst previousIndex = getPreviousEditable(index);\n\t\t\t\t\t\tif (previousIndex !== null) focusSegment(previousIndex);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"ArrowUp\": {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tlet numericValue = currentValue === \"\" ? segment.min : Number.parseInt(currentValue, 10) + 1;\n\t\t\t\t\tif (numericValue > segment.max) numericValue = segment.min;\n\n\t\t\t\t\tconst updatedValues = new Map(segmentValues);\n\t\t\t\t\tupdatedValues.set(index, padValue(String(numericValue), segment));\n\t\t\t\t\tsetDirtyValues(updatedValues);\n\t\t\t\t\ttryCommit(updatedValues);\n\t\t\t\t\trequestAnimationFrame(() => element.select());\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"ArrowDown\": {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tlet numericValue = currentValue === \"\" ? segment.max : Number.parseInt(currentValue, 10) - 1;\n\t\t\t\t\tif (numericValue < segment.min) numericValue = segment.max;\n\n\t\t\t\t\tconst updatedValues = new Map(segmentValues);\n\t\t\t\t\tupdatedValues.set(index, padValue(String(numericValue), segment));\n\t\t\t\t\tsetDirtyValues(updatedValues);\n\t\t\t\t\ttryCommit(updatedValues);\n\t\t\t\t\trequestAnimationFrame(() => element.select());\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"Backspace\": {\n\t\t\t\t\tif (currentValue === \"\") {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tconst previousIndex = getPreviousEditable(index);\n\t\t\t\t\t\tif (previousIndex !== null) focusSegment(previousIndex);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase \"Delete\": {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tconst updatedValues = new Map(segmentValues);\n\t\t\t\t\tupdatedValues.set(index, \"\");\n\t\t\t\t\tsetDirtyValues(updatedValues);\n\t\t\t\t\ttryCommit(updatedValues);\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[disabled, focusSegment, getNextEditable, getPreviousEditable, padValue, segmentValues, segments, tryCommit]\n\t);\n\n\t/\n\t Выделяет содержимое сегмента при фокусе.\n\t /\n\tconst handleFocus = useCallback(\n\t\t() => (event: FocusEvent<HTMLInputElement>) => {\n\t\t\tevent.target.select();\n\t\t},\n\t\t[]\n\t);\n\n\t/\n\t Сбрасывает таймер blur, когда контейнер получает фокус.\n\t /\n\tconst handleContainerFocus = useCallback(() => {\n\t\tclearTimeout(blurTimeout.current);\n\t}, []);\n\n\t/\n\t На blur оставляет только committed-значение либо полностью пустое состояние.\n\t /\n\tconst handleContainerBlur = useCallback(() => {\n\t\tconst currentValues = new Map(segmentValues);\n\n\t\tblurTimeout.current = window.setTimeout(() => {\n\t\t\tif (areAllDateSegmentsEmpty(segments, currentValues)) {\n\t\t\t\tonChange(null);\n\t\t\t\tsetDirtyValues(currentValues);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst nextDate = indexedSegmentsToDate(segments, currentValues, {\n\t\t\t\tdefaultDate: mode === \"time\" ? (normalizeDateTimeValue(value, \"time\") ?? createTimeOnlyBaseDate()) : undefined\n\t\t\t});\n\t\t\tif (!nextDate \|\| !isDateTimeWithinRange(nextDate, minDate, maxDate, mode)) {\n\t\t\t\tsetDirtyValues(null);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetDirtyValues(currentValues);\n\t\t}, 0);\n\t}, [maxDate, minDate, mode, onChange, segmentValues, segments, value]);\n\n\t/\n\t Фокусирует первый пустой сегмент либо последний редактируемый.\n\t /\n\tconst focusFirstEmpty = useCallback(() => {\n\t\tconst firstEmpty = editableIndices.find((index) => !(segmentValues.get(index) ?? \"\"));\n\t\tconst targetIndex = firstEmpty ?? editableIndices[editableIndices.length - 1];\n\t\tif (targetIndex !== undefined) {\n\t\t\tfocusSegment(targetIndex);\n\t\t}\n\t}, [editableIndices, focusSegment, segmentValues]);\n\n\treturn {\n\t\tsegments,\n\t\tsegmentValues,\n\t\tregisterRef,\n\t\thandleInput,\n\t\thandleKeyDown,\n\t\thandleFocus,\n\t\thandleContainerFocus,\n\t\thandleContainerBlur,\n\t\tfocusFirstEmpty\n\t};\n}\n","@use \"@/styles/mixins\" as ;\n\n.segmentInput {\n\tborder: none;\n\tborder-radius: var(--radius-xs);\n\tbackground: transparent;\n\toutline: none;\n\tpadding: 0;\n\tmargin: 0;\n\tfont-family: var(--font-family-mono);\n\tcolor: inherit;\n\ttext-align: center;\n\tcaret-color: var(--content-0);\n\tfont-variant-numeric: tabular-nums;\n\n\t&::placeholder {\n\t\tcolor: var(--content-2);\n\t\t// font-size: var(--font-size-sm);\n\t}\n\n\t&::selection {\n\t\tbackground-color: var(--focus-ring);\n\t\tcolor: var(--surface-0);\n\t}\n\n\t&:disabled {\n\t\topacity: 0.25;\n\t}\n}\n\n.separator {\n\tuser-select: none;\n\tcolor: var(--content-1);\n\tflex-shrink: 0;\n\n\t&[data-disabled] {\n\t\topacity: 0.25;\n\t}\n}\n\n.calendarButton {\n\t&:hover {\n\t\tcolor: var(--focus-ring);\n\t}\n}\n\n.popoverContent {\n\tdisplay: grid;\n\tgap: var(--space-md);\n}\n\n.bottom {\n\tgrid-template-columns: minmax(0, 1fr);\n}\n\n.right {\n\tgrid-template-columns: auto calc(9em + var(--width-add));\n\talign-items: stretch;\n}\n\n.calendarPane {\n\tmin-width: 0;\n}\n\n.timePanelPane {\n\tmin-width: 0;\n}\n\n.timeOnlyPopoverContent {\n\tmin-width: calc(9em + var(--width-add));\n}\n\n.timePanelPaneBottom {\n\tpadding-top: var(--space-md);\n\tborder-top: var(--border);\n}\n\n.timePanelPaneRight {\n\tpadding-left: var(--space-md);\n\tborder-left: var(--border);\n}\n","import { JSX, useEffect, useEffectEvent, useMemo, useState } from \"react\";\n\nimport { getStartOfDay, isDateRangeTuple, NullableDateRange } from \"@ryuzaki13/react-foundation-lib/formatters\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { CalendarDaysIcon, Clock3Icon } from \"lucide-react\";\n\nimport { Button } from \"../../button\";\nimport { CalendarView } from \"../../date-input/ui\";\nimport { InputControl, InputUI, useInputFieldIds } from \"../../input\";\nimport { Popover } from \"../../popover\";\nimport { UiBaseProps } from \"../../types\";\nimport uiStyles from \"../../ui.module.scss\";\nimport {\n\tclampTimeForDay,\n\tisDateTimeWithinRange,\n\tmergeDateWithTime,\n\tmergeTimeIntoDate,\n\tnormalizeDateTimeValue,\n\tresolvePickerBaseDate\n} from \"../lib\";\nimport { useDateTimeSegments } from \"../model\";\n\nimport styles from \"./SingleDateTimeInput.module.scss\";\nimport { TimePanel } from \"./TimePanel\";\n\nimport type { DateTimeInputMode } from \"../lib\";\n\ninterface BaseSingleDateTimeInputProps {\n\terror?: string;\n\tonClearError?: () => void;\n\tminDate?: Date;\n\tmaxDate?: Date;\n\ttimePanelPlacement?: \"bottom\" \| \"right\";\n\tmode?: DateTimeInputMode;\n}\n\nexport interface SingleDateTimeInputProps extends BaseSingleDateTimeInputProps, UiBaseProps<Date \| null> {}\n\n/*\n Поле выбора даты-времени со строгой сегментной маской и popover-пикером.\n /\nexport function SingleDateTimeInput({\n\tvalue,\n\tonChange,\n\tlabel,\n\tdescription,\n\tplaceholder,\n\tdisabled,\n\tsize,\n\terror,\n\tonClearError,\n\tminDate,\n\tmaxDate,\n\ttimePanelPlacement = \"right\",\n\tmode = \"date-time\"\n}: SingleDateTimeInputProps): JSX.Element {\n\tconst normalizedValue = normalizeDateTimeValue(value, mode);\n\tconst normalizedValueTime = normalizedValue?.getTime() ?? null;\n\n\tconst fallbackPickerDate = useMemo(() => getStartOfDay(new Date()), []);\n\n\tconst [open, setOpen] = useState(false);\n\tconst [draftValue, setDraftValue] = useState<Date \| null>(normalizedValue ?? null);\n\tconst [calendarView, setCalendarView] = useState<\"day\" \| \"month\" \| \"year\">(\"day\");\n\tconst [pickerDate, setPickerDate] = useState<Date>(() => resolvePickerBaseDate(normalizedValue, fallbackPickerDate, mode));\n\n\tconst { controlId, labelId, descriptionId, errorId, describedBy } = useInputFieldIds({\n\t\thasLabel: label !== undefined && label !== null,\n\t\thasDescription: !!description,\n\t\thasError: !!error\n\t});\n\n\tconst syncDraftDate = useEffectEvent((date: Date \| null) => setDraftValue(date));\n\tconst syncPickerDate = useEffectEvent((date: Date) => setPickerDate(date));\n\n\tuseEffect(() => {\n\t\tif (!open) {\n\t\t\tsyncDraftDate(normalizedValue ?? null);\n\t\t}\n\n\t\tif (normalizedValue) {\n\t\t\tsyncPickerDate(normalizedValue);\n\t\t}\n\t}, [normalizedValue, normalizedValueTime, open]);\n\n\tuseEffect(() => {\n\t\tif (!normalizedValue) return;\n\t\tsyncPickerDate(normalizedValue);\n\t}, [normalizedValue, normalizedValueTime]);\n\n\tconst {\n\t\tsegments,\n\t\tsegmentValues,\n\t\tregisterRef,\n\t\thandleInput,\n\t\thandleKeyDown,\n\t\thandleFocus,\n\t\thandleContainerFocus,\n\t\thandleContainerBlur,\n\t\tfocusFirstEmpty\n\t} = useDateTimeSegments({\n\t\tvalue: normalizedValue,\n\t\tonChange,\n\t\tonClearError,\n\t\tdisabled,\n\t\tminDate,\n\t\tmaxDate,\n\t\tmode\n\t});\n\n\t/\n\t Выбирает дату в календаре и сохраняет текущее время.\n\t /\n\tconst handleCalendarSelect = (nextDate: Date \| NullableDateRange) => {\n\t\tif (mode === \"time\" \|\| isDateRangeTuple(nextDate) \|\| disabled) return;\n\n\t\tconst baseValue = draftValue ?? normalizedValue ?? pickerDate;\n\t\tconst mergedDate = mergeDateWithTime(nextDate, baseValue);\n\t\tconst { hours, minutes } = clampTimeForDay(nextDate, mergedDate.getHours(), mergedDate.getMinutes(), minDate, maxDate, mode);\n\t\tconst nextValue = mergeTimeIntoDate(nextDate, hours, minutes);\n\n\t\tif (!isDateTimeWithinRange(nextValue, minDate, maxDate, mode)) return;\n\n\t\tonClearError?.();\n\t\tsetDraftValue(nextValue);\n\t\tsetPickerDate(nextValue);\n\t};\n\n\t/\n\t Выбирает время для текущего рабочего дня picker-а.\n\t */\n\tconst handleTimeChange = (hours: number, minutes: number) => {\n\t\tif (disabled) return;\n\n\t\tconst baseDate = draftValue ?? normalizedValue ?? pickerDate;\n\t\tconst clampedTime = clampTimeForDay(baseDate, hours, minutes, minDate, maxDate, mode);\n\t\tconst nextValue = mergeTimeIntoDate(baseDate, clampedTime.hours, clampedTime.minutes, mode);\n\n\t\tif (!isDateTimeWithinRange(nextValue, minDate, maxDate, mode)) return;\n\n\t\tonClearError?.();\n\t\tsetDraftValue(nextValue);\n\t\tsetPickerDate(nextValue);\n\t};\n\n\tconst handleOpenChange = (nextOpen: boolean) => {\n\t\tif (nextOpen) {\n\t\t\tsetDraftValue(normalizedValue ?? null);\n\t\t\tsetPickerDate(resolvePickerBaseDate(normalizedValue, fallbackPickerDate, mode));\n\t\t}\n\n\t\tsetOpen(nextOpen);\n\t};\n\n\tconst handlePopoverClose = () => {\n\t\tconst prevTime = normalizedValue?.getTime() ?? null;\n\t\tconst draftTime = draftValue?.getTime() ?? null;\n\n\t\tif (prevTime !== draftTime) {\n\t\t\tonChange(draftValue);\n\t\t}\n\t};\n\n\tconst panelPlacementClass = timePanelPlacement === \"right\" ? styles.timePanelPaneRight : styles.timePanelPaneBottom;\n\tconst buttonAriaLabel = mode === \"time\" ? \"Открыть выбор времени\" : \"Открыть календарь даты и времени\";\n\tconst inputPlaceholder = placeholder ?? (mode === \"time\" ? \"чч:мм\" : \"дд.мм.гггг чч:мм\");\n\tconst pickerValue = draftValue ?? normalizedValue ?? pickerDate;\n\n\treturn (\n\t\t<Popover open={open} onOpenChange={handleOpenChange}>\n\t\t\t<InputUI\n\t\t\t\tlabel={label}\n\t\t\t\tdescription={description}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tsize={size}\n\t\t\t\terror={error}\n\t\t\t\tcontrolId={controlId}\n\t\t\t\tlabelId={labelId}\n\t\t\t\tdescriptionId={descriptionId}\n\t\t\t\terrorId={errorId}>\n\t\t\t\t<InputControl\n\t\t\t\t\tendAdornmentWidth=\"var(--control-height)\"\n\t\t\t\t\tendAdornment={\n\t\t\t\t\t\t<Popover.Trigger>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tvariant=\"transparent\"\n\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\tclassName={styles.calendarButton}\n\t\t\t\t\t\t\t\ticon={mode === \"time\" ? <Clock3Icon /> : <CalendarDaysIcon />}\n\t\t\t\t\t\t\t\taria-label={buttonAriaLabel}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Popover.Trigger>\n\t\t\t\t\t}>\n\t\t\t\t\t{({ controlClassName }) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tid={controlId}\n\t\t\t\t\t\t\tclassName={cn(uiStyles.uiInputControlFake, controlClassName)}\n\t\t\t\t\t\t\tdata-disabled={disabled \|\| undefined}\n\t\t\t\t\t\t\tdata-invalid={error ? \"\" : undefined}\n\t\t\t\t\t\t\trole=\"group\"\n\t\t\t\t\t\t\taria-invalid={!!error \|\| undefined}\n\t\t\t\t\t\t\taria-placeholder={inputPlaceholder}\n\t\t\t\t\t\t\taria-labelledby={labelId}\n\t\t\t\t\t\t\taria-describedby={describedBy}\n\t\t\t\t\t\t\tonFocus={handleContainerFocus}\n\t\t\t\t\t\t\tonBlur={handleContainerBlur}\n\t\t\t\t\t\t\tonClick={(event) => {\n\t\t\t\t\t\t\t\tif (event.target === event.currentTarget) {\n\t\t\t\t\t\t\t\t\tfocusFirstEmpty();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}>\n\t\t\t\t\t\t\t{segments.map((segment, index) => {\n\t\t\t\t\t\t\t\tif (segment.kind === \"literal\") {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<span key={index} className={styles.separator} data-disabled={disabled \|\| undefined}>\n\t\t\t\t\t\t\t\t\t\t\t{segment.text}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\t\t\t\tref={registerRef(index)}\n\t\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\t\tinputMode=\"numeric\"\n\t\t\t\t\t\t\t\t\t\tclassName={styles.segmentInput}\n\t\t\t\t\t\t\t\t\t\tstyle={{ width: `${segment.length + 0.5}ch` }}\n\t\t\t\t\t\t\t\t\t\tvalue={segmentValues.get(index) ?? \"\"}\n\t\t\t\t\t\t\t\t\t\tplaceholder={segment.placeholder}\n\t\t\t\t\t\t\t\t\t\tmaxLength={segment.length}\n\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\taria-label={segment.ariaLabel}\n\t\t\t\t\t\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\t\t\t\t\t\tonChange={handleInput(index)}\n\t\t\t\t\t\t\t\t\t\tonKeyDown={handleKeyDown(index)}\n\t\t\t\t\t\t\t\t\t\tonFocus={handleFocus()}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</InputControl>\n\t\t\t</InputUI>\n\n\t\t\t<Popover.Content background=\"primary\" onClose={handlePopoverClose}>\n\t\t\t\t{mode === \"time\" ? (\n\t\t\t\t\t<div className={styles.timeOnlyPopoverContent}>\n\t\t\t\t\t\t<TimePanel\n\t\t\t\t\t\t\tvalue={pickerValue}\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\tminDate={minDate}\n\t\t\t\t\t\t\tmaxDate={maxDate}\n\t\t\t\t\t\t\tmode={mode}\n\t\t\t\t\t\t\tonChange={handleTimeChange}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<div className={cn(styles.popoverContent, styles[timePanelPlacement])}>\n\t\t\t\t\t\t<div className={styles.calendarPane}>\n\t\t\t\t\t\t\t<CalendarView\n\t\t\t\t\t\t\t\tview={calendarView}\n\t\t\t\t\t\t\t\tdatePickerLevel=\"day\"\n\t\t\t\t\t\t\t\tselectionMode=\"day\"\n\t\t\t\t\t\t\t\tonViewChange={setCalendarView}\n\t\t\t\t\t\t\t\tvalue={pickerValue}\n\t\t\t\t\t\t\t\tonChange={handleCalendarSelect}\n\t\t\t\t\t\t\t\tminDate={minDate}\n\t\t\t\t\t\t\t\tmaxDate={maxDate}\n\t\t\t\t\t\t\t\tcurrentDate={pickerDate}\n\t\t\t\t\t\t\t\tonCurrentDateChange={setPickerDate}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<div className={cn(styles.timePanelPane, panelPlacementClass)}>\n\t\t\t\t\t\t\t<TimePanel\n\t\t\t\t\t\t\t\tvalue={pickerValue}\n\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\tminDate={minDate}\n\t\t\t\t\t\t\t\tmaxDate={maxDate}\n\t\t\t\t\t\t\t\tmode={mode}\n\t\t\t\t\t\t\t\tonChange={handleTimeChange}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Popover.Content>\n\t\t</Popover>\n\t);\n}\n"],"mappings":"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"}

package/dist/chunks/{StateSelect-ujAre258.js → StateSelect-CEp7kGGg.js} RENAMED Viewed

@@ -1,4 +1,4 @@
-import { t as e } from "./Select-BJ5OqTe7.js";
+import { t as e } from "./Select-B6kxgxK2.js";
 import { useMemo as t } from "react";
 import { cn as n } from "@ryuzaki13/react-foundation-lib/utils";
 import { DEFAULT_VALUE_STATES as r, VALUE_STATE_COLOR_TOKENS as i } from "@ryuzaki13/react-foundation-lib/formatters";
@@ -75,4 +75,4 @@ function m({ label: i, description: m, disabled: h, placeholder: g, size: _, val
 //#endregion
 export { m as t };
-//# sourceMappingURL=StateSelect-ujAre258.js.map
+//# sourceMappingURL=StateSelect-CEp7kGGg.js.map

package/dist/chunks/{StateSelect-ujAre258.js.map → StateSelect-CEp7kGGg.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StateSelect-~~ujAre258~~.js","names":[],"sources":["../../src/state-select/StateSelect.module.scss","../../src/state-select/StateSelect.tsx"],"sourcesContent":[".button {\n\tpadding-left: var(--space-sm);\n}\n\n.valueContainer {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--space-sm);\n\twidth: 100%;\n\tmin-height: 1.5em;\n\tmin-width: 0;\n}\n\n.swatch {\n\t--state-color: transparent;\n\n\twidth: 1.25em;\n\theight: 1.25em;\n\tflex-shrink: 0;\n\tdisplay: inline-block;\n\tborder-radius: var(--radius-xs);\n\tborder: var(--border-width) solid var(--border-0);\n\tbackground-color: var(--state-color);\n\n\t&[data-empty] {\n\t\tbackground-color: var(--surface-0);\n\t\tbackground-image: repeating-linear-gradient(135deg, var(--border-0), var(--border-0) 0.25em, transparent 0.25em, transparent 0.5em);\n\t}\n}\n\n// .options {\n// \tpadding: var(--space-xs);\n// }\n\n.optionsPalette {\n\t--input-width: auto;\n\n\tdisplay: grid;\n\tgrid-template-columns: repeat(5, minmax(0, 1fr));\n\tgap: var(--space-xs);\n}\n\n.optionsDetailed {\n\t--input-width: 16em;\n}\n\n.option {\n\tborder-radius: var(--radius-sm);\n\toutline: none;\n\tuser-select: none;\n}\n\n.optionPalette {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tpadding: var(--space-sm);\n\tmin-width: 2.25em;\n}\n\n.optionDetailed {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--space-sm);\n\tpadding: var(--space-xs) var(--space-sm);\n}\n\n.optionMeta {\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: var(--space-xs);\n\tmin-width: 0;\n}\n\n.optionMetaIcon {\n\tdisplay: inline-flex;\n\talign-items: center;\n}\n\n.optionMetaLabel {\n\tmin-width: 0;\n\twhite-space: nowrap;\n\ttext-overflow: ellipsis;\n\toverflow: hidden;\n}\n","import { CSSProperties, ReactNode, useMemo } from \"react\";\n\nimport { DEFAULT_VALUE_STATES, VALUE_STATE_COLOR_TOKENS } from \"@ryuzaki13/react-foundation-lib/formatters\";\nimport { State } from \"@ryuzaki13/react-foundation-lib/types\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { Select, SelectProps } from \"../select\";\nimport { UiBaseProps } from \"../types\";\n\nimport styles from \"./StateSelect.module.scss\";\n\nexport type StateMeta = {\n\tlabel?: ReactNode;\n\ticon?: ReactNode;\n};\n\nexport interface StateSelectProps extends Omit<UiBaseProps<State \| undefined>, \"placeholder\"> {\n\tplaceholder?: string;\n\toptions?: readonly State[];\n\tstateMeta?: Partial<Record<State, StateMeta>>;\n\tclassName?: string;\n\tclearable?: boolean;\n}\n\ninterface StateSwatchProps {\n\tstate: State;\n\tclassName?: string;\n}\n\nfunction StateSwatch({ state, className }: StateSwatchProps) {\n\treturn (\n\t\t<span\n\t\t\tclassName={cn(styles.swatch, className)}\n\t\t\tdata-empty={state === \"none\" ? \"\" : undefined}\n\t\t\tstyle={{ \"--state-color\": VALUE_STATE_COLOR_TOKENS[state] } as CSSProperties}\n\t\t/>\n\t);\n}\n\nfunction hasStateMeta(meta: StateMeta \| undefined): boolean {\n\treturn Boolean(meta?.icon \|\| meta?.label);\n}\n\nfunction resolveStateAriaLabel(state: State, meta: StateMeta \| undefined): string {\n\tif (typeof meta?.label === \"string\" && meta.label.trim()) {\n\t\treturn meta.label;\n\t}\n\n\treturn state \|\| \"empty\";\n}\n\nfunction renderStateMeta(meta: StateMeta \| undefined) {\n\tif (!hasStateMeta(meta)) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<span className={styles.optionMeta}>\n\t\t\t{meta?.icon ? <span className={styles.optionMetaIcon}>{meta.icon}</span> : null}\n\t\t\t{meta?.label ? <span className={styles.optionMetaLabel}>{meta.label}</span> : null}\n\t\t</span>\n\t);\n}\n\nfunction renderStateValue(state: State, meta: StateMeta \| undefined) {\n\treturn (\n\t\t<div className={styles.valueContainer}>\n\t\t\t<StateSwatch state={state} />\n\t\t\t{renderStateMeta(meta)}\n\t\t</div>\n\t);\n}\n\n/*\n Специализированный селект для выбора цветового или статусного состояния. Используется там, где значению соответствует визуальный swatch.\n /\nexport function StateSelect({\n\tlabel,\n\tdescription,\n\tdisabled,\n\tplaceholder,\n\tsize,\n\tvalue,\n\tonChange,\n\toptions = DEFAULT_VALUE_STATES,\n\tstateMeta,\n\tclassName,\n\tclearable\n}: StateSelectProps) {\n\tconst stateOptions = useMemo(() => Array.from(new Set(options)), [options]);\n\tconst hasDetailedOptions = stateOptions.some((stateOption) => hasStateMeta(stateMeta?.[stateOption]));\n\n\tconst sharedSelectProps: Pick<\n\t\tSelectProps<State>,\n\t\t\| \"getOptionKey\"\n\t\t\| \"getOptionLabel\"\n\t\t\| \"getOptionAriaLabel\"\n\t\t\| \"renderValue\"\n\t\t\| \"renderOption\"\n\t\t\| \"buttonClassName\"\n\t\t\| \"optionsContentClassName\"\n\t\t\| \"getOptionClassName\"\n\t> = {\n\t\tgetOptionKey: (stateOption) => stateOption \|\| \"__empty_state__\",\n\t\tgetOptionLabel: (stateOption) => stateMeta?.[stateOption]?.label ?? stateOption,\n\t\tgetOptionAriaLabel: (stateOption) => resolveStateAriaLabel(stateOption, stateMeta?.[stateOption]),\n\t\trenderValue: (stateOption) => renderStateValue(stateOption, stateMeta?.[stateOption]),\n\t\trenderOption: (stateOption) => (\n\t\t\t<>\n\t\t\t\t<StateSwatch state={stateOption} />\n\t\t\t\t{hasDetailedOptions ? renderStateMeta(stateMeta?.[stateOption]) : null}\n\t\t\t</>\n\t\t),\n\t\tbuttonClassName: styles.button,\n\t\toptionsContentClassName: cn(/styles.options,*/ hasDetailedOptions ? styles.optionsDetailed : styles.optionsPalette),\n\t\tgetOptionClassName: () => cn(styles.option, hasDetailedOptions ? styles.optionDetailed : styles.optionPalette)\n\t};\n\n\treturn (\n\t\t<Select\n\t\t\tlabel={label}\n\t\t\tdescription={description}\n\t\t\tdisabled={disabled}\n\t\t\tplaceholder={placeholder}\n\t\t\tsize={size}\n\t\t\tvalue={value}\n\t\t\tonChange={onChange}\n\t\t\toptions={stateOptions}\n\t\t\tclassName={className}\n\t\t\tclearable={clearable}\n\t\t\t{...sharedSelectProps}\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AC6BA,SAAS,EAAY,EAAE,UAAO,gBAA+B;CAC5D,OACC,kBAAC,QAAD;EACC,WAAW,EAAG,EAAO,QAAQ,CAAS;EACtC,cAAY,MAAU,SAAS,KAAK,KAAA;EACpC,OAAO,EAAE,iBAAiB,EAAyB,GAAO;CAC1D,CAAA;AAEH;AAEA,SAAS,EAAa,GAAsC;CAC3D,OAAO,GAAQ,GAAM,QAAQ,GAAM;AACpC;AAEA,SAAS,EAAsB,GAAc,GAAqC;CAKjF,OAJI,OAAO,GAAM,SAAU,YAAY,EAAK,MAAM,KAAK,IAC/C,EAAK,QAGN,KAAS;AACjB;AAEA,SAAS,EAAgB,GAA6B;CAKrD,OAJK,EAAa,CAAI,IAKrB,kBAAC,QAAD;EAAM,WAAW,EAAO;YAAxB,CACE,GAAM,OAAO,kBAAC,QAAD;GAAM,WAAW,EAAO;aAAiB,EAAK;EAAW,CAAA,IAAI,MAC1E,GAAM,QAAQ,kBAAC,QAAD;GAAM,WAAW,EAAO;aAAkB,EAAK;EAAY,CAAA,IAAI,IACzE;MAPC;AAST;AAEA,SAAS,EAAiB,GAAc,GAA6B;CACpE,OACC,kBAAC,OAAD;EAAK,WAAW,EAAO;YAAvB,CACC,kBAAC,GAAD,EAAoB,SAAQ,CAAA,GAC3B,EAAgB,CAAI,CACjB;;AAEP;AAKA,SAAgB,EAAY,EAC3B,UACA,gBACA,aACA,gBACA,SACA,UACA,aACA,aAAU,GACV,cACA,cACA,gBACoB;CACpB,IAAM,IAAe,QAAc,MAAM,KAAK,IAAI,IAAI,CAAO,CAAC,GAAG,CAAC,CAAO,CAAC,GACpE,IAAqB,EAAa,MAAM,MAAgB,EAAa,IAAY,EAAY,CAAC;CA4BpG,OACC,kBAAC,GAAD;EACQ;EACM;EACH;EACG;EACP;EACC;EACG;EACV,SAAS;EACE;EACA;EA1BZ,eAAe,MAAgB,KAAe;EAC9C,iBAAiB,MAAgB,IAAY,EAAY,EAAE,SAAS;EACpE,qBAAqB,MAAgB,EAAsB,GAAa,IAAY,EAAY;EAChG,cAAc,MAAgB,EAAiB,GAAa,IAAY,EAAY;EACpF,eAAe,MACd,kBAAA,GAAA,EAAA,UAAA,CACC,kBAAC,GAAD,EAAa,OAAO,EAAc,CAAA,GACjC,IAAqB,EAAgB,IAAY,EAAY,IAAI,IACjE,EAAA,CAAA;EAEH,iBAAiB,EAAO;EACxB,yBAAyB,EAAuB,IAAqB,EAAO,kBAAkB,EAAO,cAAc;EACnH,0BAA0B,EAAG,EAAO,QAAQ,IAAqB,EAAO,iBAAiB,EAAO,aAAa;CAgB5G,CAAA;AAEH"}
1	+ {"version":3,"file":"StateSelect-CEp7kGGg.js","names":[],"sources":["../../src/state-select/StateSelect.module.scss","../../src/state-select/StateSelect.tsx"],"sourcesContent":[".button {\n\tpadding-left: var(--space-sm);\n}\n\n.valueContainer {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--space-sm);\n\twidth: 100%;\n\tmin-height: 1.5em;\n\tmin-width: 0;\n}\n\n.swatch {\n\t--state-color: transparent;\n\n\twidth: 1.25em;\n\theight: 1.25em;\n\tflex-shrink: 0;\n\tdisplay: inline-block;\n\tborder-radius: var(--radius-xs);\n\tborder: var(--border-width) solid var(--border-0);\n\tbackground-color: var(--state-color);\n\n\t&[data-empty] {\n\t\tbackground-color: var(--surface-0);\n\t\tbackground-image: repeating-linear-gradient(135deg, var(--border-0), var(--border-0) 0.25em, transparent 0.25em, transparent 0.5em);\n\t}\n}\n\n// .options {\n// \tpadding: var(--space-xs);\n// }\n\n.optionsPalette {\n\t--input-width: auto;\n\n\tdisplay: grid;\n\tgrid-template-columns: repeat(5, minmax(0, 1fr));\n\tgap: var(--space-xs);\n}\n\n.optionsDetailed {\n\t--input-width: 16em;\n}\n\n.option {\n\tborder-radius: var(--radius-sm);\n\toutline: none;\n\tuser-select: none;\n}\n\n.optionPalette {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tpadding: var(--space-sm);\n\tmin-width: 2.25em;\n}\n\n.optionDetailed {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--space-sm);\n\tpadding: var(--space-xs) var(--space-sm);\n}\n\n.optionMeta {\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: var(--space-xs);\n\tmin-width: 0;\n}\n\n.optionMetaIcon {\n\tdisplay: inline-flex;\n\talign-items: center;\n}\n\n.optionMetaLabel {\n\tmin-width: 0;\n\twhite-space: nowrap;\n\ttext-overflow: ellipsis;\n\toverflow: hidden;\n}\n","import { CSSProperties, ReactNode, useMemo } from \"react\";\n\nimport { DEFAULT_VALUE_STATES, VALUE_STATE_COLOR_TOKENS } from \"@ryuzaki13/react-foundation-lib/formatters\";\nimport { State } from \"@ryuzaki13/react-foundation-lib/types\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { Select, SelectProps } from \"../select\";\nimport { UiBaseProps } from \"../types\";\n\nimport styles from \"./StateSelect.module.scss\";\n\nexport type StateMeta = {\n\tlabel?: ReactNode;\n\ticon?: ReactNode;\n};\n\nexport interface StateSelectProps extends Omit<UiBaseProps<State \| undefined>, \"placeholder\"> {\n\tplaceholder?: string;\n\toptions?: readonly State[];\n\tstateMeta?: Partial<Record<State, StateMeta>>;\n\tclassName?: string;\n\tclearable?: boolean;\n}\n\ninterface StateSwatchProps {\n\tstate: State;\n\tclassName?: string;\n}\n\nfunction StateSwatch({ state, className }: StateSwatchProps) {\n\treturn (\n\t\t<span\n\t\t\tclassName={cn(styles.swatch, className)}\n\t\t\tdata-empty={state === \"none\" ? \"\" : undefined}\n\t\t\tstyle={{ \"--state-color\": VALUE_STATE_COLOR_TOKENS[state] } as CSSProperties}\n\t\t/>\n\t);\n}\n\nfunction hasStateMeta(meta: StateMeta \| undefined): boolean {\n\treturn Boolean(meta?.icon \|\| meta?.label);\n}\n\nfunction resolveStateAriaLabel(state: State, meta: StateMeta \| undefined): string {\n\tif (typeof meta?.label === \"string\" && meta.label.trim()) {\n\t\treturn meta.label;\n\t}\n\n\treturn state \|\| \"empty\";\n}\n\nfunction renderStateMeta(meta: StateMeta \| undefined) {\n\tif (!hasStateMeta(meta)) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<span className={styles.optionMeta}>\n\t\t\t{meta?.icon ? <span className={styles.optionMetaIcon}>{meta.icon}</span> : null}\n\t\t\t{meta?.label ? <span className={styles.optionMetaLabel}>{meta.label}</span> : null}\n\t\t</span>\n\t);\n}\n\nfunction renderStateValue(state: State, meta: StateMeta \| undefined) {\n\treturn (\n\t\t<div className={styles.valueContainer}>\n\t\t\t<StateSwatch state={state} />\n\t\t\t{renderStateMeta(meta)}\n\t\t</div>\n\t);\n}\n\n/*\n Специализированный селект для выбора цветового или статусного состояния. Используется там, где значению соответствует визуальный swatch.\n /\nexport function StateSelect({\n\tlabel,\n\tdescription,\n\tdisabled,\n\tplaceholder,\n\tsize,\n\tvalue,\n\tonChange,\n\toptions = DEFAULT_VALUE_STATES,\n\tstateMeta,\n\tclassName,\n\tclearable\n}: StateSelectProps) {\n\tconst stateOptions = useMemo(() => Array.from(new Set(options)), [options]);\n\tconst hasDetailedOptions = stateOptions.some((stateOption) => hasStateMeta(stateMeta?.[stateOption]));\n\n\tconst sharedSelectProps: Pick<\n\t\tSelectProps<State>,\n\t\t\| \"getOptionKey\"\n\t\t\| \"getOptionLabel\"\n\t\t\| \"getOptionAriaLabel\"\n\t\t\| \"renderValue\"\n\t\t\| \"renderOption\"\n\t\t\| \"buttonClassName\"\n\t\t\| \"optionsContentClassName\"\n\t\t\| \"getOptionClassName\"\n\t> = {\n\t\tgetOptionKey: (stateOption) => stateOption \|\| \"__empty_state__\",\n\t\tgetOptionLabel: (stateOption) => stateMeta?.[stateOption]?.label ?? stateOption,\n\t\tgetOptionAriaLabel: (stateOption) => resolveStateAriaLabel(stateOption, stateMeta?.[stateOption]),\n\t\trenderValue: (stateOption) => renderStateValue(stateOption, stateMeta?.[stateOption]),\n\t\trenderOption: (stateOption) => (\n\t\t\t<>\n\t\t\t\t<StateSwatch state={stateOption} />\n\t\t\t\t{hasDetailedOptions ? renderStateMeta(stateMeta?.[stateOption]) : null}\n\t\t\t</>\n\t\t),\n\t\tbuttonClassName: styles.button,\n\t\toptionsContentClassName: cn(/styles.options,*/ hasDetailedOptions ? styles.optionsDetailed : styles.optionsPalette),\n\t\tgetOptionClassName: () => cn(styles.option, hasDetailedOptions ? styles.optionDetailed : styles.optionPalette)\n\t};\n\n\treturn (\n\t\t<Select\n\t\t\tlabel={label}\n\t\t\tdescription={description}\n\t\t\tdisabled={disabled}\n\t\t\tplaceholder={placeholder}\n\t\t\tsize={size}\n\t\t\tvalue={value}\n\t\t\tonChange={onChange}\n\t\t\toptions={stateOptions}\n\t\t\tclassName={className}\n\t\t\tclearable={clearable}\n\t\t\t{...sharedSelectProps}\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AC6BA,SAAS,EAAY,EAAE,UAAO,gBAA+B;CAC5D,OACC,kBAAC,QAAD;EACC,WAAW,EAAG,EAAO,QAAQ,CAAS;EACtC,cAAY,MAAU,SAAS,KAAK,KAAA;EACpC,OAAO,EAAE,iBAAiB,EAAyB,GAAO;CAC1D,CAAA;AAEH;AAEA,SAAS,EAAa,GAAsC;CAC3D,OAAO,GAAQ,GAAM,QAAQ,GAAM;AACpC;AAEA,SAAS,EAAsB,GAAc,GAAqC;CAKjF,OAJI,OAAO,GAAM,SAAU,YAAY,EAAK,MAAM,KAAK,IAC/C,EAAK,QAGN,KAAS;AACjB;AAEA,SAAS,EAAgB,GAA6B;CAKrD,OAJK,EAAa,CAAI,IAKrB,kBAAC,QAAD;EAAM,WAAW,EAAO;YAAxB,CACE,GAAM,OAAO,kBAAC,QAAD;GAAM,WAAW,EAAO;aAAiB,EAAK;EAAW,CAAA,IAAI,MAC1E,GAAM,QAAQ,kBAAC,QAAD;GAAM,WAAW,EAAO;aAAkB,EAAK;EAAY,CAAA,IAAI,IACzE;MAPC;AAST;AAEA,SAAS,EAAiB,GAAc,GAA6B;CACpE,OACC,kBAAC,OAAD;EAAK,WAAW,EAAO;YAAvB,CACC,kBAAC,GAAD,EAAoB,SAAQ,CAAA,GAC3B,EAAgB,CAAI,CACjB;;AAEP;AAKA,SAAgB,EAAY,EAC3B,UACA,gBACA,aACA,gBACA,SACA,UACA,aACA,aAAU,GACV,cACA,cACA,gBACoB;CACpB,IAAM,IAAe,QAAc,MAAM,KAAK,IAAI,IAAI,CAAO,CAAC,GAAG,CAAC,CAAO,CAAC,GACpE,IAAqB,EAAa,MAAM,MAAgB,EAAa,IAAY,EAAY,CAAC;CA4BpG,OACC,kBAAC,GAAD;EACQ;EACM;EACH;EACG;EACP;EACC;EACG;EACV,SAAS;EACE;EACA;EA1BZ,eAAe,MAAgB,KAAe;EAC9C,iBAAiB,MAAgB,IAAY,EAAY,EAAE,SAAS;EACpE,qBAAqB,MAAgB,EAAsB,GAAa,IAAY,EAAY;EAChG,cAAc,MAAgB,EAAiB,GAAa,IAAY,EAAY;EACpF,eAAe,MACd,kBAAA,GAAA,EAAA,UAAA,CACC,kBAAC,GAAD,EAAa,OAAO,EAAc,CAAA,GACjC,IAAqB,EAAgB,IAAY,EAAY,IAAI,IACjE,EAAA,CAAA;EAEH,iBAAiB,EAAO;EACxB,yBAAyB,EAAuB,IAAqB,EAAO,kBAAkB,EAAO,cAAc;EACnH,0BAA0B,EAAG,EAAO,QAAQ,IAAqB,EAAO,iBAAiB,EAAO,aAAa;CAgB5G,CAAA;AAEH"}

package/dist/chunks/{TextEditorLexicalClient-CovUSRag.js → TextEditorLexicalClient-uvFboXlh.js} RENAMED Viewed

@@ -1,6 +1,6 @@
 import { t as e } from "./Button-CCWuggdA.js";
 import { r as t } from "./Grid-ByIIytjh.js";
-import { t as n } from "./Input-BmjlpA09.js";
+import { t as n } from "./Input-BYUl3UFn.js";
 import { i as r, n as i, r as a } from "./modal-ByNRME3b.js";
 import { t as o } from "./CheckBox-BowNqqd3.js";
 import { n as s } from "./RadioGroup-B9XjkcOy.js";
@@ -1175,4 +1175,4 @@ function Ee({ initialData: e, onChange: t, toolbarComponents: n, businessAdapter
 //#endregion
 export { Ee as TextEditorLexicalClient };
-//# sourceMappingURL=TextEditorLexicalClient-CovUSRag.js.map
+//# sourceMappingURL=TextEditorLexicalClient-uvFboXlh.js.map