ng-primitives 0.120.4 → 0.121.0

package/fesm2022/ng-primitives-menu.mjs

@@ -1,4 +1,4 @@
-import { createOverlay, injectOverlay, coerceOffset, coerceFlip, coerceShift } from 'ng-primitives/portal';
+import { createOverlay, injectOverlay, coerceOffset, coerceFlip, coerceShift, provideControlContainerIsolation } from 'ng-primitives/portal';
 export { injectOverlayContext as injectMenuContext } from 'ng-primitives/portal';
 import * as i0 from '@angular/core';
 import { InjectionToken, inject, Injector, ViewContainerRef, signal, computed, effect, input, booleanAttribute, Directive, output, numberAttribute } from '@angular/core';
@@ -61,14 +61,14 @@ const [NgpMenuTriggerStateToken, ngpMenuTrigger, _injectMenuTriggerState, provid
     const offset = controlled(_offset);
     const context = controlled(_context);
     // Internal state
-    const overlay = signal(null, ...(ngDevMode ? [{ debugName: "overlay" }] : []));
-    const open = computed(() => overlay()?.isOpen() ?? false, ...(ngDevMode ? [{ debugName: "open" }] : []));
-    const openOrigin = signal('program', ...(ngDevMode ? [{ debugName: "openOrigin" }] : []));
-    const closeOrigin = signal('program', ...(ngDevMode ? [{ debugName: "closeOrigin" }] : []));
+    const overlay = signal(null, ...(ngDevMode ? [{ debugName: "overlay" }] : /* istanbul ignore next */ []));
+    const open = computed(() => overlay()?.isOpen() ?? false, ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    const openOrigin = signal('program', ...(ngDevMode ? [{ debugName: "openOrigin" }] : /* istanbul ignore next */ []));
+    const closeOrigin = signal('program', ...(ngDevMode ? [{ debugName: "closeOrigin" }] : /* istanbul ignore next */ []));
     // Track whether pointer is over trigger or content (for hover triggers)
-    const pointerOverTrigger = signal(false, ...(ngDevMode ? [{ debugName: "pointerOverTrigger" }] : []));
-    const pointerOverContent = signal(false, ...(ngDevMode ? [{ debugName: "pointerOverContent" }] : []));
-    const isPointerOverMenuArea = computed(() => pointerOverTrigger() || pointerOverContent(), ...(ngDevMode ? [{ debugName: "isPointerOverMenuArea" }] : []));
+    const pointerOverTrigger = signal(false, ...(ngDevMode ? [{ debugName: "pointerOverTrigger" }] : /* istanbul ignore next */ []));
+    const pointerOverContent = signal(false, ...(ngDevMode ? [{ debugName: "pointerOverContent" }] : /* istanbul ignore next */ []));
+    const isPointerOverMenuArea = computed(() => pointerOverTrigger() || pointerOverContent(), ...(ngDevMode ? [{ debugName: "isPointerOverMenuArea" }] : /* istanbul ignore next */ []));
     // Reset pointer tracking when menu closes
     effect(() => {
         const isOpen = open();
@@ -80,7 +80,7 @@ const [NgpMenuTriggerStateToken, ngpMenuTrigger, _injectMenuTriggerState, provid
     });
     // Computed signal to determine if focus should be restored
     // Only restore if opened via keyboard OR closed via keyboard
-    const shouldRestoreFocus = computed(() => openOrigin() === 'keyboard' || closeOrigin() === 'keyboard', ...(ngDevMode ? [{ debugName: "shouldRestoreFocus" }] : []));
+    const shouldRestoreFocus = computed(() => openOrigin() === 'keyboard' || closeOrigin() === 'keyboard', ...(ngDevMode ? [{ debugName: "shouldRestoreFocus" }] : /* istanbul ignore next */ []));
     // Host bindings
     attrBinding(element, 'aria-haspopup', 'true');
     attrBinding(element, 'aria-expanded', open);
@@ -336,8 +336,8 @@ const [NgpMenuTriggerStateToken, ngpMenuTrigger, _injectMenuTriggerState, provid
         flip,
     };
 });
-function injectMenuTriggerState() {
-    return _injectMenuTriggerState();
+function injectMenuTriggerState(options) {
+    return _injectMenuTriggerState(options);
 }
 
 const [NgpMenuStateToken, ngpMenu, injectMenuState, provideMenuState] = createPrimitive('NgpMenu', ({}) => {
@@ -348,7 +348,7 @@ const [NgpMenuStateToken, ngpMenu, injectMenuState, provideMenuState] = createPr
     const parentMenu = injectMenuState({ optional: true, skipSelf: true });
     // Always trap focus in menus per WAI-ARIA guidelines (Tab should not navigate within menus)
     // Pass the open origin so focus trap uses the correct origin for :focus-visible styling
-    const openOrigin = computed(() => menuTrigger()?.openOrigin() ?? 'program', ...(ngDevMode ? [{ debugName: "openOrigin" }] : []));
+    const openOrigin = computed(() => menuTrigger()?.openOrigin() ?? 'program', ...(ngDevMode ? [{ debugName: "openOrigin" }] : /* istanbul ignore next */ []));
     ngpFocusTrap({
         focusOrigin: openOrigin,
     });
@@ -438,9 +438,9 @@ const [NgpSubmenuTriggerStateToken, ngpSubmenuTrigger, injectSubmenuTriggerState
     const placement = controlled(_placement);
     const flip = controlled(_flip);
     const offset = controlled(_offset);
-    const overlay = signal(null, ...(ngDevMode ? [{ debugName: "overlay" }] : []));
-    const open = computed(() => overlay()?.isOpen() ?? false, ...(ngDevMode ? [{ debugName: "open" }] : []));
-    const openOrigin = signal('program', ...(ngDevMode ? [{ debugName: "openOrigin" }] : []));
+    const overlay = signal(null, ...(ngDevMode ? [{ debugName: "overlay" }] : /* istanbul ignore next */ []));
+    const open = computed(() => overlay()?.isOpen() ?? false, ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    const openOrigin = signal('program', ...(ngDevMode ? [{ debugName: "openOrigin" }] : /* istanbul ignore next */ []));
     // Subscribe to parent menu's closeSubmenus
     parentMenu()
         ?.closeSubmenus.pipe(safeTakeUntilDestroyed())
@@ -601,45 +601,32 @@ class NgpSubmenuTrigger {
         /**
          * Access the submenu template ref.
          */
-        this.menu = input(undefined, ...(ngDevMode ? [{ debugName: "menu", alias: 'ngpSubmenuTrigger' }] : [{
-                alias: 'ngpSubmenuTrigger',
-            }]));
+        this.menu = input(undefined, { ...(ngDevMode ? { debugName: "menu" } : /* istanbul ignore next */ {}), alias: 'ngpSubmenuTrigger' });
         /**
          * Define if the trigger should be disabled.
          * @default false
          */
-        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", alias: 'ngpSubmenuTriggerDisabled',
-                transform: booleanAttribute }] : [{
-                alias: 'ngpSubmenuTriggerDisabled',
-                transform: booleanAttribute,
-            }]));
+        this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), alias: 'ngpSubmenuTriggerDisabled',
+            transform: booleanAttribute });
         /**
          * Define the placement of the menu relative to the trigger.
          * @default 'right-start'
          */
