@vantageos/mosaic 0.2.1 → 0.3.0-alpha.1
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.
- package/README.md +181 -0
- package/dist/Alert.schema-BQsZGG6P.d.cts +41 -0
- package/dist/Alert.schema-BQsZGG6P.d.ts +41 -0
- package/dist/ConfirmDialog-B3CQQGmJ.d.cts +34 -0
- package/dist/ConfirmDialog-B3CQQGmJ.d.ts +34 -0
- package/dist/Skeleton.schema-BO0ca2UX.d.cts +135 -0
- package/dist/Skeleton.schema-BO0ca2UX.d.ts +135 -0
- package/dist/Tabs.schema-BzcEyeq8.d.cts +79 -0
- package/dist/Tabs.schema-BzcEyeq8.d.ts +79 -0
- package/dist/artifacts.cjs +20 -2
- package/dist/artifacts.cjs.map +1 -1
- package/dist/artifacts.js +20 -2
- package/dist/artifacts.js.map +1 -1
- package/dist/confirmation.cjs +44 -2
- package/dist/confirmation.cjs.map +1 -1
- package/dist/confirmation.d.cts +34 -1
- package/dist/confirmation.d.ts +34 -1
- package/dist/confirmation.js +41 -3
- package/dist/confirmation.js.map +1 -1
- package/dist/display.cjs +145 -2
- package/dist/display.cjs.map +1 -1
- package/dist/display.d.cts +1 -0
- package/dist/display.d.ts +1 -0
- package/dist/display.js +140 -3
- package/dist/display.js.map +1 -1
- package/dist/forms.cjs +1412 -0
- package/dist/forms.cjs.map +1 -0
- package/dist/forms.d.cts +159 -0
- package/dist/forms.d.ts +159 -0
- package/dist/forms.js +1331 -0
- package/dist/forms.js.map +1 -0
- package/dist/index-CwXVgtGb.d.cts +917 -0
- package/dist/index-CwXVgtGb.d.ts +917 -0
- package/dist/index.cjs +188 -2
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +5 -2
- package/dist/index.d.ts +5 -2
- package/dist/index.js +177 -3
- package/dist/index.js.map +1 -1
- package/dist/input.cjs +19 -0
- package/dist/input.cjs.map +1 -1
- package/dist/input.d.cts +4 -34
- package/dist/input.d.ts +4 -34
- package/dist/input.js +18 -1
- package/dist/input.js.map +1 -1
- package/dist/media.cjs +20 -2
- package/dist/media.cjs.map +1 -1
- package/dist/media.js +20 -2
- package/dist/media.js.map +1 -1
- package/dist/preact/artifacts.d.ts +2 -0
- package/dist/preact/confirmation.d.ts +86 -0
- package/dist/preact/confirmation.js +263 -0
- package/dist/preact/confirmation.js.map +1 -1
- package/dist/preact/display.d.ts +241 -0
- package/dist/preact/display.js +366 -0
- package/dist/preact/display.js.map +1 -1
- package/dist/preact/forms.d.ts +875 -0
- package/dist/preact/forms.js +1323 -0
- package/dist/preact/forms.js.map +1 -0
- package/dist/preact/index.d.ts +2 -0
- package/dist/preact/input.d.ts +89 -0
- package/dist/preact/input.js +194 -0
- package/dist/preact/input.js.map +1 -1
- package/dist/preact/media.d.ts +2 -0
- package/dist/preact/progress.d.ts +2 -0
- package/dist/progress.cjs +20 -2
- package/dist/progress.cjs.map +1 -1
- package/dist/progress.js +20 -2
- package/dist/progress.js.map +1 -1
- package/dist/react/confirmation.cjs +267 -0
- package/dist/react/confirmation.cjs.map +1 -1
- package/dist/react/confirmation.d.cts +21 -1
- package/dist/react/confirmation.d.ts +21 -1
- package/dist/react/confirmation.js +263 -0
- package/dist/react/confirmation.js.map +1 -1
- package/dist/react/display.cjs +372 -0
- package/dist/react/display.cjs.map +1 -1
- package/dist/react/display.d.cts +112 -1
- package/dist/react/display.d.ts +112 -1
- package/dist/react/display.js +362 -0
- package/dist/react/display.js.map +1 -1
- package/dist/react/forms.cjs +1384 -0
- package/dist/react/forms.cjs.map +1 -0
- package/dist/react/forms.d.cts +5 -0
- package/dist/react/forms.d.ts +5 -0
- package/dist/react/forms.js +1323 -0
- package/dist/react/forms.js.map +1 -0
- package/dist/react/input.cjs +197 -0
- package/dist/react/input.cjs.map +1 -1
- package/dist/react/input.d.cts +13 -1
- package/dist/react/input.d.ts +13 -1
- package/dist/react/input.js +194 -0
- package/dist/react/input.js.map +1 -1
- package/dist/tokens.d.cts +35 -0
- package/dist/tokens.d.ts +35 -0
- package/package.json +74 -49
- package/registry.yaml +154 -1
|
@@ -0,0 +1,875 @@
|
|
|
1
|
+
import * as react_hook_form from 'react-hook-form';
|
|
2
|
+
import { FieldValues, UseFormReturn, Path, ControllerRenderProps, ControllerFieldState, UseFormStateReturn, ArrayPath, FieldArrayWithId, FieldArray as FieldArray$1 } from 'react-hook-form';
|
|
3
|
+
import { z, ZodSchema, ZodType } from 'zod';
|
|
4
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
5
|
+
import { ReactNode, ReactElement } from 'react';
|
|
6
|
+
|
|
7
|
+
/**
|
|
8
|
+
* Validation timing modes. Mosaic default is "onBlur" — Chi co-validated decision
|
|
9
|
+
* (Day 102 DM). RHF's full Mode union supports more values; we narrow to the three
|
|
10
|
+
* timings that are safe and predictable for cross-runtime consumers.
|
|
11
|
+
*/
|
|
12
|
+
declare const MosaicFormModeSchema: z.ZodEnum<["onBlur", "onChange", "onSubmit"]>;
|
|
13
|
+
type MosaicFormMode = z.infer<typeof MosaicFormModeSchema>;
|
|
14
|
+
/**
|
|
15
|
+
* Options accepted by `useMosaicForm`. The Zod schema for the form payload is
|
|
16
|
+
* passed separately (not parsed inside this schema) because it carries runtime
|
|
17
|
+
* type information that the consumer's TSchema generic propagates through.
|
|
18
|
+
*/
|
|
19
|
+
declare const UseMosaicFormOptionsSchema: z.ZodObject<{
|
|
20
|
+
mode: z.ZodDefault<z.ZodEnum<["onBlur", "onChange", "onSubmit"]>>;
|
|
21
|
+
}, "strip", z.ZodTypeAny, {
|
|
22
|
+
mode: "onBlur" | "onChange" | "onSubmit";
|
|
23
|
+
}, {
|
|
24
|
+
mode?: "onBlur" | "onChange" | "onSubmit" | undefined;
|
|
25
|
+
}>;
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* Public options to {@link useMosaicForm}. The Zod `schema` is the runtime
|
|
29
|
+
* validator (and the source of truth for the form payload type). `mode`
|
|
30
|
+
* defaults to `"onBlur"` per Chi co-validated decision (Day 102).
|
|
31
|
+
*/
|
|
32
|
+
interface UseMosaicFormOptions<TSchema extends ZodType> {
|
|
33
|
+
schema: TSchema;
|
|
34
|
+
defaultValues: Partial<ReturnType<TSchema["parse"]>> | ReturnType<TSchema["parse"]>;
|
|
35
|
+
mode?: MosaicFormMode;
|
|
36
|
+
}
|
|
37
|
+
/**
|
|
38
|
+
* Return type — the standard RHF `UseFormReturn` extended with two Mosaic
|
|
39
|
+
* metadata fields so consumers (FormField, SubmitButton, FormProvider) can
|
|
40
|
+
* inspect the active schema + timing without re-deriving them.
|
|
41
|
+
*/
|
|
42
|
+
type UseMosaicFormReturn<TFieldValues extends FieldValues = FieldValues> = UseFormReturn<TFieldValues> & {
|
|
43
|
+
mosaicSchema: ZodSchema;
|
|
44
|
+
mosaicMode: MosaicFormMode;
|
|
45
|
+
};
|
|
46
|
+
/**
|
|
47
|
+
* Cross-runtime wrapper around `react-hook-form` + `@hookform/resolvers/zod`.
|
|
48
|
+
*
|
|
49
|
+
* - Validates options through Zod (`UseMosaicFormOptionsSchema`) so an invalid
|
|
50
|
+
* `mode` fails loudly at hook-call time rather than silently degrading.
|
|
51
|
+
* - Attaches the schema + mode to the return object as `mosaicSchema` and
|
|
52
|
+
* `mosaicMode` for downstream Mosaic consumers (FieldArray will read these).
|
|
53
|
+
*
|
|
54
|
+
* Compatible with FieldArray (T16) — the return shape extends RHF's, so
|
|
55
|
+
* `useFieldArray({ control: form.control, name: ... })` works verbatim.
|
|
56
|
+
*/
|
|
57
|
+
declare function useMosaicForm<TSchema extends ZodType>(options: UseMosaicFormOptions<TSchema>): UseMosaicFormReturn<ReturnType<TSchema["parse"]> & FieldValues>;
|
|
58
|
+
|
|
59
|
+
interface FormProviderProps<TValues extends FieldValues = FieldValues> {
|
|
60
|
+
form: UseMosaicFormReturn<TValues>;
|
|
61
|
+
children: ReactNode;
|
|
62
|
+
}
|
|
63
|
+
/**
|
|
64
|
+
* Wraps `react-hook-form`'s native `<FormProvider>` AND a Mosaic-specific
|
|
65
|
+
* context that carries the extended metadata (`mosaicSchema`, `mosaicMode`).
|
|
66
|
+
* Consumer components read either context — Mosaic's own for metadata,
|
|
67
|
+
* RHF's for register/control/handleSubmit access.
|
|
68
|
+
*/
|
|
69
|
+
declare function FormProvider<TValues extends FieldValues = FieldValues>({ form, children, }: FormProviderProps<TValues>): react_jsx_runtime.JSX.Element;
|
|
70
|
+
/**
|
|
71
|
+
* Read the Mosaic-extended form context. Throws if called outside a
|
|
72
|
+
* `<FormProvider>` so consumer bugs surface immediately.
|
|
73
|
+
*
|
|
74
|
+
* Generic `TValues` lets callers narrow back to their original form shape.
|
|
75
|
+
*/
|
|
76
|
+
declare function useMosaicFormContext<TValues extends FieldValues = FieldValues>(): UseMosaicFormReturn<TValues>;
|
|
77
|
+
|
|
78
|
+
interface FormFieldRenderArgs<TValues extends FieldValues = FieldValues> {
|
|
79
|
+
field: ControllerRenderProps<TValues>;
|
|
80
|
+
fieldState: ControllerFieldState;
|
|
81
|
+
formState: UseFormStateReturn<TValues>;
|
|
82
|
+
}
|
|
83
|
+
interface FormFieldProps<TValues extends FieldValues = FieldValues> {
|
|
84
|
+
name: Path<TValues>;
|
|
85
|
+
children: (args: FormFieldRenderArgs<TValues>) => ReactElement;
|
|
86
|
+
}
|
|
87
|
+
/**
|
|
88
|
+
* Render-prop wrapper around RHF's `Controller`. Pulls `control` from the
|
|
89
|
+
* surrounding `<FormProvider>` so consumers never thread it manually.
|
|
90
|
+
*/
|
|
91
|
+
declare function FormField<TValues extends FieldValues = FieldValues>({ name, children, }: FormFieldProps<TValues>): react_jsx_runtime.JSX.Element;
|
|
92
|
+
|
|
93
|
+
/**
|
|
94
|
+
* ErrorDisplay accepts an RHF-shaped field error plus an optional consumer
|
|
95
|
+
* message map for i18n. The structure mirrors RHF `FieldError`:
|
|
96
|
+
* `{ type: string, message?: string }`.
|
|
97
|
+
*/
|
|
98
|
+
declare const FieldErrorShapeSchema: z.ZodObject<{
|
|
99
|
+
type: z.ZodString;
|
|
100
|
+
message: z.ZodOptional<z.ZodString>;
|
|
101
|
+
}, "strip", z.ZodTypeAny, {
|
|
102
|
+
type: string;
|
|
103
|
+
message?: string | undefined;
|
|
104
|
+
}, {
|
|
105
|
+
type: string;
|
|
106
|
+
message?: string | undefined;
|
|
107
|
+
}>;
|
|
108
|
+
declare const ErrorDisplayPropsSchema: z.ZodObject<{
|
|
109
|
+
error: z.ZodOptional<z.ZodObject<{
|
|
110
|
+
type: z.ZodString;
|
|
111
|
+
message: z.ZodOptional<z.ZodString>;
|
|
112
|
+
}, "strip", z.ZodTypeAny, {
|
|
113
|
+
type: string;
|
|
114
|
+
message?: string | undefined;
|
|
115
|
+
}, {
|
|
116
|
+
type: string;
|
|
117
|
+
message?: string | undefined;
|
|
118
|
+
}>>;
|
|
119
|
+
messageMap: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodString>>;
|
|
120
|
+
}, "strip", z.ZodTypeAny, {
|
|
121
|
+
error?: {
|
|
122
|
+
type: string;
|
|
123
|
+
message?: string | undefined;
|
|
124
|
+
} | undefined;
|
|
125
|
+
messageMap?: Record<string, string> | undefined;
|
|
126
|
+
}, {
|
|
127
|
+
error?: {
|
|
128
|
+
type: string;
|
|
129
|
+
message?: string | undefined;
|
|
130
|
+
} | undefined;
|
|
131
|
+
messageMap?: Record<string, string> | undefined;
|
|
132
|
+
}>;
|
|
133
|
+
type FieldErrorShape = z.infer<typeof FieldErrorShapeSchema>;
|
|
134
|
+
|
|
135
|
+
interface ErrorDisplayProps {
|
|
136
|
+
error?: FieldErrorShape;
|
|
137
|
+
messageMap?: Record<string, string>;
|
|
138
|
+
className?: string;
|
|
139
|
+
}
|
|
140
|
+
/**
|
|
141
|
+
* Single-field error formatter. Renders nothing when `error` is undefined
|
|
142
|
+
* (no error to show), otherwise emits a `role="alert"` element with the
|
|
143
|
+
* resolved message. Message resolution is delegated to the pure
|
|
144
|
+
* `formatErrorMessage` helper so React and Preact runtimes share behavior.
|
|
145
|
+
*/
|
|
146
|
+
declare function ErrorDisplay({ error, messageMap, className }: ErrorDisplayProps): react_jsx_runtime.JSX.Element | null;
|
|
147
|
+
|
|
148
|
+
interface SubmitButtonProps {
|
|
149
|
+
label?: string;
|
|
150
|
+
loadingLabel?: string;
|
|
151
|
+
className?: string;
|
|
152
|
+
}
|
|
153
|
+
/**
|
|
154
|
+
* Form submit button bound to the surrounding `<FormProvider>` form state.
|
|
155
|
+
* Disabled while `formState.isValid` is false OR `formState.isSubmitting`
|
|
156
|
+
* is true. While submitting, the loading label replaces the default label.
|
|
157
|
+
*/
|
|
158
|
+
declare function SubmitButton(props: SubmitButtonProps): react_jsx_runtime.JSX.Element;
|
|
159
|
+
|
|
160
|
+
/**
|
|
161
|
+
* Input primitive props — bound to the surrounding `FormProvider` by `name`.
|
|
162
|
+
*
|
|
163
|
+
* - `name` selects a property on the form values (RHF path).
|
|
164
|
+
* - `type` covers the 5 baseline text-like HTML input types (T11 scope).
|
|
165
|
+
* - `placeholder` / `disabled` / `autoComplete` are passthrough DOM props.
|
|
166
|
+
* - `label` is consumer-driven i18n: the caller supplies the localized string,
|
|
167
|
+
* the component never renders raw alphabetic text as JSXText children.
|
|
168
|
+
*
|
|
169
|
+
* Field primitives outside this 5-type baseline (checkbox/radio/file/etc.)
|
|
170
|
+
* land in dedicated T12-T20 components per `docs/v0.3.0-plan.md` §7.
|
|
171
|
+
*/
|
|
172
|
+
declare const InputTypeSchema: z.ZodEnum<["text", "email", "password", "number", "url"]>;
|
|
173
|
+
declare const InputPropsSchema: z.ZodObject<{
|
|
174
|
+
name: z.ZodString;
|
|
175
|
+
type: z.ZodOptional<z.ZodDefault<z.ZodEnum<["text", "email", "password", "number", "url"]>>>;
|
|
176
|
+
placeholder: z.ZodOptional<z.ZodString>;
|
|
177
|
+
disabled: z.ZodOptional<z.ZodBoolean>;
|
|
178
|
+
autoComplete: z.ZodOptional<z.ZodString>;
|
|
179
|
+
label: z.ZodString;
|
|
180
|
+
}, "strip", z.ZodTypeAny, {
|
|
181
|
+
name: string;
|
|
182
|
+
label: string;
|
|
183
|
+
type?: "number" | "text" | "email" | "url" | "password" | undefined;
|
|
184
|
+
disabled?: boolean | undefined;
|
|
185
|
+
placeholder?: string | undefined;
|
|
186
|
+
autoComplete?: string | undefined;
|
|
187
|
+
}, {
|
|
188
|
+
name: string;
|
|
189
|
+
label: string;
|
|
190
|
+
type?: "number" | "text" | "email" | "url" | "password" | undefined;
|
|
191
|
+
disabled?: boolean | undefined;
|
|
192
|
+
placeholder?: string | undefined;
|
|
193
|
+
autoComplete?: string | undefined;
|
|
194
|
+
}>;
|
|
195
|
+
type InputType = z.infer<typeof InputTypeSchema>;
|
|
196
|
+
|
|
197
|
+
interface InputProps<TValues extends FieldValues = FieldValues> {
|
|
198
|
+
name: Path<TValues>;
|
|
199
|
+
/** HTML input type. Defaults to `"text"`. */
|
|
200
|
+
type?: InputType;
|
|
201
|
+
/** Consumer-driven i18n label. Wired via `<label htmlFor>` to the input. */
|
|
202
|
+
label: string;
|
|
203
|
+
placeholder?: string;
|
|
204
|
+
disabled?: boolean;
|
|
205
|
+
autoComplete?: string;
|
|
206
|
+
/** Optional consumer override for the wrapping element id. */
|
|
207
|
+
id?: string;
|
|
208
|
+
/** Optional error code → message map for i18n. */
|
|
209
|
+
messageMap?: Record<string, string>;
|
|
210
|
+
className?: string;
|
|
211
|
+
inputClassName?: string;
|
|
212
|
+
errorClassName?: string;
|
|
213
|
+
}
|
|
214
|
+
/**
|
|
215
|
+
* Cross-runtime Input primitive (forms category, T11). Binds an `<input>` to
|
|
216
|
+
* the surrounding `<FormProvider>` via `react-hook-form`'s `Controller`.
|
|
217
|
+
*
|
|
218
|
+
* Preact runtime — `react` / `react-dom` are aliased to `preact/compat` at
|
|
219
|
+
* tsup build time per Standard §18.2. JSX is identical to the React runtime;
|
|
220
|
+
* runtime-agnostic logic lives in `src/components/forms/Input.logic.ts`.
|
|
221
|
+
*/
|
|
222
|
+
declare function Input<TValues extends FieldValues = FieldValues>({ name, type, label, placeholder, disabled, autoComplete, id, messageMap, className, inputClassName, errorClassName, }: InputProps<TValues>): react_jsx_runtime.JSX.Element;
|
|
223
|
+
|
|
224
|
+
/**
|
|
225
|
+
* Pure helpers for Textarea, shared by React + Preact runtimes.
|
|
226
|
+
*
|
|
227
|
+
* No DOM, no framework imports. Keeps the runtime surface a thin shell so
|
|
228
|
+
* Standard §18 cross-runtime parity holds by reference.
|
|
229
|
+
*/
|
|
230
|
+
declare const DEFAULT_TEXTAREA_ROWS = 3;
|
|
231
|
+
/**
|
|
232
|
+
* Clamp an input value to `maxLength` characters. When `maxLength` is undefined
|
|
233
|
+
* (no cap), returns the value unchanged. When the input already fits, returns
|
|
234
|
+
* the value unchanged (identity — avoids needless state churn in RHF).
|
|
235
|
+
*/
|
|
236
|
+
declare function clampToMaxLength(value: string, maxLength: number | undefined): string;
|
|
237
|
+
/**
|
|
238
|
+
* Resolve the effective `rows` attribute for the rendered <textarea>.
|
|
239
|
+
* Returns `DEFAULT_TEXTAREA_ROWS` when undefined or invalid (≤ 0).
|
|
240
|
+
*/
|
|
241
|
+
declare function resolveRows(rows: number | undefined): number;
|
|
242
|
+
/**
|
|
243
|
+
* Compute the next height (in pixels) for an autoResize textarea given the
|
|
244
|
+
* `scrollHeight` reported by the DOM. Returned as a number; runtime applies it
|
|
245
|
+
* via `style.height = `${n}px``. Keeps the math testable without a DOM.
|
|
246
|
+
*
|
|
247
|
+
* Min height honored when scrollHeight is implausible (≤ 0 in jsdom).
|
|
248
|
+
*/
|
|
249
|
+
declare function computeAutoResizeHeight(scrollHeight: number, minHeightPx: number): number;
|
|
250
|
+
|
|
251
|
+
/**
|
|
252
|
+
* Preact runtime mirror of `Textarea`. Identical JSX shape — tsup preactPass
|
|
253
|
+
* aliases `react`, `react-dom`, and JSX runtimes to `preact/compat` at build
|
|
254
|
+
* time per `mosaic-architecture-standard` §18.2.
|
|
255
|
+
*
|
|
256
|
+
* Shared with the React runtime via `Textarea.logic.ts` pure helpers
|
|
257
|
+
* (`resolveRows`, `clampToMaxLength`, `computeAutoResizeHeight`). The logic
|
|
258
|
+
* file is the parity contract; this file's JSX must remain byte-equivalent in
|
|
259
|
+
* structure to its React sibling for cross-runtime tests to pass.
|
|
260
|
+
*/
|
|
261
|
+
interface TextareaProps<TValues extends FieldValues = FieldValues> {
|
|
262
|
+
name: Path<TValues>;
|
|
263
|
+
rows?: number;
|
|
264
|
+
maxLength?: number;
|
|
265
|
+
autoResize?: boolean;
|
|
266
|
+
placeholder?: string;
|
|
267
|
+
disabled?: boolean;
|
|
268
|
+
label?: string;
|
|
269
|
+
className?: string;
|
|
270
|
+
errorMessageMap?: Record<string, string>;
|
|
271
|
+
}
|
|
272
|
+
declare function Textarea<TValues extends FieldValues = FieldValues>(props: TextareaProps<TValues>): react_jsx_runtime.JSX.Element;
|
|
273
|
+
|
|
274
|
+
/**
|
|
275
|
+
* Pure helpers for FieldArray. Runtime-agnostic — covers ARIA id generation
|
|
276
|
+
* and aria-label conventions used by the React + Preact runtimes.
|
|
277
|
+
*
|
|
278
|
+
* `useFieldArray` itself is a thin wrapper around RHF's hook (live in the
|
|
279
|
+
* runtime layer) — these helpers are the cross-runtime contract that the
|
|
280
|
+
* wrapper and Storybook stories share.
|
|
281
|
+
*/
|
|
282
|
+
/** Default aria-label for the wrapping list element. */
|
|
283
|
+
declare function buildListAriaLabel(name: string): string;
|
|
284
|
+
/** Default aria-label for the per-item Remove button. */
|
|
285
|
+
declare function buildRemoveAriaLabel(name: string, index: number): string;
|
|
286
|
+
/** Default aria-label for the Add button (consumer-rendered). */
|
|
287
|
+
declare function buildAddAriaLabel(name: string): string;
|
|
288
|
+
/**
|
|
289
|
+
* After removing item at `removedIndex` from an array of `previousLength`
|
|
290
|
+
* items, return the index that should receive focus. Clamps to the last
|
|
291
|
+
* remaining index, or `-1` if the list became empty.
|
|
292
|
+
*/
|
|
293
|
+
declare function nextFocusIndexAfterRemove(previousLength: number, removedIndex: number): number;
|
|
294
|
+
|
|
295
|
+
interface UseFieldArrayOptions<TValues extends FieldValues = FieldValues, TName extends ArrayPath<TValues> = ArrayPath<TValues>> {
|
|
296
|
+
name: TName;
|
|
297
|
+
control?: any;
|
|
298
|
+
}
|
|
299
|
+
declare function useFieldArray<TValues extends FieldValues = FieldValues, TName extends ArrayPath<TValues> = ArrayPath<TValues>>({ name, control }: UseFieldArrayOptions<TValues, TName>): react_hook_form.UseFieldArrayReturn<TValues, TName, "id">;
|
|
300
|
+
interface FieldArrayRenderItemArgs<TValues extends FieldValues = FieldValues, TName extends ArrayPath<TValues> = ArrayPath<TValues>> {
|
|
301
|
+
field: FieldArrayWithId<TValues, TName, "id">;
|
|
302
|
+
index: number;
|
|
303
|
+
}
|
|
304
|
+
interface FieldArrayControls<TValues extends FieldValues = FieldValues, TName extends ArrayPath<TValues> = ArrayPath<TValues>> {
|
|
305
|
+
fields: ReadonlyArray<FieldArrayWithId<TValues, TName, "id">>;
|
|
306
|
+
append: (value: FieldArray$1<TValues, TName> | FieldArray$1<TValues, TName>[]) => void;
|
|
307
|
+
remove: (index?: number | number[]) => void;
|
|
308
|
+
move: (from: number, to: number) => void;
|
|
309
|
+
swap: (a: number, b: number) => void;
|
|
310
|
+
}
|
|
311
|
+
interface FieldArrayProps<TValues extends FieldValues = FieldValues, TName extends ArrayPath<TValues> = ArrayPath<TValues>> {
|
|
312
|
+
name: TName;
|
|
313
|
+
children: (args: FieldArrayRenderItemArgs<TValues, TName>, controls: FieldArrayControls<TValues, TName>) => ReactElement;
|
|
314
|
+
ariaLabel?: string;
|
|
315
|
+
}
|
|
316
|
+
/**
|
|
317
|
+
* Preact-runtime FieldArray. Identical JSX shape to the React variant —
|
|
318
|
+
* see `runtimes/react/components/forms/FieldArray.tsx` for full docs.
|
|
319
|
+
*/
|
|
320
|
+
declare function FieldArray<TValues extends FieldValues = FieldValues, TName extends ArrayPath<TValues> = ArrayPath<TValues>>({ name, children, ariaLabel }: FieldArrayProps<TValues, TName>): react_jsx_runtime.JSX.Element;
|
|
321
|
+
|
|
322
|
+
/**
|
|
323
|
+
* Preact runtime mirror of `Checkbox`. Identical JSX shape — tsup preactPass
|
|
324
|
+
* aliases `react`, `react-dom`, and JSX runtimes to `preact/compat` at build
|
|
325
|
+
* time per `mosaic-architecture-standard` §18.2.
|
|
326
|
+
*
|
|
327
|
+
* Shared with the React runtime via `Checkbox.logic.ts` pure helpers
|
|
328
|
+
* (`resolveAriaChecked`, `resolveDescribedBy`). The logic file is the parity
|
|
329
|
+
* contract; this file's JSX must remain byte-equivalent in structure to its
|
|
330
|
+
* React sibling for cross-runtime tests to pass.
|
|
331
|
+
*/
|
|
332
|
+
interface CheckboxProps<TValues extends FieldValues = FieldValues> {
|
|
333
|
+
name: Path<TValues>;
|
|
334
|
+
label: string;
|
|
335
|
+
disabled?: boolean;
|
|
336
|
+
indeterminate?: boolean;
|
|
337
|
+
description?: string;
|
|
338
|
+
className?: string;
|
|
339
|
+
errorMessageMap?: Record<string, string>;
|
|
340
|
+
}
|
|
341
|
+
declare function Checkbox<TValues extends FieldValues = FieldValues>(props: CheckboxProps<TValues>): react_jsx_runtime.JSX.Element;
|
|
342
|
+
|
|
343
|
+
/**
|
|
344
|
+
* MultiSelect props — multi-value dropdown with removable chip rendering for
|
|
345
|
+
* the currently selected items. The schema validates static, serializable
|
|
346
|
+
* props only. Runtime callbacks (RHF `field.onChange`, `field.onBlur`) are
|
|
347
|
+
* threaded by `FormField` and live on the React/Preact interface.
|
|
348
|
+
*/
|
|
349
|
+
declare const MultiSelectOptionSchema: z.ZodObject<{
|
|
350
|
+
value: z.ZodString;
|
|
351
|
+
label: z.ZodString;
|
|
352
|
+
}, "strip", z.ZodTypeAny, {
|
|
353
|
+
value: string;
|
|
354
|
+
label: string;
|
|
355
|
+
}, {
|
|
356
|
+
value: string;
|
|
357
|
+
label: string;
|
|
358
|
+
}>;
|
|
359
|
+
declare const MultiSelectPropsSchema: z.ZodObject<{
|
|
360
|
+
name: z.ZodString;
|
|
361
|
+
label: z.ZodString;
|
|
362
|
+
options: z.ZodArray<z.ZodObject<{
|
|
363
|
+
value: z.ZodString;
|
|
364
|
+
label: z.ZodString;
|
|
365
|
+
}, "strip", z.ZodTypeAny, {
|
|
366
|
+
value: string;
|
|
367
|
+
label: string;
|
|
368
|
+
}, {
|
|
369
|
+
value: string;
|
|
370
|
+
label: string;
|
|
371
|
+
}>, "many">;
|
|
372
|
+
placeholder: z.ZodOptional<z.ZodString>;
|
|
373
|
+
disabled: z.ZodOptional<z.ZodBoolean>;
|
|
374
|
+
searchable: z.ZodOptional<z.ZodBoolean>;
|
|
375
|
+
maxItems: z.ZodOptional<z.ZodNumber>;
|
|
376
|
+
}, "strip", z.ZodTypeAny, {
|
|
377
|
+
options: {
|
|
378
|
+
value: string;
|
|
379
|
+
label: string;
|
|
380
|
+
}[];
|
|
381
|
+
name: string;
|
|
382
|
+
label: string;
|
|
383
|
+
disabled?: boolean | undefined;
|
|
384
|
+
placeholder?: string | undefined;
|
|
385
|
+
searchable?: boolean | undefined;
|
|
386
|
+
maxItems?: number | undefined;
|
|
387
|
+
}, {
|
|
388
|
+
options: {
|
|
389
|
+
value: string;
|
|
390
|
+
label: string;
|
|
391
|
+
}[];
|
|
392
|
+
name: string;
|
|
393
|
+
label: string;
|
|
394
|
+
disabled?: boolean | undefined;
|
|
395
|
+
placeholder?: string | undefined;
|
|
396
|
+
searchable?: boolean | undefined;
|
|
397
|
+
maxItems?: number | undefined;
|
|
398
|
+
}>;
|
|
399
|
+
type MultiSelectOption = z.infer<typeof MultiSelectOptionSchema>;
|
|
400
|
+
|
|
401
|
+
interface MultiSelectProps {
|
|
402
|
+
name: string;
|
|
403
|
+
label: string;
|
|
404
|
+
options: MultiSelectOption[];
|
|
405
|
+
placeholder?: string;
|
|
406
|
+
disabled?: boolean;
|
|
407
|
+
searchable?: boolean;
|
|
408
|
+
maxItems?: number;
|
|
409
|
+
className?: string;
|
|
410
|
+
}
|
|
411
|
+
/**
|
|
412
|
+
* Multi-value dropdown. Bound to RHF via `FormField` — value lives at
|
|
413
|
+
* `form.values[name]` as `string[]`. Selected values render as removable
|
|
414
|
+
* chips; the dropdown lists only unselected options. WCAG-AA combobox
|
|
415
|
+
* pattern: `role=combobox aria-multiselectable=true`, chip removal via
|
|
416
|
+
* Backspace / Delete / per-chip close icon, Tab + Arrow nav.
|
|
417
|
+
*/
|
|
418
|
+
declare function MultiSelect(props: MultiSelectProps): react_jsx_runtime.JSX.Element;
|
|
419
|
+
|
|
420
|
+
interface RadioGroupProps {
|
|
421
|
+
name: string;
|
|
422
|
+
label: string;
|
|
423
|
+
options: Array<{
|
|
424
|
+
value: string;
|
|
425
|
+
label: string;
|
|
426
|
+
description?: string;
|
|
427
|
+
disabled?: boolean;
|
|
428
|
+
}>;
|
|
429
|
+
orientation?: "vertical" | "horizontal";
|
|
430
|
+
disabled?: boolean;
|
|
431
|
+
className?: string;
|
|
432
|
+
}
|
|
433
|
+
/**
|
|
434
|
+
* Preact mirror of `runtimes/react/components/forms/RadioGroup.tsx`.
|
|
435
|
+
* The `react` import is aliased to `preact/compat` at tsup build time
|
|
436
|
+
* (Standard §18.2), so the body is identical by design.
|
|
437
|
+
*
|
|
438
|
+
* Uses native `<input type="radio">` elements + roving tabIndex.
|
|
439
|
+
* WAI-ARIA §3.10 radiogroup pattern: Arrow keys move focus AND select;
|
|
440
|
+
* Home/End jump to extremes; Space/Enter activate; disabled skipped.
|
|
441
|
+
*/
|
|
442
|
+
declare function RadioGroup(props: RadioGroupProps): react_jsx_runtime.JSX.Element;
|
|
443
|
+
|
|
444
|
+
/**
|
|
445
|
+
* Select primitive — single-select dropdown with optional search.
|
|
446
|
+
*
|
|
447
|
+
* Combobox-pattern (APG): a trigger button (role=combobox) opens a listbox
|
|
448
|
+
* popup containing option rows. Optional in-popup search filters the visible
|
|
449
|
+
* options client-side. Cross-runtime (React 19 + Preact 10).
|
|
450
|
+
*
|
|
451
|
+
* The `name` is the react-hook-form field name used by the surrounding
|
|
452
|
+
* `<FormProvider>`. The render-prop wiring lives in FormField/Controller; this
|
|
453
|
+
* component is rendered INSIDE a FormField render prop and consumes the
|
|
454
|
+
* `field` callbacks directly (see Select.stories.tsx).
|
|
455
|
+
*/
|
|
456
|
+
declare const SelectOptionSchema: z.ZodObject<{
|
|
457
|
+
value: z.ZodString;
|
|
458
|
+
label: z.ZodString;
|
|
459
|
+
disabled: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
|
|
460
|
+
}, "strip", z.ZodTypeAny, {
|
|
461
|
+
value: string;
|
|
462
|
+
disabled: boolean;
|
|
463
|
+
label: string;
|
|
464
|
+
}, {
|
|
465
|
+
value: string;
|
|
466
|
+
label: string;
|
|
467
|
+
disabled?: boolean | undefined;
|
|
468
|
+
}>;
|
|
469
|
+
type SelectOption = z.infer<typeof SelectOptionSchema>;
|
|
470
|
+
declare const SelectPropsSchema: z.ZodObject<{
|
|
471
|
+
name: z.ZodString;
|
|
472
|
+
label: z.ZodString;
|
|
473
|
+
options: z.ZodArray<z.ZodObject<{
|
|
474
|
+
value: z.ZodString;
|
|
475
|
+
label: z.ZodString;
|
|
476
|
+
disabled: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
|
|
477
|
+
}, "strip", z.ZodTypeAny, {
|
|
478
|
+
value: string;
|
|
479
|
+
disabled: boolean;
|
|
480
|
+
label: string;
|
|
481
|
+
}, {
|
|
482
|
+
value: string;
|
|
483
|
+
label: string;
|
|
484
|
+
disabled?: boolean | undefined;
|
|
485
|
+
}>, "many">;
|
|
486
|
+
placeholder: z.ZodOptional<z.ZodString>;
|
|
487
|
+
disabled: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
|
|
488
|
+
searchable: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
|
|
489
|
+
locale: z.ZodDefault<z.ZodEnum<["en", "fr"]>>;
|
|
490
|
+
}, "strip", z.ZodTypeAny, {
|
|
491
|
+
options: {
|
|
492
|
+
value: string;
|
|
493
|
+
disabled: boolean;
|
|
494
|
+
label: string;
|
|
495
|
+
}[];
|
|
496
|
+
disabled: boolean;
|
|
497
|
+
name: string;
|
|
498
|
+
label: string;
|
|
499
|
+
searchable: boolean;
|
|
500
|
+
locale: "en" | "fr";
|
|
501
|
+
placeholder?: string | undefined;
|
|
502
|
+
}, {
|
|
503
|
+
options: {
|
|
504
|
+
value: string;
|
|
505
|
+
label: string;
|
|
506
|
+
disabled?: boolean | undefined;
|
|
507
|
+
}[];
|
|
508
|
+
name: string;
|
|
509
|
+
label: string;
|
|
510
|
+
disabled?: boolean | undefined;
|
|
511
|
+
placeholder?: string | undefined;
|
|
512
|
+
searchable?: boolean | undefined;
|
|
513
|
+
locale?: "en" | "fr" | undefined;
|
|
514
|
+
}>;
|
|
515
|
+
type SelectPropsValidated = z.infer<typeof SelectPropsSchema>;
|
|
516
|
+
declare function validateSelectProps(raw: unknown): SelectPropsValidated;
|
|
517
|
+
|
|
518
|
+
interface SelectProps<TValues extends FieldValues = FieldValues> {
|
|
519
|
+
name: Path<TValues>;
|
|
520
|
+
label: string;
|
|
521
|
+
options: SelectOption[];
|
|
522
|
+
placeholder?: string;
|
|
523
|
+
disabled?: boolean;
|
|
524
|
+
searchable?: boolean;
|
|
525
|
+
className?: string;
|
|
526
|
+
/** Optional i18n map passed through to `ErrorDisplay` for error type → message. */
|
|
527
|
+
errorMessageMap?: Record<string, string>;
|
|
528
|
+
}
|
|
529
|
+
/**
|
|
530
|
+
* Single-select dropdown primitive — combobox+listbox APG pattern.
|
|
531
|
+
* Preact 10 runtime. Wraps `FormField` (RHF Controller) and exposes error
|
|
532
|
+
* state via `ErrorDisplay`. WCAG-AA strict.
|
|
533
|
+
*
|
|
534
|
+
* The visible value-label is shown in the trigger button; the listbox popup
|
|
535
|
+
* uses `aria-activedescendant` to track keyboard focus without moving DOM focus
|
|
536
|
+
* (focus stays on the trigger or the search input).
|
|
537
|
+
*/
|
|
538
|
+
declare function Select<TValues extends FieldValues = FieldValues>({ name, label, options, placeholder, disabled, searchable, className, errorMessageMap, }: SelectProps<TValues>): react_jsx_runtime.JSX.Element;
|
|
539
|
+
|
|
540
|
+
declare const SubmitButtonPropsSchema: z.ZodObject<{
|
|
541
|
+
label: z.ZodDefault<z.ZodString>;
|
|
542
|
+
loadingLabel: z.ZodDefault<z.ZodString>;
|
|
543
|
+
}, "strip", z.ZodTypeAny, {
|
|
544
|
+
label: string;
|
|
545
|
+
loadingLabel: string;
|
|
546
|
+
}, {
|
|
547
|
+
label?: string | undefined;
|
|
548
|
+
loadingLabel?: string | undefined;
|
|
549
|
+
}>;
|
|
550
|
+
|
|
551
|
+
/**
|
|
552
|
+
* FormField props — the field `name` selects a property on the form values.
|
|
553
|
+
* Children are a render-prop receiving `field`, `fieldState`, `formState`
|
|
554
|
+
* from RHF Controller; that contract is enforced at the TypeScript layer.
|
|
555
|
+
*/
|
|
556
|
+
declare const FormFieldPropsSchema: z.ZodObject<{
|
|
557
|
+
name: z.ZodString;
|
|
558
|
+
}, "strip", z.ZodTypeAny, {
|
|
559
|
+
name: string;
|
|
560
|
+
}, {
|
|
561
|
+
name: string;
|
|
562
|
+
}>;
|
|
563
|
+
|
|
564
|
+
/**
|
|
565
|
+
* FormProvider props that need runtime validation are minimal — the `form`
|
|
566
|
+
* object comes from `useMosaicForm()` and carries its own typed contract,
|
|
567
|
+
* while `children` are framework JSX. This schema exists for future-proofing
|
|
568
|
+
* (e.g. optional `name` for nested form contexts).
|
|
569
|
+
*/
|
|
570
|
+
declare const FormProviderPropsSchema: z.ZodObject<{
|
|
571
|
+
name: z.ZodOptional<z.ZodString>;
|
|
572
|
+
}, "strip", z.ZodTypeAny, {
|
|
573
|
+
name?: string | undefined;
|
|
574
|
+
}, {
|
|
575
|
+
name?: string | undefined;
|
|
576
|
+
}>;
|
|
577
|
+
|
|
578
|
+
/**
|
|
579
|
+
* Textarea — multi-line text input form primitive.
|
|
580
|
+
*
|
|
581
|
+
* Props contract (Zod-validated at boundary, mirrors React/Preact runtime types).
|
|
582
|
+
*
|
|
583
|
+
* - `name` — required, non-empty. Selects a property on the surrounding form values.
|
|
584
|
+
* - `rows` — default 3, integer ≥ 1. Maps to native textarea `rows` attribute.
|
|
585
|
+
* - `maxLength` — optional, integer ≥ 1. Caller-controlled length cap. Enforced by
|
|
586
|
+
* pure logic helpers so React and Preact runtimes share gating semantics.
|
|
587
|
+
* - `autoResize` — default false. When true, runtime grows the textarea to fit
|
|
588
|
+
* content (capped by CSS `max-height` if set by consumer).
|
|
589
|
+
* - `placeholder` — optional string.
|
|
590
|
+
* - `disabled` — optional boolean.
|
|
591
|
+
* - `label` — optional string (rendered above the textarea, bilingual-ready).
|
|
592
|
+
*/
|
|
593
|
+
declare const TextareaPropsSchema: z.ZodObject<{
|
|
594
|
+
name: z.ZodString;
|
|
595
|
+
rows: z.ZodDefault<z.ZodNumber>;
|
|
596
|
+
maxLength: z.ZodOptional<z.ZodNumber>;
|
|
597
|
+
autoResize: z.ZodDefault<z.ZodBoolean>;
|
|
598
|
+
placeholder: z.ZodOptional<z.ZodString>;
|
|
599
|
+
disabled: z.ZodOptional<z.ZodBoolean>;
|
|
600
|
+
label: z.ZodOptional<z.ZodString>;
|
|
601
|
+
}, "strip", z.ZodTypeAny, {
|
|
602
|
+
name: string;
|
|
603
|
+
rows: number;
|
|
604
|
+
autoResize: boolean;
|
|
605
|
+
disabled?: boolean | undefined;
|
|
606
|
+
maxLength?: number | undefined;
|
|
607
|
+
label?: string | undefined;
|
|
608
|
+
placeholder?: string | undefined;
|
|
609
|
+
}, {
|
|
610
|
+
name: string;
|
|
611
|
+
disabled?: boolean | undefined;
|
|
612
|
+
maxLength?: number | undefined;
|
|
613
|
+
label?: string | undefined;
|
|
614
|
+
placeholder?: string | undefined;
|
|
615
|
+
rows?: number | undefined;
|
|
616
|
+
autoResize?: boolean | undefined;
|
|
617
|
+
}>;
|
|
618
|
+
type TextareaPropsValidated = z.infer<typeof TextareaPropsSchema>;
|
|
619
|
+
declare function validateTextareaProps(raw: unknown): TextareaPropsValidated;
|
|
620
|
+
|
|
621
|
+
/**
|
|
622
|
+
* FieldArray props — `name` selects the array path on the form values.
|
|
623
|
+
* `children` is a render-prop receiving `(field, index)` for each entry
|
|
624
|
+
* AND a third arg with the controls `{ append, remove, move, swap, fields }`.
|
|
625
|
+
* That contract is enforced at the TypeScript layer.
|
|
626
|
+
*/
|
|
627
|
+
declare const FieldArrayPropsSchema: z.ZodObject<{
|
|
628
|
+
name: z.ZodString;
|
|
629
|
+
}, "strip", z.ZodTypeAny, {
|
|
630
|
+
name: string;
|
|
631
|
+
}, {
|
|
632
|
+
name: string;
|
|
633
|
+
}>;
|
|
634
|
+
/**
|
|
635
|
+
* Options accepted by `useFieldArray` — thin re-export of the underlying
|
|
636
|
+
* RHF shape. We validate `name` here for parity with FieldArray.
|
|
637
|
+
*/
|
|
638
|
+
declare const UseFieldArrayOptionsSchema: z.ZodObject<{
|
|
639
|
+
name: z.ZodString;
|
|
640
|
+
}, "strip", z.ZodTypeAny, {
|
|
641
|
+
name: string;
|
|
642
|
+
}, {
|
|
643
|
+
name: string;
|
|
644
|
+
}>;
|
|
645
|
+
|
|
646
|
+
/**
|
|
647
|
+
* Checkbox — boolean form primitive with indeterminate state support.
|
|
648
|
+
*
|
|
649
|
+
* Props contract (Zod-validated at boundary, mirrors React/Preact runtime types).
|
|
650
|
+
*
|
|
651
|
+
* - `name` — required, non-empty. Selects a property on the surrounding form values.
|
|
652
|
+
* - `label` — required, non-empty. Rendered adjacent to the checkbox (bilingual-ready).
|
|
653
|
+
* - `disabled` — optional boolean. Maps to native `disabled` attribute.
|
|
654
|
+
* - `indeterminate` — optional boolean. When true, sets DOM `.indeterminate = true`
|
|
655
|
+
* via ref and aria-checked="mixed". Controlled externally — the component does not
|
|
656
|
+
* manage this state internally.
|
|
657
|
+
* - `description` — optional string. Wired via `aria-describedby` for screen readers.
|
|
658
|
+
*/
|
|
659
|
+
declare const CheckboxPropsSchema: z.ZodObject<{
|
|
660
|
+
name: z.ZodString;
|
|
661
|
+
label: z.ZodString;
|
|
662
|
+
disabled: z.ZodOptional<z.ZodBoolean>;
|
|
663
|
+
indeterminate: z.ZodOptional<z.ZodBoolean>;
|
|
664
|
+
description: z.ZodOptional<z.ZodString>;
|
|
665
|
+
}, "strip", z.ZodTypeAny, {
|
|
666
|
+
name: string;
|
|
667
|
+
label: string;
|
|
668
|
+
description?: string | undefined;
|
|
669
|
+
disabled?: boolean | undefined;
|
|
670
|
+
indeterminate?: boolean | undefined;
|
|
671
|
+
}, {
|
|
672
|
+
name: string;
|
|
673
|
+
label: string;
|
|
674
|
+
description?: string | undefined;
|
|
675
|
+
disabled?: boolean | undefined;
|
|
676
|
+
indeterminate?: boolean | undefined;
|
|
677
|
+
}>;
|
|
678
|
+
type CheckboxPropsValidated = z.infer<typeof CheckboxPropsSchema>;
|
|
679
|
+
declare function validateCheckboxProps(raw: unknown): CheckboxPropsValidated;
|
|
680
|
+
|
|
681
|
+
/**
|
|
682
|
+
* Pure helpers for Checkbox, shared by React + Preact runtimes.
|
|
683
|
+
*
|
|
684
|
+
* No DOM, no framework imports. Keeps the runtime surface a thin shell so
|
|
685
|
+
* Standard §18 cross-runtime parity holds by reference.
|
|
686
|
+
*/
|
|
687
|
+
/**
|
|
688
|
+
* Resolve the effective `aria-checked` attribute value for the rendered
|
|
689
|
+
* `<input type="checkbox">`.
|
|
690
|
+
*
|
|
691
|
+
* - `indeterminate=true` → `"mixed"` (ARIA tri-state semantics).
|
|
692
|
+
* - `checked=true` → `true`.
|
|
693
|
+
* - otherwise → `false`.
|
|
694
|
+
*
|
|
695
|
+
* The DOM `.indeterminate` property must be set via a ref — it is not an HTML
|
|
696
|
+
* attribute and cannot be set declaratively. This helper only computes the
|
|
697
|
+
* ARIA value; the runtime is responsible for the DOM side-effect.
|
|
698
|
+
*/
|
|
699
|
+
declare function resolveAriaChecked(checked: boolean, indeterminate: boolean | undefined): boolean | "mixed";
|
|
700
|
+
/**
|
|
701
|
+
* Compute the accessible description ID to wire into `aria-describedby`.
|
|
702
|
+
*
|
|
703
|
+
* Returns the `descriptionId` when a `description` string is provided,
|
|
704
|
+
* or `undefined` when no description is present so the attribute is omitted.
|
|
705
|
+
* A falsy description short-circuits to prevent empty `aria-describedby=""`.
|
|
706
|
+
*/
|
|
707
|
+
declare function resolveDescribedBy(descriptionId: string, description: string | undefined, hasError: boolean, errorId: string): string | undefined;
|
|
708
|
+
|
|
709
|
+
/**
|
|
710
|
+
* RadioGroup — mutually exclusive single-choice form primitive.
|
|
711
|
+
*
|
|
712
|
+
* - `name` RHF field name (must match `<FormField name="…">` parent).
|
|
713
|
+
* - `options` Ordered list of radio descriptors. Each carries a stable
|
|
714
|
+
* `value` (the form value when selected), a visible `label`,
|
|
715
|
+
* and an optional `description` exposed via aria-describedby.
|
|
716
|
+
* - `orientation` Visual layout — vertical (default) or horizontal. Controls
|
|
717
|
+
* Arrow key mapping (Up/Down vs Left/Right per WAI-ARIA).
|
|
718
|
+
* - `disabled` Disables the whole group; individual options can also be
|
|
719
|
+
* disabled via `options[i].disabled`.
|
|
720
|
+
* - `label` Visible group label rendered above the radios; wired to
|
|
721
|
+
* `role="radiogroup"` via `aria-labelledby`.
|
|
722
|
+
*
|
|
723
|
+
* WCAG-AA contract is asserted by the runtime layer:
|
|
724
|
+
* - container has `role="radiogroup"` + `aria-labelledby` + `aria-orientation`.
|
|
725
|
+
* - each radio has `role="radio"` + `aria-checked` + `tabIndex` roving.
|
|
726
|
+
* - Arrow keys move focus AND selection (WAI-ARIA radiogroup pattern §3.10).
|
|
727
|
+
* - Space/Enter activates the currently focused radio.
|
|
728
|
+
* - Disabled radios are skipped during keyboard navigation.
|
|
729
|
+
*/
|
|
730
|
+
declare const RadioGroupOptionSchema: z.ZodObject<{
|
|
731
|
+
value: z.ZodString;
|
|
732
|
+
label: z.ZodString;
|
|
733
|
+
description: z.ZodOptional<z.ZodString>;
|
|
734
|
+
disabled: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
|
|
735
|
+
}, "strip", z.ZodTypeAny, {
|
|
736
|
+
value: string;
|
|
737
|
+
disabled: boolean;
|
|
738
|
+
label: string;
|
|
739
|
+
description?: string | undefined;
|
|
740
|
+
}, {
|
|
741
|
+
value: string;
|
|
742
|
+
label: string;
|
|
743
|
+
description?: string | undefined;
|
|
744
|
+
disabled?: boolean | undefined;
|
|
745
|
+
}>;
|
|
746
|
+
type RadioGroupOption = z.infer<typeof RadioGroupOptionSchema>;
|
|
747
|
+
declare const RadioGroupPropsSchema: z.ZodObject<{
|
|
748
|
+
name: z.ZodString;
|
|
749
|
+
label: z.ZodString;
|
|
750
|
+
options: z.ZodArray<z.ZodObject<{
|
|
751
|
+
value: z.ZodString;
|
|
752
|
+
label: z.ZodString;
|
|
753
|
+
description: z.ZodOptional<z.ZodString>;
|
|
754
|
+
disabled: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
|
|
755
|
+
}, "strip", z.ZodTypeAny, {
|
|
756
|
+
value: string;
|
|
757
|
+
disabled: boolean;
|
|
758
|
+
label: string;
|
|
759
|
+
description?: string | undefined;
|
|
760
|
+
}, {
|
|
761
|
+
value: string;
|
|
762
|
+
label: string;
|
|
763
|
+
description?: string | undefined;
|
|
764
|
+
disabled?: boolean | undefined;
|
|
765
|
+
}>, "many">;
|
|
766
|
+
orientation: z.ZodDefault<z.ZodEnum<["vertical", "horizontal"]>>;
|
|
767
|
+
disabled: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
|
|
768
|
+
locale: z.ZodDefault<z.ZodEnum<["en", "fr"]>>;
|
|
769
|
+
}, "strip", z.ZodTypeAny, {
|
|
770
|
+
options: {
|
|
771
|
+
value: string;
|
|
772
|
+
disabled: boolean;
|
|
773
|
+
label: string;
|
|
774
|
+
description?: string | undefined;
|
|
775
|
+
}[];
|
|
776
|
+
disabled: boolean;
|
|
777
|
+
name: string;
|
|
778
|
+
label: string;
|
|
779
|
+
orientation: "vertical" | "horizontal";
|
|
780
|
+
locale: "en" | "fr";
|
|
781
|
+
}, {
|
|
782
|
+
options: {
|
|
783
|
+
value: string;
|
|
784
|
+
label: string;
|
|
785
|
+
description?: string | undefined;
|
|
786
|
+
disabled?: boolean | undefined;
|
|
787
|
+
}[];
|
|
788
|
+
name: string;
|
|
789
|
+
label: string;
|
|
790
|
+
disabled?: boolean | undefined;
|
|
791
|
+
orientation?: "vertical" | "horizontal" | undefined;
|
|
792
|
+
locale?: "en" | "fr" | undefined;
|
|
793
|
+
}>;
|
|
794
|
+
type RadioGroupPropsValidated = z.infer<typeof RadioGroupPropsSchema>;
|
|
795
|
+
declare function validateRadioGroupProps(raw: unknown): RadioGroupPropsValidated;
|
|
796
|
+
|
|
797
|
+
/**
|
|
798
|
+
* RadioGroup.logic.ts — pure, framework-agnostic logic.
|
|
799
|
+
* No JSX here — shared between React 19 and Preact 10 runtimes.
|
|
800
|
+
*
|
|
801
|
+
* WCAG-AA ARIA + roving tabindex spec (WAI-ARIA Authoring Practices §3.10):
|
|
802
|
+
*
|
|
803
|
+
* - role="radiogroup" on container
|
|
804
|
+
* - role="radio" + aria-checked on each radio
|
|
805
|
+
* - aria-labelledby on container points to the visible group label id
|
|
806
|
+
* - aria-labelledby on each radio points to its own option label span id
|
|
807
|
+
* - aria-describedby on a radio points to its description span id (if present)
|
|
808
|
+
* - Roving tabindex:
|
|
809
|
+
* * If a value is selected → the SELECTED radio has tabIndex 0, all
|
|
810
|
+
* others tabIndex -1.
|
|
811
|
+
* * If nothing is selected → the FIRST enabled radio has tabIndex 0,
|
|
812
|
+
* all others tabIndex -1 (so Tab can enter the group).
|
|
813
|
+
* - Arrow keys (Up/Down vertical, Left/Right horizontal) MOVE focus to the
|
|
814
|
+
* next/previous enabled radio AND select it (focus + selection sync — this
|
|
815
|
+
* is the radiogroup pattern, distinct from tabs).
|
|
816
|
+
* - Home / End jump to first / last enabled radio AND select it.
|
|
817
|
+
* - Space / Enter on a non-selected focused radio selects it (no-op when
|
|
818
|
+
* already selected).
|
|
819
|
+
* - Disabled radios are skipped during arrow nav (findNextEnabledIndex).
|
|
820
|
+
*/
|
|
821
|
+
|
|
822
|
+
type RadioOrientation = "vertical" | "horizontal";
|
|
823
|
+
/**
|
|
824
|
+
* Returns the prev/next key pair for the given orientation.
|
|
825
|
+
*
|
|
826
|
+
* Vertical group → ArrowUp/ArrowDown.
|
|
827
|
+
* Horizontal group → ArrowLeft/ArrowRight.
|
|
828
|
+
*
|
|
829
|
+
* (Per WAI-ARIA radiogroup pattern, only one axis is used; the perpendicular
|
|
830
|
+
* arrow keys are NOT intercepted — they let the user move out of the group.)
|
|
831
|
+
*/
|
|
832
|
+
declare function getNavKeys(orientation: RadioOrientation): {
|
|
833
|
+
prev: string;
|
|
834
|
+
next: string;
|
|
835
|
+
};
|
|
836
|
+
/**
|
|
837
|
+
* Finds the next enabled (non-disabled) option index in `direction`,
|
|
838
|
+
* wrapping around at boundaries. Returns `currentIndex` if every option
|
|
839
|
+
* is disabled (defensive — Zod schema requires options.length ≥ 1 but does
|
|
840
|
+
* not forbid all-disabled).
|
|
841
|
+
*/
|
|
842
|
+
declare function findNextEnabledIndex(options: Array<Pick<RadioGroupOption, "disabled">>, currentIndex: number, direction: 1 | -1): number;
|
|
843
|
+
/** First enabled option index, or 0 if all are disabled. */
|
|
844
|
+
declare function findFirstEnabledIndex(options: Array<Pick<RadioGroupOption, "disabled">>): number;
|
|
845
|
+
/** Last enabled option index, or `options.length - 1` if all are disabled. */
|
|
846
|
+
declare function findLastEnabledIndex(options: Array<Pick<RadioGroupOption, "disabled">>): number;
|
|
847
|
+
/**
|
|
848
|
+
* Returns the index of the option whose `value` matches `selectedValue`,
|
|
849
|
+
* or -1 if no option is selected (or the selected value points to a disabled
|
|
850
|
+
* option — selected-but-disabled is a valid state, so we DON'T filter here).
|
|
851
|
+
*/
|
|
852
|
+
declare function findSelectedIndex(options: Array<Pick<RadioGroupOption, "value">>, selectedValue: string | undefined): number;
|
|
853
|
+
/**
|
|
854
|
+
* Roving tabindex resolver — returns the index that should carry tabIndex=0.
|
|
855
|
+
*
|
|
856
|
+
* - If something is selected → the selected index (focus follows selection).
|
|
857
|
+
* - Otherwise → the first enabled option (so Tab can enter the group).
|
|
858
|
+
*/
|
|
859
|
+
declare function getRovingTabIndex(options: Array<Pick<RadioGroupOption, "value" | "disabled">>, selectedValue: string | undefined): number;
|
|
860
|
+
/** Stable DOM id for the group label (linked by container aria-labelledby). */
|
|
861
|
+
declare function getGroupLabelId(instanceId: string, name: string): string;
|
|
862
|
+
/** Stable DOM id for an option label span (linked by radio aria-labelledby). */
|
|
863
|
+
declare function getOptionLabelId(instanceId: string, name: string, optionValue: string): string;
|
|
864
|
+
/** Stable DOM id for an option description span (linked by radio aria-describedby). */
|
|
865
|
+
declare function getOptionDescriptionId(instanceId: string, name: string, optionValue: string): string;
|
|
866
|
+
/** Tailwind classes for the root radiogroup container. */
|
|
867
|
+
declare function getGroupClasses(orientation: RadioOrientation): string;
|
|
868
|
+
/** Tailwind classes for a single radio row (label + control + description). */
|
|
869
|
+
declare function getOptionRowClasses(isDisabled: boolean, orientation: RadioOrientation): string;
|
|
870
|
+
/** Tailwind classes for the visible radio control (the round dot). */
|
|
871
|
+
declare function getRadioControlClasses(isSelected: boolean, isDisabled: boolean): string;
|
|
872
|
+
/** Whether a keyboard event should activate the focused radio (Space / Enter). */
|
|
873
|
+
declare function isActivationKey(key: string): boolean;
|
|
874
|
+
|
|
875
|
+
export { Checkbox, type CheckboxProps, CheckboxPropsSchema, type CheckboxPropsValidated, DEFAULT_TEXTAREA_ROWS, ErrorDisplay, type ErrorDisplayProps, ErrorDisplayPropsSchema, FieldArray, type FieldArrayControls, type FieldArrayProps, FieldArrayPropsSchema, type FieldArrayRenderItemArgs, type FieldErrorShape, FieldErrorShapeSchema, FormField, type FormFieldProps, FormFieldPropsSchema, type FormFieldRenderArgs, FormProvider, type FormProviderProps, FormProviderPropsSchema, Input, type InputProps, InputPropsSchema, type InputType, InputTypeSchema, type MosaicFormMode, MosaicFormModeSchema, MultiSelect, type MultiSelectOption, MultiSelectOptionSchema, type MultiSelectProps, MultiSelectPropsSchema, RadioGroup, type RadioGroupOption, RadioGroupOptionSchema, type RadioGroupProps, RadioGroupPropsSchema, type RadioGroupPropsValidated, type RadioOrientation, Select, type SelectOption, SelectOptionSchema, type SelectProps, SelectPropsSchema, type SelectPropsValidated, SubmitButton, type SubmitButtonProps, SubmitButtonPropsSchema, Textarea, type TextareaProps, TextareaPropsSchema, type TextareaPropsValidated, type UseFieldArrayOptions, UseFieldArrayOptionsSchema, type UseMosaicFormOptions, UseMosaicFormOptionsSchema, type UseMosaicFormReturn, buildAddAriaLabel, buildListAriaLabel, buildRemoveAriaLabel, clampToMaxLength, computeAutoResizeHeight, findFirstEnabledIndex, findLastEnabledIndex, findNextEnabledIndex, findSelectedIndex, getGroupClasses, getGroupLabelId, getNavKeys, getOptionDescriptionId, getOptionLabelId, getOptionRowClasses, getRadioControlClasses, getRovingTabIndex, isActivationKey, nextFocusIndexAfterRemove, resolveAriaChecked, resolveDescribedBy, resolveRows, useFieldArray, useMosaicForm, useMosaicFormContext, validateCheckboxProps, validateRadioGroupProps, validateSelectProps, validateTextareaProps };
|