Class ToolbarWidgetPattern

src/aria/private/toolbar/toolbar-widget.ts:26–66

}

export class ToolbarWidgetPattern<V> implements ListItem<V> {
  /** A unique identifier for the widget. */
  readonly id = () => this.inputs.id();

  /** The html element that should receive focus. */
  readonly element = () => this.inputs.element();

  /** Whether the widget is disabled. */
  readonly disabled = () => this.inputs.disabled() || this.group()?.disabled() || false;

  /** A reference to the parent toolbar. */
  readonly group = () => this.inputs.group();

  /** A reference to the toolbar containing the widget. */
  readonly toolbar = () => this.inputs.toolbar();

  /** The tabindex of the widget. */
  readonly tabIndex = computed(() => this.toolbar().listBehavior.getItemTabindex(this));

  /** The text used by the typeahead search. */
  readonly searchTerm = () => ''; // Unused because toolbar does not support typeahead.

  /** The value associated with the widget. */
  readonly value = () => this.inputs.value();

  /** Whether the widget is selectable. */
  readonly selectable = () => true; // Unused because toolbar does not support selection.

  /** The position of the widget within the toolbar. */
  readonly index = computed(() => this.toolbar().inputs.items().indexOf(this) ?? -1);

  /** Whether the widget is selected (only relevant in a selection group). */
  readonly selected = computed(() =>
    this.toolbar().listBehavior.inputs.value().includes(this.value()),
  );

  /** Whether the widget is currently the active one (focused). */
  readonly active: SignalLike<boolean> = computed(() => this.toolbar().activeItem() === this);

  constructor(readonly inputs: ToolbarWidgetInputs<V>) {}
}