@webority/ui-react 0.80.3 → 0.80.5

package/dist/types/components/AppInput.d.ts

@@ -1,79 +1,35 @@
-/**
- * The shared text field — wraps react-bootstrap Form.Group / Form.Label / Form.Control.
- * Visual chrome is Bootstrap `.form-control` (theme `$input-*` + one post-CSS skin);
- * `.input` is an alias on the same element for size/shell hooks (`.input-sm`,
- * `.input-icon`, …), not a second look. Shells: unit, password reveal, leading icon,
- * trailing action.
- *
- * Forwards `ref` to the underlying control, so react-hook-form's spread `{...register("name")}`
- * works unchanged, as does a controlled `value`/`onChange` pair.
- *
- * @param {object} props
- * @param {import('react').ReactNode} [props.label]
- * @param {boolean} [props.required=false]
- * @param {string} [props.error]
- * @param {string} [props.hint]
- * @param {import('react').ReactNode} [props.help] Content for the label info-tip (decoupled:
- *   the caller supplies the node; a glossary-backed app wraps its lookup here).
- * @param {string} [props.helpLabel="More information"] aria-label for the info-tip button.
- * @param {string} [props.type="text"]
- * @param {"sm"|"md"|"lg"} [props.size="md"] Control size — sm/lg opt out of the shared height.
- * @param {string} [props.leftIcon] Icon name
- * @param {string} [props.rightIcon] Icon name
- * @param {() => void} [props.onRightIconClick]
- * @param {string} [props.rightIconLabel] Accessible name for the right-icon button. Defaults to
- *   the icon name, which is a poor label but not an absent one.
- * @param {string} [props.unit]
- * @param {string} [props.id]
- * @param {string} [props.name]
- * @param {string} [props.className]
- * @param {string} [props.fieldClassName]
- * @param {boolean} [props.disabled=false]
- * @param {boolean} [props.clearable=false] Show an ✕ button while the field has a value.
- * @param {boolean} [props.showCount=false] Show a live `count / maxLength` under the field.
- * @param {number} [props.maxLength] Character cap; the count turns red as it is approached.
- * @param {import('react').ReactNode} [props.prefix] A bordered box before the input (e.g. ₹, https://).
- * @param {import('react').ReactNode} [props.suffix] A bordered box after the input (e.g. .00, .com).
- * @param {import('react').ReactNode} [props.action] A control rendered BESIDE the field, outside its
- *   border — a labelled action button (verify, apply, send code), or a confirmation once the field
- *   is resolved. The field flexes to fill the row; the action keeps its natural width. Exclusive
- *   with the in-field shells (unit / password / affix / trailing icon); pairs with a leading icon.
- * @param {boolean|"above"} [props.floatingLabel=false] Label sits inside as a placeholder, then slides
- *   up on focus/fill. `true` rests it on the top border; `"above"` rests it above the box at the
- *   top-left, clear of the border. Opt-in variant; standalone only (no icon/unit/prefix in the same field).
- * @param {"bare"} [props.variant] Borderless variant — no border/background, inherits the
- *   container's chrome (inline-rename, ⌘K).
- * @param {boolean|object} [props.passwordRequirements=false] Only honoured when `type="password"`.
- *   Pass `true` for the default policy (≥10 chars, upper, lower, digit, special), or an object to
- *   configure it — `{ minLength, uppercase, lowercase, digit, special, uniqueChars, customRules, title }`.
- *   `customRules` is a list of `{ label, pattern }` for a product's own rules (such as no spaces): a rule
- *   ticks when the regular expression `pattern` (a JavaScript RegExp source string) matches. Shows
- *   a live "Password requirements" checklist on focus that ticks each rule green as the user types
- *   (client-side, before any server validation). The rule set is the one shared with Razor via
- *   `@webority/ui-elements`, so both surfaces validate identically.
- * @param {"auto"|"top"|"bottom"|"start"|"end"|"inline"} [props.requirementsPlacement="auto"] Which side
- *   the requirements popover opens; `auto` flips to stay in view. `inline` has no popover: the checklist
- *   sits under the input, always visible, in place of the hint.
- * @param {string} [props.mask] Format the value while it is typed. A named mask
- *   (`phone-in`, `pan`, `gstin`, `aadhaar`, `ifsc`, `pin-code`, `date` as DD-MM-YYYY, `amount` with
- *   Indian grouping) or a pattern, where `9` is a digit, `A` a letter, `*` a digit or letter and any
- *   other character a literal (`"(999) 999-9999"`). Paste is cleaned and re-formatted, Backspace and
- *   Delete step over literals, and the caret stays put; a keyboard that composes text (an Android IME) is
- *   left alone until it commits, and a value set from code (react-hook-form `setValue` / `reset`) is
- *   laid out too. The behaviour is the one `<app-input mask>` runs, from `@webority/ui-elements`. Use
- *   it on a `text`, `tel`, `search`, `url` or `password` field; any other `type` warns, and an unknown
- *   mask name warns. A controlled `value` (raw or formatted) is laid out under the mask. `onChange`
- *   and `onBlur` get an event whose `target.value` is the POSTED value (the raw characters, or ISO
- *   `yyyy-MM-dd` for `date`), so a controlled field and a zod rule see what the server will see;
- *   `onInput` sees the field as displayed. react-hook-form's `register` reads the element itself, so
- *   pair it with `setValueAs: (v) => postedMasked(mask, v)`. A named mask also marks the field invalid
- *   with a curated message while it is incomplete or wrong, shown as the field's error once the field
- *   has been left or a submit was tried (an `error` you pass wins).
- * @param {boolean} [props.postFormatted=false] With a `mask`, a native form submit posts the
- *   formatted value instead of the raw one (the typed characters without the literals).
- * @param {(raw: string, formatted: string) => void} [props.onMaskChange] Called with the raw and the
- *   formatted value whenever the raw value changes.
- * @param {import('react').Ref<HTMLInputElement>} [ref]
- */
-declare const AppInput: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
+declare const AppInput: import("react").ForwardRefExoticComponent<{
+    label?: import('react').ReactNode;
+    required?: boolean;
+    error?: string;
+    hint?: string;
+    placeholder?: string;
+    help?: import('react').ReactNode;
+    helpLabel?: string;
+    type?: string;
+    size?: "sm" | "md" | "lg";
+    leftIcon?: string;
+    rightIcon?: string;
+    onRightIconClick?: () => void;
+    rightIconLabel?: string;
+    unit?: string;
+    id?: string;
+    name?: string;
+    className?: string;
+    fieldClassName?: string;
+    disabled?: boolean;
+    clearable?: boolean;
+    showCount?: boolean;
+    maxLength?: number;
+    prefix?: import('react').ReactNode;
+    suffix?: import('react').ReactNode;
+    action?: import('react').ReactNode;
+    floatingLabel?: boolean | "above";
+    variant?: "bare";
+    passwordRequirements?: boolean | object;
+    requirementsPlacement?: "auto" | "top" | "bottom" | "start" | "end" | "inline";
+    mask?: string;
+    postFormatted?: boolean;
+    onMaskChange?: (raw: string, formatted: string) => void;
+} & import("react").RefAttributes<HTMLInputElement>>;
 export default AppInput;

