@olddevs/ui 0.0.0-stage → 4.0.0

package/dist/components/inputs/FormField.d.ts

@@ -0,0 +1,89 @@
+import { type ComponentPropsWithoutRef, type ReactNode } from "react";
+/** Раскладка поля: подпись над полем или в колонке слева. */
+export type FieldLayout = "stack" | "side";
+/** @internal */
+export declare const FieldLayoutProvider: import("react").Provider<FieldLayout | null>;
+export interface FormFieldProps extends Omit<ComponentPropsWithoutRef<"div">, "children"> {
+    /** Подпись над полем. */
+    label: ReactNode;
+    /**
+     * `id` поля, к которому относится подпись.
+     *
+     * Без него подпись остаётся просто текстом: клик по ней не фокусирует поле,
+     * а скринридер не называет поле её словами. Проп необязателен, потому что
+     * `id` знает только вызывающий, а придумывать его здесь через `useId` нечем —
+     * поле лежит в `children`, и подставить ему атрибут отсюда невозможно.
+     */
+    htmlFor?: string;
+    /** Пояснение под полем. */
+    hint?: ReactNode;
+    /**
+     * Сообщение об ошибке. По умолчанию заменяет `hint`; с `hintPersistent` подсказка
+     * остаётся, и ошибка встаёт под ней.
+     *
+     * Две строки под полем, одна из которых противоречит другой, — источник шума:
+     * пояснение говорит, как заполнять, ошибка — что заполнено неверно, и вместе
+     * они заставляют читать обе, чтобы понять, какая ещё действует.
+     */
+    error?: ReactNode;
+    /**
+     * Подсказка остаётся под полем и при ошибке; ошибка встаёт под ней.
+     *
+     * Для подсказки-ПРАВИЛА (формат, ограничение: «8–64 символа, цифра и
+     * буква»): прятать её ровно тогда, когда пользователь ошибся, значит отнять
+     * инструкцию в момент, когда она нужнее всего. Подсказка-пояснение («как к
+     * вам обращаться») по-прежнему заменяется ошибкой — это умолчание
+     * (ADR-0065).
+     */
+    hintPersistent?: boolean;
+    /**
+     * Отметка обязательного поля рядом с подписью.
+     *
+     * Только отметка: валидацию она не включает и не заменяет. Кит показывает
+     * состояние формы, а вычисляет его потребитель — правила обязательности это
+     * знание домена.
+     */
+    required?: boolean;
+    /**
+     * Раскладка: `stack` — подпись над полем, `side` — подпись в колонке слева.
+     *
+     * Ось живёт ЗДЕСЬ, а не в `FormLayout`, потому что подпись рисует это поле:
+     * перенести её в левую колонку снаружи невозможно — она лежит внутри
+     * собственного флекса компонента. Разбор — ADR-0025.
+     *
+     * Без пропа ось берётся у ближайшего `FormLayout`, а без него — `stack`, и
+     * разметка не меняется ни на узел.
+     */
+    layout?: FieldLayout;
+    /** Поле, к которому относится подпись. */
+    children?: ReactNode;
+}
+/**
+ * Подпись, поле и пояснение — одним блоком.
+ *
+ * СВЯЗЬ ПОДПИСИ С ПОЛЕМ — ЧЕРЕЗ `htmlFor`, и её стоит проставлять всегда:
+ *
+ *     <FormField label="Название" htmlFor="cat-name">
+ *       <TextControl id="cat-name" … />
+ *     </FormField>
+ *
+ * Раньше связи не было вовсе и подделывать её было нечем — отсюда прежняя
+ * докстрока «связать может только вызывающий». Это верно и сейчас: `id`
+ * по-прежнему приходит снаружи. Изменилось то, что теперь для этого есть проп,
+ * а не только совет обернуть весь блок в `<label>` на стороне вызова.
+ *
+ * ШИРИНА КОЛОНКИ ПОДПИСЕЙ — ПЕРЕМЕННАЯ `--form-label-w`, а не `subgrid`.
+ * `subgrid` выровнял бы подписи по общему треку, но требует, чтобы поле было
+ * прямым элементом внешнего грида с известным числом дорожек, — а при двух
+ * колонках и строке во всю ширину их то две, то четыре. Переменная же
+ * работает и вне `FormLayout`: поле с `layout="side"` стоит само по себе.
+ *
+ * Длинная подпись переносится ВНУТРИ своей колонки и не двигает поле — это и
+ * есть требование «не ломает соседний ряд».
+ *
+ * Прежняя версия экспортировала ещё и `inputStyle` — объект инлайн-стилей
+ * поля. Он не переносится: разбор показал ноль использований во всём фронте,
+ * то есть экспорт держался сам за себя.
+ */
+export declare const FormField: import("react").ForwardRefExoticComponent<FormFieldProps & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=FormField.d.ts.map

