ng-primitives 0.89.0 → 0.91.0

package/fesm2022/ng-primitives-listbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-primitives-listbox.mjs","sources":["../../../../packages/ng-primitives/listbox/src/listbox-header/listbox-header.ts","../../../../packages/ng-primitives/listbox/src/listbox/listbox-state.ts","../../../../packages/ng-primitives/listbox/src/listbox-option/listbox-option.ts","../../../../packages/ng-primitives/listbox/src/listbox-section/listbox-section.ts","../../../../packages/ng-primitives/listbox/src/listbox-trigger/listbox-trigger.ts","../../../../packages/ng-primitives/listbox/src/listbox/listbox.ts","../../../../packages/ng-primitives/listbox/src/ng-primitives-listbox.ts"],"sourcesContent":["import { Directive, input } from '@angular/core';\nimport { NgpHeaderToken } from 'ng-primitives/common';\nimport { uniqueId } from 'ng-primitives/utils';\n\n@Directive({\n  selector: '[ngpListboxHeader]',\n  exportAs: 'ngpListboxHeader',\n  host: {\n    role: 'presentation',\n    '[attr.id]': 'id()',\n  },\n  // temporary until we remove NgpHeader completely - this prevents breaking changes\n  providers: [{ provide: NgpHeaderToken, useExisting: NgpListboxHeader }],\n})\nexport class NgpListboxHeader {\n  /**\n   * The id of the listbox header.\n   */\n  readonly id = input(uniqueId('ngp-listbox-header'));\n}\n","import {\n  createState,\n  createStateInjector,\n  createStateProvider,\n  createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpListbox } from './listbox';\n\n/**\n * The state token  for the Listbox primitive.\n */\nexport const NgpListboxStateToken = createStateToken<NgpListbox<unknown>>('Listbox');\n\n/**\n * Provides the Listbox state.\n */\nexport const provideListboxState = createStateProvider(NgpListboxStateToken);\n\n/**\n * Injects the Listbox state.\n */\nexport const injectListboxState = createStateInjector<NgpListbox<unknown>>(NgpListboxStateToken, {\n  deferred: true,\n});\n\n/**\n * The Listbox state registration function.\n */\nexport const listboxState = createState(NgpListboxStateToken);\n","import { FocusOrigin } from '@angular/cdk/a11y';\nimport { BooleanInput } from '@angular/cdk/coercion';\nimport {\n  booleanAttribute,\n  computed,\n  Directive,\n  effect,\n  input,\n  OnDestroy,\n  signal,\n} from '@angular/core';\nimport { ngpInteractions } from 'ng-primitives/interactions';\nimport { injectElementRef, onDomRemoval, scrollIntoViewIfNeeded } from 'ng-primitives/internal';\nimport { uniqueId } from 'ng-primitives/utils';\nimport type { NgpListbox } from '../listbox/listbox';\nimport { injectListboxState } from '../listbox/listbox-state';\n\n@Directive({\n  selector: '[ngpListboxOption]',\n  exportAs: 'ngpListboxOption',\n  host: {\n    role: 'option',\n    '[attr.id]': 'id()',\n    '[attr.aria-disabled]': 'optionDisabled()',\n    '[attr.data-active]': 'listbox()?.isFocused() && active() ? \"\" : undefined',\n    '[attr.data-selected]': 'selected() ? \"\" : undefined',\n    '[attr.data-disabled]': 'optionDisabled() ? \"\" : undefined',\n    '(click)': 'select(\"mouse\")',\n    '(mouseenter)': 'activate()',\n    '(keydown.enter)': 'select(\"keyboard\")',\n    '(keydown.space)': 'select(\"keyboard\")',\n  },\n})\nexport class NgpListboxOption<T> implements OnDestroy {\n  protected readonly listbox = injectListboxState<NgpListbox<T>>();\n  private readonly elementRef = injectElementRef();\n\n  /**\n   * The id of the listbox.\n   */\n  readonly id = input(uniqueId('ngp-listbox-option'));\n\n  /**\n   * The value of the option.\n   */\n  readonly value = input.required<T>({\n    alias: 'ngpListboxOptionValue',\n  });\n\n  /**\n   * Whether the option is disabled.\n   */\n  readonly optionDisabled = input<boolean, BooleanInput>(false, {\n    alias: 'ngpListboxOptionDisabled',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * Whether the option is active.\n   */\n  protected readonly active = signal<boolean>(false);\n\n  /**\n   * @internal\n   * Whether the option is selected.\n   */\n  readonly selected = computed(() => this.listbox()?.isSelected(this.value()));\n\n  /**\n   * @internal\n   * Whether the option is disabled - this is used by the `Highlightable` interface.\n   */\n  get disabled(): boolean {\n    return this._disabled();\n  }\n\n  /**\n   * Whether the option is disabled.\n   */\n  protected readonly _disabled = computed(\n    () => this.optionDisabled() || (this.listbox()?.disabled() ?? false),\n  );\n\n  constructor() {\n    ngpInteractions({\n      hover: true,\n      press: true,\n      focusVisible: true,\n      focus: true,\n      disabled: this._disabled,\n    });\n\n    // the listbox may not be available when the option is initialized\n    // so we need to add the option when the listbox is available\n    effect(() => this.listbox()?.addOption(this));\n\n    // any time the element is removed from the dom, we need to remove the option from the listbox\n    // and we also want to reset the active state\n    onDomRemoval(this.elementRef.nativeElement, () => {\n      this.listbox()?.removeOption(this);\n      this.setInactiveStyles();\n    });\n  }\n\n  ngOnDestroy(): void {\n    this.listbox()?.removeOption(this);\n  }\n\n  /**\n   * @internal\n   * Sets the active state of the option.\n   */\n  setActiveStyles(): void {\n    this.active.set(true);\n    scrollIntoViewIfNeeded(this.elementRef.nativeElement);\n  }\n\n  /**\n   * @internal\n   * Sets the inactive state of the option.\n   */\n  setInactiveStyles(): void {\n    this.active.set(false);\n  }\n\n  /**\n   * @internal\n   * Gets the label of the option, used by the `Highlightable` interface.\n   */\n  getLabel(): string {\n    return this.elementRef.nativeElement.textContent ?? '';\n  }\n\n  /**\n   * @internal\n   * Selects the option.\n   */\n  select(origin: FocusOrigin): void {\n    this.listbox()?.selectOption(this.value(), origin);\n  }\n\n  /**\n   * @internal\n   * Activate the current options.\n   */\n  activate(): void {\n    if (this._disabled()) {\n      return;\n    }\n\n    this.listbox()?.activateOption(this.value());\n  }\n}\n","import { contentChild, Directive } from '@angular/core';\nimport { NgpHeaderToken } from 'ng-primitives/common';\n\n@Directive({\n  selector: '[ngpListboxSection]',\n  exportAs: 'ngpListboxSection',\n  host: {\n    role: 'group',\n    '[attr.aria-labelledby]': 'header()?.id()',\n  },\n})\nexport class NgpListboxSection {\n  /**\n   * Access the header of the section if it exists.\n   */\n  protected readonly header = contentChild(NgpHeaderToken, { descendants: true });\n}\n","import { Directive, HostListener } from '@angular/core';\nimport { injectPopoverTriggerState } from 'ng-primitives/popover';\n\n@Directive({\n  selector: '[ngpListboxTrigger]',\n  exportAs: 'ngpListboxTrigger',\n})\nexport class NgpListboxTrigger {\n  /**\n   * There must also be a popover trigger directive associated with this element.\n   */\n  private readonly popoverTrigger = injectPopoverTriggerState();\n\n  /**\n   * When the up or down arrow key is pressed, open the popover.\n   */\n  @HostListener('keydown', ['$event'])\n  openPopover(event: KeyboardEvent) {\n    if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n      this.popoverTrigger().show();\n      event.preventDefault();\n    }\n  }\n}\n","import { ActiveDescendantKeyManager, FocusOrigin } from '@angular/cdk/a11y';\nimport { BooleanInput } from '@angular/cdk/coercion';\nimport {\n  AfterContentInit,\n  booleanAttribute,\n  computed,\n  DestroyRef,\n  Directive,\n  HostListener,\n  inject,\n  Injector,\n  input,\n  output,\n  signal,\n} from '@angular/core';\nimport { NgpSelectionMode } from 'ng-primitives/common';\nimport { ngpFocusVisibleInteraction } from 'ng-primitives/interactions';\nimport { explicitEffect } from 'ng-primitives/internal';\nimport { injectPopoverTriggerState } from 'ng-primitives/popover';\nimport { safeTakeUntilDestroyed, uniqueId } from 'ng-primitives/utils';\nimport type { NgpListboxOption } from '../listbox-option/listbox-option';\nimport { listboxState, provideListboxState } from './listbox-state';\n\n@Directive({\n  selector: '[ngpListbox]',\n  exportAs: 'ngpListbox',\n  providers: [provideListboxState()],\n  host: {\n    '[id]': 'state.id()',\n    role: 'listbox',\n    '[attr.tabindex]': 'tabindex()',\n    '[attr.aria-disabled]': 'state.disabled()',\n    '[attr.aria-multiselectable]': 'state.mode() === \"multiple\"',\n    '[attr.aria-activedescendant]': 'activeDescendant()',\n    '(focusin)': 'isFocused.set(true)',\n    '(focusout)': 'isFocused.set(false)',\n  },\n})\nexport class NgpListbox<T> implements AfterContentInit {\n  /**\n   * Access the injector.\n   */\n  private readonly injector = inject(Injector);\n\n  /**\n   * Access the destroy ref.\n   */\n  private readonly destroyRef = inject(DestroyRef);\n\n  /**\n   * The listbox may be used within a popover, which we may want to close on selection.\n   */\n  private readonly popoverTrigger = injectPopoverTriggerState({ optional: true });\n\n  /**\n   * The id of the listbox.\n   */\n  readonly id = input(uniqueId('ngp-listbox'));\n\n  /**\n   * The listbox selection mode.\n   */\n  readonly mode = input<NgpSelectionMode>('single', {\n    alias: 'ngpListboxMode',\n  });\n\n  /**\n   * The listbox selection.\n   */\n  readonly value = input<T[]>([], {\n    alias: 'ngpListboxValue',\n  });\n\n  /**\n   * Emits when the listbox selection changes.\n   */\n  readonly valueChange = output<T[]>({\n    alias: 'ngpListboxValueChange',\n  });\n\n  /**\n   * The listbox disabled state.\n   */\n  readonly disabled = input<boolean, BooleanInput>(false, {\n    alias: 'ngpListboxDisabled',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * The comparator function to use when comparing values.\n   * If not provided, strict equality (===) is used.\n   */\n  readonly compareWith = input<(a: T, b: T) => boolean>((a, b) => a === b, {\n    alias: 'ngpListboxCompareWith',\n  });\n\n  /**\n   * The tabindex of the listbox.\n   */\n  protected readonly tabindex = computed(() => (this.state.disabled() ? -1 : 0));\n\n  /**\n   * Access the options in the listbox.\n   */\n  protected readonly options = signal<NgpListboxOption<T>[]>([]);\n\n  /**\n   * The active descendant of the listbox.\n   */\n  protected readonly keyManager = new ActiveDescendantKeyManager(this.options, this.injector);\n\n  /**\n   * Gets the active descendant of the listbox.\n   */\n  protected readonly activeDescendant = signal<string | undefined>(undefined);\n\n  /**\n   * @internal\n   * Whether the listbox is focused.\n   */\n  readonly isFocused = signal(false);\n\n  /**\n   * The listbox state\n   */\n  private readonly state = listboxState<NgpListbox<T>>(this);\n\n  constructor() {\n    ngpFocusVisibleInteraction({ disabled: this.state.disabled });\n  }\n\n  ngAfterContentInit(): void {\n    this.keyManager.withHomeAndEnd().withTypeAhead().withVerticalOrientation();\n\n    this.keyManager.change\n      .pipe(safeTakeUntilDestroyed(this.destroyRef))\n      .subscribe(() => this.activeDescendant.set(this.keyManager.activeItem?.id()));\n\n    // On initialization, set the first selected option as the active descendant if there is one.\n    this.updateActiveItem();\n\n    // if the options change, update the active item, for example the item that was previously active may have been removed\n    // any time the value changes we should make sure that the active item is updated\n    explicitEffect([this.options], () => this.updateActiveItem(), {\n      injector: this.injector,\n    });\n  }\n\n  private updateActiveItem(): void {\n    const selectedOption = this.options().find(o => o.selected());\n\n    if (selectedOption) {\n      this.keyManager.setActiveItem(selectedOption);\n    } else {\n      this.keyManager.setFirstItemActive();\n    }\n  }\n\n  @HostListener('keydown', ['$event'])\n  protected onKeydown(event: KeyboardEvent): void {\n    this.keyManager.onKeydown(event);\n\n    // if the keydown was enter or space, select the active descendant if there is one\n    if (event.key === 'Enter' || event.key === ' ') {\n      this.keyManager.activeItem?.select('keyboard');\n    }\n\n    // if this is an arrow key or selection key, prevent the default action to prevent the page from scrolling\n    if (\n      event.key === 'ArrowDown' ||\n      event.key === 'ArrowUp' ||\n      event.key === 'Enter' ||\n      event.key === ' '\n    ) {\n      event.preventDefault();\n    }\n  }\n\n  /**\n   * @internal\n   * Selects an option in the listbox.\n   */\n  selectOption(value: T, origin: FocusOrigin): void {\n    if (this.state.mode() === 'single') {\n      const newValue = [value];\n      this.state.value.set(newValue);\n      this.valueChange.emit(newValue);\n    } else {\n      // if the value is already selected, remove it, otherwise add it\n      if (this.isSelected(value)) {\n        const newValue = this.state.value().filter(v => !this.state.compareWith()(v, value));\n        this.state.value.set(newValue);\n        this.valueChange.emit(newValue);\n      } else {\n        const newValue = [...this.state.value(), value];\n        this.state.value.set(newValue);\n        this.valueChange.emit(newValue);\n      }\n    }\n\n    // Set the active descendant to the selected option.\n    const option = this.options().find(o => this.state.compareWith()(o.value(), value));\n\n    if (option) {\n      this.keyManager.setActiveItem(option);\n    }\n\n    // If the listbox is within a popover, close the popover on selection if it is not in a multiple selection mode.\n    if (this.state.mode() !== 'multiple') {\n      this.popoverTrigger()?.hide(origin);\n    }\n  }\n\n  /**\n   * @internal\n   * Determine if an option is selected using the compareWith function.\n   */\n  isSelected(value: T): boolean {\n    return this.state.value().some(v => this.state.compareWith()(v, value));\n  }\n\n  /**\n   * @internal\n   * Activate an option in the listbox.\n   */\n  activateOption(value: T) {\n    const option = this.options().find(o => this.state.compareWith()(o.value(), value));\n\n    if (option) {\n      this.keyManager.setActiveItem(option);\n    }\n  }\n\n  /**\n   * Registers an option with the listbox.\n   * @internal\n   */\n  addOption(option: NgpListboxOption<T>): void {\n    // if the option already exists, do not add it again\n    if (!this.options().includes(option)) {\n      this.options.update(options => [...options, option]);\n    }\n  }\n\n  /**\n   * Deregisters an option with the listbox.\n   * @internal\n   */\n  removeOption(option: NgpListboxOption<T>): void {\n    this.options.update(options => options.filter(o => o !== option));\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;MAca,gBAAgB,CAAA;AAV7B,IAAA,WAAA,GAAA;AAWE;;AAEG;QACM,IAAA,CAAA,EAAE,GAAG,KAAK,CAAC,QAAQ,CAAC,oBAAoB,CAAC,CAAC;AACpD,IAAA;+GALY,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,EAAA,EAAA,EAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,MAAA,EAAA,cAAA,EAAA,EAAA,UAAA,EAAA,EAAA,SAAA,EAAA,MAAA,EAAA,EAAA,EAAA,SAAA,EAFhB,CAAC,EAAE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,gBAAgB,EAAE,CAAC,EAAA,QAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAE5D,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAV5B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,oBAAoB;AAC9B,oBAAA,QAAQ,EAAE,kBAAkB;AAC5B,oBAAA,IAAI,EAAE;AACJ,wBAAA,IAAI,EAAE,cAAc;AACpB,wBAAA,WAAW,EAAE,MAAM;AACpB,qBAAA;;oBAED,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAA,gBAAkB,EAAE,CAAC;AACxE,iBAAA;;;ACLD;;AAEG;AACI,MAAM,oBAAoB,GAAG,gBAAgB,CAAsB,SAAS,CAAC;AAEpF;;AAEG;MACU,mBAAmB,GAAG,mBAAmB,CAAC,oBAAoB;AAE3E;;AAEG;AACI,MAAM,kBAAkB,GAAG,mBAAmB,CAAsB,oBAAoB,EAAE;AAC/F,IAAA,QAAQ,EAAE,IAAI;AACf,CAAA;AAED;;AAEG;AACI,MAAM,YAAY,GAAG,WAAW,CAAC,oBAAoB,CAAC;;MCKhD,gBAAgB,CAAA;AAmC3B;;;AAGG;AACH,IAAA,IAAI,QAAQ,GAAA;AACV,QAAA,OAAO,IAAI,CAAC,SAAS,EAAE;IACzB;AASA,IAAA,WAAA,GAAA;QAjDmB,IAAA,CAAA,OAAO,GAAG,kBAAkB,EAAiB;QAC/C,IAAA,CAAA,UAAU,GAAG,gBAAgB,EAAE;AAEhD;;AAEG;QACM,IAAA,CAAA,EAAE,GAAG,KAAK,CAAC,QAAQ,CAAC,oBAAoB,CAAC,CAAC;AAEnD;;AAEG;AACM,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,CAAI;AACjC,YAAA,KAAK,EAAE,uBAAuB;AAC/B,SAAA,CAAC;AAEF;;AAEG;AACM,QAAA,IAAA,CAAA,cAAc,GAAG,KAAK,CAAwB,KAAK,EAAE;AAC5D,YAAA,KAAK,EAAE,0BAA0B;AACjC,YAAA,SAAS,EAAE,gBAAgB;AAC5B,SAAA,CAAC;AAEF;;AAEG;AACgB,QAAA,IAAA,CAAA,MAAM,GAAG,MAAM,CAAU,KAAK,CAAC;AAElD;;;AAGG;AACM,QAAA,IAAA,CAAA,QAAQ,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,OAAO,EAAE,EAAE,UAAU,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;AAU5E;;AAEG;QACgB,IAAA,CAAA,SAAS,GAAG,QAAQ,CACrC,MAAM,IAAI,CAAC,cAAc,EAAE,KAAK,IAAI,CAAC,OAAO,EAAE,EAAE,QAAQ,EAAE,IAAI,KAAK,CAAC,CACrE;AAGC,QAAA,eAAe,CAAC;AACd,YAAA,KAAK,EAAE,IAAI;AACX,YAAA,KAAK,EAAE,IAAI;AACX,YAAA,YAAY,EAAE,IAAI;AAClB,YAAA,KAAK,EAAE,IAAI;YACX,QAAQ,EAAE,IAAI,CAAC,SAAS;AACzB,SAAA,CAAC;;;AAIF,QAAA,MAAM,CAAC,MAAM,IAAI,CAAC,OAAO,EAAE,EAAE,SAAS,CAAC,IAAI,CAAC,CAAC;;;QAI7C,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,MAAK;YAC/C,IAAI,CAAC,OAAO,EAAE,EAAE,YAAY,CAAC,IAAI,CAAC;YAClC,IAAI,CAAC,iBAAiB,EAAE;AAC1B,QAAA,CAAC,CAAC;IACJ;IAEA,WAAW,GAAA;QACT,IAAI,CAAC,OAAO,EAAE,EAAE,YAAY,CAAC,IAAI,CAAC;IACpC;AAEA;;;AAGG;IACH,eAAe,GAAA;AACb,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;AACrB,QAAA,sBAAsB,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC;IACvD;AAEA;;;AAGG;IACH,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC;IACxB;AAEA;;;AAGG;IACH,QAAQ,GAAA;QACN,OAAO,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,IAAI,EAAE;IACxD;AAEA;;;AAGG;AACH,IAAA,MAAM,CAAC,MAAmB,EAAA;AACxB,QAAA,IAAI,CAAC,OAAO,EAAE,EAAE,YAAY,CAAC,IAAI,CAAC,KAAK,EAAE,EAAE,MAAM,CAAC;IACpD;AAEA;;;AAGG;IACH,QAAQ,GAAA;AACN,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE,EAAE;YACpB;QACF;QAEA,IAAI,CAAC,OAAO,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;IAC9C;+GAtHW,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,EAAA,EAAA,EAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,uBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,0BAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,MAAA,EAAA,QAAA,EAAA,EAAA,SAAA,EAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,YAAA,EAAA,YAAA,EAAA,eAAA,EAAA,sBAAA,EAAA,eAAA,EAAA,sBAAA,EAAA,EAAA,UAAA,EAAA,EAAA,SAAA,EAAA,MAAA,EAAA,oBAAA,EAAA,kBAAA,EAAA,kBAAA,EAAA,uDAAA,EAAA,oBAAA,EAAA,+BAAA,EAAA,oBAAA,EAAA,qCAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAAhB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAhB5B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,oBAAoB;AAC9B,oBAAA,QAAQ,EAAE,kBAAkB;AAC5B,oBAAA,IAAI,EAAE;AACJ,wBAAA,IAAI,EAAE,QAAQ;AACd,wBAAA,WAAW,EAAE,MAAM;AACnB,wBAAA,sBAAsB,EAAE,kBAAkB;AAC1C,wBAAA,oBAAoB,EAAE,qDAAqD;AAC3E,wBAAA,sBAAsB,EAAE,6BAA6B;AACrD,wBAAA,sBAAsB,EAAE,mCAAmC;AAC3D,wBAAA,SAAS,EAAE,iBAAiB;AAC5B,wBAAA,cAAc,EAAE,YAAY;AAC5B,wBAAA,iBAAiB,EAAE,oBAAoB;AACvC,wBAAA,iBAAiB,EAAE,oBAAoB;AACxC,qBAAA;AACF,iBAAA;;;MCrBY,iBAAiB,CAAA;AAR9B,IAAA,WAAA,GAAA;AASE;;AAEG;QACgB,IAAA,CAAA,MAAM,GAAG,YAAY,CAAC,cAAc,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC;AAChF,IAAA;+GALY,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAjB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,iBAAiB,wNAIa,cAAc,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAJ5C,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAR7B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,qBAAqB;AAC/B,oBAAA,QAAQ,EAAE,mBAAmB;AAC7B,oBAAA,IAAI,EAAE;AACJ,wBAAA,IAAI,EAAE,OAAO;AACb,wBAAA,wBAAwB,EAAE,gBAAgB;AAC3C,qBAAA;AACF,iBAAA;;;MCHY,iBAAiB,CAAA;AAJ9B,IAAA,WAAA,GAAA;AAKE;;AAEG;QACc,IAAA,CAAA,cAAc,GAAG,yBAAyB,EAAE;AAY9D,IAAA;AAVC;;AAEG;AAEH,IAAA,WAAW,CAAC,KAAoB,EAAA;AAC9B,QAAA,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,IAAI,KAAK,CAAC,GAAG,KAAK,SAAS,EAAE;AACxD,YAAA,IAAI,CAAC,cAAc,EAAE,CAAC,IAAI,EAAE;YAC5B,KAAK,CAAC,cAAc,EAAE;QACxB;IACF;+GAfW,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAjB,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,SAAA,EAAA,qBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAAjB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAJ7B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,qBAAqB;AAC/B,oBAAA,QAAQ,EAAE,mBAAmB;AAC9B,iBAAA;8BAWC,WAAW,EAAA,CAAA;sBADV,YAAY;uBAAC,SAAS,EAAE,CAAC,QAAQ,CAAC;;;MCsBxB,UAAU,CAAA;AAyFrB,IAAA,WAAA,GAAA;AAxFA;;AAEG;AACc,QAAA,IAAA,CAAA,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC;AAE5C;;AAEG;AACc,QAAA,IAAA,CAAA,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;AAEhD;;AAEG;QACc,IAAA,CAAA,cAAc,GAAG,yBAAyB,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;AAE/E;;AAEG;QACM,IAAA,CAAA,EAAE,GAAG,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;AAE5C;;AAEG;AACM,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAmB,QAAQ,EAAE;AAChD,YAAA,KAAK,EAAE,gBAAgB;AACxB,SAAA,CAAC;AAEF;;AAEG;AACM,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAM,EAAE,EAAE;AAC9B,YAAA,KAAK,EAAE,iBAAiB;AACzB,SAAA,CAAC;AAEF;;AAEG;QACM,IAAA,CAAA,WAAW,GAAG,MAAM,CAAM;AACjC,YAAA,KAAK,EAAE,uBAAuB;AAC/B,SAAA,CAAC;AAEF;;AAEG;AACM,QAAA,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAwB,KAAK,EAAE;AACtD,YAAA,KAAK,EAAE,oBAAoB;AAC3B,YAAA,SAAS,EAAE,gBAAgB;AAC5B,SAAA,CAAC;AAEF;;;AAGG;AACM,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK,CAA0B,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;AACvE,YAAA,KAAK,EAAE,uBAAuB;AAC/B,SAAA,CAAC;AAEF;;AAEG;QACgB,IAAA,CAAA,QAAQ,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;AAE9E;;AAEG;AACgB,QAAA,IAAA,CAAA,OAAO,GAAG,MAAM,CAAwB,EAAE,CAAC;AAE9D;;AAEG;AACgB,QAAA,IAAA,CAAA,UAAU,GAAG,IAAI,0BAA0B,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC;AAE3F;;AAEG;AACgB,QAAA,IAAA,CAAA,gBAAgB,GAAG,MAAM,CAAqB,SAAS,CAAC;AAE3E;;;AAGG;AACM,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAAC,KAAK,CAAC;AAElC;;AAEG;AACc,QAAA,IAAA,CAAA,KAAK,GAAG,YAAY,CAAgB,IAAI,CAAC;QAGxD,0BAA0B,CAAC,EAAE,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;IAC/D;IAEA,kBAAkB,GAAA;QAChB,IAAI,CAAC,UAAU,CAAC,cAAc,EAAE,CAAC,aAAa,EAAE,CAAC,uBAAuB,EAAE;QAE1E,IAAI,CAAC,UAAU,CAAC;AACb,aAAA,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,UAAU,CAAC;aAC5C,SAAS,CAAC,MAAM,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,UAAU,EAAE,EAAE,EAAE,CAAC,CAAC;;QAG/E,IAAI,CAAC,gBAAgB,EAAE;;;AAIvB,QAAA,cAAc,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC,gBAAgB,EAAE,EAAE;YAC5D,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACxB,SAAA,CAAC;IACJ;IAEQ,gBAAgB,GAAA;AACtB,QAAA,MAAM,cAAc,GAAG,IAAI,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC;QAE7D,IAAI,cAAc,EAAE;AAClB,YAAA,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,cAAc,CAAC;QAC/C;aAAO;AACL,YAAA,IAAI,CAAC,UAAU,CAAC,kBAAkB,EAAE;QACtC;IACF;AAGU,IAAA,SAAS,CAAC,KAAoB,EAAA;AACtC,QAAA,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,KAAK,CAAC;;AAGhC,QAAA,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE;YAC9C,IAAI,CAAC,UAAU,CAAC,UAAU,EAAE,MAAM,CAAC,UAAU,CAAC;QAChD;;AAGA,QAAA,IACE,KAAK,CAAC,GAAG,KAAK,WAAW;YACzB,KAAK,CAAC,GAAG,KAAK,SAAS;YACvB,KAAK,CAAC,GAAG,KAAK,OAAO;AACrB,YAAA,KAAK,CAAC,GAAG,KAAK,GAAG,EACjB;YACA,KAAK,CAAC,cAAc,EAAE;QACxB;IACF;AAEA;;;AAGG;IACH,YAAY,CAAC,KAAQ,EAAE,MAAmB,EAAA;QACxC,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,QAAQ,EAAE;AAClC,YAAA,MAAM,QAAQ,GAAG,CAAC,KAAK,CAAC;YACxB,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC;AAC9B,YAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC;QACjC;aAAO;;AAEL,YAAA,IAAI,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE;AAC1B,gBAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC;gBACpF,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC;AAC9B,gBAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC;YACjC;iBAAO;AACL,gBAAA,MAAM,QAAQ,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,CAAC;gBAC/C,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC;AAC9B,gBAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC;YACjC;QACF;;AAGA,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,CAAC,CAAC;QAEnF,IAAI,MAAM,EAAE;AACV,YAAA,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,MAAM,CAAC;QACvC;;QAGA,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,UAAU,EAAE;YACpC,IAAI,CAAC,cAAc,EAAE,EAAE,IAAI,CAAC,MAAM,CAAC;QACrC;IACF;AAEA;;;AAGG;AACH,IAAA,UAAU,CAAC,KAAQ,EAAA;QACjB,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC;IACzE;AAEA;;;AAGG;AACH,IAAA,cAAc,CAAC,KAAQ,EAAA;AACrB,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,CAAC,CAAC;QAEnF,IAAI,MAAM,EAAE;AACV,YAAA,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,MAAM,CAAC;QACvC;IACF;AAEA;;;AAGG;AACH,IAAA,SAAS,CAAC,MAA2B,EAAA;;QAEnC,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;AACpC,YAAA,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,OAAO,IAAI,CAAC,GAAG,OAAO,EAAE,MAAM,CAAC,CAAC;QACtD;IACF;AAEA;;;AAGG;AACH,IAAA,YAAY,CAAC,MAA2B,EAAA;QACtC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,OAAO,IAAI,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,KAAK,MAAM,CAAC,CAAC;IACnE;+GApNW,UAAU,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAV,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,UAAU,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,EAAA,EAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,oBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,uBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,WAAA,EAAA,uBAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,MAAA,EAAA,SAAA,EAAA,EAAA,SAAA,EAAA,EAAA,SAAA,EAAA,qBAAA,EAAA,UAAA,EAAA,sBAAA,EAAA,SAAA,EAAA,mBAAA,EAAA,EAAA,UAAA,EAAA,EAAA,IAAA,EAAA,YAAA,EAAA,eAAA,EAAA,YAAA,EAAA,oBAAA,EAAA,kBAAA,EAAA,2BAAA,EAAA,+BAAA,EAAA,4BAAA,EAAA,oBAAA,EAAA,EAAA,EAAA,SAAA,EAZV,CAAC,mBAAmB,EAAE,CAAC,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAYvB,UAAU,EAAA,UAAA,EAAA,CAAA;kBAftB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,cAAc;AACxB,oBAAA,QAAQ,EAAE,YAAY;AACtB,oBAAA,SAAS,EAAE,CAAC,mBAAmB,EAAE,CAAC;AAClC,oBAAA,IAAI,EAAE;AACJ,wBAAA,MAAM,EAAE,YAAY;AACpB,wBAAA,IAAI,EAAE,SAAS;AACf,wBAAA,iBAAiB,EAAE,YAAY;AAC/B,wBAAA,sBAAsB,EAAE,kBAAkB;AAC1C,wBAAA,6BAA6B,EAAE,6BAA6B;AAC5D,wBAAA,8BAA8B,EAAE,oBAAoB;AACpD,wBAAA,WAAW,EAAE,qBAAqB;AAClC,wBAAA,YAAY,EAAE,sBAAsB;AACrC,qBAAA;AACF,iBAAA;wDA0HW,SAAS,EAAA,CAAA;sBADlB,YAAY;uBAAC,SAAS,EAAE,CAAC,QAAQ,CAAC;;;AC9JrC;;AAEG;;;;"}
+{"version":3,"file":"ng-primitives-listbox.mjs","sources":["../../../../packages/ng-primitives/listbox/src/listbox-header/listbox-header.ts","../../../../packages/ng-primitives/listbox/src/listbox/listbox-state.ts","../../../../packages/ng-primitives/listbox/src/listbox-option/listbox-option.ts","../../../../packages/ng-primitives/listbox/src/listbox-section/listbox-section.ts","../../../../packages/ng-primitives/listbox/src/listbox-trigger/listbox-trigger.ts","../../../../packages/ng-primitives/listbox/src/listbox/listbox.ts","../../../../packages/ng-primitives/listbox/src/ng-primitives-listbox.ts"],"sourcesContent":["import { Directive, input } from '@angular/core';\nimport { NgpHeaderToken } from 'ng-primitives/common';\nimport { uniqueId } from 'ng-primitives/utils';\n\n@Directive({\n  selector: '[ngpListboxHeader]',\n  exportAs: 'ngpListboxHeader',\n  host: {\n    role: 'presentation',\n    '[attr.id]': 'id()',\n  },\n  // temporary until we remove NgpHeader completely - this prevents breaking changes\n  providers: [{ provide: NgpHeaderToken, useExisting: NgpListboxHeader }],\n})\nexport class NgpListboxHeader {\n  /**\n   * The id of the listbox header.\n   */\n  readonly id = input(uniqueId('ngp-listbox-header'));\n}\n","import {\n  createState,\n  createStateInjector,\n  createStateProvider,\n  createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpListbox } from './listbox';\n\n/**\n * The state token  for the Listbox primitive.\n */\nexport const NgpListboxStateToken = createStateToken<NgpListbox<unknown>>('Listbox');\n\n/**\n * Provides the Listbox state.\n */\nexport const provideListboxState = createStateProvider(NgpListboxStateToken);\n\n/**\n * Injects the Listbox state.\n */\nexport const injectListboxState = createStateInjector<NgpListbox<unknown>>(NgpListboxStateToken, {\n  deferred: true,\n});\n\n/**\n * The Listbox state registration function.\n */\nexport const listboxState = createState(NgpListboxStateToken);\n","import { FocusOrigin } from '@angular/cdk/a11y';\nimport { BooleanInput } from '@angular/cdk/coercion';\nimport {\n  booleanAttribute,\n  computed,\n  Directive,\n  effect,\n  input,\n  OnDestroy,\n  signal,\n} from '@angular/core';\nimport { ngpInteractions } from 'ng-primitives/interactions';\nimport { injectElementRef, onDomRemoval, scrollIntoViewIfNeeded } from 'ng-primitives/internal';\nimport { uniqueId } from 'ng-primitives/utils';\nimport type { NgpListbox } from '../listbox/listbox';\nimport { injectListboxState } from '../listbox/listbox-state';\n\n@Directive({\n  selector: '[ngpListboxOption]',\n  exportAs: 'ngpListboxOption',\n  host: {\n    role: 'option',\n    '[attr.id]': 'id()',\n    '[attr.aria-disabled]': 'optionDisabled()',\n    '[attr.data-active]': 'listbox()?.isFocused() && active() ? \"\" : undefined',\n    '[attr.data-selected]': 'selected() ? \"\" : undefined',\n    '[attr.data-disabled]': 'optionDisabled() ? \"\" : undefined',\n    '(click)': 'select(\"mouse\")',\n    '(mouseenter)': 'activate()',\n    '(keydown.enter)': 'select(\"keyboard\")',\n    '(keydown.space)': 'select(\"keyboard\")',\n  },\n})\nexport class NgpListboxOption<T> implements OnDestroy {\n  protected readonly listbox = injectListboxState<NgpListbox<T>>();\n  private readonly elementRef = injectElementRef();\n\n  /**\n   * The id of the listbox.\n   */\n  readonly id = input(uniqueId('ngp-listbox-option'));\n\n  /**\n   * The value of the option.\n   */\n  readonly value = input.required<T>({\n    alias: 'ngpListboxOptionValue',\n  });\n\n  /**\n   * Whether the option is disabled.\n   */\n  readonly optionDisabled = input<boolean, BooleanInput>(false, {\n    alias: 'ngpListboxOptionDisabled',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * Whether the option is active.\n   */\n  protected readonly active = signal<boolean>(false);\n\n  /**\n   * @internal\n   * Whether the option is selected.\n   */\n  readonly selected = computed(() => this.listbox()?.isSelected(this.value()));\n\n  /**\n   * @internal\n   * Whether the option is disabled - this is used by the `Highlightable` interface.\n   */\n  get disabled(): boolean {\n    return this._disabled();\n  }\n\n  /**\n   * Whether the option is disabled.\n   */\n  protected readonly _disabled = computed(\n    () => this.optionDisabled() || (this.listbox()?.disabled() ?? false),\n  );\n\n  constructor() {\n    ngpInteractions({\n      hover: true,\n      press: true,\n      focusVisible: true,\n      focus: true,\n      disabled: this._disabled,\n    });\n\n    // the listbox may not be available when the option is initialized\n    // so we need to add the option when the listbox is available\n    effect(() => this.listbox()?.addOption(this));\n\n    // any time the element is removed from the dom, we need to remove the option from the listbox\n    // and we also want to reset the active state\n    onDomRemoval(this.elementRef.nativeElement, () => {\n      this.listbox()?.removeOption(this);\n      this.setInactiveStyles();\n    });\n  }\n\n  ngOnDestroy(): void {\n    this.listbox()?.removeOption(this);\n  }\n\n  /**\n   * @internal\n   * Sets the active state of the option.\n   */\n  setActiveStyles(): void {\n    this.active.set(true);\n    scrollIntoViewIfNeeded(this.elementRef.nativeElement);\n  }\n\n  /**\n   * @internal\n   * Sets the inactive state of the option.\n   */\n  setInactiveStyles(): void {\n    this.active.set(false);\n  }\n\n  /**\n   * @internal\n   * Gets the label of the option, used by the `Highlightable` interface.\n   */\n  getLabel(): string {\n    return this.elementRef.nativeElement.textContent ?? '';\n  }\n\n  /**\n   * @internal\n   * Selects the option.\n   */\n  select(origin: FocusOrigin): void {\n    this.listbox()?.selectOption(this.value(), origin);\n  }\n\n  /**\n   * @internal\n   * Activate the current options.\n   */\n  activate(): void {\n    if (this._disabled()) {\n      return;\n    }\n\n    this.listbox()?.activateOption(this.value());\n  }\n}\n","import { contentChild, Directive } from '@angular/core';\nimport { NgpHeaderToken } from 'ng-primitives/common';\n\n@Directive({\n  selector: '[ngpListboxSection]',\n  exportAs: 'ngpListboxSection',\n  host: {\n    role: 'group',\n    '[attr.aria-labelledby]': 'header()?.id()',\n  },\n})\nexport class NgpListboxSection {\n  /**\n   * Access the header of the section if it exists.\n   */\n  protected readonly header = contentChild(NgpHeaderToken, { descendants: true });\n}\n","import { Directive, HostListener } from '@angular/core';\nimport { injectPopoverTriggerState } from 'ng-primitives/popover';\n\n@Directive({\n  selector: '[ngpListboxTrigger]',\n  exportAs: 'ngpListboxTrigger',\n})\nexport class NgpListboxTrigger {\n  /**\n   * There must also be a popover trigger directive associated with this element.\n   */\n  private readonly popoverTrigger = injectPopoverTriggerState();\n\n  /**\n   * When the up or down arrow key is pressed, open the popover.\n   */\n  @HostListener('keydown', ['$event'])\n  openPopover(event: KeyboardEvent) {\n    if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n      this.popoverTrigger().show();\n      event.preventDefault();\n    }\n  }\n}\n","import { ActiveDescendantKeyManager, FocusOrigin } from '@angular/cdk/a11y';\nimport { BooleanInput } from '@angular/cdk/coercion';\nimport {\n  AfterContentInit,\n  booleanAttribute,\n  computed,\n  DestroyRef,\n  Directive,\n  HostListener,\n  inject,\n  Injector,\n  input,\n  output,\n  signal,\n} from '@angular/core';\nimport { NgpSelectionMode } from 'ng-primitives/common';\nimport { ngpFocusVisibleInteraction } from 'ng-primitives/interactions';\nimport { explicitEffect } from 'ng-primitives/internal';\nimport { injectPopoverTriggerState } from 'ng-primitives/popover';\nimport { safeTakeUntilDestroyed, uniqueId } from 'ng-primitives/utils';\nimport type { NgpListboxOption } from '../listbox-option/listbox-option';\nimport { listboxState, provideListboxState } from './listbox-state';\n\n@Directive({\n  selector: '[ngpListbox]',\n  exportAs: 'ngpListbox',\n  providers: [provideListboxState()],\n  host: {\n    '[id]': 'state.id()',\n    role: 'listbox',\n    '[attr.tabindex]': 'tabindex()',\n    '[attr.aria-disabled]': 'state.disabled()',\n    '[attr.aria-multiselectable]': 'state.mode() === \"multiple\"',\n    '[attr.aria-activedescendant]': 'activeDescendant()',\n    '(focusin)': 'isFocused.set(true)',\n    '(focusout)': 'isFocused.set(false)',\n  },\n})\nexport class NgpListbox<T> implements AfterContentInit {\n  /**\n   * Access the injector.\n   */\n  private readonly injector = inject(Injector);\n\n  /**\n   * Access the destroy ref.\n   */\n  private readonly destroyRef = inject(DestroyRef);\n\n  /**\n   * The listbox may be used within a popover, which we may want to close on selection.\n   */\n  private readonly popoverTrigger = injectPopoverTriggerState({ optional: true });\n\n  /**\n   * The id of the listbox.\n   */\n  readonly id = input(uniqueId('ngp-listbox'));\n\n  /**\n   * The listbox selection mode.\n   */\n  readonly mode = input<NgpSelectionMode>('single', {\n    alias: 'ngpListboxMode',\n  });\n\n  /**\n   * The listbox selection.\n   */\n  readonly value = input<T[]>([], {\n    alias: 'ngpListboxValue',\n  });\n\n  /**\n   * Emits when the listbox selection changes.\n   */\n  readonly valueChange = output<T[]>({\n    alias: 'ngpListboxValueChange',\n  });\n\n  /**\n   * The listbox disabled state.\n   */\n  readonly disabled = input<boolean, BooleanInput>(false, {\n    alias: 'ngpListboxDisabled',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * The comparator function to use when comparing values.\n   * If not provided, strict equality (===) is used.\n   */\n  readonly compareWith = input<(a: T, b: T) => boolean>((a, b) => a === b, {\n    alias: 'ngpListboxCompareWith',\n  });\n\n  /**\n   * The tabindex of the listbox.\n   */\n  protected readonly tabindex = computed(() => (this.state.disabled() ? -1 : 0));\n\n  /**\n   * Access the options in the listbox.\n   */\n  protected readonly options = signal<NgpListboxOption<T>[]>([]);\n\n  /**\n   * The active descendant of the listbox.\n   */\n  protected readonly keyManager = new ActiveDescendantKeyManager(this.options, this.injector);\n\n  /**\n   * Gets the active descendant of the listbox.\n   */\n  protected readonly activeDescendant = signal<string | undefined>(undefined);\n\n  /**\n   * @internal\n   * Whether the listbox is focused.\n   */\n  readonly isFocused = signal(false);\n\n  /**\n   * The listbox state\n   */\n  protected readonly state = listboxState<NgpListbox<T>>(this);\n\n  constructor() {\n    ngpFocusVisibleInteraction({ disabled: this.state.disabled });\n  }\n\n  ngAfterContentInit(): void {\n    this.keyManager.withHomeAndEnd().withTypeAhead().withVerticalOrientation();\n\n    this.keyManager.change\n      .pipe(safeTakeUntilDestroyed(this.destroyRef))\n      .subscribe(() => this.activeDescendant.set(this.keyManager.activeItem?.id()));\n\n    // On initialization, set the first selected option as the active descendant if there is one.\n    this.updateActiveItem();\n\n    // if the options change, update the active item, for example the item that was previously active may have been removed\n    // any time the value changes we should make sure that the active item is updated\n    explicitEffect([this.options], () => this.updateActiveItem(), {\n      injector: this.injector,\n    });\n  }\n\n  private updateActiveItem(): void {\n    const selectedOption = this.options().find(o => o.selected());\n\n    if (selectedOption) {\n      this.keyManager.setActiveItem(selectedOption);\n    } else {\n      this.keyManager.setFirstItemActive();\n    }\n  }\n\n  @HostListener('keydown', ['$event'])\n  protected onKeydown(event: KeyboardEvent): void {\n    this.keyManager.onKeydown(event);\n\n    // if the keydown was enter or space, select the active descendant if there is one\n    if (event.key === 'Enter' || event.key === ' ') {\n      this.keyManager.activeItem?.select('keyboard');\n    }\n\n    // if this is an arrow key or selection key, prevent the default action to prevent the page from scrolling\n    if (\n      event.key === 'ArrowDown' ||\n      event.key === 'ArrowUp' ||\n      event.key === 'Enter' ||\n      event.key === ' '\n    ) {\n      event.preventDefault();\n    }\n  }\n\n  /**\n   * @internal\n   * Selects an option in the listbox.\n   */\n  selectOption(value: T, origin: FocusOrigin): void {\n    if (this.state.mode() === 'single') {\n      const newValue = [value];\n      this.state.value.set(newValue);\n      this.valueChange.emit(newValue);\n    } else {\n      // if the value is already selected, remove it, otherwise add it\n      if (this.isSelected(value)) {\n        const newValue = this.state.value().filter(v => !this.state.compareWith()(v, value));\n        this.state.value.set(newValue);\n        this.valueChange.emit(newValue);\n      } else {\n        const newValue = [...this.state.value(), value];\n        this.state.value.set(newValue);\n        this.valueChange.emit(newValue);\n      }\n    }\n\n    // Set the active descendant to the selected option.\n    const option = this.options().find(o => this.state.compareWith()(o.value(), value));\n\n    if (option) {\n      this.keyManager.setActiveItem(option);\n    }\n\n    // If the listbox is within a popover, close the popover on selection if it is not in a multiple selection mode.\n    if (this.state.mode() !== 'multiple') {\n      this.popoverTrigger()?.hide(origin);\n    }\n  }\n\n  /**\n   * @internal\n   * Determine if an option is selected using the compareWith function.\n   */\n  isSelected(value: T): boolean {\n    return this.state.value().some(v => this.state.compareWith()(v, value));\n  }\n\n  /**\n   * @internal\n   * Activate an option in the listbox.\n   */\n  activateOption(value: T) {\n    const option = this.options().find(o => this.state.compareWith()(o.value(), value));\n\n    if (option) {\n      this.keyManager.setActiveItem(option);\n    }\n  }\n\n  /**\n   * Registers an option with the listbox.\n   * @internal\n   */\n  addOption(option: NgpListboxOption<T>): void {\n    // if the option already exists, do not add it again\n    if (!this.options().includes(option)) {\n      this.options.update(options => [...options, option]);\n    }\n  }\n\n  /**\n   * Deregisters an option with the listbox.\n   * @internal\n   */\n  removeOption(option: NgpListboxOption<T>): void {\n    this.options.update(options => options.filter(o => o !== option));\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ng-primitives-menu.mjs

@@ -2,7 +2,7 @@ import { coerceOffset, createOverlay, injectOverlay } from 'ng-primitives/portal
 export { injectOverlayContext as injectMenuContext } from 'ng-primitives/portal';
 import * as i0 from '@angular/core';
 import { InjectionToken, inject, Injector, ViewContainerRef, input, booleanAttribute, signal, computed, HostListener, Directive } from '@angular/core';
-import { setupButton } from 'ng-primitives/button';
+import { ngpButton } from 'ng-primitives/button';
 import { injectElementRef } from 'ng-primitives/internal';
 import * as i1 from 'ng-primitives/roving-focus';
 import { NgpRovingFocusItem, provideRovingFocusGroup, NgpRovingFocusGroup } from 'ng-primitives/roving-focus';
@@ -91,51 +91,54 @@ class NgpSubmenuTrigger {
         /**
          * Access the submenu template ref.
          */
-        this.menu = input(undefined, {
-            alias: 'ngpSubmenuTrigger',
-        });
+        this.menu = input(undefined, ...(ngDevMode ? [{ debugName: "menu", alias: 'ngpSubmenuTrigger' }] : [{
+                alias: 'ngpSubmenuTrigger',
+            }]));
         /**
          * Define if the trigger should be disabled.
          * @default false
          */
-        this.disabled = input(false, {
-            alias: 'ngpSubmenuTriggerDisabled',
-            transform: booleanAttribute,
-        });
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", alias: 'ngpSubmenuTriggerDisabled',
+                transform: booleanAttribute }] : [{
+                alias: 'ngpSubmenuTriggerDisabled',
+                transform: booleanAttribute,
+            }]));
         /**
          * Define the placement of the menu relative to the trigger.
          * @default 'right-start'
          */
-        this.placement = input('right-start', {
-            alias: 'ngpSubmenuTriggerPlacement',
-        });
+        this.placement = input('right-start', ...(ngDevMode ? [{ debugName: "placement", alias: 'ngpSubmenuTriggerPlacement' }] : [{
+                alias: 'ngpSubmenuTriggerPlacement',
+            }]));
         /**
          * Define the offset of the menu relative to the trigger.
          * Can be a number (applies to mainAxis) or an object with mainAxis, crossAxis, and alignmentAxis.
          * @default 0
          */
-        this.offset = input(0, {
-            alias: 'ngpSubmenuTriggerOffset',
-            transform: coerceOffset,
-        });
+        this.offset = input(0, ...(ngDevMode ? [{ debugName: "offset", alias: 'ngpSubmenuTriggerOffset',
+                transform: coerceOffset }] : [{
+                alias: 'ngpSubmenuTriggerOffset',
+                transform: coerceOffset,
+            }]));
         /**
          * Define whether the menu should flip when there is not enough space for the menu.
          * @default true
          */
-        this.flip = input(true, {
-            alias: 'ngpSubmenuTriggerFlip',
-            transform: booleanAttribute,
-        });
+        this.flip = input(true, ...(ngDevMode ? [{ debugName: "flip", alias: 'ngpSubmenuTriggerFlip',
+                transform: booleanAttribute }] : [{
+                alias: 'ngpSubmenuTriggerFlip',
+                transform: booleanAttribute,
+            }]));
         /**
          * The overlay that manages the menu
          * @internal
          */
-        this.overlay = signal(null);
+        this.overlay = signal(null, ...(ngDevMode ? [{ debugName: "overlay" }] : []));
         /**
          * The open state of the menu.
          * @internal
          */
-        this.open = computed(() => this.overlay()?.isOpen() ?? false);
+        this.open = computed(() => this.overlay()?.isOpen() ?? false, ...(ngDevMode ? [{ debugName: "open" }] : []));
         /**
          * Access the menu trigger state.
          */
@@ -216,10 +219,14 @@ class NgpSubmenuTrigger {
     /**
      * If the user presses the right arrow key, we want to open the submenu
      * and focus the first item in the submenu.
+     * If the user presses the left arrow key, we want to close the submenu.
      * This behavior will be inverted if the direction is RTL.
      * @param event
      */
-    showSubmenuOnArrow(event) {
+    handleArrowKey(event) {
+        if (event instanceof KeyboardEvent === false) {
+            return;
+        }
         const direction = getComputedStyle(this.trigger.nativeElement).direction;
         const isRtl = direction === 'rtl';
         const isRightArrow = event.key === 'ArrowRight';
@@ -240,10 +247,10 @@ class NgpSubmenuTrigger {
         }
         this.show();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpSubmenuTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.11", type: NgpSubmenuTrigger, isStandalone: true, selector: "[ngpSubmenuTrigger]", inputs: { menu: { classPropertyName: "menu", publicName: "ngpSubmenuTrigger", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpSubmenuTriggerDisabled", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "ngpSubmenuTriggerPlacement", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "ngpSubmenuTriggerOffset", isSignal: true, isRequired: false, transformFunction: null }, flip: { classPropertyName: "flip", publicName: "ngpSubmenuTriggerFlip", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "aria-haspopup": "true" }, listeners: { "click": "toggle($event)", "keydown.ArrowRight": "showSubmenuOnArrow($event)", "keydown.ArrowLeft": "showSubmenuOnArrow($event)", "pointerenter": "showSubmenuOnHover($event)" }, properties: { "attr.aria-expanded": "open() ? \"true\" : \"false\"", "attr.data-open": "open() ? \"\" : null" } }, providers: [provideSubmenuTriggerState({ inherit: false })], exportAs: ["ngpSubmenuTrigger"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpSubmenuTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.9", type: NgpSubmenuTrigger, isStandalone: true, selector: "[ngpSubmenuTrigger]", inputs: { menu: { classPropertyName: "menu", publicName: "ngpSubmenuTrigger", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpSubmenuTriggerDisabled", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "ngpSubmenuTriggerPlacement", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "ngpSubmenuTriggerOffset", isSignal: true, isRequired: false, transformFunction: null }, flip: { classPropertyName: "flip", publicName: "ngpSubmenuTriggerFlip", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "aria-haspopup": "true" }, listeners: { "click": "toggle($event)", "keydown.ArrowRight": "handleArrowKey($event)", "keydown.ArrowLeft": "handleArrowKey($event)", "pointerenter": "showSubmenuOnHover($event)" }, properties: { "attr.aria-expanded": "open() ? \"true\" : \"false\"", "attr.data-open": "open() ? \"\" : null" } }, providers: [provideSubmenuTriggerState({ inherit: false })], exportAs: ["ngpSubmenuTrigger"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpSubmenuTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpSubmenuTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpSubmenuTrigger]',
@@ -256,7 +263,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
                         '(click)': 'toggle($event)',
                     },
                 }]