-        this.placement = input('right-start', ...(ngDevMode ? [{ debugName: "placement", alias: 'ngpSubmenuTriggerPlacement' }] : [{
-                alias: 'ngpSubmenuTriggerPlacement',
-            }]));
+        this.placement = input('right-start', { ...(ngDevMode ? { debugName: "placement" } : /* istanbul ignore next */ {}), 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, ...(ngDevMode ? [{ debugName: "offset", alias: 'ngpSubmenuTriggerOffset',
-                transform: coerceOffset }] : [{
-                alias: 'ngpSubmenuTriggerOffset',
-                transform: coerceOffset,
-            }]));
+        this.offset = input(0, { ...(ngDevMode ? { debugName: "offset" } : /* istanbul ignore next */ {}), alias: 'ngpSubmenuTriggerOffset',
+            transform: coerceOffset });
         /**
          * Define whether the menu should flip when there is not enough space for the menu.
          * Can be a boolean to enable/disable, or an object with padding and fallbackPlacements options.
          * @default true
          */
-        this.flip = input(true, ...(ngDevMode ? [{ debugName: "flip", alias: 'ngpSubmenuTriggerFlip',
-                transform: coerceFlip }] : [{
-                alias: 'ngpSubmenuTriggerFlip',
-                transform: coerceFlip,
-            }]));
+        this.flip = input(true, { ...(ngDevMode ? { debugName: "flip" } : /* istanbul ignore next */ {}), alias: 'ngpSubmenuTriggerFlip',
+            transform: coerceFlip });
         /**
          * Access the menu trigger state.
          */
@@ -677,15 +664,15 @@ class NgpSubmenuTrigger {
     focus(origin = 'program') {
         this.state.focus(origin);
     }
-    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 } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpSubmenuTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.14", 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 } }, providers: [
             provideSubmenuTriggerState(),
             // Also provide as NgpMenuTriggerStateToken so the submenu's menu-state
             // can find this trigger's openOrigin for :focus-visible styling
             { provide: NgpMenuTriggerStateToken, useExisting: NgpSubmenuTriggerStateToken },
         ], exportAs: ["ngpSubmenuTrigger"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpSubmenuTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpSubmenuTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpSubmenuTrigger]',