package/dist/components/inputs/FormField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/FormField.tsx"],"names":[],"mappings":"AAEA,OAAO,EAKL,KAAK,wBAAwB,EAC7B,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAQf,6DAA6D;AAC7D,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,MAAM,CAAC;AAU3C,gBAAgB;AAChB,eAAO,MAAM,mBAAmB,8CAA8B,CAAC;AAE/D,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IACvF,yBAAyB;IACzB,KAAK,EAAE,SAAS,CAAC;IACjB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2BAA2B;IAC3B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;;OAQG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,SAAS,2GAwHpB,CAAC"}

package/dist/components/inputs/FormField.js

@@ -0,0 +1,24 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { createContext, forwardRef, useContext, useId, } from "react";
+import { FieldDescriptionProvider, FieldInvalidProvider, FieldLabelProvider, } from "../../hooks/useFieldDescription.js";
+import { cn } from "../../lib/cn.js";
+const FieldLayoutContext = createContext(null);
+export const FieldLayoutProvider = FieldLayoutContext.Provider;
+export const FormField = forwardRef(function FormField({ label, htmlFor, hint, error, hintPersistent, required, layout, children, className, ...rest }, ref) {
+    const inherited = useContext(FieldLayoutContext);
+    const side = (layout ?? inherited ?? "stack") === "side";
+    const messageId = useId();
+    const hintId = useId();
+    const keepHint = hintPersistent === true && error != null && Boolean(hint);
+    const labelId = useId();
+    const message = error != null ? (_jsx("div", { id: messageId, role: "alert", className: "text-danger-strong text-[11px]", children: error })) : hint ? (_jsx("div", { id: messageId, className: "text-fg-3 text-[11px]", children: hint })) : null;
+    const describedBy = message != null ? (keepHint ? `${hintId} ${messageId}` : messageId) : undefined;
+    const messages = keepHint ? (_jsxs(_Fragment, { children: [_jsx("div", { id: hintId, className: "text-fg-3 text-[11px]", children: hint }), message] })) : (message);
+    const invalid = error != null;
+    return (_jsxs("div", { ref: ref, className: cn(side
+            ?
+                "grid grid-cols-[var(--form-label-w,12rem)_minmax(0,1fr)] items-start gap-x-4"
+            : "flex flex-col gap-1.5", className), ...rest, children: [_jsxs("label", { id: labelId, htmlFor: htmlFor, className: cn("text-fg-2 text-[11px] font-bold tracking-wide uppercase", side && "pt-2.5"), children: [label, required && (_jsx("span", { "aria-hidden": true, className: "text-danger-strong ml-0.5", children: "*" }))] }), _jsx(FieldLabelProvider, { value: labelId, children: _jsx(FieldDescriptionProvider, { value: describedBy, children: _jsx(FieldInvalidProvider, { value: invalid, children: side ? (_jsxs("div", { className: "flex flex-col gap-1.5", children: [children, messages] })) : (_jsxs(_Fragment, { children: [children, messages] })) }) }) })] }));
+});
+//# sourceMappingURL=FormField.js.map

package/dist/components/inputs/FormField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../../src/components/inputs/FormField.tsx"],"names":[],"mappings":"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"}

package/dist/components/inputs/FormLayout.d.ts