package/dist/types/components/AppMentionInput.d.ts

@@ -1,41 +1,41 @@
 import "@webority/ui-elements/elements/mention-input";
-/**
- * A text box where "@" opens a list of people to mention. Up and Down choose, Enter or Tab
- * mention, Escape closes the list; the person reads "@Asha Rao" in the text. Typing inside a
- * mention turns it back into plain text, and Backspace just after one removes it whole.
- *
- * The value is plain text with each mention stored as `@[Asha Rao](u-12)`: never HTML, so it can
- * be saved and shown anywhere without escaping worries. Show a saved value with `AppCommentThread`,
- * or read it with `parseMentionValue` and `mentionedIds` from `@webority/ui-elements/elements/mention-input`
- * (the server's twin is `MentionText` in Webority.Ui.Razor).
- *
- * Wraps the shared `<wui-mention-input>` element; Razor `<app-mention-input>` renders the same box.
- *
- * @param {object} props
- * @param {string} [props.value] The stored value (`Thanks @[Asha Rao](u-12)`).
- * @param {(value: string, meta: { mentions: { id: string, label: string }[] }) => void} [props.onChange]
- *   Called on every edit with the stored value and the people it mentions, each once.
- * @param {{ value: string, label: string, description?: string, src?: string }[]} [props.people]
- *   The people to offer. `value` is the person's public id (letters, digits, `_ . : -`).
- * @param {(query: string, opts?: { signal?: AbortSignal }) => Promise<{ value: string, label: string, description?: string, src?: string }[]>} [props.loadPeople]
- *   Look people up as the person types after "@" (instead of `people`).
- * @param {number} [props.minChars=1] How many letters after "@" before `loadPeople` runs.
- * @param {number} [props.debounce=250] Milliseconds to wait for typing to pause before `loadPeople` runs.
- * @param {() => void} [props.onSubmit] Ctrl or Cmd+Enter in the box (send a comment).
- * @param {number} [props.rows=3] Visible lines.
- * @param {string} [props.placeholder]
- * @param {boolean} [props.disabled=false]
- * @param {string} [props.name] Posts the stored value under this name in a form.
- * @param {string} [props.id] The element's id; the text box is `{id}-text`, the label's target.
- * @param {import('react').ReactNode} [props.label] Shown above the box; a string also names it.
- * @param {string} [props.error]
- * @param {string} [props.hint]
- * @param {boolean} [props.required=false]
- * @param {import('react').ReactNode} [props.help] Help content in an info tip beside the label.
- * @param {string} [props.helpLabel="More information"] Accessible name for that info tip.
- * @param {string} [props.className] Extra classes on the element.
- * @param {string} [props.fieldClassName] Extra classes on the field wrapper.
- * @param {import('react').Ref<HTMLElement>} [ref] The `<wui-mention-input>` element.
- */
-declare const AppMentionInput: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
+declare const AppMentionInput: import("react").ForwardRefExoticComponent<{
+    value?: string;
+    onChange?: (value: string, meta: {
+        mentions: {
+            id: string;
+            label: string;
+        }[];
+    }) => void;
+    people?: {
+        value: string;
+        label: string;
+        description?: string;
+        src?: string;
+    }[];
+    loadPeople?: (query: string, opts?: {
+        signal?: AbortSignal;
+    }) => Promise<{
+        value: string;
+        label: string;
+        description?: string;
+        src?: string;
+    }[]>;
+    minChars?: number;
+    debounce?: number;
+    onSubmit?: () => void;
+    rows?: number;
+    placeholder?: string;
+    disabled?: boolean;
+    name?: string;
+    id?: string;
+    label?: import('react').ReactNode;
+    error?: string;
+    hint?: string;
+    required?: boolean;
+    help?: import('react').ReactNode;
+    helpLabel?: string;
+    className?: string;
+    fieldClassName?: string;
+} & import("react").RefAttributes<HTMLElement>>;
 export default AppMentionInput;