@@ -755,24 +742,18 @@ const [NgpMenuItemStateToken, ngpMenuItem, injectMenuItemState, provideMenuItemS
 class NgpMenuItem {
     constructor() {
         /** Whether the menu item is disabled */
-        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", alias: 'ngpMenuItemDisabled',
-                transform: booleanAttribute }] : [{
-                alias: 'ngpMenuItemDisabled',
-                transform: booleanAttribute,
-            }]));
+        this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), alias: 'ngpMenuItemDisabled',
+            transform: booleanAttribute });
         /** Whether the menu should close when this item is selected */
-        this.closeOnSelect = input(true, ...(ngDevMode ? [{ debugName: "closeOnSelect", alias: 'ngpMenuItemCloseOnSelect',
-                transform: booleanAttribute }] : [{
-                alias: 'ngpMenuItemCloseOnSelect',
-                transform: booleanAttribute,
-            }]));
+        this.closeOnSelect = input(true, { ...(ngDevMode ? { debugName: "closeOnSelect" } : /* istanbul ignore next */ {}), alias: 'ngpMenuItemCloseOnSelect',
+            transform: booleanAttribute });
         ngpMenuItem({ disabled: this.disabled, closeOnSelect: this.closeOnSelect });
         ngpRovingFocusItem({ disabled: this.disabled });
     }
-    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 }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "ngpMenuItemCloseOnSelect", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideMenuItemState(), provideRovingFocusItemState()], exportAs: ["ngpMenuItem"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.14", type: NgpMenuItem, isStandalone: true, selector: "[ngpMenuItem]", inputs: { disabled: { classPropertyName: "disabled", publicName: "ngpMenuItemDisabled", isSignal: true, isRequired: false, transformFunction: null }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "ngpMenuItemCloseOnSelect", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideMenuItemState(), provideRovingFocusItemState()], exportAs: ["ngpMenuItem"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenuItem, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpMenuItem]',
@@ -814,21 +795,15 @@ const [NgpMenuItemCheckboxStateToken, ngpMenuItemCheckbox, injectMenuItemCheckbo
 class NgpMenuItemCheckbox {
     constructor() {
         /** Whether the checkbox is checked */
-        this.checked = input(false, ...(ngDevMode ? [{ debugName: "checked", alias: 'ngpMenuItemCheckboxChecked',
-                transform: booleanAttribute }] : [{
-                alias: 'ngpMenuItemCheckboxChecked',
-                transform: booleanAttribute,
-            }]));
+        this.checked = input(false, { ...(ngDevMode ? { debugName: "checked" } : /* istanbul ignore next */ {}), alias: 'ngpMenuItemCheckboxChecked',
+            transform: booleanAttribute });
         /** Event emitted when the checked state changes */
         this.checkedChange = output({
             alias: 'ngpMenuItemCheckboxCheckedChange',
         });
         /** Whether the menu item checkbox is disabled */
-        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", alias: 'ngpMenuItemCheckboxDisabled',
-                transform: booleanAttribute }] : [{
-                alias: 'ngpMenuItemCheckboxDisabled',
-                transform: booleanAttribute,
-            }]));
+        this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), alias: 'ngpMenuItemCheckboxDisabled',
+            transform: booleanAttribute });
         ngpMenuItemCheckbox({
             checked: this.checked,
             disabled: this.disabled,
@@ -836,10 +811,10 @@ class NgpMenuItemCheckbox {
         });
         ngpRovingFocusItem({ disabled: this.disabled });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuItemCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.9", type: NgpMenuItemCheckbox, isStandalone: true, selector: "[ngpMenuItemCheckbox]", inputs: { checked: { classPropertyName: "checked", publicName: "ngpMenuItemCheckboxChecked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpMenuItemCheckboxDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checkedChange: "ngpMenuItemCheckboxCheckedChange" }, providers: [provideMenuItemCheckboxState(), provideRovingFocusItemState()], exportAs: ["ngpMenuItemCheckbox"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenuItemCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.14", type: NgpMenuItemCheckbox, isStandalone: true, selector: "[ngpMenuItemCheckbox]", inputs: { checked: { classPropertyName: "checked", publicName: "ngpMenuItemCheckboxChecked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpMenuItemCheckboxDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checkedChange: "ngpMenuItemCheckboxCheckedChange" }, providers: [provideMenuItemCheckboxState(), provideRovingFocusItemState()], exportAs: ["ngpMenuItemCheckbox"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuItemCheckbox, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenuItemCheckbox, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpMenuItemCheckbox]',
