@navette-js/forms 0.0.0-stage → 1.0.0-beta.2

package/lib/index.d.ts

@@ -0,0 +1,866 @@
+import { HtmlString, type ColorManager, type Lazy } from '@navette-js/support';
+import { Component, Schema, type ComponentContext } from '@navette-js/schemas';
+import { Action } from '@navette-js/actions';
+export declare const useColorManager: (manager: ColorManager) => void;
+type Rule = {
+    name: string;
+    passes: (value: unknown, ctx: ComponentContext) => boolean | Promise<boolean>;
+    message: (attribute: string) => string;
+};
+export declare abstract class Field extends Component {
+    protected _label: Lazy<string | null, ComponentContext>;
+    protected _required: Lazy<boolean, ComponentContext>;
+    protected _disabled: Lazy<boolean, ComponentContext>;
+    protected _autofocus: boolean;
+    protected _default: unknown;
+    protected _rules: Rule[];
+    protected _afterStateUpdated: ((ctx: ComponentContext & {
+        set: (name: string, value: unknown) => void;
+    }) => unknown) | null;
+    protected _dehydrated: boolean | null;
+    protected _hiddenLabel: boolean;
+    protected _helperText: string | null;
+    constructor(name: string);
+    hasStatePath(): boolean;
+    getName(): string;
+    getId(): string;
+    label(label: Lazy<string | null, ComponentContext>): this;
+    required(condition?: Lazy<boolean, ComponentContext>): this;
+    disabled(condition?: Lazy<boolean, ComponentContext>): this;
+    autofocus(condition?: boolean): this;
+    default(value: unknown): this;
+    /** Helper text shown under the field. */
+    helperText(text: string | null): this;
+    /** Helper text id, linked to the control through `aria-describedby`. */
+    protected getHelperTextId(): string | null;
+    /** Keeps the label for screen readers only. */
+    hiddenLabel(condition?: boolean): this;
+    protected _hint: Lazy<string | HtmlString | null, ComponentContext>;
+    protected _hintColor: Lazy<string | null, ComponentContext>;
+    protected _hintIcon: Lazy<string | null, ComponentContext>;
+    protected _hintIconTooltip: Lazy<string | null, ComponentContext>;
+    protected _hintActions: Action[];
+    /**
+     * Hint shown to the right of the label (a `Text` component). The text is escaped; an `HtmlString` from `@navette-js/support`
+     * (`raw('<a href="…">…</a>')`) is inserted as is, so only put values escaped with `e()` in it.
+     */
+    hint(hint: Lazy<string | HtmlString | null, ComponentContext>): this;
+    /** Color of the hint and its icon (by default `gray` for the text, `primary` for the icon). */
+    hintColor(color: Lazy<string | null, ComponentContext>): this;
+    /** Hint icon, with an optional tooltip (also used as its accessible name). */
+    hintIcon(name: Lazy<string | null, ComponentContext>, tooltip?: Lazy<string | null, ComponentContext>): this;
+    hintIconTooltip(tooltip: Lazy<string | null, ComponentContext>): this;
+    /** Action shown after the hint (small link), mounted on the field. */
+    hintAction(action: Action): this;
+    hintActions(actions: Action[]): this;
+    getHintActions(): Action[];
+    /** Actions the field exposes for mounting (`schemaComponent` = field key): its hint actions. */
+    getActions(): Action[];
+    /** Row after the label: hint, hint icon and hint actions. */
+    protected renderAfterLabel(): Promise<string>;
+    /** Runs on the server when the field state changes (`live()` field). `set(name, value)` changes another field of the same form. */
+    afterStateUpdated(callback: (ctx: ComponentContext & {
+        set: (name: string, value: unknown) => void;
+    }) => unknown): this;
+    hasAfterStateUpdated(): boolean;
+    callAfterStateUpdated(set: (name: string, value: unknown) => void): Promise<void>;
+    /** Forces the field into the submitted data, even when disabled (`.disabled().dehydrated()`). */
+    dehydrated(condition?: boolean): this;
+    /** By default, a disabled field is neither validated nor saved. */
+    isDehydrated(): Promise<boolean>;
+    getDefaultState(): unknown;
+    /** Shapes a record value as it enters the form (hydration). */
+    hydrateState(value: unknown): unknown;
+    rule(rule: Rule): this;
+    /** `unique` rule: the value must not exist in the column of the same name; `ignoreRecord` excludes the record being edited. */
+    unique(options?: {
+        ignoreRecord?: boolean;
+        column?: string;
+    }): this;
+    getLabel(): Promise<string>;
+    isRequired(): Promise<boolean>;
+    isDisabled(): Promise<boolean>;
+    getErrors(): string[];
+    hasError(): boolean;
+    /** Validation rules: `required` first, then the field's own. */
+    getValidationRules(): Promise<Rule[]>;
+    validate(): Promise<string[]>;
+    /** Value written to the data to save (composite fields only leave a skeleton, filled by their children). */
+    dehydrateState(state: unknown): unknown;
+    /** Final shaping of the saved value, once child fields are dehydrated (e.g. a Builder's item list). */
+    finalizeDehydratedState(state: unknown): unknown;
+    protected wrap(html: string, options?: {
+        labelPrefix?: string;
+        wrapperClass?: string;
+        after?: string;
+        labelAsDiv?: boolean;
+        focusable?: boolean;
+    }): Promise<string>;
+}
+export declare class TextInput extends Field {
+    private _type;
+    private _isPassword;
+    private _isRevealable;
+    private _autocomplete;
+    private _maxLength;
+    private _minLength;
+    private _placeholder;
+    private _numeric;
+    private _minValue;
+    private _maxValue;
+    private _prefix;
+    private _live;
+    static make(name: string): TextInput;
+    /** Decimal number: `type="number"`, `step="any"`. */
+    numeric(): this;
+    /** Integer: `type="number"`, `step="1"`. */
+    integer(): this;
+    private _step;
+    /** Input `step` of a numeric field, overriding the one implied by `numeric()` or `integer()`. */
+    step(step: number | 'any' | null): this;
+    minValue(value: number): this;
+    maxValue(value: number): this;
+    /** Label shown before the input (e.g. `$`). */
+    prefix(label: string | null): this;
+    private _suffix;
+    /** Label shown after the input ("hours", "kg"…). */
+    suffix(label: string | null): this;
+    /** Sends the state to the server on every keystroke, or on blur with `onBlur`. */
+    live(options?: {
+        onBlur?: boolean;
+    }): this;
+    type(type: string): this;
+    password(condition?: boolean): this;
+    revealable(condition?: boolean): this;
+    /** `true` → "on", `false` → "off", a string as is. */
+    autocomplete(value?: string | boolean): this;
+    placeholder(text: string | null): this;
+    private _mask;
+    /** Alpine input mask (`(999) 999-9999`): guides typing in the browser, with no validation value. */
+    mask(pattern: string | null): this;
+    /** Phone number: digits, spaces and common punctuation. */
+    tel(): this;
+    /** Web address: `url` input type, a valid http(s) value is required. */
+    url(): this;
+    maxLength(length: number): this;
+    minLength(length: number): this;
+    toHtml(): Promise<string>;
+}
+/** Native date picker (`<input type="date">`). */
+export declare class DatePicker extends Field {
+    private _maxDate;
+    private _minDate;
+    private _live;
+    static make(name: string): DatePicker;
+    private _datePlaceholder;
+    /** Placeholder attribute (browsers do not display it on a native `date` input). */
+    placeholder(text: string | null): this;
+    /** Sends the state to the server as soon as it changes (`wire:model.live`). */
+    live(condition?: boolean): this;
+    /** The state is a `YYYY-MM-DD` date, whatever the stored precision. */
+    hydrateState(value: unknown): unknown;
+    private static resolve;
+    private bound;
+    /** Latest accepted date: `'today'`, a `YYYY-MM-DD` date, or a context function (`({ get }) => get('endDate') || 'today'`). */
+    maxDate(date: Lazy<string | null, ComponentContext>): this;
+    minDate(date: Lazy<string | null, ComponentContext>): this;
+    toHtml(): Promise<string>;
+}
+type Options = [string, string][] | Record<string, string>;
+/**
+ * Dropdown. Native (`<select>`) by default; `searchable()` switches to the JavaScript select,
+ * which queries the server through the exposed methods (`getSearchResultsForJs`…).
+ */
+export declare class Select extends Field {
+    private _options;
+    private _placeholder;
+    private _searchable;
+    private _dynamic;
+    private _searchOnServer;
+    private _live;
+    private _hasNoInitialOptions;
+    private _multiple;
+    private _optionLabelsUsing;
+    private _disableOptionWhen;
+    private _searchResultsUsing;
+    private _optionLabelUsing;
+    static make(name: string): Select;
+    /** Search results computed by the server on every keystroke (no preloaded option list). */
+    getSearchResultsUsing(resolver: (search: string, ctx: ComponentContext) => Options | Promise<Options>): this;
+    /** Label of a value; also used to validate that a searched value exists. */
+    getOptionLabelUsing(resolver: (value: string, ctx: ComponentContext) => string | null | Promise<string | null>): this;
+    /**
+     * Fixed options, or a (possibly async) function evaluated on every request.
+     * `dynamic: false`: options come from a function but stay fixed for the page's lifetime (announced as static to the browser).
+     * `searchOnServer: false`: search runs in the browser, among the options already sent (for a complete list).
+     */
+    options(options: Options | ((ctx: ComponentContext) => Options | Promise<Options>), config?: {
+        dynamic?: boolean;
+        searchOnServer?: boolean;
+    }): this;
+    /** Disables an option depending on the context (e.g. already picked in another row). */
+    disableOptionWhen(condition: (value: string, ctx: ComponentContext) => boolean): this;
+    /** Sends the state to the server as soon as it changes. */
+    live(condition?: boolean): this;
+    placeholder(label: string | null): this;
+    private _selectablePlaceholder;
+    /** `false`: the native select has no empty option. */
+    selectablePlaceholder(condition?: boolean): this;
+    searchable(condition?: boolean): this;
+    /** Multiple selection: the state is a list of values; always uses the JavaScript select. */
+    multiple(condition?: boolean): this;
+    isMultiple(): boolean;
+    /** Labels of several values at once (multiple selection with server search); also used to validate the values. */
+    getOptionLabelsUsing(resolver: (values: string[], ctx: ComponentContext) => Options | Promise<Options>): this;
+    getDefaultState(): unknown;
+    /** Sanitized selected values: unique strings. */
+    private selectedValues;
+    private labelsOf;
+    /** No-op: options are always loaded with the form. */
+    preload(): this;
+    hydrateState(value: unknown): unknown;
+    dehydrateState(state: unknown): unknown;
+    resolveOptions(): Promise<[string, string][]>;
+    getValidationRules(): Promise<Rule[]>;
+    getExposedMethods(): string[];
+    private static forJs;
+    getOptionsForJs(): Promise<{
+        label: string;
+        value: string;
+        isDisabled: boolean;
+    }[]>;
+    private withDisabled;
+    getSearchResultsForJs(search?: unknown): Promise<{
+        label: string;
+        value: string;
+        isDisabled: boolean;
+    }[]>;
+    getOptionLabel(): Promise<string | null>;
+    getOptionLabelsForJs(): Promise<unknown[]>;
+    private _createOptionForm;
+    private _createOptionUsing;
+    private _createOptionModalHeading;
+    private _modifyCreateOptionAction;
+    private _editOptionForm;
+    private _updateOptionUsing;
+    private _fillEditOptionForm;
+    private _editOptionModalHeading;
+    private _modifyEditOptionAction;
+    /**
+     * Form of the "Create" modal opened by the field's "+" button, validated on the server.
+     * `createOptionUsing()` saves the option and returns its value, which becomes the field state (appended for `multiple()`).
+     * Options must come from a function (`options(() => …)`, or server search) for the new value to appear.
+     */
+    createOptionForm(schema: Component[] | ((schema: Schema) => Component[] | Schema) | null): this;
+    /** Saves the option from the validated modal data; returns the value (key) of the created option. */
+    createOptionUsing(callback: ((data: Record<string, unknown>, ctx: ComponentContext) => string | number | null | Promise<string | number | null>) | null): this;
+    createOptionModalHeading(heading: string | null): this;
+    /** Customizes the create action (label, icon, modal width…). */
+    createOptionAction(modify: ((action: Action) => Action | void) | null): this;
+    /**
+     * Form of the "Edit" modal for the selected option (single selection only). The field becomes `live()` so the button
+     * appears as soon as an option is picked. Filled by `fillEditOptionActionFormUsing()`, saved by `updateOptionUsing()`.
+     */
+    editOptionForm(schema: Component[] | ((schema: Schema) => Component[] | Schema) | null): this;
+    updateOptionUsing(callback: ((data: Record<string, unknown>, ctx: ComponentContext) => unknown) | null): this;
+    /** Initial data of the "Edit" modal (the context carries the current field state in `state`). */
+    fillEditOptionActionFormUsing(callback: ((ctx: ComponentContext) => Record<string, unknown> | null | Promise<Record<string, unknown> | null>) | null): this;
+    editOptionModalHeading(heading: string | null): this;
+    editOptionAction(modify: ((action: Action) => Action | void) | null): this;
+    /** Same form for creating and editing. */
+    manageOptionForm(schema: Component[] | ((schema: Schema) => Component[] | Schema) | null): this;
+    private setState;
+    private getCreateOptionAction;
+    private getEditOptionAction;
+    /** Actions mounted on the field: hint, create option and edit option. */
+    getActions(): Action[];
+    /** "+" and "edit" buttons on the right of the field. */
+    private suffixHtml;
+    toHtml(): Promise<string>;
+    /** JavaScript select rendering. */
+    private toJsHtml;
+}
+/** Column of a table Repeater: label and width. */
+export declare class TableColumn {
+    label: string;
+    private _width;
+    constructor(label: string);
+    static make(label: string): TableColumn;
+    width(width: number | string): this;
+    getWidth(): string | null;
+}
+type ItemLink = {
+    label: string;
+    icon: string;
+    url: string;
+};
+/**
+ * List of repeated items sharing the same fields, displayed as a table.
+ * The state is a map `item key → fields`; key order is display order.
+ * Add, delete and move are component actions, mounted with `schemaComponent`.
+ */
+export declare class Repeater extends Field {
+    private _schema;
+    private _columns;
+    private _defaultItems;
+    private _maxItems;
+    private _itemLinks;
+    static make(name: string): Repeater;
+    /** Item fields: a function called for each item. */
+    schema(factory: () => Field[]): this;
+    /** Table display, one column per field. */
+    table(columns: TableColumn[]): this;
+    defaultItems(count: number): this;
+    maxItems(count: number): this;
+    private _reorderable;
+    /** `false`: items keep their order (e.g. a relationship without an order column). */
+    reorderable(condition?: boolean): this;
+    /** Link shown on each row (an item action pointing to a URL). */
+    extraItemLink(resolver: (ctx: {
+        item: Record<string, unknown>;
+        key: string;
+    }) => ItemLink | null): this;
+    /** Well-formed items only: keys come from the browser, so only simple keys are kept. */
+    getItems(): Record<string, Record<string, unknown>>;
+    private setItems;
+    private itemDefaults;
+    getDefaultState(): unknown;
+    /** Relationship records → `record-<id>` items, limited to the declared fields. */
+    hydrateState(value: unknown): unknown;
+    dehydrateState(): unknown;
+    getChildSchemas(): Schema[];
+    getValidationRules(): Promise<Rule[]>;
+    getActions(): Action[];
+    toHtml(): Promise<string>;
+}
+/** Native time input: the state is `HH:MM` with `seconds(false)`, `HH:MM:SS` otherwise. */
+export declare class TimePicker extends Field {
+    private _seconds;
+    static make(name: string): TimePicker;
+    seconds(condition?: boolean): this;
+    hydrateState(value: unknown): unknown;
+    toHtml(): Promise<string>;
+}
+/** Native `datetime-local` input: the saved state is `YYYY-MM-DD HH:MM:SS`. */
+export declare class DateTimePicker extends Field {
+    private _seconds;
+    static make(name: string): DateTimePicker;
+    seconds(condition?: boolean): this;
+    dehydrateState(state: unknown): unknown;
+    toHtml(): Promise<string>;
+}
+/** Single choice as radio buttons. */
+export declare class Radio extends Field {
+    private _options;
+    private _descriptions;
+    private _inline;
+    private _live;
+    static make(name: string): Radio;
+    options(options: Options): this;
+    /** Helper text per value, under the option label. */
+    descriptions(descriptions: Record<string, string>): this;
+    /** Options side by side. */
+    inline(condition?: boolean): this;
+    live(condition?: boolean): this;
+    getValidationRules(): Promise<Rule[]>;
+    toHtml(): Promise<string>;
+}
+export declare class Textarea extends Field {
+    private _rows;
+    private _maxLength;
+    static make(name: string): Textarea;
+    rows(rows: number): this;
+    maxLength(length: number): this;
+    toHtml(): Promise<string>;
+}
+/** Tag list input: the state is an array of strings. */
+export declare class TagsInput extends Field {
+    private _placeholder;
+    private _suggestions;
+    private _splitKeys;
+    static make(name: string): TagsInput;
+    placeholder(text: string | null): this;
+    /** Values suggested while typing. */
+    suggestions(suggestions: string[]): this;
+    /** Keys that confirm the current tag, besides Enter (`['Tab', ',']`). */
+    splitKeys(keys: string[]): this;
+    getDefaultState(): unknown;
+    hydrateState(value: unknown): unknown;
+    /** Only non-empty strings are saved, whatever shape the browser sends. */
+    dehydrateState(state: unknown): unknown;
+    toHtml(): Promise<string>;
+}
+/** On/off switch. */
+export declare class Toggle extends Field {
+    static make(name: string): Toggle;
+    getDefaultState(): unknown;
+    hydrateState(value: unknown): unknown;
+    toHtml(): Promise<string>;
+}
+/** Single choice shown as buttons. */
+export declare class ToggleButtons extends Field {
+    private _options;
+    private _inline;
+    private _grouped;
+    private _colors;
+    private _icons;
+    static make(name: string): ToggleButtons;
+    private _live;
+    /** Sends the state to the server as soon as it changes. */
+    live(condition?: boolean): this;
+    /** Color per value (e.g. from an enum). */
+    colors(colors: Record<string, string>): this;
+    /** Icon per value. */
+    icons(icons: Record<string, string>): this;
+    options(options: Options): this;
+    /** Buttons side by side. */
+    inline(condition?: boolean): this;
+    /** Buttons joined into a single group. */
+    grouped(condition?: boolean): this;
+    getValidationRules(): Promise<Rule[]>;
+    toHtml(): Promise<string>;
+}
+type RichDocument = {
+    type: 'doc';
+    content?: unknown[];
+};
+/** Stored HTML → TipTap document. Parsing drops anything the schema does not know (scripts, event attributes, `javascript:` links). */
+export declare function richHtmlToDocument(html: string | null | undefined): RichDocument;
+/**
+ * TipTap document → HTML to save, or null if empty or invalid. The document comes from the browser,
+ * so it is rendered then re-parsed to keep only what the schema accepts.
+ */
+export declare function richDocumentToHtml(document: unknown): string | null;
+/**
+ * Rich text editor: the browser works on a TipTap document, the database receives HTML.
+ * Not supported yet: attachments, custom blocks, mentions.
+ */
+export declare class RichEditor extends Field {
+    static make(name: string): RichEditor;
+    hydrateState(value: unknown): unknown;
+    getDefaultState(): unknown;
+    dehydrateState(state: unknown): unknown;
+    getValidationRules(): Promise<Rule[]>;
+    getExposedMethods(): string[];
+    getMentionSearchResultsForJs(): unknown[];
+    getMentionLabelsForJs(): unknown[];
+    getCustomBlockPreviewsForJs(): unknown[];
+    getUploadedFileAttachmentTemporaryUrl(): null;
+    saveUploadedFileAttachmentAndGetUrl(): null;
+    /** Toolbar "link" action: a modal (URL, new tab), then commands sent back to the browser editor. */
+    getActions(): Action[];
+    toHtml(): Promise<string>;
+}
+/** Color picker (hex format). */
+export declare class ColorPicker extends Field {
+    static make(name: string): ColorPicker;
+    /** Hex format: the only one supported, kept for API compatibility. */
+    hex(): this;
+    constructor(name: string);
+    toHtml(): Promise<string>;
+}
+export declare class Checkbox extends Field {
+    static make(name: string): Checkbox;
+    getDefaultState(): unknown;
+    toHtml(): Promise<string>;
+}
+/** Checkboxes for a list of values (no search or "select all" yet). */
+export declare class CheckboxList extends Field {
+    private _options;
+    private _optionColumns;
+    static make(name: string): CheckboxList;
+    options(options: Options): this;
+    /** Number of columns the options are spread over (from `lg`). */
+    columns(columns: number | null): this;
+    getDefaultState(): unknown;
+    hydrateState(value: unknown): unknown;
+    /** Only offered values are kept, without duplicates, in option order. */
+    dehydrateState(state: unknown): unknown;
+    getValidationRules(): Promise<Rule[]>;
+    toHtml(): Promise<string>;
+}
+/** Free-form key/value pairs, saved as an object. */
+export declare class KeyValue extends Field {
+    private _keyLabel;
+    private _valueLabel;
+    private _reorderable;
+    static make(name: string): KeyValue;
+    keyLabel(label: string): this;
+    valueLabel(label: string): this;
+    reorderable(condition?: boolean): this;
+    getDefaultState(): unknown;
+    private static toPairs;
+    hydrateState(value: unknown): unknown;
+    /** Flat object of strings: empty keys, nested objects and dangerous keys are dropped; 200 pairs at most. */
+    dehydrateState(state: unknown): unknown;
+    toHtml(): Promise<string>;
+}
+/** Developer-written JavaScript expression (e.g. a Slider tooltip formatter), inserted as is: never put user data in it. */
+export declare class RawJs {
+    readonly js: string;
+    constructor(js: string);
+    static make(js: string): RawJs;
+    toString(): string;
+}
+/**
+ * Markdown editor (EasyMDE). The state is raw Markdown text, to sanitize before any HTML display.
+ * Attachments are not supported (no `attachFiles` button by default); when read-only (`disabled()`),
+ * the text is shown escaped, without Markdown conversion.
+ */
+export declare class MarkdownEditor extends Field {
+    private _toolbarButtons;
+    private _minHeight;
+    private _maxHeight;
+    private _placeholder;
+    private _live;
+    static make(name: string): MarkdownEditor;
+    /** Toolbar buttons, grouped (`[['bold', 'italic'], ['undo', 'redo']]`) or flat. */
+    toolbarButtons(buttons: (string | string[])[]): this;
+    /** Removes buttons; with no argument, removes them all. */
+    disableToolbarButtons(names?: string[]): this;
+    disableAllToolbarButtons(condition?: boolean): this;
+    /** Adds buttons (in a separate group). */
+    enableToolbarButtons(names: string[]): this;
+    getToolbarButtons(): (string | string[])[];
+    hasToolbarButton(name: string): boolean;
+    /** Minimum height of the editing area (`10rem` by default). */
+    minHeight(height: string | null): this;
+    maxHeight(height: string | null): this;
+    placeholder(text: string | null): this;
+    /** Sends the state to the server while typing (`debounce` in milliseconds), or on blur with `onBlur`. */
+    live(options?: {
+        onBlur?: boolean;
+        debounce?: number | null;
+    }): this;
+    maxLength(length: number): this;
+    minLength(length: number): this;
+    hydrateState(value: unknown): unknown;
+    getValidationRules(): Promise<Rule[]>;
+    getExposedMethods(): string[];
+    getUploadedFileAttachmentTemporaryUrl(): null;
+    saveUploadedFileAttachmentAndGetUrl(): null;
+    toHtml(): Promise<string>;
+}
+/** Code editor (CodeMirror): highlighting from `language()`, line wrapping with `wrap()`. */
+export declare class CodeEditor extends Field {
+    private _language;
+    private _canWrap;
+    private _live;
+    static make(name: string): CodeEditor;
+    /** Language: `cpp`, `css`, `go`, `html`, `java`, `javascript`, `json`, `markdown`, `php`, `python`, `sql`, `xml`, `yaml`. */
+    language(language: string | null): this;
+    getLanguage(): string | null;
+    /**
+     * Wraps long lines. Called with an HTML string, it is the inherited field wrapper,
+     * which the component's rendering uses.
+     */
+    wrap(condition?: any, options?: any): any;
+    canWrap(): boolean;
+    live(options?: {
+        onBlur?: boolean;
+        debounce?: number | null;
+    }): this;
+    hydrateState(value: unknown): unknown;
+    getValidationRules(): Promise<Rule[]>;
+    toHtml(): Promise<string>;
+}
+/**
+ * Slider (noUiSlider): one value, or several handles when the state is a list (`default([20, 70])`).
+ * Required by default; bounds, step and numeric type are checked on the server.
+ */
+export declare class Slider extends Field {
+    private _minValue;
+    private _maxValue;
+    private _step;
+    private _minDifference;
+    private _maxDifference;
+    private _rangePadding;
+    private _fillTrack;
+    private _vertical;
+    private _rtl;
+    private _behavior;
+    private _tooltips;
+    private _pipsMode;
+    private _pipsDensity;
+    private _pipsFormatter;
+    private _pipsValues;
+    private _steppedPips;
+    private _pipsFilter;
+    private _nonLinearPoints;
+    private _decimalPlaces;
+    private _live;
+    constructor(name: string);
+    static make(name: string): Slider;
+    range(minValue: number, maxValue: number): this;
+    minValue(value: number): this;
+    maxValue(value: number): this;
+    /** Step between values; `1` requires an integer, otherwise the value must be a multiple of the step. */
+    step(step: number | null): this;
+    /** Minimum / maximum gap between two handles. */
+    minDifference(difference: number | null): this;
+    maxDifference(difference: number | null): this;
+    /** Forbidden margin at the ends: a number, or `[start, end]`. */
+    rangePadding(padding: number | [number, number] | null): this;
+    /** Colored track segments, one boolean per segment (`[true, false]` by default). */
+    fillTrack(fill?: boolean[] | null): this;
+    vertical(condition?: boolean): this;
+    /** Right to left (top to bottom for a vertical slider, the default when vertical). */
+    rtl(condition?: boolean | null): this;
+    /** Handle behavior (`tap`, `drag`, `fixed`, `snap`, `unconstrained`…); `null`: none. */
+    behavior(behavior?: string | string[] | null): this;
+    /** Handle tooltips: a boolean, one boolean per handle, or a `RawJs` formatting `$value`. */
+    tooltips(tooltips?: boolean | RawJs | (boolean | RawJs)[]): this;
+    /** Pips: `range` (default), `steps`, `positions`, `count`, `values`. */
+    pips(mode?: string | null, density?: number | null): this;
+    pipsMode(mode: string | null): this;
+    pipsDensity(density: number | null): this;
+    /** Pip formatter (a `RawJs` receiving `$value`). */
+    pipsFormatter(formatter: RawJs | null): this;
+    pipsValues(values: number | number[] | null): this;
+    steppedPips(condition?: boolean): this;
+    /** Pip filter (a `RawJs` receiving `$value`). */
+    pipsFilter(filter: RawJs | null): this;
+    /** Non-linear scale (`{ '10%': 500, '50%': 4000 }`). */
+    nonLinearPoints(points: Record<string, number | number[]> | null): this;
+    /** Decimal places of the saved value. */
+    decimalPlaces(places: number | null): this;
+    live(options?: {
+        onBlur?: boolean;
+        debounce?: number | null;
+    }): this;
+    getMinValueWithPadding(): number;
+    getMaxValueWithPadding(): number;
+    isMultiple(): boolean;
+    getDefaultState(): unknown;
+    private cast;
+    hydrateState(value: unknown): unknown;
+    dehydrateState(state: unknown): unknown;
+    getValidationRules(): Promise<Rule[]>;
+    /** A `RawJs` becomes a `{ to: ($value) => … }` formatter object. */
+    private static formatters;
+    toHtml(): Promise<string>;
+}
+/** Hidden field: an `<input type="hidden">` bound to the state, with no label or grid slot. */
+export declare class Hidden extends Field {
+    constructor(name: string);
+    static make(name: string): Hidden;
+    toHtml(): Promise<string>;
+}
+/** One-time code: one box per digit; the state is a digit string of exactly `length()` characters. */
+export declare class OneTimeCodeInput extends Field {
+    private _length;
+    private _submitOnCompletion;
+    private _readOnly;
+    constructor(name: string);
+    static make(name: string): OneTimeCodeInput;
+    /** Number of digits (6 by default). */
+    length(length: number): this;
+    getLength(): number;
+    /** Submits the form as soon as the last digit is typed. */
+    submitOnCompletion(condition?: boolean): this;
+    readOnly(condition?: boolean): this;
+    hydrateState(value: unknown): unknown;
+    toHtml(): Promise<string>;
+}
+/**
+ * Read-only text in a form. Nothing is saved. An `HtmlString` is inserted as is.
+ */
+export declare class Placeholder extends Component {
+    private _label;
+    private _content;
+    private _hiddenLabel;
+    constructor(name: string);
+    static make(name: string): Placeholder;
+    hasStatePath(): boolean;
+    label(label: Lazy<string | null, ComponentContext>): this;
+    hiddenLabel(condition?: boolean): this;
+    content(content: Lazy<string | number | HtmlString | null, ComponentContext>): this;
+    toHtml(): Promise<string>;
+}
+/** Fills the default state of every field in a schema. */
+export declare function fillSchema(schema: Schema, target: Record<string, unknown>): void;
+/** Fills the form state from a record, field by field. */
+export declare function fillSchemaFromRecord(schema: Schema, target: Record<string, unknown>, record: Record<string, unknown>): void;
+/** Validates every visible field of a schema; returns errors by state path. */
+export declare function validateSchema(schema: Schema): Promise<Record<string, string[]>>;
+/** State to save: only declared, visible, dehydrated fields; an empty string becomes `null`. */
+export declare function getSchemaState(schema: Schema): Promise<Record<string, unknown>>;
+type StepHook = (ctx: ComponentContext) => void | Promise<void>;
+/** Throw from a step's `beforeValidation` / `afterValidation` to stay on the current step. */
+export declare class Halt extends Error {
+    constructor();
+}
+/** A wizard step: a label, an optional description and icon, and its own schema. */
+export declare class Step extends Component {
+    private children;
+    private _columns;
+    private label;
+    private _description;
+    private _icon;
+    private _completedIcon;
+    private _beforeValidation;
+    private _afterValidation;
+    constructor(label: string);
+    static make(label: string): Step;
+    schema(components: Component[]): this;
+    columns(columns?: Record<string, number> | number | null): this;
+    description(description: string | null): this;
+    icon(name: string | null): this;
+    completedIcon(name: string | null): this;
+    /** Runs before the step is validated, on "Next"; throw `Halt` to stay on the step. */
+    beforeValidation(callback: StepHook | null): this;
+    /** Runs after a successful validation, before moving to the next step; throw `Halt` to stay on the step. */
+    afterValidation(callback: StepHook | null): this;
+    getLabel(): string;
+    getDescription(): string | null;
+    getIcon(): string | null;
+    getCompletedIcon(): string | null;
+    callBeforeValidation(): Promise<void>;
+    callAfterValidation(): Promise<void>;
+    getChildSchemas(): Schema[];
+    toHtml(): Promise<string>;
+    /** Step panel: a `<form>` when the wizard has a submit handler (Enter goes to the next step, or saves on the last one). */
+    toStepHtml(submitHandler: string | null, hasHeader: boolean): Promise<string>;
+}
+/**
+ * Multi-step wizard: every step is rendered, the browser only shows the current one.
+ * "Next" validates the current step on the server before moving on, unless the wizard is `skippable()`.
+ */
+export declare class Wizard extends Component {
+    private steps;
+    private _label;
+    private _skippable;
+    private _startStep;
+    private _contained;
+    private _headerHidden;
+    private _cancelAction;
+    private _submitAction;
+    private _alpineSubmitHandler;
+    private _stepQueryStringKey;
+    private _modifyNext;
+    private _modifyPrevious;
+    constructor(steps?: Step[]);
+    static make(steps?: Step[]): Wizard;
+    schema(steps: Step[]): this;
+    label(label: string | null): this;
+    /** Steps can be visited in any order, without validation. */
+    skippable(condition?: boolean): this;
+    /** Step shown on open (1-based). */
+    startOnStep(step: number): this;
+    /** `false`: no card around the wizard (as on a resource page). */
+    contained(condition?: boolean): this;
+    hiddenHeader(condition?: boolean): this;
+    /** Action shown instead of "Back" on the first step. */
+    cancelAction(action: Action | null): this;
+    /** Action shown instead of "Next" on the last step. */
+    submitAction(action: Action | null): this;
+    /** Alpine expression run when the last step is submitted from the keyboard (e.g. `$wire.create()`). */
+    alpineSubmitHandler(handler: string | null): this;
+    /** Keeps the current step in the URL (`?step=…`). */
+    persistStepInQueryString(key?: string | null): this;
+    nextAction(modify: ((action: Action) => Action | void) | null): this;
+    previousAction(modify: ((action: Action) => Action | void) | null): this;
+    getKey(): string;
+    getExposedMethods(): string[];
+    /** "Next" re-renders the component so the step's validation errors show up. */
+    isRenderlessMethod(): boolean;
+    getChildSchemas(): Schema[];
+    private getSteps;
+    /** Called by the browser on "Next": validates the current step, then announces the next one. */
+    nextStep(currentStepIndex?: unknown, currentStepKey?: unknown): Promise<void>;
+    /** Going back happens in the browser; this exposed method is a no-op the front end still calls. */
+    previousStep(): void;
+    toHtml(): Promise<string>;
+}
+/** Temporary file received by the runtime (see @navette-js/wire). */
+export type TemporaryUpload = {
+    id: string;
+    path: string;
+    name: string;
+    type: string;
+    size: number;
+    extension: string;
+};
+export type UploadedFileInfo = {
+    name: string;
+    size: number;
+    type: string;
+    url: string;
+};
+/** Saved state item when the field does not store files itself (`storeFiles(false)`): an already saved file, or a temporary file to process. */
+export type FileUploadEntry = {
+    key: string;
+} | {
+    file: TemporaryUpload;
+};
+/** Where files go once the form is saved. */
+export interface FileStorage {
+    /** Stores a temporary file and returns its key (relative path). */
+    store(file: TemporaryUpload, directory: string | null): Promise<string>;
+    info(key: string): Promise<UploadedFileInfo | null>;
+}
+/** Local disk storage, served under a public URL. File names are random; the extension comes from the detected type. */
+export declare class LocalFileStorage implements FileStorage {
+    private root;
+    private baseUrl;
+    constructor(root: string, baseUrl: string);
+    private resolve;
+    store(file: TemporaryUpload, directory: string | null): Promise<string>;
+    info(key: string): Promise<UploadedFileInfo | null>;
+}
+/**
+ * File upload (FilePond).
+ * State: `{ <file key>: <stored key> | 'livewire-file:<temporary id>' }`. A stored key from the browser is only accepted
+ * if the record being edited already has it, so nobody can claim someone else's file.
+ */
+export declare class FileUpload extends Field {
+    /** Application-wide default storage. */
+    static storage: FileStorage | null;
+    private _multiple;
+    private _maxFiles;
+    private _maxSize;
+    private _reorderable;
+    private _acceptedFileTypes;
+    private _directory;
+    private _storeFiles;
+    private _storage;
+    private _getUploadedFileUsing;
+    static make(name: string): FileUpload;
+    multiple(condition?: boolean): this;
+    maxFiles(count: number | null): this;
+    /** Maximum file size, in kilobytes. */
+    maxSize(kilobytes: number | null): this;
+    reorderable(condition?: boolean): this;
+    /** Accepted MIME types (`image/jpeg`, `image/*`…), checked against the received file's content. */
+    acceptedFileTypes(types: string[] | null): this;
+    image(): this;
+    directory(directory: string | null): this;
+    storage(storage: FileStorage): this;
+    /** `false`: the field stores nothing itself; the data receives `FileUploadEntry` items for the adapter to process (media). */
+    storeFiles(condition?: boolean): this;
+    /** Info about an already saved file (name, size, type, URL), when it does not come from the storage. */
+    getUploadedFileUsing(resolver: (key: string, ctx: ComponentContext) => UploadedFileInfo | null | Promise<UploadedFileInfo | null>): this;
+    getDefaultState(): unknown;
+    hydrateState(value: unknown): unknown;
+    private get uploads();
+    private getStorage;
+    /** Sanitized state entries: safe file key, string value. */
+    private entries;
+    /** Stored keys the current record already owns: the only ones accepted back from the browser. */
+    private originalKeys;
+    private isTemporary;
+    getExposedMethods(): string[];
+    getUploadedFiles(): Promise<Record<string, UploadedFileInfo | null>>;
+    private writeState;
+    /** Removes a file from the field. A stored file is only deleted by the application when the form is saved. */
+    removeUploadedFile(fileKey: unknown): void;
+    deleteUploadedFile(fileKey: unknown): void;
+    reorderUploadedFiles(fileKeys: unknown): void;
+    getValidationRules(): Promise<Rule[]>;
+    /** Validates the whole state, even when empty (a required field without files must fail). */
+    validate(): Promise<string[]>;
+    /** On save: temporary files are stored, unrecognized existing keys are dropped. */
+    dehydrateState(): Promise<unknown>;
+    toHtml(): Promise<string>;
+}
+export {};