@@ -0,0 +1,47 @@
+import { type ComponentPropsWithoutRef } from "react";
+export interface FormLayoutProps extends ComponentPropsWithoutRef<"div"> {
+    /** Число колонок. На узких экранах колонка всегда одна — это делает CSS. */
+    columns?: 1 | 2;
+    /** Где стоят подписи полей: над полем или в колонке слева. */
+    labels?: "top" | "side";
+    /**
+     * Ширина колонки подписей — любая длина CSS.
+     *
+     * Проп, а не только переменная, потому что ширина зависит от самых длинных
+     * подписей ЭТОЙ формы, а не от темы: подобрать её глобально нельзя.
+     */
+    labelWidth?: string;
+}
+/**
+ * Раскладка формы: колонки и место подписей.
+ *
+ * ОТВЕЧАЕТ ТОЛЬКО ЗА ПОЗИЦИЮ УЗЛОВ. Ни валидации, ни состава полей, ни
+ * состояния: `Form` отказался от собственной валидации осознанно, и раскладка
+ * этого не пересматривает. Признак нарушения границы проверяемый — проп,
+ * который влияет не на позицию узлов, а на их состав (ADR-0025).
+ *
+ * СЕТКА НА CSS, А НЕ РАСЧЁТ В JS. Одна колонка на узких экранах включается
+ * медиазапросом: раскладка, зависящая от `matchMedia`, до гидратации
+ * показывает неверную, и первый кадр формы приходится на неё.
+ *
+ * ПОДПИСИ СЛЕВА — ЭТО ОСЬ `FormField`, А НЕ ЭТОГО КОМПОНЕНТА. Раскладка лишь
+ * передаёт её контекстом: подпись рисует поле, и перенести её снаружи
+ * невозможно. Отсюда следствие, которое стоит знать заранее: `labels="side"`
+ * действует на `FormField` и молча не применяется к чужим детям — `<input>`
+ * потребителя раскладка позиционирует, но подписи у него не видит.
+ *
+ * `Fieldset` отдельным компонентом не заводится: группировка с подписью — это
+ * родные `<fieldset>` и `<legend>`, и обёртка вокруг них не добавила бы
+ * ничего, кроме имени в экспорте.
+ */
+export declare const FormLayout: import("react").ForwardRefExoticComponent<FormLayoutProps & import("react").RefAttributes<HTMLDivElement>>;
+export type FieldRowProps = ComponentPropsWithoutRef<"div">;
+/**
+ * Поле во всю ширину раскладки: адрес, длинное описание, блок кнопок.
+ *
+ * `col-span-full`, а не `col-span-2`: строка обязана занимать столько колонок,
+ * сколько их есть. Фиксированные две в одноколоночной раскладке создали бы
+ * неявную вторую колонку — форма разъехалась бы там, где ничего не меняли.
+ */
+export declare const FieldRow: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=FormLayout.d.ts.map

package/dist/components/inputs/FormLayout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormLayout.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/FormLayout.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAc,KAAK,wBAAwB,EAAsB,MAAM,OAAO,CAAC;AAItF,MAAM,WAAW,eAAgB,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IACtE,4EAA4E;IAC5E,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IAChB,8DAA8D;IAC9D,MAAM,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IACxB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,UAAU,4GAqBrB,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,wBAAwB,CAAC,KAAK,CAAC,CAAC;AAE5D;;;;;;GAMG;AACH,eAAO,MAAM,QAAQ,2MAKnB,CAAC"}

package/dist/components/inputs/FormLayout.js

@@ -0,0 +1,12 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { cn } from "../../lib/cn.js";
+import { FieldLayoutProvider } from "./FormField.js";
+export const FormLayout = forwardRef(function FormLayout({ columns = 1, labels = "top", labelWidth, className, style, ...rest }, ref) {
+    return (_jsx(FieldLayoutProvider, { value: labels === "side" ? "side" : "stack", children: _jsx("div", { ref: ref, className: cn("grid gap-4", columns === 2 && "sm:grid-cols-2", className), style: labelWidth != null ? { ...style, "--form-label-w": labelWidth } : style, ...rest }) }));
+});
+export const FieldRow = forwardRef(function FieldRow({ className, ...rest }, ref) {
+    return _jsx("div", { ref: ref, className: cn("col-span-full", className), ...rest });
+});
+//# sourceMappingURL=FormLayout.js.map

package/dist/components/inputs/FormLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormLayout.js","sourceRoot":"","sources":["../../../src/components/inputs/FormLayout.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,UAAU,EAAqD,MAAM,OAAO,CAAC;AACtF,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAsCrD,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAAkC,SAAS,UAAU,CACvF,EAAE,OAAO,GAAG,CAAC,EAAE,MAAM,GAAG,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EACtE,GAAG;IAEH,OAAO,CAIL,KAAC,mBAAmB,IAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,YAC9D,cACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,OAAO,KAAK,CAAC,IAAI,gBAAgB,EAAE,SAAS,CAAC,EAGzE,KAAK,EACH,UAAU,IAAI,IAAI,CAAC,CAAC,CAAE,EAAE,GAAG,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAAoB,CAAC,CAAC,CAAC,KAAK,KAExF,IAAI,GACR,GACkB,CACvB,CAAC;AACJ,CAAC,CAAC,CAAC;AAWH,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAAgC,SAAS,QAAQ,CACjF,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EACtB,GAAG;IAEH,OAAO,cAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC,KAAM,IAAI,GAAI,CAAC;AAChF,CAAC,CAAC,CAAC"}

package/dist/components/inputs/InlineEdit.d.ts