package/dist/types/components/AppMultiSelect.d.ts

@@ -1,52 +1,35 @@
 import "@webority/ui-elements/elements/multiselect";
-/**
- * Multi-value select over the shared `<wui-multiselect>` element. The control shows each
- * chosen value as a removable `.chip`; the dropdown is a searchable checklist.
- *
- * Options may be rich rows: `description` is a secondary line under the label (also matched
- * by the search), `avatar` an image URL and `initials` the face shown without (or under) it,
- * and `disabled` keeps a row visible but unselectable with `disabledHint` beside it
- * (e.g. "Already added").
- *
- * `allowCustom` turns the control into free entry: an inline text input after the chips
- * filters the list, and Enter / comma / blur / a pasted list commit whatever was typed as its
- * own chip (value = label = the text). Typed text is checked against `customPattern` then
- * `validateCustom`; a refusal keeps the text and shows the message under the control. Chips are
- * de-duplicated ignoring case. The in-menu search box is not shown in this mode.
- *
- * @param {object} props
- * @param {string[]} [props.values] Selected option values.
- * @param {(values: string[]) => void} [props.onChange]
- * @param {Array<{ value: string, label: import('react').ReactNode, description?: string, avatar?: string, initials?: string, disabled?: boolean, disabledHint?: string }>} [props.options]
- *   The choices. A label may be a node (`<>CO<sub>2</sub></>`): it renders as static markup in the
- *   menu and on the chosen chip, and search, typeahead and the accessible names (the option and the
- *   chip's remove button) use its text.
- * @param {string} [props.placeholder]
- * @param {string} [props.searchPlaceholder] Placeholder for the in-menu search box.
- * @param {boolean} [props.searchable=true] Ignored under `allowCustom`, whose inline input is the search.
- * @param {boolean} [props.allowCustom=false] Accept typed entries that are not options.
- * @param {(value: string) => boolean | string} [props.validateCustom] Checks a typed entry:
- *   `true` accepts, a string refuses with that message, anything else refuses with
- *   `customInvalidMessage`. Runs after `customPattern`.
- * @param {string} [props.customPattern] Regular expression a typed entry must match in full
- *   (anchored like the HTML `pattern` attribute).
- * @param {string} [props.customInvalidMessage] Message for a refused typed entry
- *   (default "Enter a valid value.").
- * @param {boolean} [props.disabled]
- * @param {string} [props.icon] Leading glyph inside the control (a library icon name).
- * @param {'sm'|'lg'} [props.size] Control size around the default.
- * @param {boolean} [props.collapseChips=false] Keep the chosen chips on one row and fold the
- *   overflow into a "+N" counter, rather than letting the control grow.
- * @param {string} [props.name]
- * @param {string} [props.id] DOM id for the control and the label's `for` target.
- * @param {import('react').ReactNode} [props.label]
- * @param {string} [props.error]
- * @param {string} [props.hint]
- * @param {boolean} [props.required]
- * @param {import('react').ReactNode} [props.help] Help content shown in an info tip beside the label.
- * @param {string} [props.helpLabel="More information"] Accessible name for that info tip.
- * @param {string} [props.fieldClassName]
- * @param {import('react').Ref<HTMLElement>} [ref]
- */
-declare const AppMultiSelect: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
+declare const AppMultiSelect: import("react").ForwardRefExoticComponent<{
+    values?: string[];
+    onChange?: (values: string[]) => void;
+    options?: Array<{
+        value: string;
+        label: import('react').ReactNode;
+        description?: string;
+        avatar?: string;
+        initials?: string;
+        disabled?: boolean;
+        disabledHint?: string;
+    }>;
+    placeholder?: string;
+    searchPlaceholder?: string;
+    searchable?: boolean;
+    allowCustom?: boolean;
+    validateCustom?: (value: string) => boolean | string;
+    customPattern?: string;
+    customInvalidMessage?: string;
+    disabled?: boolean;
+    icon?: string;
+    size?: 'sm' | 'lg';
+    collapseChips?: boolean;
+    name?: string;
+    id?: string;
+    label?: import('react').ReactNode;
+    error?: string;
+    hint?: string;
+    required?: boolean;
+    help?: import('react').ReactNode;
+    helpLabel?: string;
+    fieldClassName?: string;
+} & import("react").RefAttributes<HTMLElement>>;
 export default AppMultiSelect;

