@theredhead — Frontend Library - v1.0.0
    Preparing search index...

    Class UIInput

    Thin wrapper around a native <input> or <textarea> element.

    Supports two-way binding via both text ([(text)]) and value ([(value)]).

    • text is the authoritative model — it holds the literal string displayed in the native element.
    • value is a derived model — it holds whatever the adapter makes of the text (or a plain copy when no adapter is set).

    Consumers that only use [(value)] (the pre-adapter API) continue to work without changes: when no adapter is set, text and value are kept in sync bidirectionally.

    Set multiline to true to render a <textarea> instead.

    <!-- backward-compatible: [(value)] still works as before -->
    <ui-input [(value)]="amount" placeholder="Enter amount" />

    <!-- with adapter: [(text)] for raw, [(value)] for processed -->
    <ui-input [adapter]="emailAdapter" [(text)]="email" [(value)]="normalized" />

    <!-- with popup adapter: suffix icon toggles a popup panel -->
    <ui-input [adapter]="dateAdapter" [(text)]="date" placeholder="yyyy-MM-dd" />

    <ui-input multiline [rows]="4" [(text)]="description" />

    Implements

    • OnDestroy
    Index

    Properties

    adapter ariaLabel disabled errors hasPopup heightAdjustable isPopupOpen multiline placeholder rows text type valid validation value

    Methods

    closePopup openPopup togglePopup

    Properties

    adapter: InputSignal<TextAdapter | undefined> = ...

    Optional adapter that transforms text → value and provides icons.

    ariaLabel: InputSignal<string | undefined> = ...

    Accessible label forwarded to the native element as aria-label.

    Required when no visible <label> is associated with the control.

    disabled: InputSignal<boolean> = ...

    Whether the control is disabled.

    errors: Signal<readonly string[]> = ...

    Validation error messages from the adapter.

    Empty when valid or when no adapter is set.

    hasPopup: Signal<boolean> = ...

    Whether the current adapter supports a popup panel.

    heightAdjustable: InputSignal<boolean> = ...

    Whether the multiline textarea can be vertically resized by the user via a drag handle. Only applies when multiline is true. Defaults to true.

    isPopupOpen: WritableSignal<boolean> = ...

    Whether the popup panel is currently open.

    multiline: InputSignal<boolean> = ...

    When true, renders a <textarea> instead of an <input>.

    placeholder: InputSignal<string> = ...

    Placeholder text.

    rows: InputSignal<number> = ...

    Number of visible text rows (only applies when multiline is true). Defaults to 3.

    Readonlytext

    text: ModelSignal<string> = ...

    Raw text displayed in the native element (two-way bindable).

    This is the authoritative model — it always holds the literal string shown in the control.

    type: InputSignal<
        "number"
        | "text"
        | "email"
        | "date"
        | "password"
        | "tel"
        | "url",
    > = ...

    Native input type (ignored when multiline is true).

    valid: Signal<boolean> = ...

    Whether the current text is valid according to the adapter.

    Always true when no adapter is set or the adapter does not implement validate.

    validation: Signal<TextAdapterValidationResult> = ...

    Validation result from the adapter's validate() method.

    Returns { valid: true, errors: [] } when no adapter is set or the adapter does not implement validate.

    value: ModelSignal<string> = ...

    Processed value derived from text through the adapter.

    When no adapter is set this mirrors text exactly, preserving full backward compatibility with consumers that use [(value)].

    Two-way bindable via [(value)].

    Methods

    • Close the popup panel and destroy the component.

      Returns void

    • Open the popup panel.

      Returns void

    • Toggle the popup open/closed.

      Returns void

    Settings

    Member Visibility

    On This Page

    Properties
    Methods