@@ -0,0 +1,50 @@
+import { type ComponentPropsWithoutRef } from "react";
+export interface InlineEditProps extends Omit<ComponentPropsWithoutRef<"div">, "onChange" | "children" | "defaultValue"> {
+    /** Подтверждённое значение. Компонент его не хранит. */
+    value: string;
+    /** Подтверждение правки. Вызывается, только когда значение изменилось. */
+    onChange: (value: string) => void;
+    /**
+     * Доступное имя поля. Обязательно и проверяется компилятором: без него
+     * правка по месту даёт поле без имени ровно в момент ввода. Имя кнопки
+     * строится из значения и слова «изменить» из каталога сообщений.
+     */
+    label: string;
+    /** Режим правки. Без пропа компонент ведёт его сам. */
+    editing?: boolean;
+    /** Вызывается при входе в режим правки и выходе из него и получает новое состояние. */
+    onEditingChange?: (editing: boolean) => void;
+    /** Что показать на кнопке, когда значение пустое. */
+    placeholder?: string;
+    /** Выключает правку: кнопка-значение не открывает поле. */
+    disabled?: boolean;
+}
+/**
+ * Правка значения по месту: кнопка-значение → поле → подтверждение.
+ *
+ * ПОДТВЕРЖДЁННОЕ ЗНАЧЕНИЕ НЕ ХРАНИТСЯ. Внутри живёт только черновик правки — то,
+ * что набирают прямо сейчас; подтверждение уходит наружу, и следующим кадром
+ * значение приходит пропом. Компонент, хранящий подтверждённое, показывал бы
+ * своё после отказа сервера сохранить.
+ *
+ * ОТМЕНА ПО ESCAPE — ТРЕБОВАНИЕ, А НЕ УДОБСТВО. Без неё пользователь, начавший
+ * править по ошибке, не может выйти, не сохранив: щелчок мимо подтверждает,
+ * Enter подтверждает, и выхода без записи не остаётся.
+ *
+ * ФОКУС — ГЛАВНОЕ, ЧТО ЗДЕСЬ ЕСТЬ, и потому проверяется в живом браузере:
+ *
+ * - открытие ставит курсор в поле, а не оставляет его на кнопке — иначе
+ *   пользователь клавиатуры открыл поле и печатает в никуда;
+ * - Escape возвращает и значение, и фокус на кнопку;
+ * - Enter подтверждает и тоже возвращает фокус на кнопку: поле исчезает, и без
+ *   возврата фокус уезжает на `<body>`;
+ * - щелчок мимо подтверждает и фокус НЕ забирает: пользователь ушёл туда,
+ *   куда хотел.
+ *
+ * Режим правки можно вести снаружи (`editing` + `onEditingChange`) — так же,
+ * как сворачивание у `SideNav`. Без пропа компонент ведёт его сам: три строки
+ * состояния, повторённые каждым потребителем, — это не «состояние у
+ * потребителя», а переписанный компонент.
+ */
+export declare function InlineEdit({ value, onChange, label, editing, onEditingChange, placeholder, disabled, className, ...rest }: InlineEditProps): import("react").JSX.Element;
+//# sourceMappingURL=InlineEdit.d.ts.map

package/dist/components/inputs/InlineEdit.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineEdit.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/InlineEdit.tsx"],"names":[],"mappings":"AAEA,OAAO,EAIL,KAAK,wBAAwB,EAE9B,MAAM,OAAO,CAAC;AAKf,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,wBAAwB,CAAC,KAAK,CAAC,EAC/B,UAAU,GAAG,UAAU,GAAG,cAAc,CACzC;IACC,wDAAwD;IACxD,KAAK,EAAE,MAAM,CAAC;IACd,0EAA0E;IAC1E,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;;;OAIG;IACH,KAAK,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,uFAAuF;IACvF,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,qDAAqD;IACrD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,QAAQ,EACR,KAAK,EACL,OAAO,EACP,eAAe,EACf,WAAW,EACX,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,eAAe,+BAkIjB"}

package/dist/components/inputs/InlineEdit.js