package/dist/types/components/AppNumberInput.d.ts

@@ -1,43 +1,23 @@
-/**
- * Numeric field with ±/step stepper buttons, min/max clamping, and precision rounding.
- * Mirrors the AppInput field-shell pattern (label/error/hint/required/aria wiring) exactly.
- *
- * Forwards `ref` to the underlying input. `onChange` is called with a **number** (or `''`),
- * not a DOM event — react-hook-form's plain `{...register('x')}` spread expects an event and
- * will not work here. Wire it with `<Controller name="x" render={({ field }) => (
- * <AppNumberInput value={field.value} onChange={field.onChange} />
- * )} />` instead.
- *
- * Behavior:
- * - Displays as a text input (inputmode decimal when precision > 0, numeric otherwise)
- * - Stepper buttons (−/+) increment/decrement by step, clamped to min/max
- * - Typing free text: emits parsed number on change; '' on blur if unparsable or empty
- * - Keyboard ArrowUp/ArrowDown increment/decrement (respects step and bounds)
- * - Rounding to the specified precision
- * - Buttons disabled at min/max or when the control is disabled
- *
- * @param {object} props
- * @param {number|''} [props.value]
- * @param {(next: number|'') => void} [props.onChange]
- * @param {import('react').ReactNode} [props.label]
- * @param {boolean} [props.required=false]
- * @param {string} [props.error]
- * @param {string} [props.hint]
- * @param {import('react').ReactNode} [props.help] Content for the label info-tip (decoupled:
- *   the caller supplies the node; a glossary-backed app wraps its lookup here). Mirrors AppInput.
- * @param {string} [props.helpLabel="More information"] aria-label for the info-tip button.
- * @param {number} [props.min] Minimum value (inclusive)
- * @param {number} [props.max] Maximum value (inclusive)
- * @param {number} [props.step=1] Increment by this amount
- * @param {number} [props.precision=0] Number of decimal places to round to
- * @param {string} [props.unit] Unit suffix displayed inside the field (e.g. "kg", "°C")
- * @param {string} [props.size="md"] Control size — sm/md/lg
- * @param {string} [props.id]
- * @param {string} [props.name]
- * @param {string} [props.className]
- * @param {string} [props.fieldClassName]
- * @param {boolean} [props.disabled=false]
- * @param {import('react').Ref<HTMLInputElement>} [ref]
- */
-declare const AppNumberInput: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
+declare const AppNumberInput: import("react").ForwardRefExoticComponent<{
+    value?: number | '';
+    onChange?: (next: number | '') => void;
+    label?: import('react').ReactNode;
+    required?: boolean;
+    error?: string;
+    hint?: string;
+    placeholder?: string;
+    help?: import('react').ReactNode;
+    helpLabel?: string;
+    min?: number;
+    max?: number;
+    step?: number;
+    precision?: number;
+    unit?: string;
+    size?: string;
+    id?: string;
+    name?: string;
+    className?: string;
+    fieldClassName?: string;
+    disabled?: boolean;
+} & import("react").RefAttributes<HTMLInputElement>>;
 export default AppNumberInput;