-        }], ctorParameters: () => [], propDecorators: { showSubmenuOnArrow: [{
+        }], ctorParameters: () => [], propDecorators: { menu: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpSubmenuTrigger", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpSubmenuTriggerDisabled", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpSubmenuTriggerPlacement", required: false }] }], offset: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpSubmenuTriggerOffset", required: false }] }], flip: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpSubmenuTriggerFlip", required: false }] }], handleArrowKey: [{
                 type: HostListener,
                 args: ['keydown.ArrowRight', ['$event']]
             }, {
@@ -279,11 +286,12 @@ class NgpMenuItem {
         /** Access the parent menu */
         this.parentMenu = injectMenu();
         /** Whether the menu item is disabled */
-        this.disabled = input(false, {
-            alias: 'ngpMenuItemDisabled',
-            transform: booleanAttribute,
-        });
-        setupButton({ disabled: this.disabled });
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", alias: 'ngpMenuItemDisabled',
+                transform: booleanAttribute }] : [{
+                alias: 'ngpMenuItemDisabled',
+                transform: booleanAttribute,
+            }]));
+        ngpButton({ disabled: this.disabled });
     }
     /** Close the menu when the item is clicked */
     onClick(event) {
@@ -300,8 +308,11 @@ class NgpMenuItem {
      * we want to close the menu and focus the parent menu item.
      */
     handleArrowKey(event) {
+        if (event instanceof KeyboardEvent === false) {
+            return;
+        }
         // if there is no parent menu, we don't want to do anything
-        const trigger = this.injector.get(NgpSubmenuTrigger, null, { optional: true });
+        const trigger = this.injector.get(NgpSubmenuTrigger, null, { optional: true, skipSelf: true });
         if (!trigger) {
             return;
         }
@@ -322,10 +333,10 @@ class NgpMenuItem {
     showSubmenuOnHover() {
         this.parentMenu?.closeSubmenus.next(this.elementRef.nativeElement);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.11", type: NgpMenuItem, isStandalone: true, selector: "[ngpMenuItem]", inputs: { disabled: { classPropertyName: "disabled", publicName: "ngpMenuItemDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "menuitem" }, listeners: { "click": "onClick($event)", "keydown.ArrowLeft": "handleArrowKey($event)", "keydown.ArrowRight": "handleArrowKey($event)", "mouseenter": "showSubmenuOnHover()" } }, exportAs: ["ngpMenuItem"], hostDirectives: [{ directive: i1.NgpRovingFocusItem, inputs: ["ngpRovingFocusItemDisabled", "ngpMenuItemDisabled"] }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.9", type: NgpMenuItem, isStandalone: true, selector: "[ngpMenuItem]", inputs: { disabled: { classPropertyName: "disabled", publicName: "ngpMenuItemDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "menuitem" }, listeners: { "click": "onClick($event)", "keydown.ArrowLeft": "handleArrowKey($event)", "keydown.ArrowRight": "handleArrowKey($event)", "mouseenter": "showSubmenuOnHover()" } }, exportAs: ["ngpMenuItem"], hostDirectives: [{ directive: i1.NgpRovingFocusItem, inputs: ["ngpRovingFocusItemDisabled", "ngpMenuItemDisabled"] }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpMenuItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuItem, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpMenuItem]',
@@ -340,7 +351,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
                         '(keydown.ArrowRight)': 'handleArrowKey($event)',
                     },
                 }]