@@ -0,0 +1,70 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useLayoutEffect, useRef, useState, } from "react";
+import { cn } from "../../lib/cn.js";
+import { useMessages } from "../../i18n/useMessages.js";
+import { TextControl } from "./TextControl.js";
+export function InlineEdit({ value, onChange, label, editing, onEditingChange, placeholder, disabled, className, ...rest }) {
+    const messages = useMessages();
+    const [uncontrolled, setUncontrolled] = useState(false);
+    const isControlled = editing !== undefined;
+    const open = isControlled ? editing : uncontrolled;
+    const [draft, setDraft] = useState(value);
+    const buttonRef = useRef(null);
+    const fieldRef = useRef(null);
+    const returnFocus = useRef(false);
+    const cancelling = useRef(false);
+    const setOpen = (next) => {
+        if (!isControlled)
+            setUncontrolled(next);
+        onEditingChange?.(next);
+    };
+    useLayoutEffect(() => {
+        if (open) {
+            setDraft(value);
+            cancelling.current = false;
+            if (fieldRef.current)
+                fieldRef.current.value = value;
+            fieldRef.current?.focus();
+            fieldRef.current?.select();
+            return;
+        }
+        if (returnFocus.current) {
+            returnFocus.current = false;
+            buttonRef.current?.focus();
+        }
+    }, [open]);
+    const start = () => setOpen(true);
+    const confirm = (withFocus) => {
+        returnFocus.current = withFocus;
+        setOpen(false);
+        if (draft !== value)
+            onChange(draft);
+    };
+    const cancel = () => {
+        cancelling.current = true;
+        returnFocus.current = true;
+        setOpen(false);
+    };
+    const handleKeyDown = (event) => {
+        if (event.key === "Enter") {
+            event.preventDefault();
+            confirm(true);
+        }
+        if (event.key === "Escape") {
+            event.preventDefault();
+            cancel();
+        }
+    };
+    return (_jsx("div", { className: cn("min-w-0", className), ...rest, children: open ? (_jsx(TextControl, { ref: fieldRef, "aria-label": label, value: draft, disabled: disabled, onChange: (event) => setDraft(event.target.value), onKeyDown: handleKeyDown, onBlur: () => {
+                if (cancelling.current) {
+                    cancelling.current = false;
+                    return;
+                }
+                confirm(false);
+            }, shellClassName: "w-full" })) : (_jsxs("button", { ref: buttonRef, type: "button", disabled: disabled, onClick: start, className: "text-fg-0 rounded-control hover:bg-bg-2 flex w-full cursor-pointer items-center " +
+                "px-2 py-[10px] text-left text-[13px] leading-5 transition-colors " +
+                "focus-visible:outline-accent-strong focus-visible:outline-2 focus-visible:outline-offset-2 " +
+                "disabled:cursor-not-allowed disabled:opacity-50", children: [value === "" ? (_jsx("span", { className: "text-fg-3", children: placeholder ?? messages.inlineEdit.empty })) : (value), _jsxs("span", { className: "sr-only", children: [", ", messages.inlineEdit.edit] })] })) }));
+}
+//# sourceMappingURL=InlineEdit.js.map

package/dist/components/inputs/InlineEdit.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineEdit.js","sourceRoot":"","sources":["../../../src/components/inputs/InlineEdit.tsx"],"names":[],"mappings":"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"}

package/dist/components/inputs/MaskedInput.d.ts

@@ -0,0 +1,66 @@
+import { type ComponentPropsWithoutRef } from "react";
+export interface MaskedInputProps extends Omit<ComponentPropsWithoutRef<"input">, "onChange" | "value" | "defaultValue" | "size"> {
+    /**
+     * Маска: `9` — цифра, `a` — буква, `*` — цифра или буква; остальное литерал.
+     *
+     * Кит о предметной области не знает: маска приходит пропом, и «телефон» или
+     * «серия паспорта» — знание вызывающего.
+     */
+    mask: string;
+    /** Сырое значение — без литералов маски. Именно оно уходит на сервер. */
+    value: string;
+    /**
+     * Вызывается с обоими представлениями: сырым и показанным.
+     *
+     * Сырое нужно запросу, показанное — тому, кто хранит текст как есть. Отдать
+     * одно — значит заставить половину потребителей форматировать заново.
+     */
+    onChange: (raw: string, formatted: string) => void;
+    /** Классы на оболочку с рамкой. */
+    shellClassName?: string;
+    /**
+     * Показывать формат прямо в поле: `+7 (___) ___-__-__`.
+     *
+     * ПО УМОЛЧАНИЮ ВКЛЮЧЕНО, и это не косметика. До появления трафарета поле не
+     * сообщало формат ВООБЩЕ: `formatMask` подставляет литералы только пока есть
+     * что ставить дальше, поэтому пустое поле показывало пустой прямоугольник, а
+     * наполовину заполненное — обрубок без остатка. Пользователь узнавал формат
+     * методом проб.
+     *
+     * Выключается там, где формат уже сказан рядом и повторять его в поле —
+     * шум: короткая известная маска в плотной таблице, поле под своей подписью
+     * с примером.
+     *
+     * Трафарет — УКРАШЕНИЕ: он `aria-hidden` и скринридеру не достаётся. Формат для
+     * него живёт в подсказке `FormField`, которая с полем связана
+     * (`aria-describedby`), — и это разделение сознательное: постоянная подсказка
+     * доступна и при проверке набранного, а трафарет по мере ввода исчезает.
+     */
+    showMask?: boolean;
+}
+/**
+ * Поле с маской ввода.
+ *
+ * СТОИТ НА `TextControl` (прецедент ADR-0009): рамка, фокус, выключенное и
+ * невалидное состояния — его; здесь только механика маски.
+ *
+ * ЗНАЧЕНИЕ СЫРОЕ, ПОКАЗ ОТФОРМАТИРОВАННЫЙ. Хранить формат — значит хранить
+ * решение о показе: маску можно поменять, а записанные с ней скобки останутся
+ * в базе навсегда.
+ *
+ * КАРЕТКА — ТО, РАДИ ЧЕГО КОМПОНЕНТ ВООБЩЕ НУЖЕН. Форматирование на каждом
+ * вводе перерисовывает строку целиком, и браузер ставит каретку в конец;
+ * править середину номера становится невозможно. Поэтому позиция считается по
+ * маске: сколько символов значения стояло левее — столько и останется.
+ *
+ * BACKSPACE ЧЕРЕЗ ЛИТЕРАЛ УДАЛЯЕТ СИМВОЛ ЗНАЧЕНИЯ, а не литерал. Иначе каретка
+ * упирается в `)` и стирание встаёт: литерал удалится, тут же вернётся
+ * форматированием, и нажатие ничего не изменит — дефект, который выглядит как
+ * зависшая клавиша.
+ *
+ * Вставка отдельного обработчика не требует: вставленное приходит тем же
+ * событием ввода, и разбор по маске раскладывает его так же, как набранное
+ * (`unmask` в `lib/mask.ts`).
+ */
+export declare const MaskedInput: import("react").ForwardRefExoticComponent<MaskedInputProps & import("react").RefAttributes<HTMLInputElement>>;
+//# sourceMappingURL=MaskedInput.d.ts.map