package/dist/types/components/AppOtpInput.d.ts

@@ -1,48 +1,18 @@
 import "@webority/ui-elements/elements/otp";
-/**
- * Code entry — MFA, email/phone verification, backup codes. Thin React wrapper over the
- * shared `<wui-otp>` element, in the standard `.field` shell.
- *
- * It is ONE input with the segment boxes drawn underneath, not N inputs. That is what makes
- * OS autofill work (iOS/Android hand an SMS code to the focused field, whole — six inputs
- * get all six digits in box one or just the first, depending on version) and what makes a
- * screen reader announce one labelled field instead of six unlabelled boxes. Paste is not a
- * special case for the same reason.
- *
- * Scope is the INPUT, not the screen: resend timers, "didn't get a code" copy, masked
- * destination text, lockout after N attempts and where to go on success are all product
- * decisions and stay in the product.
- *
- * @param {object} props
- * @param {string} [props.value]
- * @param {(value: string) => void} [props.onChange]
- * @param {(value: string) => void} [props.onComplete] Fires once, when the last character
- *   lands — so a form can submit itself without polling the value.
- *
- *   It receives the CODE, not a DOM event. With react-hook-form that matters:
- *   `onComplete={handleSubmit(onSubmit)}` hands a string to a handler that expects an event
- *   and calls `preventDefault` on it. RHF v7 guards against it so the short form happens to
- *   work — by accident, and not something to rely on. Wrap it instead:
- *
- *   ```jsx
- *   <AppOtpInput onComplete={() => handleSubmit(onSubmit)()} />
- *   ```
- *
- *   The component is also CONTROLLED, so with RHF it wants `<Controller>` rather than
- *   `register`.
- * @param {number} [props.length=6] Characters in the code. TOTP is 6; backup codes are often 8.
- * @param {"numeric"|"alphanumeric"} [props.mode="numeric"] Drives the on-screen keyboard and
- *   what the field will accept.
- * @param {string} [props.label]
- * @param {boolean} [props.required=false]
- * @param {string} [props.hint]
- * @param {string} [props.error]
- * @param {boolean} [props.disabled=false]
- * @param {string} [props.name]
- * @param {string} [props.id]
- * @param {string} [props.className] Class to apply to the control element.
- * @param {string} [props.fieldClassName] Class to apply to the wrapper field div.
- * @param {import('react').Ref<HTMLElement>} [ref]
- */
-declare const AppOtpInput: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
+declare const AppOtpInput: import("react").ForwardRefExoticComponent<{
+    value?: string;
+    onChange?: (value: string) => void;
+    onComplete?: (value: string) => void;
+    length?: number;
+    mode?: "numeric" | "alphanumeric";
+    label?: string;
+    required?: boolean;
+    hint?: string;
+    error?: string;
+    disabled?: boolean;
+    name?: string;
+    id?: string;
+    className?: string;
+    fieldClassName?: string;
+} & import("react").RefAttributes<HTMLElement>>;
 export default AppOtpInput;

package/dist/types/components/AppPhoneNumberInput.d.ts

@@ -1,3 +1,19 @@
 import "@webority/ui-elements/elements/phone";