-        }], ctorParameters: () => [], propDecorators: { showSubmenuOnHover: [{
+        }], ctorParameters: () => [], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpMenuItemDisabled", required: false }] }], showSubmenuOnHover: [{
                 type: HostListener,
                 args: ['mouseenter']
             }] } });
@@ -386,71 +397,74 @@ class NgpMenuTrigger {
         /**
          * Access the menu template ref or ComponentType.
          */
-        this.menu = input(undefined, {
-            alias: 'ngpMenuTrigger',
-        });
+        this.menu = input(undefined, ...(ngDevMode ? [{ debugName: "menu", alias: 'ngpMenuTrigger' }] : [{
+                alias: 'ngpMenuTrigger',
+            }]));
         /**
          * Define if the trigger should be disabled.
          * @default false
          */
-        this.disabled = input(false, {
-            alias: 'ngpMenuTriggerDisabled',
-            transform: booleanAttribute,
-        });
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", alias: 'ngpMenuTriggerDisabled',
+                transform: booleanAttribute }] : [{
+                alias: 'ngpMenuTriggerDisabled',
+                transform: booleanAttribute,
+            }]));
         /**
          * Define the placement of the menu relative to the trigger.
          * @default 'bottom-start'
          */
-        this.placement = input(this.config.placement, {
-            alias: 'ngpMenuTriggerPlacement',
-        });
+        this.placement = input(this.config.placement, ...(ngDevMode ? [{ debugName: "placement", alias: 'ngpMenuTriggerPlacement' }] : [{
+                alias: 'ngpMenuTriggerPlacement',
+            }]));
         /**
          * Define the offset of the menu relative to the trigger.
          * Can be a number (applies to mainAxis) or an object with mainAxis, crossAxis, and alignmentAxis.
          * @default 4
          */