package/dist/components/inputs/MaskedInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MaskedInput.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/MaskedInput.tsx"],"names":[],"mappings":"AAEA,OAAO,EAML,KAAK,wBAAwB,EAE9B,MAAM,OAAO,CAAC;AAqBf,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAC5C,wBAAwB,CAAC,OAAO,CAAC,EACjC,UAAU,GAAG,OAAO,GAAG,cAAc,GAAG,MAAM,CAC/C;IACC;;;;;OAKG;IACH,IAAI,EAAE,MAAM,CAAC;IACb,yEAAyE;IACzE,KAAK,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,mCAAmC;IACnC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;;;;;;;;;;;;;;;;OAiBG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,WAAW,+GA6LtB,CAAC"}

package/dist/components/inputs/MaskedInput.js

@@ -0,0 +1,73 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useImperativeHandle, useLayoutEffect, useRef, useState, } from "react";
+import { useMessages } from "../../i18n/useMessages.js";
+import { caretAfter, formatMask, maskRemainder, maskTokenAt, rawLengthBefore, unmask, unmaskOverflow, } from "../../lib/mask.js";
+import { TextControl } from "./TextControl.js";
+const EXPECTED = {
+    "9": "digit",
+    a: "letter",
+    "*": "any",
+};
+export const MaskedInput = forwardRef(function MaskedInput({ mask, value, onChange, onKeyDown, showMask = true, ...rest }, ref) {
+    const innerRef = useRef(null);
+    useImperativeHandle(ref, () => innerRef.current, []);
+    const caret = useRef(null);
+    const messages = useMessages();
+    const [rejection, setRejection] = useState("");
+    const formatted = formatMask(value, mask);
+    const underlay = showMask ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "invisible", children: formatted }), _jsx("span", { className: "text-fg-2 forced-colors:text-[color:GrayText]", children: maskRemainder(value, mask) })] })) : undefined;
+    useLayoutEffect(() => {
+        const el = innerRef.current;
+        const at = caret.current;
+        caret.current = null;
+        if (el && at != null)
+            el.setSelectionRange(at, at);
+    });
+    const commit = (raw, rawCaret) => {
+        caret.current = caretAfter(mask, rawCaret);
+        onChange(raw, formatMask(raw, mask));
+    };
+    const control = (_jsx(TextControl, { ref: innerRef, underlay: underlay, value: formatted, onChange: (event) => {
+            const shown = event.target.value;
+            const position = event.target.selectionStart ?? shown.length;
+            const raw = unmask(shown, mask);
+            const added = shown.length - formatted.length;
+            const native = event.nativeEvent;
+            const inputType = native instanceof InputEvent ? native.inputType : undefined;
+            const bulk = inputType === "insertFromPaste" ||
+                inputType === "insertFromPasteAsQuotation" ||
+                inputType === "insertFromDrop" ||
+                inputType === "insertReplacementText" ||
+                (!inputType && added > 1);
+            const overflow = bulk ? unmaskOverflow(shown, mask) : 0;
+            if (overflow > 0) {
+                setRejection(messages.maskedInput.truncated({ count: overflow }));
+            }
+            else if (added > 0 && raw === value) {
+                const at = rawLengthBefore(mask, Math.max(position - added, 0));
+                const token = maskTokenAt(mask, at);
+                setRejection(token == null
+                    ? messages.maskedInput.full
+                    : messages.maskedInput.rejected({ expected: EXPECTED[token] }));
+            }
+            else if (rejection)
+                setRejection("");
+            commit(raw, unmask(shown.slice(0, position), mask).length);
+        }, onKeyDown: (event) => {
+            onKeyDown?.(event);
+            if (event.defaultPrevented || event.key !== "Backspace")
+                return;
+            const el = event.currentTarget;
+            const start = el.selectionStart ?? 0;
+            if (start !== el.selectionEnd)
+                return;
+            const before = rawLengthBefore(mask, start);
+            if (before === 0)
+                return;
+            event.preventDefault();
+            commit(value.slice(0, before - 1) + value.slice(before), before - 1);
+        }, ...rest }));
+    return (_jsxs(_Fragment, { children: [control, _jsx("span", { role: "status", "aria-live": "polite", className: "sr-only", children: rejection })] }));
+});
+//# sourceMappingURL=MaskedInput.js.map

