@radix-ng/primitives 0.26.0 → 0.27.0

package/fesm2022/radix-ng-primitives-hover-card.mjs

@@ -0,0 +1,1213 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, TemplateRef, DestroyRef, computed, input, numberAttribute, booleanAttribute, output, effect, untracked, SimpleChange, Directive, ElementRef, NgZone, Renderer2, isDevMode, VERSION, Injectable, makeEnvironmentProviders, signal, contentChild, ViewContainerRef, afterNextRender, assertInInjectionContext, forwardRef, Component, ChangeDetectionStrategy, NgModule } from '@angular/core';
+import * as i1 from '@angular/cdk/overlay';
+import { Overlay, CdkConnectedOverlay, CdkOverlayOrigin } from '@angular/cdk/overlay';
+import { RdxPositionSide, RdxPositionAlign, RDX_POSITIONING_DEFAULTS, getContentPosition, getAllPossibleConnectedPositions, injectDocument, injectWindow, getArrowPositionParams, getSideAndAlignFromAllPossibleConnectedPositions } from '@radix-ng/primitives/core';
+import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
+import { filter, tap, Subject, map, debounce, timer } from 'rxjs';
+
+const RdxHoverCardAnchorToken = new InjectionToken('RdxHoverCardAnchorToken');
+
+const RdxHoverCardArrowToken = new InjectionToken('RdxHoverCardArrowToken');
+
+const RdxHoverCardCloseToken = new InjectionToken('RdxHoverCardCloseToken');
+
+const RdxHoverCardContentAttributesToken = new InjectionToken('RdxHoverCardContentAttributesToken');
+
+var RdxHoverCardState;
+(function (RdxHoverCardState) {
+    RdxHoverCardState["OPEN"] = "open";
+    RdxHoverCardState["CLOSED"] = "closed";
+})(RdxHoverCardState || (RdxHoverCardState = {}));
+var RdxHoverCardAction;
+(function (RdxHoverCardAction) {
+    RdxHoverCardAction["OPEN"] = "open";
+    RdxHoverCardAction["CLOSE"] = "close";
+})(RdxHoverCardAction || (RdxHoverCardAction = {}));
+var RdxHoverCardAttachDetachEvent;
+(function (RdxHoverCardAttachDetachEvent) {
+    RdxHoverCardAttachDetachEvent["ATTACH"] = "attach";
+    RdxHoverCardAttachDetachEvent["DETACH"] = "detach";
+})(RdxHoverCardAttachDetachEvent || (RdxHoverCardAttachDetachEvent = {}));
+var RdxHoverCardAnimationStatus;
+(function (RdxHoverCardAnimationStatus) {
+    RdxHoverCardAnimationStatus["OPEN_STARTED"] = "open_started";
+    RdxHoverCardAnimationStatus["OPEN_ENDED"] = "open_ended";
+    RdxHoverCardAnimationStatus["CLOSED_STARTED"] = "closed_started";
+    RdxHoverCardAnimationStatus["CLOSED_ENDED"] = "closed_ended";
+})(RdxHoverCardAnimationStatus || (RdxHoverCardAnimationStatus = {}));
+
+class RdxHoverCardContentDirective {
+    constructor() {
+        /** @ignore */
+        this.rootDirective = injectHoverCardRoot();
+        /** @ignore */
+        this.templateRef = inject(TemplateRef);
+        /** @ignore */
+        this.overlay = inject(Overlay);
+        /** @ignore */
+        this.destroyRef = inject(DestroyRef);
+        /** @ignore */
+        this.connectedOverlay = inject(CdkConnectedOverlay);
+        /** @ignore */
+        this.name = computed(() => `rdx-hover-card-trigger-${this.rootDirective.uniqueId()}`);
+        /**
+         * @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);
+        /**
+         * @description The distance in pixels from the trigger.
+         * @default undefined
+         */
+        this.sideOffset = input(NaN, {
+            transform: numberAttribute
+        });
+        /**
+         * @description The preferred alignment against the trigger. May change when collisions occur.
+         * @default center
+         */
+        this.align = input(RdxPositionAlign.Center);
+        /**
+         * @description An offset in pixels from the "start" or "end" alignment options.
+         * @default undefined
+         */
+        this.alignOffset = input(NaN, {
+            transform: numberAttribute
+        });
+        /**
+         * @description Whether to add some alternate positions of the content.
+         * @default false
+         */
+        this.alternatePositionsDisabled = input(false, { transform: booleanAttribute });
+        /** @description Whether to prevent `onOverlayEscapeKeyDown` handler from calling. */
+        this.onOverlayEscapeKeyDownDisabled = input(false, { transform: booleanAttribute });
+        /** @description Whether to prevent `onOverlayOutsideClick` handler from calling. */
+        this.onOverlayOutsideClickDisabled = input(false, { transform: booleanAttribute });
+        /**
+         * @description Event handler called when the escape key is down.
+         * It can be prevented by setting `onOverlayEscapeKeyDownDisabled` input to `true`.
+         */
+        this.onOverlayEscapeKeyDown = output();
+        /**
+         * @description Event handler called when a pointer event occurs outside the bounds of the component.
+         * It can be prevented by setting `onOverlayOutsideClickDisabled` input to `true`.
+         */
+        this.onOverlayOutsideClick = output();
+        /**
+         * @description Event handler called after the overlay is open
+         */
+        this.onOpen = output();
+        /**
+         * @description Event handler called after the overlay is closed
+         */
+        this.onClosed = output();
+        /** @ingore */
+        this.positions = computed(() => this.computePositions());
+        this.onOriginChangeEffect();
+        this.onPositionChangeEffect();
+    }
+    /** @ignore */
+    ngOnInit() {
+        this.setScrollStrategy();
+        this.setHasBackdrop();
+        this.setDisableClose();
+        this.onAttach();
+        this.onDetach();
+        this.connectKeydownEscape();
+        this.connectOutsideClick();
+    }
+    /** @ignore */
+    open() {
+        if (this.connectedOverlay.open) {
+            return;
+        }
+        const prevOpen = this.connectedOverlay.open;
+        this.connectedOverlay.open = true;
+        this.fireOverlayNgOnChanges('open', this.connectedOverlay.open, prevOpen);
+    }
+    /** @ignore */
+    close() {
+        if (!this.connectedOverlay.open) {
+            return;
+        }
+        const prevOpen = this.connectedOverlay.open;
+        this.connectedOverlay.open = false;
+        this.fireOverlayNgOnChanges('open', this.connectedOverlay.open, prevOpen);
+    }
+    /** @ignore */
+    positionChange() {
+        return this.connectedOverlay.positionChange.asObservable();
+    }
+    /** @ignore */
+    connectKeydownEscape() {
+        this.connectedOverlay.overlayKeydown
+            .asObservable()
+            .pipe(filter(() => !this.onOverlayEscapeKeyDownDisabled() &&
+            !this.rootDirective.rdxCdkEventService?.primitivePreventedFromCdkEvent(this.rootDirective, 'cdkOverlayEscapeKeyDown')), filter((event) => event.key === 'Escape'), tap((event) => {
+            this.onOverlayEscapeKeyDown.emit(event);
+        }), filter(() => !this.rootDirective.firstDefaultOpen()), tap(() => {
+            this.rootDirective.handleClose();
+        }), takeUntilDestroyed(this.destroyRef))
+            .subscribe();
+    }
+    /** @ignore */
+    connectOutsideClick() {
+        this.connectedOverlay.overlayOutsideClick
+            .asObservable()
+            .pipe(filter(() => !this.onOverlayOutsideClickDisabled() &&
+            !this.rootDirective.rdxCdkEventService?.primitivePreventedFromCdkEvent(this.rootDirective, 'cdkOverlayOutsideClick')), 
+        /**
+         * Handle the situation when an anchor is added and the anchor becomes the origin of the overlay
+         * hence  the trigger will be considered the outside element
+         */
+        filter((event) => {
+            return (!this.rootDirective.anchorDirective() ||
+                !this.rootDirective
+                    .triggerDirective()
+                    .elementRef.nativeElement.contains(event.target));
+        }), tap((event) => {
+            this.onOverlayOutsideClick.emit(event);
+        }), filter(() => !this.rootDirective.firstDefaultOpen()), tap(() => {
+            this.rootDirective.handleClose();
+        }), takeUntilDestroyed(this.destroyRef))
+            .subscribe();
+    }
+    /** @ignore */
+    onAttach() {
+        this.connectedOverlay.attach
+            .asObservable()
+            .pipe(tap(() => {
+            /**
+             * `this.onOpen.emit();` is being delegated to the rootDirective directive due to the opening animation
+             */
+            this.rootDirective.attachDetachEvent.set(RdxHoverCardAttachDetachEvent.ATTACH);
+        }), takeUntilDestroyed(this.destroyRef))
+            .subscribe();
+    }
+    /** @ignore */
+    onDetach() {
+        this.connectedOverlay.detach
+            .asObservable()
+            .pipe(tap(() => {
+            /**
+             * `this.onClosed.emit();` is being delegated to the rootDirective directive due to the closing animation
+             */
+            this.rootDirective.attachDetachEvent.set(RdxHoverCardAttachDetachEvent.DETACH);
+        }), takeUntilDestroyed(this.destroyRef))
+            .subscribe();
+    }
+    /** @ignore */
+    setScrollStrategy() {
+        const prevScrollStrategy = this.connectedOverlay.scrollStrategy;
+        this.connectedOverlay.scrollStrategy = this.overlay.scrollStrategies.reposition();
+        this.fireOverlayNgOnChanges('scrollStrategy', this.connectedOverlay.scrollStrategy, prevScrollStrategy);
+    }
+    /** @ignore */
+    setHasBackdrop() {
+        const prevHasBackdrop = this.connectedOverlay.hasBackdrop;
+        this.connectedOverlay.hasBackdrop = false;
+        this.fireOverlayNgOnChanges('hasBackdrop', this.connectedOverlay.hasBackdrop, prevHasBackdrop);
+    }
+    /** @ignore */
+    setDisableClose() {
+        const prevDisableClose = this.connectedOverlay.disableClose;
+        this.connectedOverlay.disableClose = true;
+        this.fireOverlayNgOnChanges('disableClose', this.connectedOverlay.disableClose, prevDisableClose);
+    }
+    /** @ignore */
+    setOrigin(origin) {
+        const prevOrigin = this.connectedOverlay.origin;
+        this.connectedOverlay.origin = origin;
+        this.fireOverlayNgOnChanges('origin', this.connectedOverlay.origin, prevOrigin);
+    }
+    /** @ignore */
+    setPositions(positions) {
+        const prevPositions = this.connectedOverlay.positions;
+        this.connectedOverlay.positions = positions;
+        this.fireOverlayNgOnChanges('positions', this.connectedOverlay.positions, prevPositions);
+        this.connectedOverlay.overlayRef?.updatePosition();
+    }
+    /** @ignore */
+    computePositions() {
+        const arrowHeight = this.rootDirective.arrowDirective()?.height() ?? 0;
+        const offsets = {
+            sideOffset: arrowHeight + (isNaN(this.sideOffset()) ? RDX_POSITIONING_DEFAULTS.offsets.side : this.sideOffset()),
+            alignOffset: isNaN(this.alignOffset()) ? RDX_POSITIONING_DEFAULTS.offsets.align : this.alignOffset()
+        };
+        const basePosition = getContentPosition({
+            side: this.side(),
+            align: this.align(),
+            sideOffset: offsets.sideOffset,
+            alignOffset: offsets.alignOffset
+        });
+        const positions = [basePosition];
+        if (!this.alternatePositionsDisabled()) {
+            /**
+             * Alternate positions for better user experience along the X/Y axis (e.g. vertical/horizontal scrolling)
+             */
+            const allPossibleConnectedPositions = getAllPossibleConnectedPositions();
+            allPossibleConnectedPositions.forEach((_, key) => {
+                const sideAndAlignArray = key.split('|');
+                if (sideAndAlignArray[0] !== this.side() ||
+                    sideAndAlignArray[1] !== this.align()) {
+                    positions.push(getContentPosition({
+                        side: sideAndAlignArray[0],
+                        align: sideAndAlignArray[1],
+                        sideOffset: offsets.sideOffset,
+                        alignOffset: offsets.alignOffset
+                    }));
+                }
+            });
+        }
+        return positions;
+    }
+    onOriginChangeEffect() {
+        effect(() => {
+            const origin = (this.rootDirective.anchorDirective() ?? this.rootDirective.triggerDirective())
+                .overlayOrigin;
+            untracked(() => {
+                this.setOrigin(origin);
+            });
+        });
+    }
+    /** @ignore */
+    onPositionChangeEffect() {
+        effect(() => {
+            const positions = this.positions();
+            this.alternatePositionsDisabled();
+            untracked(() => {
+                this.setPositions(positions);
+            });
+        });
+    }
+    /** @ignore */
+    fireOverlayNgOnChanges(input, currentValue, previousValue, firstChange = false) {
+        this.connectedOverlay.ngOnChanges({
+            [input]: new SimpleChange(previousValue, currentValue, firstChange)
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.5", type: RdxHoverCardContentDirective, isStandalone: true, selector: "[rdxHoverCardContent]", 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.0.5", ngImport: i0, type: RdxHoverCardContentDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rdxHoverCardContent]',
+                    hostDirectives: [
+                        CdkConnectedOverlay
+                    ]
+                }]
+        }], ctorParameters: () => [] });
+
+class RdxHoverCardTriggerDirective {
+    constructor() {
+        /** @ignore */
+        this.rootDirective = injectHoverCardRoot();
+        /** @ignore */
+        this.elementRef = inject(ElementRef);
+        /** @ignore */
+        this.overlayOrigin = inject(CdkOverlayOrigin);
+        /** @ignore */
+        this.name = computed(() => `rdx-hover-card-trigger-${this.rootDirective.uniqueId()}`);
+    }
+    /** @ignore */
+    pointerenter() {
+        this.rootDirective.handleOpen();
+    }
+    /** @ignore */
+    pointerleave() {
+        this.rootDirective.handleClose();
+    }
+    /** @ignore */
+    focus() {
+        this.rootDirective.handleOpen();
+    }
+    /** @ignore */
+    blur() {
+        this.rootDirective.handleClose();
+    }
+    /** @ignore */
+    click() {
+        this.rootDirective.handleClose();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: RdxHoverCardTriggerDirective, isStandalone: true, selector: "[rdxHoverCardTrigger]", host: { listeners: { "pointerenter": "pointerenter()", "pointerleave": "pointerleave()", "focus": "focus()", "blur": "blur()", "click": "click()" }, properties: { "attr.id": "name()", "attr.aria-haspopup": "\"dialog\"", "attr.aria-expanded": "rootDirective.isOpen()", "attr.aria-controls": "rootDirective.contentDirective().name()", "attr.data-state": "rootDirective.state()" } }, hostDirectives: [{ directive: i1.CdkOverlayOrigin }], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardTriggerDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rdxHoverCardTrigger]',
+                    hostDirectives: [CdkOverlayOrigin],
+                    host: {
+                        '[attr.id]': 'name()',
+                        '[attr.aria-haspopup]': '"dialog"',
+                        '[attr.aria-expanded]': 'rootDirective.isOpen()',
+                        '[attr.aria-controls]': 'rootDirective.contentDirective().name()',
+                        '[attr.data-state]': 'rootDirective.state()',
+                        '(pointerenter)': 'pointerenter()',
+                        '(pointerleave)': 'pointerleave()',
+                        '(focus)': 'focus()',
+                        '(blur)': 'blur()',
+                        '(click)': 'click()'
+                    }
+                }]
+        }] });
+
+const RdxCdkEventServiceWindowKey = Symbol('__RdxCdkEventService__');
+
+function eventTypeAsPrimitiveConfigKey(eventType) {
+    return `prevent${eventType[0].toUpperCase()}${eventType.slice(1)}`;
+}
+class RdxCdkEventService {
+    #clickDomRootEventCallbacks;
+    constructor() {
+        this.document = injectDocument();
+        this.destroyRef = inject(DestroyRef);
+        this.ngZone = inject(NgZone);
+        this.renderer2 = inject(Renderer2);
+        this.window = injectWindow();
+        this.onDestroyCallbacks = new Set([() => deleteRdxCdkEventServiceWindowKey(this.window)]);
+        this.#clickDomRootEventCallbacks = new Set();
+        this.#listenToClickDomRootEvent();
+        this.#registerOnDestroyCallbacks();
+    }
+    registerPrimitive(primitiveInstance) {
+        if (!this.primitiveConfigs) {
+            this.primitiveConfigs = new Map();
+        }
+        if (!this.primitiveConfigs.has(primitiveInstance)) {
+            this.primitiveConfigs.set(primitiveInstance, {});
+        }
+    }
+    deregisterPrimitive(primitiveInstance) {
+        if (this.primitiveConfigs?.has(primitiveInstance)) {
+            this.primitiveConfigs.delete(primitiveInstance);
+        }
+    }
+    preventPrimitiveFromCdkEvent(primitiveInstance, eventType) {
+        this.#setPreventPrimitiveFromCdkEvent(primitiveInstance, eventType, true);
+    }
+    allowPrimitiveForCdkEvent(primitiveInstance, eventType) {
+        this.#setPreventPrimitiveFromCdkEvent(primitiveInstance, eventType, false);
+    }
+    preventPrimitiveFromCdkMultiEvents(primitiveInstance, eventTypes) {
+        eventTypes.forEach((eventType) => {
+            this.#setPreventPrimitiveFromCdkEvent(primitiveInstance, eventType, true);
+        });
+    }
+    allowPrimitiveForCdkMultiEvents(primitiveInstance, eventTypes) {
+        eventTypes.forEach((eventType) => {
+            this.#setPreventPrimitiveFromCdkEvent(primitiveInstance, eventType, false);
+        });
+    }
+    setPreventPrimitiveFromCdkMixEvents(primitiveInstance, eventTypes) {
+        Object.keys(eventTypes).forEach((eventType) => {
+            this.#setPreventPrimitiveFromCdkEvent(primitiveInstance, eventType, eventTypes[eventTypeAsPrimitiveConfigKey(eventType)]);
+        });
+    }
+    primitivePreventedFromCdkEvent(primitiveInstance, eventType) {
+        return this.primitiveConfigs?.get(primitiveInstance)?.[eventTypeAsPrimitiveConfigKey(eventType)];
+    }
+    addClickDomRootEventCallback(callback) {
+        this.#clickDomRootEventCallbacks.add(callback);
+    }
+    removeClickDomRootEventCallback(callback) {
+        return this.#clickDomRootEventCallbacks.delete(callback);
+    }
+    #setPreventPrimitiveFromCdkEvent(primitiveInstance, eventType, value) {
+        if (!this.primitiveConfigs?.has(primitiveInstance)) {
+            isDevMode() &&
+                console.error('[RdxCdkEventService.preventPrimitiveFromCdkEvent] RDX Primitive instance has not been registered!', primitiveInstance);
+            return;
+        }
+        switch (eventType) {
+            case 'cdkOverlayOutsideClick':
+                this.primitiveConfigs.get(primitiveInstance).preventCdkOverlayOutsideClick = value;
+                break;
+            case 'cdkOverlayEscapeKeyDown':
+                this.primitiveConfigs.get(primitiveInstance).preventCdkOverlayEscapeKeyDown = value;
+                break;
+        }
+    }
+    #registerOnDestroyCallbacks() {
+        this.destroyRef.onDestroy(() => {
+            this.onDestroyCallbacks.forEach((onDestroyCallback) => onDestroyCallback());
+            this.onDestroyCallbacks.clear();
+        });
+    }
+    #listenToClickDomRootEvent() {
+        const target = this.document;
+        const eventName = 'click';
+        const options = { capture: true };
+        const callback = (event) => {
+            this.#clickDomRootEventCallbacks.forEach((clickDomRootEventCallback) => clickDomRootEventCallback(event));
+        };
+        const major = parseInt(VERSION.major);
+        const minor = parseInt(VERSION.minor);
+        let destroyClickDomRootEventListener;
+        /**
+         * @see src/cdk/platform/features/backwards-compatibility.ts in @angular/cdk
+         */
+        if (major > 19 || (major === 19 && minor > 0) || (major === 0 && minor === 0)) {
+            destroyClickDomRootEventListener = this.ngZone.runOutsideAngular(() => {
+                const destroyClickDomRootEventListenerInternal = this.renderer2.listen(target, eventName, callback, 
+                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                // @ts-expect-error
+                options);
+                return () => {
+                    destroyClickDomRootEventListenerInternal();
+                    this.#clickDomRootEventCallbacks.clear();
+                };
+            });
+        }
+        else {
+            /**
+             * This part can get removed when v19.1 or higher is on the board
+             */
+            destroyClickDomRootEventListener = this.ngZone.runOutsideAngular(() => {
+                target.addEventListener(eventName, callback, options);
+                return () => {
+                    this.ngZone.runOutsideAngular(() => target.removeEventListener(eventName, callback, options));
+                    this.#clickDomRootEventCallbacks.clear();
+                };
+            });
+        }
+        this.onDestroyCallbacks.add(destroyClickDomRootEventListener);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxCdkEventService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxCdkEventService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxCdkEventService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [] });
+const RdxCdkEventServiceToken = new InjectionToken('RdxCdkEventServiceToken');
+const existsErrorMessage = 'RdxCdkEventService should be provided only once!';
+const deleteRdxCdkEventServiceWindowKey = (window) => {
+    delete window[RdxCdkEventServiceWindowKey];
+};
+const getProvider = (throwWhenExists = true) => ({
+    provide: RdxCdkEventServiceToken,
+    useFactory: () => {
+        isDevMode() && console.log('providing RdxCdkEventService...');
+        const window = injectWindow();
+        if (window[RdxCdkEventServiceWindowKey]) {
+            if (throwWhenExists) {
+                throw Error(existsErrorMessage);
+            }
+            else {
+                isDevMode() && console.warn(existsErrorMessage);
+            }
+        }
+        window[RdxCdkEventServiceWindowKey] ??= new RdxCdkEventService();
+        return window[RdxCdkEventServiceWindowKey];
+    }
+});
+const provideRdxCdkEventServiceInRoot = () => makeEnvironmentProviders([getProvider()]);
+const provideRdxCdkEventService = () => getProvider(false);
+const injectRdxCdkEventService = () => inject(RdxCdkEventServiceToken, { optional: true });
+
+let nextId = 0;
+class RdxHoverCardRootDirective {
+    constructor() {
+        /** @ignore */
+        this.uniqueId = signal(++nextId);
+        /** @ignore */
+        this.name = computed(() => `rdx-hover-card-root-${this.uniqueId()}`);
+        /**
+         * @description The anchor directive that comes form outside the hover-card rootDirective
+         * @default undefined
+         */
+        this.anchor = input(void 0);
+        /**
+         * @description The open state of the hover-card when it is initially rendered. Use when you do not need to control its open state.
+         * @default false
+         */
+        this.defaultOpen = input(false, { transform: booleanAttribute });
+        /**
+         * @description The controlled state of the hover-card. `open` input take precedence of `defaultOpen` input.
+         * @default undefined
+         */
+        this.open = input(void 0, { transform: booleanAttribute });
+        /**
+         * To customise the open delay for a specific hover-card.
+         */
+        this.openDelay = input(500, {
+            transform: numberAttribute
+        });
+        /**
+         * To customise the close delay for a specific hover-card.
+         */
+        this.closeDelay = input(200, {
+            transform: numberAttribute
+        });
+        /**
+         * @description Whether to control the state of the hover-card from external. Use in conjunction with `open` input.
+         * @default undefined
+         */
+        this.externalControl = input(void 0, { transform: booleanAttribute });
+        /**
+         * @description Whether to take into account CSS opening/closing animations.
+         * @default false
+         */
+        this.cssAnimation = input(false, { 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 });
+        /**
+         * @description Whether to take into account CSS closing animations. `cssAnimation` input must be set to 'true'
+         * @default false
+         */
+        this.cssClosingAnimation = input(false, { transform: booleanAttribute });
+        /** @ignore */
+        this.cssAnimationStatus = signal(null);
+        /** @ignore */
+        this.contentDirective = contentChild.required(RdxHoverCardContentDirective);
+        /** @ignore */
+        this.triggerDirective = contentChild.required(RdxHoverCardTriggerDirective);
+        /** @ignore */
+        this.arrowDirective = contentChild(RdxHoverCardArrowToken);
+        /** @ignore */
+        this.closeDirective = contentChild(RdxHoverCardCloseToken);
+        /** @ignore */
+        this.contentAttributesComponent = contentChild(RdxHoverCardContentAttributesToken);
+        /** @ignore */
+        this.internalAnchorDirective = contentChild(RdxHoverCardAnchorToken);
+        /** @ignore */
+        this.viewContainerRef = inject(ViewContainerRef);
+        /** @ignore */
+        this.rdxCdkEventService = injectRdxCdkEventService();
+        /** @ignore */
+        this.destroyRef = inject(DestroyRef);
+        /** @ignore */
+        this.state = signal(RdxHoverCardState.CLOSED);
+        /** @ignore */
+        this.attachDetachEvent = signal(RdxHoverCardAttachDetachEvent.DETACH);
+        /** @ignore */
+        this.isFirstDefaultOpen = signal(false);
+        /** @ignore */
+        this.anchorDirective = computed(() => this.internalAnchorDirective() ?? this.anchor());
+        /** @ignore */
+        this.actionSubject$ = new Subject();
+        /** @ignore */
+        this.onAnchorChangeEffect = () => {
+            effect(() => {
+                const anchor = this.anchor();
+                untracked(() => {
+                    if (anchor) {
+                        anchor.setRoot(this);
+                    }
+                });
+            });
+        };
+        this.rdxCdkEventService?.registerPrimitive(this);
+        this.destroyRef.onDestroy(() => this.rdxCdkEventService?.deregisterPrimitive(this));
+        this.actionSubscription();
+        this.onStateChangeEffect();
+        this.onCssAnimationStatusChangeChangeEffect();
+        this.onOpenChangeEffect();
+        this.onIsFirstDefaultOpenChangeEffect();
+        this.onAnchorChangeEffect();
+        this.emitOpenOrClosedEventEffect();
+        afterNextRender({
+            write: () => {
+                if (this.defaultOpen() && !this.open()) {
+                    this.isFirstDefaultOpen.set(true);
+                }
+            }
+        });
+    }
+    /** @ignore */
+    getAnimationParamsSnapshot() {
+        return {
+            cssAnimation: this.cssAnimation(),
+            cssOpeningAnimation: this.cssOpeningAnimation(),
+            cssClosingAnimation: this.cssClosingAnimation(),
+            cssAnimationStatus: this.cssAnimationStatus(),
+            attachDetachEvent: this.attachDetachEvent(),
+            state: this.state(),
+            canEmitOnOpenOrOnClosed: this.canEmitOnOpenOrOnClosed()
+        };
+    }
+    /** @ignore */
+    controlledExternally() {
+        return this.externalControl;
+    }
+    /** @ignore */
+    firstDefaultOpen() {
+        return this.isFirstDefaultOpen();
+    }
+    /** @ignore */
+    handleOpen() {
+        if (this.externalControl()) {
+            return;
+        }
+        this.actionSubject$.next(RdxHoverCardAction.OPEN);
+    }
+    /** @ignore */
+    handleClose(closeButton) {
+        if (this.isFirstDefaultOpen()) {
+            this.isFirstDefaultOpen.set(false);
+        }
+        if (!closeButton && this.externalControl()) {
+            return;
+        }
+        this.actionSubject$.next(RdxHoverCardAction.CLOSE);
+    }
+    /** @ignore */
+    handleToggle() {
+        if (this.externalControl()) {
+            return;
+        }
+        this.isOpen() ? this.handleClose() : this.handleOpen();
+    }
+    /** @ignore */
+    isOpen(state) {
+        return (state ?? this.state()) === RdxHoverCardState.OPEN;
+    }
+    /** @ignore */
+    setState(state = RdxHoverCardState.CLOSED) {
+        if (state === this.state()) {
+            return;
+        }
+        this.state.set(state);
+    }
+    /** @ignore */
+    openContent() {
+        this.contentDirective().open();
+        if (!this.cssAnimation() || !this.cssOpeningAnimation()) {
+            this.cssAnimationStatus.set(null);
+        }
+    }
+    /** @ignore */
+    closeContent() {
+        this.contentDirective().close();
+        if (!this.cssAnimation() || !this.cssClosingAnimation()) {
+            this.cssAnimationStatus.set(null);
+        }
+    }
+    /** @ignore */
+    emitOnOpen() {
+        this.contentDirective().onOpen.emit();
+    }
+    /** @ignore */
+    emitOnClosed() {
+        this.contentDirective().onClosed.emit();
+    }
+    /** @ignore */
+    ifOpenOrCloseWithoutAnimations(state) {
+        return (!this.contentAttributesComponent() ||
+            !this.cssAnimation() ||
+            (this.cssAnimation() && !this.cssClosingAnimation() && state === RdxHoverCardState.CLOSED) ||
+            (this.cssAnimation() && !this.cssOpeningAnimation() && state === RdxHoverCardState.OPEN) ||
+            // !this.cssAnimationStatus() ||
+            (this.cssOpeningAnimation() &&
+                state === RdxHoverCardState.OPEN &&
+                [RdxHoverCardAnimationStatus.OPEN_STARTED].includes(this.cssAnimationStatus())) ||
+            (this.cssClosingAnimation() &&
+                state === RdxHoverCardState.CLOSED &&
+                [RdxHoverCardAnimationStatus.CLOSED_STARTED].includes(this.cssAnimationStatus())));
+    }
+    /** @ignore */
+    ifOpenOrCloseWithAnimations(cssAnimationStatus) {
+        return (this.contentAttributesComponent() &&
+            this.cssAnimation() &&
+            cssAnimationStatus &&
+            ((this.cssOpeningAnimation() &&
+                this.state() === RdxHoverCardState.OPEN &&
+                [RdxHoverCardAnimationStatus.OPEN_ENDED].includes(cssAnimationStatus)) ||
+                (this.cssClosingAnimation() &&
+                    this.state() === RdxHoverCardState.CLOSED &&
+                    [RdxHoverCardAnimationStatus.CLOSED_ENDED].includes(cssAnimationStatus))));
+    }
+    /** @ignore */
+    openOrClose(state) {
+        const isOpen = this.isOpen(state);
+        isOpen ? this.openContent() : this.closeContent();
+    }
+    /** @ignore */
+    emitOnOpenOrOnClosed(state) {
+        this.isOpen(state)
+            ? this.attachDetachEvent() === RdxHoverCardAttachDetachEvent.ATTACH && this.emitOnOpen()
+            : this.attachDetachEvent() === RdxHoverCardAttachDetachEvent.DETACH && this.emitOnClosed();
+    }
+    /** @ignore */
+    canEmitOnOpenOrOnClosed() {
+        return (!this.cssAnimation() ||
+            (!this.cssOpeningAnimation() && this.state() === RdxHoverCardState.OPEN) ||
+            (this.cssOpeningAnimation() &&
+                this.state() === RdxHoverCardState.OPEN &&
+                this.cssAnimationStatus() === RdxHoverCardAnimationStatus.OPEN_ENDED) ||
+            (!this.cssClosingAnimation() && this.state() === RdxHoverCardState.CLOSED) ||
+            (this.cssClosingAnimation() &&
+                this.state() === RdxHoverCardState.CLOSED &&
+                this.cssAnimationStatus() === RdxHoverCardAnimationStatus.CLOSED_ENDED));
+    }
+    /** @ignore */
+    onStateChangeEffect() {
+        let isFirst = true;
+        effect(() => {
+            const state = this.state();
+            untracked(() => {
+                if (isFirst) {
+                    isFirst = false;
+                    return;
+                }
+                if (!this.ifOpenOrCloseWithoutAnimations(state)) {
+                    return;
+                }
+                this.openOrClose(state);
+            });
+        }, {});
+    }
+    /** @ignore */
+    onCssAnimationStatusChangeChangeEffect() {
+        let isFirst = true;
+        effect(() => {
+            const cssAnimationStatus = this.cssAnimationStatus();
+            untracked(() => {
+                if (isFirst) {
+                    isFirst = false;
+                    return;
+                }
+                if (!this.ifOpenOrCloseWithAnimations(cssAnimationStatus)) {
+                    return;
+                }
+                this.openOrClose(this.state());
+            });
+        });
+    }
+    /** @ignore */
+    emitOpenOrClosedEventEffect() {
+        let isFirst = true;
+        effect(() => {
+            this.attachDetachEvent();
+            this.cssAnimationStatus();
+            untracked(() => {
+                if (isFirst) {
+                    isFirst = false;
+                    return;
+                }
+                const canEmitOpenClose = untracked(() => this.canEmitOnOpenOrOnClosed());
+                if (!canEmitOpenClose) {
+                    return;
+                }
+                this.emitOnOpenOrOnClosed(this.state());
+            });
+        });
+    }
+    /** @ignore */
+    onOpenChangeEffect() {
+        effect(() => {
+            const open = this.open();
+            untracked(() => {
+                this.setState(open ? RdxHoverCardState.OPEN : RdxHoverCardState.CLOSED);
+            });
+        });
+    }
+    /** @ignore */
+    onIsFirstDefaultOpenChangeEffect() {
+        const effectRef = effect(() => {
+            const defaultOpen = this.defaultOpen();
+            untracked(() => {
+                if (!defaultOpen || this.open()) {
+                    effectRef.destroy();
+                    return;
+                }
+                this.handleOpen();
+            });
+        });
+    }
+    /** @ignore */
+    actionSubscription() {
+        this.actionSubject$
+            .asObservable()
+            .pipe(map((action) => {
+            console.log(action);
+            switch (action) {
+                case RdxHoverCardAction.OPEN:
+                    return { action, duration: this.openDelay() };
+                case RdxHoverCardAction.CLOSE:
+                    return { action, duration: this.closeDelay() };
+            }
+        }), debounce((config) => timer(config.duration)), tap((config) => {
+            switch (config.action) {
+                case RdxHoverCardAction.OPEN:
+                    this.setState(RdxHoverCardState.OPEN);
+                    break;
+                case RdxHoverCardAction.CLOSE:
+                    this.setState(RdxHoverCardState.CLOSED);
+                    break;
+            }
+        }), takeUntilDestroyed())
+            .subscribe();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardRootDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.0.5", type: RdxHoverCardRootDirective, isStandalone: true, selector: "[rdxHoverCardRoot]", 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 }, openDelay: { classPropertyName: "openDelay", publicName: "openDelay", isSignal: true, isRequired: false, transformFunction: null }, closeDelay: { classPropertyName: "closeDelay", publicName: "closeDelay", 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: "contentDirective", first: true, predicate: RdxHoverCardContentDirective, descendants: true, isSignal: true }, { propertyName: "triggerDirective", first: true, predicate: RdxHoverCardTriggerDirective, descendants: true, isSignal: true }, { propertyName: "arrowDirective", first: true, predicate: RdxHoverCardArrowToken, descendants: true, isSignal: true }, { propertyName: "closeDirective", first: true, predicate: RdxHoverCardCloseToken, descendants: true, isSignal: true }, { propertyName: "contentAttributesComponent", first: true, predicate: RdxHoverCardContentAttributesToken, descendants: true, isSignal: true }, { propertyName: "internalAnchorDirective", first: true, predicate: RdxHoverCardAnchorToken, descendants: true, isSignal: true }], exportAs: ["rdxHoverCardRoot"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardRootDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rdxHoverCardRoot]',
+                    exportAs: 'rdxHoverCardRoot'
+                }]
+        }], ctorParameters: () => [] });
+
+function injectHoverCardRoot(optional = false) {
+    isDevMode() && assertInInjectionContext(injectHoverCardRoot);
+    return inject(RdxHoverCardRootDirective, { optional });
+}
+
+class RdxHoverCardAnchorDirective {
+    constructor() {
+        /**
+         * @ignore
+         * If outside the rootDirective then null, otherwise the rootDirective directive - with optional `true` passed in as the first param.
+         * If outside the rootDirective and non-null value that means the html structure is wrong - hover-card inside hover-card.
+         * */
+        this.rootDirective = injectHoverCardRoot(true);
+        /** @ignore */
+        this.elementRef = inject(ElementRef);
+        /** @ignore */
+        this.overlayOrigin = inject(CdkOverlayOrigin);
+        /** @ignore */
+        this.document = injectDocument();
+        /** @ignore */
+        this.name = computed(() => `rdx-hover-card-external-anchor-${this.rootDirective?.uniqueId()}`);
+    }
+    /** @ignore */
+    click() {
+        this.emitOutsideClick();
+    }
+    /** @ignore */
+    setRoot(root) {
+        this.rootDirective = root;
+    }
+    emitOutsideClick() {
+        if (!this.rootDirective?.isOpen() || this.rootDirective?.contentDirective().onOverlayOutsideClickDisabled()) {
+            return;
+        }
+        const clickEvent = new MouseEvent('click', {
+            view: this.document.defaultView,
+            bubbles: true,
+            cancelable: true,
+            relatedTarget: this.elementRef.nativeElement
+        });
+        this.rootDirective?.triggerDirective().elementRef.nativeElement.dispatchEvent(clickEvent);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardAnchorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: RdxHoverCardAnchorDirective, isStandalone: true, selector: "[rdxHoverCardAnchor]", host: { attributes: { "type": "button" }, listeners: { "click": "click()" }, properties: { "attr.id": "name()", "attr.aria-haspopup": "\"dialog\"" } }, providers: [
+            {
+                provide: RdxHoverCardAnchorToken,
+                useExisting: forwardRef(() => RdxHoverCardAnchorDirective)
+            }
+        ], exportAs: ["rdxHoverCardAnchor"], hostDirectives: [{ directive: i1.CdkOverlayOrigin }], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardAnchorDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rdxHoverCardAnchor]',
+                    exportAs: 'rdxHoverCardAnchor',
+                    hostDirectives: [CdkOverlayOrigin],
+                    host: {
+                        type: 'button',
+                        '[attr.id]': 'name()',
+                        '[attr.aria-haspopup]': '"dialog"',
+                        '(click)': 'click()'
+                    },
+                    providers: [
+                        {
+                            provide: RdxHoverCardAnchorToken,
+                            useExisting: forwardRef(() => RdxHoverCardAnchorDirective)
+                        }
+                    ]
+                }]
+        }] });
+
+class RdxHoverCardArrowDirective {
+    constructor() {
+        /** @ignore */
+        this.renderer = inject(Renderer2);
+        /** @ignore */
+        this.rootDirective = injectHoverCardRoot();
+        /** @ignore */
+        this.elementRef = inject(ElementRef);
+        /**
+         * @description The width of the arrow in pixels.
+         * @default 10
+         */
+        this.width = input(RDX_POSITIONING_DEFAULTS.arrow.width, { transform: numberAttribute });
+        /**
+         * @description The height of the arrow in pixels.
+         * @default 5
+         */
+        this.height = input(RDX_POSITIONING_DEFAULTS.arrow.height, { transform: numberAttribute });
+        /** @ignore */
+        this.arrowSvgElement = computed(() => {
+            const width = this.width();
+            const height = this.height();
+            const svgElement = this.renderer.createElement('svg', 'svg');
+            this.renderer.setAttribute(svgElement, 'viewBox', '0 0 30 10');
+            this.renderer.setAttribute(svgElement, 'width', String(width));
+            this.renderer.setAttribute(svgElement, 'height', String(height));
+            const polygonElement = this.renderer.createElement('polygon', 'svg');
+            this.renderer.setAttribute(polygonElement, 'points', '0,0 30,0 15,10');
+            this.renderer.setAttribute(svgElement, 'preserveAspectRatio', 'none');
+            this.renderer.appendChild(svgElement, polygonElement);
+            return svgElement;
+        });
+        /** @ignore */
+        this.currentArrowSvgElement = signal(void 0);
+        /** @ignore */
+        this.position = toSignal(this.rootDirective.contentDirective().positionChange());
+        afterNextRender({
+            write: () => {
+                if (this.elementRef.nativeElement.parentElement) {
+                    this.renderer.setStyle(this.elementRef.nativeElement.parentElement, 'position', 'relative');
+                }
+                this.renderer.setStyle(this.elementRef.nativeElement, 'position', 'absolute');
+                this.renderer.setStyle(this.elementRef.nativeElement, 'boxSizing', '');
+                this.renderer.setStyle(this.elementRef.nativeElement, 'fontSize', '0px');
+            }
+        });
+        this.onArrowSvgElementChangeEffect();
+        this.onContentPositionAndArrowDimensionsChangeEffect();
+    }
+    /** @ignore */
+    setAnchorOrTriggerRect() {
+        this.anchorOrTriggerRect = (this.rootDirective.anchorDirective() ?? this.rootDirective.triggerDirective()).elementRef.nativeElement.getBoundingClientRect();
+    }
+    /** @ignore */
+    setPosition(position, arrowDimensions) {
+        this.setAnchorOrTriggerRect();
+        const posParams = getArrowPositionParams(getSideAndAlignFromAllPossibleConnectedPositions(position.connectionPair), { width: arrowDimensions.width, height: arrowDimensions.height }, { width: this.anchorOrTriggerRect.width, height: this.anchorOrTriggerRect.height });
+        this.renderer.setStyle(this.elementRef.nativeElement, 'top', posParams.top);
+        this.renderer.setStyle(this.elementRef.nativeElement, 'bottom', '');
+        this.renderer.setStyle(this.elementRef.nativeElement, 'left', posParams.left);
+        this.renderer.setStyle(this.elementRef.nativeElement, 'right', '');
+        this.renderer.setStyle(this.elementRef.nativeElement, 'transform', posParams.transform);
+        this.renderer.setStyle(this.elementRef.nativeElement, 'transformOrigin', posParams.transformOrigin);
+    }
+    /** @ignore */
+    onArrowSvgElementChangeEffect() {
+        effect(() => {
+            const arrowElement = this.arrowSvgElement();
+            untracked(() => {
+                const currentArrowSvgElement = this.currentArrowSvgElement();
+                if (currentArrowSvgElement) {
+                    this.renderer.removeChild(this.elementRef.nativeElement, currentArrowSvgElement);
+                }
+                this.currentArrowSvgElement.set(arrowElement);
+                this.renderer.setStyle(this.elementRef.nativeElement, 'width', `${this.width()}px`);
+                this.renderer.setStyle(this.elementRef.nativeElement, 'height', `${this.height()}px`);
+                this.renderer.appendChild(this.elementRef.nativeElement, this.currentArrowSvgElement());
+            });
+        });
+    }
+    /** @ignore */
+    onContentPositionAndArrowDimensionsChangeEffect() {
+        effect(() => {
+            const position = this.position();
+            const arrowDimensions = { width: this.width(), height: this.height() };
+            untracked(() => {
+                if (!position) {
+                    return;
+                }
+                this.setPosition(position, arrowDimensions);
+            });
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardArrowDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.5", type: RdxHoverCardArrowDirective, isStandalone: true, selector: "[rdxHoverCardArrow]", 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: RdxHoverCardArrowToken,
+                useExisting: forwardRef(() => RdxHoverCardArrowDirective)
+            }
+        ], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardArrowDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rdxHoverCardArrow]',
+                    providers: [
+                        {
+                            provide: RdxHoverCardArrowToken,
+                            useExisting: forwardRef(() => RdxHoverCardArrowDirective)
+                        }
+                    ]
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * TODO: to be removed? But it seems to be useful when controlled from outside
+ */
+class RdxHoverCardCloseDirective {
+    constructor() {
+        /** @ignore */
+        this.rootDirective = injectHoverCardRoot();
+        /** @ignore */
+        this.elementRef = inject(ElementRef);
+        /** @ignore */
+        this.renderer = inject(Renderer2);
+        this.onIsControlledExternallyEffect();
+    }
+    /** @ignore */
+    onIsControlledExternallyEffect() {
+        effect(() => {
+            const isControlledExternally = this.rootDirective.controlledExternally()();
+            untracked(() => {
+                this.renderer.setStyle(this.elementRef.nativeElement, 'display', isControlledExternally ? null : 'none');
+            });
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardCloseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: RdxHoverCardCloseDirective, isStandalone: true, selector: "[rdxHoverCardClose]", host: { attributes: { "type": "button" }, listeners: { "click": "rootDirective.handleClose(true)" } }, providers: [
+            {
+                provide: RdxHoverCardCloseToken,
+                useExisting: forwardRef(() => RdxHoverCardCloseDirective)
+            }
+        ], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardCloseDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rdxHoverCardClose]',
+                    host: {
+                        type: 'button',
+                        '(click)': 'rootDirective.handleClose(true)'
+                    },
+                    providers: [
+                        {
+                            provide: RdxHoverCardCloseToken,
+                            useExisting: forwardRef(() => RdxHoverCardCloseDirective)
+                        }
+                    ]
+                }]
+        }], ctorParameters: () => [] });
+
+class RdxHoverCardContentAttributesComponent {
+    constructor() {
+        /** @ignore */
+        this.rootDirective = injectHoverCardRoot();
+        /** @ignore */
+        this.name = computed(() => `rdx-hover-card-content-attributes-${this.rootDirective.uniqueId()}`);
+        /** @ignore */
+        this.disableAnimation = computed(() => !this.canAnimate());
+    }
+    /** @ignore */
+    onAnimationStart(_) {
+        this.rootDirective.cssAnimationStatus.set(this.rootDirective.state() === RdxHoverCardState.OPEN
+            ? RdxHoverCardAnimationStatus.OPEN_STARTED
+            : RdxHoverCardAnimationStatus.CLOSED_STARTED);
+    }
+    /** @ignore */
+    onAnimationEnd(_) {
+        this.rootDirective.cssAnimationStatus.set(this.rootDirective.state() === RdxHoverCardState.OPEN
+            ? RdxHoverCardAnimationStatus.OPEN_ENDED
+            : RdxHoverCardAnimationStatus.CLOSED_ENDED);
+    }
+    /** @ignore */
+    pointerenter() {
+        this.rootDirective.handleOpen();
+    }
+    /** @ignore */
+    pointerleave() {
+        this.rootDirective.handleClose();
+    }
+    /** @ignore */
+    focus() {
+        this.rootDirective.handleOpen();
+    }
+    /** @ignore */
+    blur() {
+        this.rootDirective.handleClose();
+    }
+    /** @ignore */
+    canAnimate() {
+        return (this.rootDirective.cssAnimation() &&
+            ((this.rootDirective.cssOpeningAnimation() && this.rootDirective.state() === RdxHoverCardState.OPEN) ||
+                (this.rootDirective.cssClosingAnimation() && this.rootDirective.state() === RdxHoverCardState.CLOSED)));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardContentAttributesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: RdxHoverCardContentAttributesComponent, isStandalone: true, selector: "[rdxHoverCardContentAttributes]", host: { listeners: { "animationstart": "onAnimationStart($event)", "animationend": "onAnimationEnd($event)", "pointerenter": "pointerenter()", "pointerleave": "pointerleave()", "focus": "focus()", "blur": "blur()" }, properties: { "attr.role": "\"dialog\"", "attr.id": "name()", "attr.data-state": "rootDirective.state()", "attr.data-side": "rootDirective.contentDirective().side()", "attr.data-align": "rootDirective.contentDirective().align()", "style": "disableAnimation() ? {animation: \"none !important\"} : null" } }, providers: [
+            {
+                provide: RdxHoverCardContentAttributesToken,
+                useExisting: forwardRef(() => RdxHoverCardContentAttributesComponent)
+            }
+        ], ngImport: i0, template: `
+        <ng-content />
+    `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardContentAttributesComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: '[rdxHoverCardContentAttributes]',
+                    template: `
+        <ng-content />
+    `,
+                    host: {
+                        '[attr.role]': '"dialog"',
+                        '[attr.id]': 'name()',
+                        '[attr.data-state]': 'rootDirective.state()',
+                        '[attr.data-side]': 'rootDirective.contentDirective().side()',
+                        '[attr.data-align]': 'rootDirective.contentDirective().align()',
+                        '[style]': 'disableAnimation() ? {animation: "none !important"} : null',
+                        '(animationstart)': 'onAnimationStart($event)',
+                        '(animationend)': 'onAnimationEnd($event)',
+                        '(pointerenter)': 'pointerenter()',
+                        '(pointerleave)': 'pointerleave()',
+                        '(focus)': 'focus()',
+                        '(blur)': 'blur()'
+                    },
+                    providers: [
+                        {
+                            provide: RdxHoverCardContentAttributesToken,
+                            useExisting: forwardRef(() => RdxHoverCardContentAttributesComponent)
+                        }
+                    ],
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }] });
+
+const _imports = [
+    RdxHoverCardArrowDirective,
+    RdxHoverCardCloseDirective,
+    RdxHoverCardContentDirective,
+    RdxHoverCardTriggerDirective,
+    RdxHoverCardRootDirective,
+    RdxHoverCardAnchorDirective,
+    RdxHoverCardContentAttributesComponent
+];
+class RdxHoverCardModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardModule, imports: [RdxHoverCardArrowDirective,
+            RdxHoverCardCloseDirective,
+            RdxHoverCardContentDirective,
+            RdxHoverCardTriggerDirective,
+            RdxHoverCardRootDirective,
+            RdxHoverCardAnchorDirective,
+            RdxHoverCardContentAttributesComponent], exports: [RdxHoverCardArrowDirective,
+            RdxHoverCardCloseDirective,
+            RdxHoverCardContentDirective,
+            RdxHoverCardTriggerDirective,
+            RdxHoverCardRootDirective,
+            RdxHoverCardAnchorDirective,
+            RdxHoverCardContentAttributesComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardModule }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: RdxHoverCardModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [..._imports],
+                    exports: [..._imports]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { RdxHoverCardAnchorDirective, RdxHoverCardArrowDirective, RdxHoverCardCloseDirective, RdxHoverCardContentAttributesComponent, RdxHoverCardContentDirective, RdxHoverCardModule, RdxHoverCardRootDirective, RdxHoverCardTriggerDirective };
+//# sourceMappingURL=radix-ng-primitives-hover-card.mjs.map