-        this.offset = input(this.config.offset, {
-            alias: 'ngpMenuTriggerOffset',
-            transform: coerceOffset,
-        });
+        this.offset = input(this.config.offset, ...(ngDevMode ? [{ debugName: "offset", alias: 'ngpMenuTriggerOffset',
+                transform: coerceOffset }] : [{
+                alias: 'ngpMenuTriggerOffset',
+                transform: coerceOffset,
+            }]));
         /**
          * Define whether the menu should flip when there is not enough space for the menu.
          * @default true
          */
-        this.flip = input(this.config.flip, {
-            alias: 'ngpMenuTriggerFlip',
-            transform: booleanAttribute,
-        });
+        this.flip = input(this.config.flip, ...(ngDevMode ? [{ debugName: "flip", alias: 'ngpMenuTriggerFlip',
+                transform: booleanAttribute }] : [{
+                alias: 'ngpMenuTriggerFlip',
+                transform: booleanAttribute,
+            }]));
         /**
          * Define the container in which the menu should be attached.
          * @default document.body
          */
-        this.container = input(this.config.container, {
-            alias: 'ngpMenuTriggerContainer',
-        });
+        this.container = input(this.config.container, ...(ngDevMode ? [{ debugName: "container", alias: 'ngpMenuTriggerContainer' }] : [{
+                alias: 'ngpMenuTriggerContainer',
+            }]));
         /**
          * Defines how the menu behaves when the window is scrolled.
          * @default 'block'
          */