package/dist/components/inputs/MaskedInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MaskedInput.js","sourceRoot":"","sources":["../../../src/components/inputs/MaskedInput.tsx"],"names":[],"mappings":"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"}

package/dist/components/inputs/NumberInput.d.ts

@@ -0,0 +1,53 @@
+export interface NumberInputProps {
+    /** `null` — поле пусто. Это не то же самое, что введённый ноль. */
+    value: number | null;
+    /** Вызывается при смене числа; `null` — поле очищено. */
+    onChange: (value: number | null) => void;
+    /** Наименьшее допустимое значение. */
+    min?: number;
+    /** Наибольшее допустимое значение. */
+    max?: number;
+    /** Шаг изменения кнопками и стрелками клавиатуры. */
+    step?: number;
+    /** Формат отображения: проценты, валюта, единицы. Идёт в `Intl.NumberFormat`. */
+    formatOptions?: Intl.NumberFormatOptions;
+    /** Плейсхолдер в пустом поле. */
+    placeholder?: string;
+    /** Выключает поле и кнопки шага. */
+    disabled?: boolean;
+    /** Показывает поле в состоянии ошибки. */
+    invalid?: boolean;
+    /**
+     * Доступное имя. Обязательно и проверяется компилятором — как у `Toggle`.
+     *
+     * Подпись из `FormField` сюда не дотягивается: react-aria генерирует `id`
+     * внутреннему полю сам, и связать с ним чужой `<label htmlFor>` нечем.
+     * Поэтому имя компонент держит у себя.
+     */
+    label: string;
+    /** Классы на оболочку с рамкой — ширина, скругление, внутренние отступы. */
+    shellClassName?: string;
+    /** Классы на корневой элемент. */
+    className?: string;
+}
+/**
+ * Числовое поле со ступенями.
+ *
+ * ПУСТОЕ ПОЛЕ ОТДАЁТ `null`, А НЕ НОЛЬ. Ноль — это введённое значение, и
+ * отличать его от «ничего не введено» обязано само значение, а не догадка
+ * потребителя. Та же логика, по которой `Select` отдаёт `null` при очистке.
+ * Внутри react-aria пустоту выражает `NaN`; наружу он не выходит — `NaN`
+ * не равен сам себе, и потребитель, сравнивший его с чем угодно, получил бы
+ * тихо неверный результат.
+ *
+ * Вид рамки, фокуса и выключенного состояния — общий с `TextControl`, из
+ * `lib/field.ts`. Не копия: два поля, стоящие в одной форме рядом, обязаны
+ * фокусироваться одинаково, а копипаст классов расходится — во фронте до
+ * пакета так и вышло с пятью полями поиска.
+ *
+ * Разбор и форматирование по `formatOptions` держит react-aria: локаль, разряды,
+ * знак процента, ввод «1 234,5» — всё это его работа, и повторять её здесь
+ * означало бы писать вторую библиотеку.
+ */
+export declare const NumberInput: import("react").ForwardRefExoticComponent<NumberInputProps & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=NumberInput.d.ts.map

package/dist/components/inputs/NumberInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/NumberInput.tsx"],"names":[],"mappings":"AASA,MAAM,WAAW,gBAAgB;IAC/B,mEAAmE;IACnE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,yDAAyD;IACzD,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACzC,sCAAsC;IACtC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,sCAAsC;IACtC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,qDAAqD;IACrD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iFAAiF;IACjF,aAAa,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC;IACzC,iCAAiC;IACjC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,0CAA0C;IAC1C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;;;OAMG;IACH,KAAK,EAAE,MAAM,CAAC;IACd,4EAA4E;IAC5E,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kCAAkC;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAMD;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,WAAW,6GAwEtB,CAAC"}