@@ -875,7 +850,7 @@ const [NgpMenuItemRadioStateToken, ngpMenuItemRadio, injectMenuItemRadioState, p
     // Use base menu item behavior but don't close on select
     ngpMenuItem({ disabled, closeOnSelect: signal(false), role: 'menuitemradio' });
     // Computed checked state
-    const checked = computed(() => radioGroup()?.value() === value(), ...(ngDevMode ? [{ debugName: "checked" }] : []));
+    const checked = computed(() => radioGroup()?.value() === value(), ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
     // Host bindings
     attrBinding(element, 'aria-checked', checked);
     dataBinding(element, 'data-checked', checked);
@@ -900,13 +875,13 @@ class NgpMenuItemIndicator {
         const element = injectElementRef();
         const checkboxState = injectMenuItemCheckboxState({ optional: true });
         const radioState = injectMenuItemRadioState({ optional: true });
-        const checked = computed(() => checkboxState()?.checked() ?? radioState()?.checked() ?? false, ...(ngDevMode ? [{ debugName: "checked" }] : []));
+        const checked = computed(() => checkboxState()?.checked() ?? radioState()?.checked() ?? false, ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
         dataBinding(element, 'data-checked', checked);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuItemIndicator, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.9", type: NgpMenuItemIndicator, isStandalone: true, selector: "[ngpMenuItemIndicator]", exportAs: ["ngpMenuItemIndicator"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenuItemIndicator, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.14", type: NgpMenuItemIndicator, isStandalone: true, selector: "[ngpMenuItemIndicator]", exportAs: ["ngpMenuItemIndicator"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuItemIndicator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenuItemIndicator, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpMenuItemIndicator]',
@@ -920,9 +895,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImpor
 class NgpMenuItemRadioGroup {
     constructor() {
         /** The current value of the radio group */
-        this.value = input(null, ...(ngDevMode ? [{ debugName: "value", alias: 'ngpMenuItemRadioGroupValue' }] : [{
-                alias: 'ngpMenuItemRadioGroupValue',
-            }]));
+        this.value = input(null, { ...(ngDevMode ? { debugName: "value" } : /* istanbul ignore next */ {}), alias: 'ngpMenuItemRadioGroupValue' });
         /** Event emitted when the value changes */
         this.valueChange = output({
             alias: 'ngpMenuItemRadioGroupValueChange',
@@ -932,10 +905,10 @@ class NgpMenuItemRadioGroup {
             onValueChange: value => this.valueChange.emit(value),
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuItemRadioGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.9", type: NgpMenuItemRadioGroup, isStandalone: true, selector: "[ngpMenuItemRadioGroup]", inputs: { value: { classPropertyName: "value", publicName: "ngpMenuItemRadioGroupValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "ngpMenuItemRadioGroupValueChange" }, providers: [provideMenuItemRadioGroupState()], exportAs: ["ngpMenuItemRadioGroup"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenuItemRadioGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.14", type: NgpMenuItemRadioGroup, isStandalone: true, selector: "[ngpMenuItemRadioGroup]", inputs: { value: { classPropertyName: "value", publicName: "ngpMenuItemRadioGroupValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "ngpMenuItemRadioGroupValueChange" }, providers: [provideMenuItemRadioGroupState()], exportAs: ["ngpMenuItemRadioGroup"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuItemRadioGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenuItemRadioGroup, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpMenuItemRadioGroup]',
@@ -950,22 +923,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImpor
 class NgpMenuItemRadio {
     constructor() {
         /** The value this radio item represents */
-        this.value = input.required(...(ngDevMode ? [{ debugName: "value", alias: 'ngpMenuItemRadioValue' }] : [{
-                alias: 'ngpMenuItemRadioValue',
-            }]));
+        this.value = input.required({ ...(ngDevMode ? { debugName: "value" } : /* istanbul ignore next */ {}), alias: 'ngpMenuItemRadioValue' });
         /** Whether the radio item is disabled */
-        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", alias: 'ngpMenuItemRadioDisabled',
-                transform: booleanAttribute }] : [{
-                alias: 'ngpMenuItemRadioDisabled',
-                transform: booleanAttribute,
-            }]));
+        this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), alias: 'ngpMenuItemRadioDisabled',
+            transform: booleanAttribute });
         ngpMenuItemRadio({ value: this.value, disabled: this.disabled });
         ngpRovingFocusItem({ disabled: this.disabled });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuItemRadio, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.9", type: NgpMenuItemRadio, isStandalone: true, selector: "[ngpMenuItemRadio]", inputs: { value: { classPropertyName: "value", publicName: "ngpMenuItemRadioValue", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpMenuItemRadioDisabled", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideMenuItemRadioState(), provideRovingFocusItemState()], exportAs: ["ngpMenuItemRadio"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenuItemRadio, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.14", type: NgpMenuItemRadio, isStandalone: true, selector: "[ngpMenuItemRadio]", inputs: { value: { classPropertyName: "value", publicName: "ngpMenuItemRadioValue", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpMenuItemRadioDisabled", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideMenuItemRadioState(), provideRovingFocusItemState()], exportAs: ["ngpMenuItemRadio"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuItemRadio, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenuItemRadio, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpMenuItemRadio]',
@@ -986,111 +954,78 @@ class NgpMenuTrigger {
         /**
          * Access the menu template ref or ComponentType.
          */
-        this.menu = input(undefined, ...(ngDevMode ? [{ debugName: "menu", alias: 'ngpMenuTrigger' }] : [{
-                alias: 'ngpMenuTrigger',
-            }]));
+        this.menu = input(undefined, { ...(ngDevMode ? { debugName: "menu" } : /* istanbul ignore next */ {}), alias: 'ngpMenuTrigger' });
         /**
          * Define if the trigger should be disabled.
          * @default false
          */
-        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", alias: 'ngpMenuTriggerDisabled',
-                transform: booleanAttribute }] : [{
-                alias: 'ngpMenuTriggerDisabled',
-                transform: booleanAttribute,
-            }]));
+        this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), alias: 'ngpMenuTriggerDisabled',
+            transform: booleanAttribute });
         /**
          * Define the placement of the menu relative to the trigger.
          * @default 'bottom-start'
          */
