@radix-ng/primitives 0.43.0 → 0.44.0

package/fesm2022/radix-ng-primitives-popover.mjs

@@ -47,40 +47,40 @@ class RdxPopoverContentDirective {
         /** @ignore */
         this.connectedOverlay = inject(CdkConnectedOverlay);
         /** @ignore */
-        this.name = computed(() => `rdx-popover-trigger-${this.popoverRoot.uniqueId()}`);
+        this.name = computed(() => `rdx-popover-trigger-${this.popoverRoot.uniqueId()}`, ...(ngDevMode ? [{ debugName: "name" }] : []));
         /**
          * @description The preferred side of the trigger to render against when open. Will be reversed when collisions occur and avoidCollisions is enabled.
          * @default top
          */
-        this.side = input(RdxPositionSide.Top);
+        this.side = input(RdxPositionSide.Top, ...(ngDevMode ? [{ debugName: "side" }] : []));
         /**
          * @description The distance in pixels from the trigger.
          * @default undefined
          */
-        this.sideOffset = input(NaN, {
-            transform: numberAttribute
-        });
+        this.sideOffset = input(NaN, ...(ngDevMode ? [{ debugName: "sideOffset", transform: numberAttribute }] : [{
+                transform: numberAttribute
+            }]));
         /**
          * @description The preferred alignment against the trigger. May change when collisions occur.
          * @default center
          */
-        this.align = input(RdxPositionAlign.Center);
+        this.align = input(RdxPositionAlign.Center, ...(ngDevMode ? [{ debugName: "align" }] : []));
         /**
          * @description An offset in pixels from the "start" or "end" alignment options.
          * @default undefined
          */
-        this.alignOffset = input(NaN, {
-            transform: numberAttribute
-        });
+        this.alignOffset = input(NaN, ...(ngDevMode ? [{ debugName: "alignOffset", transform: numberAttribute }] : [{
+                transform: numberAttribute
+            }]));
         /**
          * @description Whether to add some alternate positions of the content.
          * @default false
          */
-        this.alternatePositionsDisabled = input(false, { transform: booleanAttribute });
+        this.alternatePositionsDisabled = input(false, ...(ngDevMode ? [{ debugName: "alternatePositionsDisabled", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
         /** @description Whether to prevent `onOverlayEscapeKeyDown` handler from calling. */
-        this.onOverlayEscapeKeyDownDisabled = input(false, { transform: booleanAttribute });
+        this.onOverlayEscapeKeyDownDisabled = input(false, ...(ngDevMode ? [{ debugName: "onOverlayEscapeKeyDownDisabled", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
         /** @description Whether to prevent `onOverlayOutsideClick` handler from calling. */
-        this.onOverlayOutsideClickDisabled = input(false, { transform: booleanAttribute });
+        this.onOverlayOutsideClickDisabled = input(false, ...(ngDevMode ? [{ debugName: "onOverlayOutsideClickDisabled", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
         /**
          * @description Event handler called when the escape key is down.
          * It can be prevented by setting `onOverlayEscapeKeyDownDisabled` input to `true`.
@@ -100,7 +100,7 @@ class RdxPopoverContentDirective {
          */
         this.onClosed = output();
         /** @ingore */
-        this.positions = computed(() => this.computePositions());
+        this.positions = computed(() => this.computePositions(), ...(ngDevMode ? [{ debugName: "positions" }] : []));
         this.onOriginChangeEffect();
         this.onPositionChangeEffect();
     }
@@ -284,10 +284,10 @@ class RdxPopoverContentDirective {
             [input]: new SimpleChange(previousValue, currentValue, firstChange)
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.4", type: RdxPopoverContentDirective, isStandalone: true, selector: "[rdxPopoverContent]", inputs: { side: { classPropertyName: "side", publicName: "side", isSignal: true, isRequired: false, transformFunction: null }, sideOffset: { classPropertyName: "sideOffset", publicName: "sideOffset", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, alignOffset: { classPropertyName: "alignOffset", publicName: "alignOffset", isSignal: true, isRequired: false, transformFunction: null }, alternatePositionsDisabled: { classPropertyName: "alternatePositionsDisabled", publicName: "alternatePositionsDisabled", isSignal: true, isRequired: false, transformFunction: null }, onOverlayEscapeKeyDownDisabled: { classPropertyName: "onOverlayEscapeKeyDownDisabled", publicName: "onOverlayEscapeKeyDownDisabled", isSignal: true, isRequired: false, transformFunction: null }, onOverlayOutsideClickDisabled: { classPropertyName: "onOverlayOutsideClickDisabled", publicName: "onOverlayOutsideClickDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onOverlayEscapeKeyDown: "onOverlayEscapeKeyDown", onOverlayOutsideClick: "onOverlayOutsideClick", onOpen: "onOpen", onClosed: "onClosed" }, hostDirectives: [{ directive: i1.CdkConnectedOverlay }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.3", type: RdxPopoverContentDirective, isStandalone: true, selector: "[rdxPopoverContent]", inputs: { side: { classPropertyName: "side", publicName: "side", isSignal: true, isRequired: false, transformFunction: null }, sideOffset: { classPropertyName: "sideOffset", publicName: "sideOffset", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, alignOffset: { classPropertyName: "alignOffset", publicName: "alignOffset", isSignal: true, isRequired: false, transformFunction: null }, alternatePositionsDisabled: { classPropertyName: "alternatePositionsDisabled", publicName: "alternatePositionsDisabled", isSignal: true, isRequired: false, transformFunction: null }, onOverlayEscapeKeyDownDisabled: { classPropertyName: "onOverlayEscapeKeyDownDisabled", publicName: "onOverlayEscapeKeyDownDisabled", isSignal: true, isRequired: false, transformFunction: null }, onOverlayOutsideClickDisabled: { classPropertyName: "onOverlayOutsideClickDisabled", publicName: "onOverlayOutsideClickDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onOverlayEscapeKeyDown: "onOverlayEscapeKeyDown", onOverlayOutsideClick: "onOverlayOutsideClick", onOpen: "onOpen", onClosed: "onClosed" }, hostDirectives: [{ directive: i1.CdkConnectedOverlay }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverContentDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverContentDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPopoverContent]',
@@ -304,16 +304,16 @@ class RdxPopoverTriggerDirective {
         /** @ignore */
         this.overlayOrigin = inject(CdkOverlayOrigin);
         /** @ignore */
-        this.name = computed(() => `rdx-popover-trigger-${this.popoverRoot.uniqueId()}`);
+        this.name = computed(() => `rdx-popover-trigger-${this.popoverRoot.uniqueId()}`, ...(ngDevMode ? [{ debugName: "name" }] : []));
     }
     /** @ignore */
     click() {
         this.popoverRoot.handleToggle();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: RdxPopoverTriggerDirective, isStandalone: true, selector: "[rdxPopoverTrigger]", host: { attributes: { "type": "button" }, listeners: { "click": "click()" }, properties: { "attr.id": "name()", "attr.aria-haspopup": "\"dialog\"", "attr.aria-expanded": "popoverRoot.isOpen()", "attr.aria-controls": "popoverRoot.popoverContentDirective().name()", "attr.data-state": "popoverRoot.state()" } }, hostDirectives: [{ directive: i1.CdkOverlayOrigin }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.3", type: RdxPopoverTriggerDirective, isStandalone: true, selector: "[rdxPopoverTrigger]", host: { attributes: { "type": "button" }, listeners: { "click": "click()" }, properties: { "attr.id": "name()", "attr.aria-haspopup": "\"dialog\"", "attr.aria-expanded": "popoverRoot.isOpen()", "attr.aria-controls": "popoverRoot.popoverContentDirective().name()", "attr.data-state": "popoverRoot.state()" } }, hostDirectives: [{ directive: i1.CdkOverlayOrigin }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverTriggerDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverTriggerDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPopoverTrigger]',
@@ -448,10 +448,10 @@ class RdxCdkEventService {
         }
         this.onDestroyCallbacks.add(destroyClickDomRootEventListener);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxCdkEventService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxCdkEventService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxCdkEventService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxCdkEventService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxCdkEventService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxCdkEventService, decorators: [{
             type: Injectable
         }], ctorParameters: () => [] });
 const RdxCdkEventServiceToken = new InjectionToken('RdxCdkEventServiceToken');
@@ -484,58 +484,58 @@ let nextId = 0;
 class RdxPopoverRootDirective {
     constructor() {
         /** @ignore */
-        this.uniqueId = signal(++nextId);
+        this.uniqueId = signal(++nextId, ...(ngDevMode ? [{ debugName: "uniqueId" }] : []));
         /** @ignore */
-        this.name = computed(() => `rdx-popover-root-${this.uniqueId()}`);
+        this.name = computed(() => `rdx-popover-root-${this.uniqueId()}`, ...(ngDevMode ? [{ debugName: "name" }] : []));
         /**
          * @description The anchor directive that comes form outside the popover root
          * @default undefined
          */
-        this.anchor = input(void 0);
+        this.anchor = input(void 0, ...(ngDevMode ? [{ debugName: "anchor" }] : []));
         /**
          * @description The open state of the popover when it is initially rendered. Use when you do not need to control its open state.
          * @default false
          */
-        this.defaultOpen = input(false, { transform: booleanAttribute });
+        this.defaultOpen = input(false, ...(ngDevMode ? [{ debugName: "defaultOpen", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
         /**
          * @description The controlled state of the popover. `open` input take precedence of `defaultOpen` input.
          * @default undefined
          */
-        this.open = input(void 0, { transform: booleanAttribute });
+        this.open = input(void 0, ...(ngDevMode ? [{ debugName: "open", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
         /**
          * @description Whether to control the state of the popover from external. Use in conjunction with `open` input.
          * @default undefined
          */
-        this.externalControl = input(void 0, { transform: booleanAttribute });
+        this.externalControl = input(void 0, ...(ngDevMode ? [{ debugName: "externalControl", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
         /**
          * @description Whether to take into account CSS opening/closing animations.
          * @default false
          */
-        this.cssAnimation = input(false, { transform: booleanAttribute });
+        this.cssAnimation = input(false, ...(ngDevMode ? [{ debugName: "cssAnimation", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
         /**
          * @description Whether to take into account CSS opening animations. `cssAnimation` input must be set to 'true'
          * @default false
          */
-        this.cssOpeningAnimation = input(false, { transform: booleanAttribute });
+        this.cssOpeningAnimation = input(false, ...(ngDevMode ? [{ debugName: "cssOpeningAnimation", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
         /**
          * @description Whether to take into account CSS closing animations. `cssAnimation` input must be set to 'true'
          * @default false
          */
-        this.cssClosingAnimation = input(false, { transform: booleanAttribute });
+        this.cssClosingAnimation = input(false, ...(ngDevMode ? [{ debugName: "cssClosingAnimation", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
         /** @ignore */
-        this.cssAnimationStatus = signal(null);
+        this.cssAnimationStatus = signal(null, ...(ngDevMode ? [{ debugName: "cssAnimationStatus" }] : []));
         /** @ignore */
         this.popoverContentDirective = contentChild.required(RdxPopoverContentDirective);
         /** @ignore */
         this.popoverTriggerDirective = contentChild.required(RdxPopoverTriggerDirective);
         /** @ignore */
-        this.popoverArrowDirective = contentChild(RdxPopoverArrowToken);
+        this.popoverArrowDirective = contentChild(RdxPopoverArrowToken, ...(ngDevMode ? [{ debugName: "popoverArrowDirective" }] : []));
         /** @ignore */
-        this.popoverCloseDirective = contentChild(RdxPopoverCloseToken);
+        this.popoverCloseDirective = contentChild(RdxPopoverCloseToken, ...(ngDevMode ? [{ debugName: "popoverCloseDirective" }] : []));
         /** @ignore */
-        this.popoverContentAttributesComponent = contentChild(RdxPopoverContentAttributesToken);
+        this.popoverContentAttributesComponent = contentChild(RdxPopoverContentAttributesToken, ...(ngDevMode ? [{ debugName: "popoverContentAttributesComponent" }] : []));
         /** @ignore */
-        this.internalPopoverAnchorDirective = contentChild(RdxPopoverAnchorToken);
+        this.internalPopoverAnchorDirective = contentChild(RdxPopoverAnchorToken, ...(ngDevMode ? [{ debugName: "internalPopoverAnchorDirective" }] : []));
         /** @ignore */
         this.viewContainerRef = inject(ViewContainerRef);
         /** @ignore */
@@ -543,13 +543,13 @@ class RdxPopoverRootDirective {
         /** @ignore */
         this.destroyRef = inject(DestroyRef);
         /** @ignore */
-        this.state = signal(RdxPopoverState.CLOSED);
+        this.state = signal(RdxPopoverState.CLOSED, ...(ngDevMode ? [{ debugName: "state" }] : []));
         /** @ignore */
-        this.attachDetachEvent = signal(RdxPopoverAttachDetachEvent.DETACH);
+        this.attachDetachEvent = signal(RdxPopoverAttachDetachEvent.DETACH, ...(ngDevMode ? [{ debugName: "attachDetachEvent" }] : []));
         /** @ignore */
-        this.isFirstDefaultOpen = signal(false);
+        this.isFirstDefaultOpen = signal(false, ...(ngDevMode ? [{ debugName: "isFirstDefaultOpen" }] : []));
         /** @ignore */
-        this.popoverAnchorDirective = computed(() => this.internalPopoverAnchorDirective() ?? this.anchor());
+        this.popoverAnchorDirective = computed(() => this.internalPopoverAnchorDirective() ?? this.anchor(), ...(ngDevMode ? [{ debugName: "popoverAnchorDirective" }] : []));
         /** @ignore */
         this.onAnchorChangeEffect = () => {
             effect(() => {
@@ -776,12 +776,12 @@ class RdxPopoverRootDirective {
                 }
                 this.handleOpen();
             });
-        });
+        }, ...(ngDevMode ? [{ debugName: "effectRef" }] : []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverRootDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.2.4", type: RdxPopoverRootDirective, isStandalone: true, selector: "[rdxPopoverRoot]", inputs: { anchor: { classPropertyName: "anchor", publicName: "anchor", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, externalControl: { classPropertyName: "externalControl", publicName: "externalControl", isSignal: true, isRequired: false, transformFunction: null }, cssAnimation: { classPropertyName: "cssAnimation", publicName: "cssAnimation", isSignal: true, isRequired: false, transformFunction: null }, cssOpeningAnimation: { classPropertyName: "cssOpeningAnimation", publicName: "cssOpeningAnimation", isSignal: true, isRequired: false, transformFunction: null }, cssClosingAnimation: { classPropertyName: "cssClosingAnimation", publicName: "cssClosingAnimation", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "popoverContentDirective", first: true, predicate: RdxPopoverContentDirective, descendants: true, isSignal: true }, { propertyName: "popoverTriggerDirective", first: true, predicate: RdxPopoverTriggerDirective, descendants: true, isSignal: true }, { propertyName: "popoverArrowDirective", first: true, predicate: RdxPopoverArrowToken, descendants: true, isSignal: true }, { propertyName: "popoverCloseDirective", first: true, predicate: RdxPopoverCloseToken, descendants: true, isSignal: true }, { propertyName: "popoverContentAttributesComponent", first: true, predicate: RdxPopoverContentAttributesToken, descendants: true, isSignal: true }, { propertyName: "internalPopoverAnchorDirective", first: true, predicate: RdxPopoverAnchorToken, descendants: true, isSignal: true }], exportAs: ["rdxPopoverRoot"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverRootDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "20.3.3", type: RdxPopoverRootDirective, isStandalone: true, selector: "[rdxPopoverRoot]", inputs: { anchor: { classPropertyName: "anchor", publicName: "anchor", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, externalControl: { classPropertyName: "externalControl", publicName: "externalControl", isSignal: true, isRequired: false, transformFunction: null }, cssAnimation: { classPropertyName: "cssAnimation", publicName: "cssAnimation", isSignal: true, isRequired: false, transformFunction: null }, cssOpeningAnimation: { classPropertyName: "cssOpeningAnimation", publicName: "cssOpeningAnimation", isSignal: true, isRequired: false, transformFunction: null }, cssClosingAnimation: { classPropertyName: "cssClosingAnimation", publicName: "cssClosingAnimation", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "popoverContentDirective", first: true, predicate: RdxPopoverContentDirective, descendants: true, isSignal: true }, { propertyName: "popoverTriggerDirective", first: true, predicate: RdxPopoverTriggerDirective, descendants: true, isSignal: true }, { propertyName: "popoverArrowDirective", first: true, predicate: RdxPopoverArrowToken, descendants: true, isSignal: true }, { propertyName: "popoverCloseDirective", first: true, predicate: RdxPopoverCloseToken, descendants: true, isSignal: true }, { propertyName: "popoverContentAttributesComponent", first: true, predicate: RdxPopoverContentAttributesToken, descendants: true, isSignal: true }, { propertyName: "internalPopoverAnchorDirective", first: true, predicate: RdxPopoverAnchorToken, descendants: true, isSignal: true }], exportAs: ["rdxPopoverRoot"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverRootDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverRootDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPopoverRoot]',
@@ -809,7 +809,7 @@ class RdxPopoverAnchorDirective {
         /** @ignore */
         this.document = injectDocument();
         /** @ignore */
-        this.name = computed(() => `rdx-popover-external-anchor-${this.popoverRoot?.uniqueId()}`);
+        this.name = computed(() => `rdx-popover-external-anchor-${this.popoverRoot?.uniqueId()}`, ...(ngDevMode ? [{ debugName: "name" }] : []));
     }
     /** @ignore */
     click() {
@@ -832,15 +832,15 @@ class RdxPopoverAnchorDirective {
         });
         this.popoverRoot?.popoverTriggerDirective().elementRef.nativeElement.dispatchEvent(clickEvent);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverAnchorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: RdxPopoverAnchorDirective, isStandalone: true, selector: "[rdxPopoverAnchor]", host: { attributes: { "type": "button" }, listeners: { "click": "click()" }, properties: { "attr.id": "name()", "attr.aria-haspopup": "\"dialog\"" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverAnchorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.3", type: RdxPopoverAnchorDirective, isStandalone: true, selector: "[rdxPopoverAnchor]", host: { attributes: { "type": "button" }, listeners: { "click": "click()" }, properties: { "attr.id": "name()", "attr.aria-haspopup": "\"dialog\"" } }, providers: [
             {
                 provide: RdxPopoverAnchorToken,
                 useExisting: forwardRef(() => RdxPopoverAnchorDirective)
             }
         ], exportAs: ["rdxPopoverAnchor"], hostDirectives: [{ directive: i1.CdkOverlayOrigin }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverAnchorDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverAnchorDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPopoverAnchor]',
@@ -873,12 +873,12 @@ class RdxPopoverArrowDirective {
          * @description The width of the arrow in pixels.
          * @default 10
          */
-        this.width = input(RDX_POSITIONING_DEFAULTS.arrow.width, { transform: numberAttribute });
+        this.width = input(RDX_POSITIONING_DEFAULTS.arrow.width, ...(ngDevMode ? [{ debugName: "width", transform: numberAttribute }] : [{ transform: numberAttribute }]));
         /**
          * @description The height of the arrow in pixels.
          * @default 5
          */
-        this.height = input(RDX_POSITIONING_DEFAULTS.arrow.height, { transform: numberAttribute });
+        this.height = input(RDX_POSITIONING_DEFAULTS.arrow.height, ...(ngDevMode ? [{ debugName: "height", transform: numberAttribute }] : [{ transform: numberAttribute }]));
         /** @ignore */
         this.arrowSvgElement = computed(() => {
             const width = this.width();
@@ -892,9 +892,9 @@ class RdxPopoverArrowDirective {
             this.renderer.setAttribute(svgElement, 'preserveAspectRatio', 'none');
             this.renderer.appendChild(svgElement, polygonElement);
             return svgElement;
-        });
+        }, ...(ngDevMode ? [{ debugName: "arrowSvgElement" }] : []));
         /** @ignore */
-        this.currentArrowSvgElement = signal(void 0);
+        this.currentArrowSvgElement = signal(void 0, ...(ngDevMode ? [{ debugName: "currentArrowSvgElement" }] : []));
         /** @ignore */
         this.position = toSignal(this.popoverRoot.popoverContentDirective().positionChange());
         afterNextRender({
@@ -954,15 +954,15 @@ class RdxPopoverArrowDirective {
             });
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverArrowDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.4", type: RdxPopoverArrowDirective, isStandalone: true, selector: "[rdxPopoverArrow]", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverArrowDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.3", type: RdxPopoverArrowDirective, isStandalone: true, selector: "[rdxPopoverArrow]", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
             {
                 provide: RdxPopoverArrowToken,
                 useExisting: forwardRef(() => RdxPopoverArrowDirective)
             }
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverArrowDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverArrowDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPopoverArrow]',
@@ -994,15 +994,15 @@ class RdxPopoverCloseDirective {
             });
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverCloseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: RdxPopoverCloseDirective, isStandalone: true, selector: "[rdxPopoverClose]", host: { attributes: { "type": "button" }, listeners: { "click": "popoverRoot.handleClose()" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverCloseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.3", type: RdxPopoverCloseDirective, isStandalone: true, selector: "[rdxPopoverClose]", host: { attributes: { "type": "button" }, listeners: { "click": "popoverRoot.handleClose()" } }, providers: [
             {
                 provide: RdxPopoverCloseToken,
                 useExisting: forwardRef(() => RdxPopoverCloseDirective)
             }
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverCloseDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverCloseDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPopoverClose]',
@@ -1026,9 +1026,9 @@ class RdxPopoverContentAttributesComponent {
         /** @ignore */
         this.popoverRoot = injectPopoverRoot();
         /** @ignore */
-        this.name = computed(() => `rdx-popover-content-attributes-${this.popoverRoot.uniqueId()}`);
+        this.name = computed(() => `rdx-popover-content-attributes-${this.popoverRoot.uniqueId()}`, ...(ngDevMode ? [{ debugName: "name" }] : []));
         /** @ignore */
-        this.disableAnimation = computed(() => !this.canAnimate());
+        this.disableAnimation = computed(() => !this.canAnimate(), ...(ngDevMode ? [{ debugName: "disableAnimation" }] : []));
         afterNextRender({
             write: () => {
                 if (this.focusInitialDirective) {
@@ -1056,8 +1056,8 @@ class RdxPopoverContentAttributesComponent {
             ((this.popoverRoot.cssOpeningAnimation() && this.popoverRoot.state() === RdxPopoverState.OPEN) ||
                 (this.popoverRoot.cssClosingAnimation() && this.popoverRoot.state() === RdxPopoverState.CLOSED)));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverContentAttributesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: RdxPopoverContentAttributesComponent, isStandalone: true, selector: "[rdxPopoverContentAttributes]", host: { listeners: { "animationstart": "onAnimationStart($event)", "animationend": "onAnimationEnd($event)" }, properties: { "attr.role": "\"dialog\"", "attr.id": "name()", "attr.data-state": "popoverRoot.state()", "attr.data-side": "popoverRoot.popoverContentDirective().side()", "attr.data-align": "popoverRoot.popoverContentDirective().align()", "style": "disableAnimation() ? {animation: \"none !important\"} : null" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverContentAttributesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.3", type: RdxPopoverContentAttributesComponent, isStandalone: true, selector: "[rdxPopoverContentAttributes]", host: { listeners: { "animationstart": "onAnimationStart($event)", "animationend": "onAnimationEnd($event)" }, properties: { "attr.role": "\"dialog\"", "attr.id": "name()", "attr.data-state": "popoverRoot.state()", "attr.data-side": "popoverRoot.popoverContentDirective().side()", "attr.data-align": "popoverRoot.popoverContentDirective().align()", "style": "disableAnimation() ? {animation: \"none !important\"} : null" } }, providers: [
             {
                 provide: RdxPopoverContentAttributesToken,
                 useExisting: forwardRef(() => RdxPopoverContentAttributesComponent)
@@ -1066,7 +1066,7 @@ class RdxPopoverContentAttributesComponent {
         <ng-content />
     `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverContentAttributesComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverContentAttributesComponent, decorators: [{
             type: Component,
             args: [{
                     selector: '[rdxPopoverContentAttributes]',
@@ -1107,8 +1107,8 @@ const _imports = [
     RdxPopoverContentAttributesComponent
 ];
 class RdxPopoverModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverModule, imports: [RdxPopoverArrowDirective,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverModule, imports: [RdxPopoverArrowDirective,
             RdxPopoverCloseDirective,
             RdxPopoverContentDirective,
             RdxPopoverTriggerDirective,
@@ -1121,9 +1121,9 @@ class RdxPopoverModule {
             RdxPopoverRootDirective,
             RdxPopoverAnchorDirective,
             RdxPopoverContentAttributesComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverModule }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: RdxPopoverModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: RdxPopoverModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [..._imports],