-declare const AppPhoneNumberInput: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
+declare const AppPhoneNumberInput: import("react").ForwardRefExoticComponent<{
+    value?: string;
+    onChange?: (value: string) => void;
+    country?: string;
+    disabled?: boolean;
+    name?: string;
+    id?: string;
+    label?: import('react').ReactNode;
+    placeholder?: string;
+    required?: boolean;
+    hint?: string;
+    error?: string;
+    showFlag?: boolean;
+    showDialCode?: boolean;
+    size?: "sm" | "md" | "lg";
+    fieldClassName?: string;
+} & import("react").RefAttributes<any>>;
 export default AppPhoneNumberInput;

package/dist/types/components/AppRadio.d.ts

@@ -1,19 +1,9 @@
-/**
- * Shared radio on the Bootstrap `.form-check` markup — the same structure the
- * Razor <app-radio> emits, so both surfaces render identically.
- *
- * The label is bound to the input with id/htmlFor rather than react-bootstrap's
- * `label` prop: that rendered a <label> with no `for`, so clicking the text did
- * nothing and screen readers never announced the name.
- *
- * @param {object} props
- * @param {import('react').ReactNode} [props.label]
- * @param {string} [props.id]
- * @param {string} [props.name]
- * @param {string} [props.error] Error message, rendered below the control. Replaces the hint.
- * @param {string} [props.hint] Helper text below the control. Hidden while an error is shown.
- * @param {string} [props.className]
- * @param {import('react').Ref<HTMLInputElement>} [ref]
- */
-declare const AppRadio: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
+declare const AppRadio: import("react").ForwardRefExoticComponent<{
+    label?: import('react').ReactNode;
+    id?: string;
+    name?: string;
+    error?: string;
+    hint?: string;
+    className?: string;
+} & import("react").RefAttributes<HTMLInputElement>>;
 export default AppRadio;

package/dist/types/components/AppRichText.d.ts

@@ -1,42 +1,20 @@
-/**
- * A formatted-text field: a toolbar (bold, italic, inline code, link, headings, lists, quote, code
- * block, undo, redo) over an editable surface, with the usual keyboard shortcuts. The field is the
- * shared `<wui-rich-text>` element, the same one the Razor `<app-rich-text>` uses, with its editing
- * engine loaded the first time an editor mounts: a page without one never downloads it.
- *
- * The value is a string in `format`, HTML by default or Markdown. It is always written out from a
- * fixed set of allowed content (paragraphs, bold, italic, inline code, links, two heading levels,
- * lists, quotes, code blocks), so pasted or seeded markup outside that set never reaches the value:
- * a pasted script, style, class or table has nowhere to land. A link may point at http, https,
- * mailto or tel only. An empty editor is the empty string. Still sanitise on the server: the
- * browser is not a trust boundary.
- *
- * ```jsx
- * <AppRichText label="Notes" value={notes} onChange={setNotes} hint="Shown on the invoice." />
- * ```
- *
- * `onChange` fires on every edit with the new string. `format` is read when the editor mounts; the
- * wrapper remounts the editor when it changes, so the value you hold must be in the new format.
- *
- * @param {object} props
- * @param {string} [props.value] The content, in `format`.
- * @param {(value: string) => void} [props.onChange] Called with the new string on every edit.
- * @param {'html'|'markdown'} [props.format='html'] What `value` is.
- * @param {string} [props.placeholder] Shown while the editor is empty.
- * @param {string} [props.name] Posted under this name with a form.
- * @param {import('react').ReactNode} [props.label]
- * @param {string} [props.error]
- * @param {string} [props.hint]
- * @param {boolean} [props.required=false] Marks the field required; an empty editor is invalid.
- * @param {boolean} [props.disabled=false] Locks the editor and keeps it out of the form post.
- * @param {boolean} [props.readOnly=false] Locks the editor; the value still posts.
- * @param {string} [props.id]
- * @param {string} [props.ariaLabel] Accessible name for the editor; defaults to a string `label`.
- * @param {string} [props.className] Class on the `<wui-rich-text>` element.
- * @param {string} [props.fieldClassName] Class on the wrapper field div.
- * @param {import('react').ReactNode} [props.help] Help content shown in an info tip beside the label.
- * @param {string} [props.helpLabel="More information"] Accessible name for that info tip.
- * @param {import('react').Ref<HTMLElement>} [ref] The `<wui-rich-text>` element.
- */
-declare const AppRichText: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
+declare const AppRichText: import("react").ForwardRefExoticComponent<{
+    value?: string;
+    onChange?: (value: string) => void;
+    format?: 'html' | 'markdown';
+    placeholder?: string;
+    name?: string;
+    label?: import('react').ReactNode;
+    error?: string;
+    hint?: string;
+    required?: boolean;
+    disabled?: boolean;
+    readOnly?: boolean;
+    id?: string;
+    ariaLabel?: string;
+    className?: string;
+    fieldClassName?: string;
+    help?: import('react').ReactNode;
+    helpLabel?: string;
+} & import("react").RefAttributes<HTMLElement>>;
 export default AppRichText;