-        this.scrollBehavior = input(this.config.scrollBehavior, {
-            alias: 'ngpMenuTriggerScrollBehavior',
-        });
+        this.scrollBehavior = input(this.config.scrollBehavior, ...(ngDevMode ? [{ debugName: "scrollBehavior", alias: 'ngpMenuTriggerScrollBehavior' }] : [{
+                alias: 'ngpMenuTriggerScrollBehavior',
+            }]));
         /**
          * Provide context to the menu. This can be used to pass data to the menu content.
          */
-        this.context = input(undefined, {
-            alias: 'ngpMenuTriggerContext',
-        });
+        this.context = input(undefined, ...(ngDevMode ? [{ debugName: "context", alias: 'ngpMenuTriggerContext' }] : [{
+                alias: 'ngpMenuTriggerContext',
+            }]));
         /**
          * The overlay that manages the menu
          * @internal
          */
-        this.overlay = signal(null);
+        this.overlay = signal(null, ...(ngDevMode ? [{ debugName: "overlay" }] : []));
         /**
          * The open state of the menu.
          * @internal
          */
-        this.open = computed(() => this.overlay()?.isOpen() ?? false);
+        this.open = computed(() => this.overlay()?.isOpen() ?? false, ...(ngDevMode ? [{ debugName: "open" }] : []));
         /**
          * The menu trigger state.
          */
