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

    Class UISelectTool

    A toolbar value picker — the trigger label updates to show the currently selected value, and the selection persists in the value model.

    When to use UISelectTool vs UIDropdownTool:

    UISelectTool UIDropdownTool
    Purpose Choose a value Execute a command
    Trigger label Updates to show current value Always fixed (e.g. "Insert")
    Persistent state value model holds the selection None — emits an action
    Analogy <select> element Menu button / split button

    Use UISelectTool when the user needs to pick a value that stays selected (e.g. font size, colour mode, zoom level). Use UIDropdownTool for command lists where the trigger label never changes and no value is retained (e.g. an "Insert" menu).

    After a selection, the new value is available via (itemRef as UISelectTool).value() in the toolAction handler.

    <ui-toolbar (toolAction)="onAction($event)">
      <ui-select-tool
        id="font-size"
        label="Size"
        [options]="fontSizeOptions"
        [(value)]="fontSize"
      />
    </ui-toolbar>

    Hierarchy (View Summary)

    Index

    Constructors

    constructor

    Properties

    ariaLabel disabled icon id itemAction label options tooltip value

    Methods

    deactivate emitAction

    Constructors

    Properties

    ariaLabel: InputSignal<string> = ...

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

    disabled: InputSignal<boolean> = ...

    Whether this item is disabled.

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

    SVG inner-content string for an optional icon (use UIIcons.Lucide.*).

    id: InputSignal<string> = ...

    Unique identifier for this toolbar item.

    itemAction: OutputEmitterRef<ToolActionEvent> = ...

    Emitted when the user triggers an action on this item.

    label: InputSignal<string> = ...

    Human-readable label shown in the tool.

    options: InputSignal<SelectOption[]> = ...

    Available select options.

    tooltip: InputSignal<string> = ...

    Tooltip text shown on pointer hover.

    value: ModelSignal<string> = ...

    Currently selected value (two-way bindable).

    Methods

    • Deactivate (un-check / un-press) this item.

      No-op by default. Overridden by UIToggleTool to set checked to false, enabling radio-style exclusivity in UIToggleGroupTool.

      Returns void

    • Emit a ToolActionEvent for this item.

      Parameters

      • event: MouseEvent | null

        The originating mouse event, or null for programmatic triggers.

      Returns void

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Methods