package/dist/components/inputs/NumberInput.js

@@ -0,0 +1,17 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { Button, Group, Input, NumberField } from "react-aria-components";
+import { useFieldDescribedBy, useFieldInvalid } from "../../hooks/useFieldDescription.js";
+import { cn } from "../../lib/cn.js";
+import { useMessages } from "../../i18n/useMessages.js";
+import { FIELD_INPUT_CLASS, FIELD_SHELL_CLASS } from "../../lib/field.js";
+const STEP_BUTTON_CLASS = "text-fg-2 hover:text-fg-0 hover:bg-bg-3 flex size-6 shrink-0 items-center justify-center " +
+    "rounded-xs text-[15px] leading-none transition-colors disabled:pointer-events-none disabled:opacity-40";
+export const NumberInput = forwardRef(function NumberInput({ value, onChange, min, max, step, formatOptions, placeholder, disabled, invalid, label, shellClassName, className, }, ref) {
+    const messages = useMessages();
+    const describedBy = useFieldDescribedBy();
+    const fieldInvalid = useFieldInvalid();
+    return (_jsx(NumberField, { ref: ref, value: value ?? Number.NaN, onChange: (next) => onChange(Number.isNaN(next) ? null : next), minValue: min, maxValue: max, step: step, formatOptions: formatOptions, isDisabled: disabled, isInvalid: invalid ?? (fieldInvalid || undefined), "aria-label": label, "aria-describedby": describedBy, className: className, children: _jsxs(Group, { className: cn(FIELD_SHELL_CLASS, "flex items-center gap-1", shellClassName), children: [_jsx(Button, { slot: "decrement", className: STEP_BUTTON_CLASS, "aria-label": messages.numberInput.decrement({ label: label ?? "" }), children: "\u2212" }), _jsx(Input, { "data-disable-focus-ring": "true", placeholder: placeholder, className: cn(FIELD_INPUT_CLASS, "min-w-0 flex-1 text-center tabular-nums") }), _jsx(Button, { slot: "increment", className: STEP_BUTTON_CLASS, "aria-label": messages.numberInput.increment({ label: label ?? "" }), children: "+" })] }) }));
+});
+//# sourceMappingURL=NumberInput.js.map

package/dist/components/inputs/NumberInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../../src/components/inputs/NumberInput.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAC1E,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,oCAAoC,CAAC;AAC1F,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAmC1E,MAAM,iBAAiB,GACrB,2FAA2F;IAC3F,wGAAwG,CAAC;AAqB3G,MAAM,CAAC,MAAM,WAAW,GAAG,UAAU,CAAmC,SAAS,WAAW,CAC1F,EACE,KAAK,EACL,QAAQ,EACR,GAAG,EACH,GAAG,EACH,IAAI,EACJ,aAAa,EACb,WAAW,EACX,QAAQ,EACR,OAAO,EACP,KAAK,EACL,cAAc,EACd,SAAS,GACV,EACD,GAAG;IAEH,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAG/B,MAAM,WAAW,GAAG,mBAAmB,EAAE,CAAC;IAG1C,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,OAAO,CACL,KAAC,WAAW,IACV,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,IAAI,MAAM,CAAC,GAAG,EAC1B,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,EAC9D,QAAQ,EAAE,GAAG,EACb,QAAQ,EAAE,GAAG,EACb,IAAI,EAAE,IAAI,EACV,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,QAAQ,EACpB,SAAS,EAAE,OAAO,IAAI,CAAC,YAAY,IAAI,SAAS,CAAC,gBACrC,KAAK,sBACC,WAAW,EAC7B,SAAS,EAAE,SAAS,YAEpB,MAAC,KAAK,IACJ,SAAS,EAAE,EAAE,CACX,iBAAiB,EACjB,yBAAyB,EAKzB,cAAc,CACf,aAED,KAAC,MAAM,IACL,IAAI,EAAC,WAAW,EAChB,SAAS,EAAE,iBAAiB,gBAChB,QAAQ,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,IAAI,EAAE,EAAE,CAAC,uBAG3D,EACT,KAAC,KAAK,+BACoB,MAAM,EAC9B,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,EAAE,CAAC,iBAAiB,EAAE,yCAAyC,CAAC,GAC3E,EACF,KAAC,MAAM,IACL,IAAI,EAAC,WAAW,EAChB,SAAS,EAAE,iBAAiB,gBAChB,QAAQ,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,IAAI,EAAE,EAAE,CAAC,kBAG3D,IACH,GACI,CACf,CAAC;AACJ,CAAC,CAAC,CAAC"}