package/dist/types/components/AppSelect.d.ts

@@ -1,14 +1,14 @@
 import "@webority/ui-elements/elements/select";
-/**
- * @param {object} props
- * @param {Array<{ value: string, label?: import('react').ReactNode, text?: string, icon?: string }>} [props.options]
- *   The choices. A label may be a node (`<>LPZ 0<sub>B</sub></>`): it renders as static markup in
- *   the list and the value, and search and the option's accessible name use its text.
- * @param {string} [props.className] Class to apply to the control element.
- * @param {string} [props.fieldClassName] Class to apply to the wrapper field div.
- * @param {import('react').ReactNode} [props.prefix] A bordered box before the select (e.g. "+91", "Tag"),
- *   the same shell as AppInput's prefix. Not combined with floatingLabel.
- * @param {import('react').ReactNode} [props.suffix] A bordered box after the select, as AppInput's suffix.
- */
-declare const AppSelect: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
+declare const AppSelect: import("react").ForwardRefExoticComponent<{
+    options?: Array<{
+        value: string;
+        label?: import('react').ReactNode;
+        text?: string;
+        icon?: string;
+    }>;
+    className?: string;
+    fieldClassName?: string;
+    prefix?: import('react').ReactNode;
+    suffix?: import('react').ReactNode;
+} & import("react").RefAttributes<any>>;
 export default AppSelect;

package/dist/types/components/AppSlider.d.ts

@@ -1,38 +1,30 @@
 import "@webority/ui-elements/elements/slider";
-/**
- * Thin React wrapper over the shared `<wui-slider>` element (single or dual-thumb slider).
- *
- * Single-thumb mode (default): `value` + `onChange` with string value.
- * Dual-thumb mode (range): `start`/`end` + `onChange` callback receives `{ start, end }`.
- *
- * Wraps it in the standard `.field` shell — label / required mark / hint / error.
- * The shell is omitted entirely when there is nothing to render around the control.
- *
- * @param {object} props
- * @param {number} [props.value]                    Current value (single mode)
- * @param {number} [props.start]                    Range start (range mode)
- * @param {number} [props.end]                      Range end (range mode)
- * @param {boolean} [props.range]                   Enables dual-thumb range mode
- * @param {(value: number|{start, end}) => void} [props.onChange]
- * @param {number} [props.min=0]
- * @param {number} [props.max=100]
- * @param {number} [props.step=1]
- * @param {string} [props.label]
- * @param {boolean} [props.required]
- * @param {string} [props.hint]
- * @param {string} [props.error]
- * @param {string} [props.name]                     Form field name (single mode)
- * @param {string} [props.startName]                Form field name for range start
- * @param {string} [props.endName]                  Form field name for range end
- * @param {boolean} [props.disabled]
- * @param {'sm'|'md'|'lg'} [props.size]             Control size tier
- * @param {boolean} [props.showValue]               Shows a label with current value(s)
- * @param {string} [props.unit]                     Suffix for the value label (e.g. '%')
- * @param {string} [props.id]
- * @param {string} [props.ariaLabel]
- * @param {string} [props.className] Class to apply to the control element.
- * @param {string} [props.fieldClassName] Class to apply to the wrapper field div.
- * @param {import('react').Ref<HTMLElement>} [ref]
- */
-declare const AppSlider: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
+declare const AppSlider: import("react").ForwardRefExoticComponent<{
+    value?: number;
+    start?: number;
+    end?: number;
+    range?: boolean;
+    onChange?: (value: number | {
+        start: any;
+        end: any;
+    }) => void;
+    min?: number;
+    max?: number;
+    step?: number;
+    label?: string;
+    required?: boolean;
+    hint?: string;
+    error?: string;
+    name?: string;
+    startName?: string;
+    endName?: string;
+    disabled?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+    showValue?: boolean;
+    unit?: string;
+    id?: string;
+    ariaLabel?: string;
+    className?: string;
+    fieldClassName?: string;
+} & import("react").RefAttributes<HTMLElement>>;
 export default AppSlider;