-        this.placement = input(this.config.placement, ...(ngDevMode ? [{ debugName: "placement", alias: 'ngpMenuTriggerPlacement' }] : [{
-                alias: 'ngpMenuTriggerPlacement',
-            }]));
+        this.placement = input(this.config.placement, { ...(ngDevMode ? { debugName: "placement" } : /* istanbul ignore next */ {}), 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, ...(ngDevMode ? [{ debugName: "offset", alias: 'ngpMenuTriggerOffset',
-                transform: coerceOffset }] : [{
-                alias: 'ngpMenuTriggerOffset',
-                transform: coerceOffset,
-            }]));
+        this.offset = input(this.config.offset, { ...(ngDevMode ? { debugName: "offset" } : /* istanbul ignore next */ {}), alias: 'ngpMenuTriggerOffset',
+            transform: coerceOffset });
         /**
          * Define whether the menu should flip when there is not enough space for the menu.
          * Can be a boolean to enable/disable, or an object with padding and fallbackPlacements options.
          * @default true
          */
-        this.flip = input(this.config.flip, ...(ngDevMode ? [{ debugName: "flip", alias: 'ngpMenuTriggerFlip',
-                transform: coerceFlip }] : [{
-                alias: 'ngpMenuTriggerFlip',
-                transform: coerceFlip,
-            }]));
+        this.flip = input(this.config.flip, { ...(ngDevMode ? { debugName: "flip" } : /* istanbul ignore next */ {}), alias: 'ngpMenuTriggerFlip',
+            transform: coerceFlip });
         /**
          * Configure shift behavior to keep the menu in view.
          * Can be a boolean to enable/disable, or an object with padding and limiter options.
          * @default undefined (enabled by default in overlay)
          */
-        this.shift = input(this.config.shift, ...(ngDevMode ? [{ debugName: "shift", alias: 'ngpMenuTriggerShift',
-                transform: coerceShift }] : [{
-                alias: 'ngpMenuTriggerShift',
-                transform: coerceShift,
-            }]));
+        this.shift = input(this.config.shift, { ...(ngDevMode ? { debugName: "shift" } : /* istanbul ignore next */ {}), alias: 'ngpMenuTriggerShift',
+            transform: coerceShift });
         /**
          * Define the container in which the menu should be attached.
          * @default document.body
          */
-        this.container = input(this.config.container, ...(ngDevMode ? [{ debugName: "container", alias: 'ngpMenuTriggerContainer' }] : [{
-                alias: 'ngpMenuTriggerContainer',
-            }]));
+        this.container = input(this.config.container, { ...(ngDevMode ? { debugName: "container" } : /* istanbul ignore next */ {}), alias: 'ngpMenuTriggerContainer' });
         /**
          * Defines how the menu behaves when the window is scrolled.
          * @default 'block'
          */
-        this.scrollBehavior = input(this.config.scrollBehavior, ...(ngDevMode ? [{ debugName: "scrollBehavior", alias: 'ngpMenuTriggerScrollBehavior' }] : [{
-                alias: 'ngpMenuTriggerScrollBehavior',
-            }]));
+        this.scrollBehavior = input(this.config.scrollBehavior, { ...(ngDevMode ? { debugName: "scrollBehavior" } : /* istanbul ignore next */ {}), alias: 'ngpMenuTriggerScrollBehavior' });
         /**
          * Define the cooldown duration in milliseconds.
          * When moving from one menu to another within this duration,
          * the showDelay is skipped for the new menu.
          * @default 0
          */
-        this.cooldown = input(this.config.cooldown, ...(ngDevMode ? [{ debugName: "cooldown", alias: 'ngpMenuTriggerCooldown',
-                transform: numberAttribute }] : [{
-                alias: 'ngpMenuTriggerCooldown',
-                transform: numberAttribute,
-            }]));
+        this.cooldown = input(this.config.cooldown, { ...(ngDevMode ? { debugName: "cooldown" } : /* istanbul ignore next */ {}), alias: 'ngpMenuTriggerCooldown',
+            transform: numberAttribute });
         /**
          * Provide context to the menu. This can be used to pass data to the menu content.
          */
-        this.context = input(undefined, ...(ngDevMode ? [{ debugName: "context", alias: 'ngpMenuTriggerContext' }] : [{
-                alias: 'ngpMenuTriggerContext',
-            }]));
+        this.context = input(undefined, { ...(ngDevMode ? { debugName: "context" } : /* istanbul ignore next */ {}), alias: 'ngpMenuTriggerContext' });
         /**
          * Define which trigger types are enabled for the menu.
          * @default ['click']
          */
-        this.triggers = input(this.config.triggers, ...(ngDevMode ? [{ debugName: "triggers", alias: 'ngpMenuTriggerOpenTriggers' }] : [{
-                alias: 'ngpMenuTriggerOpenTriggers',
-            }]));
+        this.triggers = input(this.config.triggers, { ...(ngDevMode ? { debugName: "triggers" } : /* istanbul ignore next */ {}), alias: 'ngpMenuTriggerOpenTriggers' });
         /**
          * Define the delay before the menu is displayed (hover/focus triggers).
          * @default 0
          */
-        this.showDelay = input(this.config.showDelay, ...(ngDevMode ? [{ debugName: "showDelay", alias: 'ngpMenuTriggerShowDelay',
-                transform: numberAttribute }] : [{
-                alias: 'ngpMenuTriggerShowDelay',
-                transform: numberAttribute,
-            }]));
+        this.showDelay = input(this.config.showDelay, { ...(ngDevMode ? { debugName: "showDelay" } : /* istanbul ignore next */ {}), alias: 'ngpMenuTriggerShowDelay',
+            transform: numberAttribute });
         /**
          * Define the delay before the menu is hidden (hover/focus triggers).
          * @default 0
          */
-        this.hideDelay = input(this.config.hideDelay, ...(ngDevMode ? [{ debugName: "hideDelay", alias: 'ngpMenuTriggerHideDelay',
-                transform: numberAttribute }] : [{
-                alias: 'ngpMenuTriggerHideDelay',
-                transform: numberAttribute,
-            }]));
+        this.hideDelay = input(this.config.hideDelay, { ...(ngDevMode ? { debugName: "hideDelay" } : /* istanbul ignore next */ {}), alias: 'ngpMenuTriggerHideDelay',
+            transform: numberAttribute });
         /**
          * The menu trigger state.
          */
@@ -1131,10 +1066,10 @@ class NgpMenuTrigger {
     toggle(event) {
         this.state.toggle(event);
     }
-    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 }, shift: { classPropertyName: "shift", publicName: "ngpMenuTriggerShift", 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 }, cooldown: { classPropertyName: "cooldown", publicName: "ngpMenuTriggerCooldown", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "ngpMenuTriggerContext", isSignal: true, isRequired: false, transformFunction: null }, triggers: { classPropertyName: "triggers", publicName: "ngpMenuTriggerOpenTriggers", isSignal: true, isRequired: false, transformFunction: null }, showDelay: { classPropertyName: "showDelay", publicName: "ngpMenuTriggerShowDelay", isSignal: true, isRequired: false, transformFunction: null }, hideDelay: { classPropertyName: "hideDelay", publicName: "ngpMenuTriggerHideDelay", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideMenuTriggerState()], exportAs: ["ngpMenuTrigger"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenuTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.14", 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 }, shift: { classPropertyName: "shift", publicName: "ngpMenuTriggerShift", 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 }, cooldown: { classPropertyName: "cooldown", publicName: "ngpMenuTriggerCooldown", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "ngpMenuTriggerContext", isSignal: true, isRequired: false, transformFunction: null }, triggers: { classPropertyName: "triggers", publicName: "ngpMenuTriggerOpenTriggers", isSignal: true, isRequired: false, transformFunction: null }, showDelay: { classPropertyName: "showDelay", publicName: "ngpMenuTriggerShowDelay", isSignal: true, isRequired: false, transformFunction: null }, hideDelay: { classPropertyName: "hideDelay", publicName: "ngpMenuTriggerHideDelay", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideMenuTriggerState()], exportAs: ["ngpMenuTrigger"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenuTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenuTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpMenuTrigger]',
@@ -1153,11 +1088,8 @@ class NgpMenu {
          * Whether focus should wrap around when reaching the end of the menu.
          * @default true
          */
-        this.wrap = input(this.config.wrap, ...(ngDevMode ? [{ debugName: "wrap", alias: 'ngpMenuWrap',
-                transform: booleanAttribute }] : [{
-                alias: 'ngpMenuWrap',
-                transform: booleanAttribute,
-            }]));
+        this.wrap = input(this.config.wrap, { ...(ngDevMode ? { debugName: "wrap" } : /* istanbul ignore next */ {}), alias: 'ngpMenuWrap',
+            transform: booleanAttribute });
         this.state = ngpMenu({ wrap: this.wrap });
         ngpRovingFocusGroup({ inherit: false, wrap: this.wrap });
     }
@@ -1165,15 +1097,16 @@ class NgpMenu {
     closeAllMenus(origin) {
         this.state.closeAllMenus(origin);
     }
-    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: "17.1.0", version: "20.3.9", type: NgpMenu, isStandalone: true, selector: "[ngpMenu]", inputs: { wrap: { classPropertyName: "wrap", publicName: "ngpMenuWrap", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenu, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.14", type: NgpMenu, isStandalone: true, selector: "[ngpMenu]", inputs: { wrap: { classPropertyName: "wrap", publicName: "ngpMenuWrap", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
             // ensure we don't inherit the focus group from the parent menu if there is one
             provideRovingFocusGroupState({ inherit: false }),
             provideMenuState({ inherit: false }),
             provideFocusTrapState(),
+            provideControlContainerIsolation(),
         ], exportAs: ["ngpMenu"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpMenu, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: NgpMenu, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpMenu]',
@@ -1183,6 +1116,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImpor
                         provideRovingFocusGroupState({ inherit: false }),
                         provideMenuState({ inherit: false }),
                         provideFocusTrapState(),
+                        provideControlContainerIsolation(),
                     ],
                 }]
         }], ctorParameters: () => [], propDecorators: { wrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpMenuWrap", required: false }] }] } });