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

    Class UIToggle

    A toggle switch with customisable on/off labels.

    Provides a two-way value binding and optional text labels that appear beside (or inside) the switch track, giving users clear feedback about what each state represents.

    <!-- Simple on/off toggle -->
    <ui-toggle [(value)]="isEnabled" />

    <!-- With custom labels -->
    <ui-toggle [(value)]="mode"
      onLabel="Dark" offLabel="Light" />

    <!-- With projected label -->
    <ui-toggle [(value)]="notifications">
      Enable notifications
    </ui-toggle>
    Index

    Constructors

    constructor

    Properties

    activeLabel ariaLabel disabled hasTrackLabels offLabel onLabel size value valueChange

    Methods

    toggle

    Constructors

    Properties

    activeLabel: Signal<string> = ...

    The currently active label text.

    ariaLabel: InputSignal<string> = ...

    Accessible label forwarded to aria-label.

    disabled: InputSignal<boolean> = ...

    Whether the toggle is disabled.

    hasTrackLabels: Signal<boolean> = ...

    Whether on/off track labels are configured.

    offLabel: InputSignal<string> = ...

    Label displayed when the toggle is off.

    onLabel: InputSignal<string> = ...

    Label displayed when the toggle is on.

    size: InputSignal<ToggleSize> = ...

    Size variant.

    value: ModelSignal<boolean> = ...

    Whether the toggle is on. Supports two-way binding via [(value)].

    valueChange: OutputEmitterRef<boolean> = ...

    Emitted when the value changes.

    Methods

    • Toggle the value on user interaction.

      Returns void

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Methods