@@ -525,10 +539,10 @@ class NgpMenuTrigger {
         };
         this.overlay.set(createOverlay(config));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpMenuTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.11", type: NgpMenuTrigger, isStandalone: true, selector: "[ngpMenuTrigger]", inputs: { menu: { classPropertyName: "menu", publicName: "ngpMenuTrigger", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpMenuTriggerDisabled", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "ngpMenuTriggerPlacement", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "ngpMenuTriggerOffset", isSignal: true, isRequired: false, transformFunction: null }, flip: { classPropertyName: "flip", publicName: "ngpMenuTriggerFlip", isSignal: true, isRequired: false, transformFunction: null }, container: { classPropertyName: "container", publicName: "ngpMenuTriggerContainer", isSignal: true, isRequired: false, transformFunction: null }, scrollBehavior: { classPropertyName: "scrollBehavior", publicName: "ngpMenuTriggerScrollBehavior", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "ngpMenuTriggerContext", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "aria-haspopup": "true" }, listeners: { "click": "onClick($event)" }, properties: { "attr.aria-expanded": "open() ? \"true\" : \"false\"", "attr.data-open": "open() ? \"\" : null", "attr.data-placement": "state.placement()" } }, providers: [provideMenuTriggerState({ inherit: false })], exportAs: ["ngpMenuTrigger"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.9", type: NgpMenuTrigger, isStandalone: true, selector: "[ngpMenuTrigger]", inputs: { menu: { classPropertyName: "menu", publicName: "ngpMenuTrigger", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpMenuTriggerDisabled", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "ngpMenuTriggerPlacement", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "ngpMenuTriggerOffset", isSignal: true, isRequired: false, transformFunction: null }, flip: { classPropertyName: "flip", publicName: "ngpMenuTriggerFlip", isSignal: true, isRequired: false, transformFunction: null }, container: { classPropertyName: "container", publicName: "ngpMenuTriggerContainer", isSignal: true, isRequired: false, transformFunction: null }, scrollBehavior: { classPropertyName: "scrollBehavior", publicName: "ngpMenuTriggerScrollBehavior", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "ngpMenuTriggerContext", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "aria-haspopup": "true" }, listeners: { "click": "onClick($event)" }, properties: { "attr.aria-expanded": "open() ? \"true\" : \"false\"", "attr.data-open": "open() ? \"\" : null", "attr.data-placement": "state.placement()" } }, providers: [provideMenuTriggerState({ inherit: false })], exportAs: ["ngpMenuTrigger"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpMenuTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpMenuTrigger]',
