Class MenuItemPattern

src/aria/private/menu/menu.ts:759–866

/** The menu item ui pattern class. */
export class MenuItemPattern<V> implements ListItem<V> {
  /** The value of the menu item. */
  readonly value: SignalLike<V>;

  /** The unique ID of the menu item. */
  readonly id: SignalLike<string>;

  /** Whether the menu item is disabled. */
  readonly disabled = () => this.inputs.parent()?.disabled() || this.inputs.disabled();

  /** The search term for the menu item. */
  readonly searchTerm: SignalLike<string>;

  /** The element of the menu item. */
  readonly element: SignalLike<HTMLElement | undefined>;

  /** Whether the menu item is active. */
  readonly active = computed(() => this.inputs.parent()?.inputs.activeItem() === this);

  /** Whether the menu item has received interaction. */
  readonly hasBeenInteracted = signal(false);

  /** The tab index of the menu item. */
  readonly tabIndex = computed(() => {
    if (this.submenu() && this.submenu()?.inputs.activeItem()) {
      return -1;
    }
    return this.inputs.parent()?.listBehavior.getItemTabindex(this) ?? -1;
  });

  /** The position of the menu item in the menu. */
  readonly index = computed(() => this.inputs.parent()?.inputs.items().indexOf(this) ?? -1);

  /** Whether the menu item is expanded. */
  readonly expanded = computed(() => (this.submenu() ? this._expanded() : null));

  /** Whether the menu item is expanded. */
  readonly _expanded = signal(false);

  /** The ID of the menu that the menu item controls. */
  readonly controls = signal<string | undefined>(undefined);

  /** The role of the menu item. */
  readonly role = () => this.inputs.role();

  /** Whether the menu item has a popup. */
  readonly hasPopup = computed(() => !!this.submenu());

  /** The submenu associated with the menu item. */
  readonly submenu: SignalLike<MenuPattern<V> | undefined>;

  /** Whether the menu item is selectable. */
  readonly selectable: SignalLike<boolean>;

  constructor(readonly inputs: MenuItemInputs<V>) {
    this.id = inputs.id;
    this.value = inputs.value;
    this.element = inputs.element;