@@ -542,7 +556,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
                         '(click)': 'onClick($event)',
                     },
                 }]
-        }] });
+        }], propDecorators: { menu: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpMenuTrigger", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpMenuTriggerDisabled", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpMenuTriggerPlacement", required: false }] }], offset: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpMenuTriggerOffset", required: false }] }], flip: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpMenuTriggerFlip", required: false }] }], container: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpMenuTriggerContainer", required: false }] }], scrollBehavior: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpMenuTriggerScrollBehavior", required: false }] }], context: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpMenuTriggerContext", required: false }] }] } });
 
 /**
  * The `NgpMenu` is a container for menu items.
@@ -563,14 +577,14 @@ class NgpMenu {
         this.menuTrigger().hide(origin);
         this.parentMenu?.closeAllMenus(origin);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpMenu, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.11", type: NgpMenu, isStandalone: true, selector: "[ngpMenu]", host: { attributes: { "role": "menu", "data-overlay": "" }, properties: { "style.left.px": "overlay.position().x", "style.top.px": "overlay.position().y", "style.--ngp-menu-trigger-width.px": "overlay.triggerWidth()", "style.--ngp-menu-transform-origin": "overlay.transformOrigin()", "attr.data-placement": "overlay.finalPlacement()" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenu, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.9", type: NgpMenu, isStandalone: true, selector: "[ngpMenu]", host: { attributes: { "role": "menu", "data-overlay": "" }, properties: { "style.left.px": "overlay.position().x", "style.top.px": "overlay.position().y", "style.--ngp-menu-trigger-width.px": "overlay.triggerWidth()", "style.--ngp-menu-transform-origin": "overlay.transformOrigin()", "attr.data-placement": "overlay.finalPlacement()" } }, providers: [
             // ensure we don't inherit the focus group from the parent menu if there is one
             provideRovingFocusGroup(NgpRovingFocusGroup, { inherit: false }),
             provideMenu(NgpMenu),
         ], exportAs: ["ngpMenu"], hostDirectives: [{ directive: i1.NgpRovingFocusGroup }, { directive: i2.NgpFocusTrap }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpMenu, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenu, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpMenu]',