@radix-ng/primitives 1.0.4 → 1.0.6

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

@@ -33,14 +33,17 @@ class RdxPortal {
          * Specify a container to portal the content into. Can be an `ElementRef`, a native element, or a
          * CSS selector. Defaults to `document.body` when not set (or when a selector matches nothing).
          */
-        this.container = input(...(ngDevMode ? [undefined, { debugName: "container" }] : /* istanbul ignore next */ []));
-        this._computedContainer = linkedSignal(this.container, ...(ngDevMode ? [{ debugName: "_computedContainer" }] : /* istanbul ignore next */ []));
+        this.container = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "container" }] : /* istanbul ignore next */ []));
+        this._computedContainer = linkedSignal(this.container, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "_computedContainer" }] : /* istanbul ignore next */ []));
         this.computedContainer = this._computedContainer.asReadonly();
         this.elementContainer = computed(() => {
             const provided = resolvePortalContainer(this.computedContainer(), this.document);
             const body = this.document?.body ?? null;
             return provided ?? body;
-        }, ...(ngDevMode ? [{ debugName: "elementContainer" }] : /* istanbul ignore next */ []));
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "elementContainer" }] : /* istanbul ignore next */ []));
         const isBrowser = isPlatformBrowser(this.platformId);
         if (!isBrowser || !this.document) {
             return;
@@ -63,10 +66,10 @@ class RdxPortal {
     setContainer(container) {
         this._computedContainer.set(container);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPortal, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: RdxPortal, isStandalone: true, selector: "[rdxPortal]", inputs: { container: { classPropertyName: "container", publicName: "container", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["rdxPortal"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPortal, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", type: RdxPortal, isStandalone: true, selector: "[rdxPortal]", inputs: { container: { classPropertyName: "container", publicName: "container", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["rdxPortal"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPortal, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPortal, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPortal]',
@@ -99,14 +102,18 @@ class RdxPortalPresence {
          * Container to portal the content into. Can be an `ElementRef`, a native element, or a CSS
          * selector. Defaults to `document.body` (or when a selector matches nothing).
          */
-        this.container = input(...(ngDevMode ? [undefined, { debugName: "container" }] : /* istanbul ignore next */ []));
-        this._computedContainer = linkedSignal(this.container, ...(ngDevMode ? [{ debugName: "_computedContainer" }] : /* istanbul ignore next */ []));
+        this.container = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "container" }] : /* istanbul ignore next */ []));
+        this._computedContainer = linkedSignal(this.container, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "_computedContainer" }] : /* istanbul ignore next */ []));
         this.elementContainer = computed(() => {
             const provided = resolvePortalContainer(this._computedContainer(), this.document);
             return provided ?? this.document?.body ?? null;
-        }, ...(ngDevMode ? [{ debugName: "elementContainer" }] : /* istanbul ignore next */ []));
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "elementContainer" }] : /* istanbul ignore next */ []));
         /** The live view's root nodes, exposed as a signal so the relocation effect re-runs on (re)mount. */
-        this.mountedNodes = signal([], ...(ngDevMode ? [{ debugName: "mountedNodes" }] : /* istanbul ignore next */ []));
+        this.mountedNodes = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "mountedNodes" }] : /* istanbul ignore next */ []));
         this.viewRef = null;
         const machine = new PresenceMachine({
             present: inject(RDX_PRESENCE_CONTEXT).present,
@@ -147,10 +154,10 @@ class RdxPortalPresence {
         this.viewRef = null;
         this.mountedNodes.set([]);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPortalPresence, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: RdxPortalPresence, isStandalone: true, inputs: { container: { classPropertyName: "container", publicName: "container", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPortalPresence, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", type: RdxPortalPresence, isStandalone: true, inputs: { container: { classPropertyName: "container", publicName: "container", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPortalPresence, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPortalPresence, decorators: [{
             type: Directive,
             args: [{
                     standalone: true

package/fesm2022/radix-ng-primitives-portal.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"radix-ng-primitives-portal.mjs","sources":["../../../packages/primitives/portal/src/resolve-container.ts","../../../packages/primitives/portal/src/portal.ts","../../../packages/primitives/portal/src/portal-presence.ts","../../../packages/primitives/portal/radix-ng-primitives-portal.ts"],"sourcesContent":["import { ElementRef } from '@angular/core';\n\n/**\n * A target container for a portal. Accepts an `ElementRef`, a native element, or a CSS selector\n * resolved against the document.\n */\nexport type RdxPortalContainer = ElementRef<HTMLElement> | HTMLElement | string;\n\n/**\n * Resolve a {@link RdxPortalContainer} to a concrete element. Returns `null` when nothing usable is\n * provided (a missing container, a selector matching nothing, or a non-element value), so callers can\n * fall back to `document.body`. Shared by `RdxPortal` and `RdxPortalPresence`.\n */\nexport function resolvePortalContainer(\n    container: RdxPortalContainer | undefined,\n    document: Document | null\n): HTMLElement | null {\n    if (!container) {\n        return null;\n    }\n    if (typeof container === 'string') {\n        return document?.querySelector<HTMLElement>(container) ?? null;\n    }\n    if (container instanceof ElementRef) {\n        return container.nativeElement ?? null;\n    }\n    // Anything that isn't a real element (e.g. a TemplateRef passed by mistake) falls back to the\n    // default container so the content still leaves the flow instead of staying in place.\n    return container instanceof HTMLElement ? container : null;\n}\n","import { DOCUMENT, isPlatformBrowser } from '@angular/common';\nimport {\n    computed,\n    DestroyRef,\n    Directive,\n    effect,\n    ElementRef,\n    inject,\n    input,\n    linkedSignal,\n    PLATFORM_ID\n} from '@angular/core';\nimport { RdxPortalContainer, resolvePortalContainer } from './resolve-container';\n\n@Directive({\n    selector: '[rdxPortal]',\n    exportAs: 'rdxPortal'\n})\nexport class RdxPortal {\n    private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n    private readonly platformId = inject(PLATFORM_ID);\n    private readonly document = inject(DOCUMENT, { optional: true });\n    private readonly destroyRef = inject(DestroyRef);\n\n    /**\n     * Specify a container to portal the content into. Can be an `ElementRef`, a native element, or a\n     * CSS selector. Defaults to `document.body` when not set (or when a selector matches nothing).\n     */\n    readonly container = input<RdxPortalContainer>();\n\n    private readonly _computedContainer = linkedSignal(this.container);\n    readonly computedContainer = this._computedContainer.asReadonly();\n\n    private readonly elementContainer = computed<HTMLElement | null>(() => {\n        const provided = resolvePortalContainer(this.computedContainer(), this.document);\n        const body = this.document?.body ?? null;\n        return provided ?? body;\n    });\n\n    constructor() {\n        const isBrowser = isPlatformBrowser(this.platformId);\n        if (!isBrowser || !this.document) {\n            return;\n        }\n\n        const element = this.elementRef.nativeElement;\n        // Anchor the original DOM position with a comment node, so the element can be restored\n        // exactly where it was when the directive is destroyed.\n        const anchor = this.document.createComment('rdx-portal');\n        element.parentNode?.insertBefore(anchor, element);\n\n        // Move reactively: the effect runs after inputs are bound (so `container` is respected on\n        // first render) and re-runs whenever the target container changes. `appendChild` relocates\n        // the element, it does not clone it.\n        effect(() => {\n            this.elementContainer()?.appendChild(element);\n        });\n\n        this.destroyRef.onDestroy(() => {\n            anchor.parentNode?.replaceChild(element, anchor);\n        });\n    }\n\n    setContainer(container: RdxPortalContainer) {\n        this._computedContainer.set(container);\n    }\n}\n","import { DOCUMENT, isPlatformBrowser } from '@angular/common';\nimport {\n    computed,\n    DestroyRef,\n    Directive,\n    effect,\n    EmbeddedViewRef,\n    inject,\n    Injector,\n    input,\n    linkedSignal,\n    PLATFORM_ID,\n    signal,\n    TemplateRef,\n    ViewContainerRef\n} from '@angular/core';\nimport { PresenceMachine, RDX_PRESENCE_CONTEXT } from '@radix-ng/primitives/presence';\nimport { RdxPortalContainer, resolvePortalContainer } from './resolve-container';\n\n/**\n * Structural directive merging what `RdxPortal` + `RdxPresenceDirective` did as a pair: it mounts its\n * template while `present()` (from {@link RDX_PRESENCE_CONTEXT}) is `true`, **relocates every root\n * node into a portal container** (default `document.body`), and on close runs the presence exit state\n * machine — keeping the content mounted until every running CSS exit `@keyframes` on any root node\n * finishes.\n *\n * Unlike `RdxPortal`, it adds **no wrapper element**: the template's root nodes become direct children\n * of the container. Use the `*` microsyntax for the common single-root case\n * (`<div *rdxXxxPortal rdxXxxPositioner>`) or the explicit `<ng-template rdxXxxPortal>` form for a\n * custom container or multiple root nodes (e.g. a dialog backdrop + popup).\n *\n * SSR: on the server the view renders in place and is never relocated; after hydration the relocation\n * effect moves the nodes into the container (same browser-guarded split `RdxPortal` uses).\n */\n@Directive({\n    standalone: true\n})\nexport class RdxPortalPresence {\n    private readonly viewContainerRef = inject(ViewContainerRef);\n    private readonly templateRef = inject(TemplateRef<void>);\n    private readonly document = inject(DOCUMENT, { optional: true });\n    private readonly isBrowser = isPlatformBrowser(inject(PLATFORM_ID));\n\n    /**\n     * Container to portal the content into. Can be an `ElementRef`, a native element, or a CSS\n     * selector. Defaults to `document.body` (or when a selector matches nothing).\n     */\n    readonly container = input<RdxPortalContainer>();\n\n    private readonly _computedContainer = linkedSignal(this.container);\n\n    private readonly elementContainer = computed<HTMLElement | null>(() => {\n        const provided = resolvePortalContainer(this._computedContainer(), this.document);\n        return provided ?? this.document?.body ?? null;\n    });\n\n    /** The live view's root nodes, exposed as a signal so the relocation effect re-runs on (re)mount. */\n    private readonly mountedNodes = signal<Node[]>([]);\n    private viewRef: EmbeddedViewRef<void> | null = null;\n\n    constructor() {\n        const machine = new PresenceMachine({\n            present: inject(RDX_PRESENCE_CONTEXT).present,\n            isBrowser: this.isBrowser,\n            injector: inject(Injector),\n            mountView: () => this.mountView(),\n            destroyView: () => this.destroyView()\n        });\n\n        // Relocate reactively: re-runs whenever the resolved container changes or the view is\n        // (re)mounted. On the server we never relocate — the nodes render in place.\n        effect(() => {\n            const container = this.elementContainer();\n            const nodes = this.mountedNodes();\n            if (!this.isBrowser || !container) {\n                return;\n            }\n            for (const node of nodes) {\n                container.appendChild(node);\n            }\n        });\n\n        inject(DestroyRef).onDestroy(() => machine.dispose());\n    }\n\n    /** Imperatively override the portal container (parity with `RdxPortal.setContainer`). */\n    setContainer(container: RdxPortalContainer): void {\n        this._computedContainer.set(container);\n    }\n\n    private mountView(): HTMLElement[] {\n        this.viewRef = this.viewContainerRef.createEmbeddedView(this.templateRef);\n        const rootNodes = this.viewRef.rootNodes as Node[];\n        this.mountedNodes.set(rootNodes);\n        // Watch every element root for exit animations (dialog returns backdrop + popup).\n        return rootNodes.filter((node): node is HTMLElement => node instanceof HTMLElement);\n    }\n\n    private destroyView(): void {\n        // Destroying the view removes the nodes from wherever they currently live (the container) —\n        // no anchor-comment juggling, unlike `RdxPortal` which restores its host element.\n        this.viewRef?.destroy();\n        this.viewRef = null;\n        this.mountedNodes.set([]);\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"radix-ng-primitives-portal.mjs","sources":["../../../packages/primitives/portal/src/resolve-container.ts","../../../packages/primitives/portal/src/portal.ts","../../../packages/primitives/portal/src/portal-presence.ts","../../../packages/primitives/portal/radix-ng-primitives-portal.ts"],"sourcesContent":["import { ElementRef } from '@angular/core';\n\n/**\n * A target container for a portal. Accepts an `ElementRef`, a native element, or a CSS selector\n * resolved against the document.\n */\nexport type RdxPortalContainer = ElementRef<HTMLElement> | HTMLElement | string;\n\n/**\n * Resolve a {@link RdxPortalContainer} to a concrete element. Returns `null` when nothing usable is\n * provided (a missing container, a selector matching nothing, or a non-element value), so callers can\n * fall back to `document.body`. Shared by `RdxPortal` and `RdxPortalPresence`.\n */\nexport function resolvePortalContainer(\n    container: RdxPortalContainer | undefined,\n    document: Document | null\n): HTMLElement | null {\n    if (!container) {\n        return null;\n    }\n    if (typeof container === 'string') {\n        return document?.querySelector<HTMLElement>(container) ?? null;\n    }\n    if (container instanceof ElementRef) {\n        return container.nativeElement ?? null;\n    }\n    // Anything that isn't a real element (e.g. a TemplateRef passed by mistake) falls back to the\n    // default container so the content still leaves the flow instead of staying in place.\n    return container instanceof HTMLElement ? container : null;\n}\n","import { DOCUMENT, isPlatformBrowser } from '@angular/common';\nimport {\n    computed,\n    DestroyRef,\n    Directive,\n    effect,\n    ElementRef,\n    inject,\n    input,\n    linkedSignal,\n    PLATFORM_ID\n} from '@angular/core';\nimport { RdxPortalContainer, resolvePortalContainer } from './resolve-container';\n\n@Directive({\n    selector: '[rdxPortal]',\n    exportAs: 'rdxPortal'\n})\nexport class RdxPortal {\n    private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n    private readonly platformId = inject(PLATFORM_ID);\n    private readonly document = inject(DOCUMENT, { optional: true });\n    private readonly destroyRef = inject(DestroyRef);\n\n    /**\n     * Specify a container to portal the content into. Can be an `ElementRef`, a native element, or a\n     * CSS selector. Defaults to `document.body` when not set (or when a selector matches nothing).\n     */\n    readonly container = input<RdxPortalContainer>();\n\n    private readonly _computedContainer = linkedSignal(this.container);\n    readonly computedContainer = this._computedContainer.asReadonly();\n\n    private readonly elementContainer = computed<HTMLElement | null>(() => {\n        const provided = resolvePortalContainer(this.computedContainer(), this.document);\n        const body = this.document?.body ?? null;\n        return provided ?? body;\n    });\n\n    constructor() {\n        const isBrowser = isPlatformBrowser(this.platformId);\n        if (!isBrowser || !this.document) {\n            return;\n        }\n\n        const element = this.elementRef.nativeElement;\n        // Anchor the original DOM position with a comment node, so the element can be restored\n        // exactly where it was when the directive is destroyed.\n        const anchor = this.document.createComment('rdx-portal');\n        element.parentNode?.insertBefore(anchor, element);\n\n        // Move reactively: the effect runs after inputs are bound (so `container` is respected on\n        // first render) and re-runs whenever the target container changes. `appendChild` relocates\n        // the element, it does not clone it.\n        effect(() => {\n            this.elementContainer()?.appendChild(element);\n        });\n\n        this.destroyRef.onDestroy(() => {\n            anchor.parentNode?.replaceChild(element, anchor);\n        });\n    }\n\n    setContainer(container: RdxPortalContainer) {\n        this._computedContainer.set(container);\n    }\n}\n","import { DOCUMENT, isPlatformBrowser } from '@angular/common';\nimport {\n    computed,\n    DestroyRef,\n    Directive,\n    effect,\n    EmbeddedViewRef,\n    inject,\n    Injector,\n    input,\n    linkedSignal,\n    PLATFORM_ID,\n    signal,\n    TemplateRef,\n    ViewContainerRef\n} from '@angular/core';\nimport { PresenceMachine, RDX_PRESENCE_CONTEXT } from '@radix-ng/primitives/presence';\nimport { RdxPortalContainer, resolvePortalContainer } from './resolve-container';\n\n/**\n * Structural directive merging what `RdxPortal` + `RdxPresenceDirective` did as a pair: it mounts its\n * template while `present()` (from {@link RDX_PRESENCE_CONTEXT}) is `true`, **relocates every root\n * node into a portal container** (default `document.body`), and on close runs the presence exit state\n * machine — keeping the content mounted until every running CSS exit `@keyframes` on any root node\n * finishes.\n *\n * Unlike `RdxPortal`, it adds **no wrapper element**: the template's root nodes become direct children\n * of the container. Use the `*` microsyntax for the common single-root case\n * (`<div *rdxXxxPortal rdxXxxPositioner>`) or the explicit `<ng-template rdxXxxPortal>` form for a\n * custom container or multiple root nodes (e.g. a dialog backdrop + popup).\n *\n * SSR: on the server the view renders in place and is never relocated; after hydration the relocation\n * effect moves the nodes into the container (same browser-guarded split `RdxPortal` uses).\n */\n@Directive({\n    standalone: true\n})\nexport class RdxPortalPresence {\n    private readonly viewContainerRef = inject(ViewContainerRef);\n    private readonly templateRef = inject(TemplateRef<void>);\n    private readonly document = inject(DOCUMENT, { optional: true });\n    private readonly isBrowser = isPlatformBrowser(inject(PLATFORM_ID));\n\n    /**\n     * Container to portal the content into. Can be an `ElementRef`, a native element, or a CSS\n     * selector. Defaults to `document.body` (or when a selector matches nothing).\n     */\n    readonly container = input<RdxPortalContainer>();\n\n    private readonly _computedContainer = linkedSignal(this.container);\n\n    private readonly elementContainer = computed<HTMLElement | null>(() => {\n        const provided = resolvePortalContainer(this._computedContainer(), this.document);\n        return provided ?? this.document?.body ?? null;\n    });\n\n    /** The live view's root nodes, exposed as a signal so the relocation effect re-runs on (re)mount. */\n    private readonly mountedNodes = signal<Node[]>([]);\n    private viewRef: EmbeddedViewRef<void> | null = null;\n\n    constructor() {\n        const machine = new PresenceMachine({\n            present: inject(RDX_PRESENCE_CONTEXT).present,\n            isBrowser: this.isBrowser,\n            injector: inject(Injector),\n            mountView: () => this.mountView(),\n            destroyView: () => this.destroyView()\n        });\n\n        // Relocate reactively: re-runs whenever the resolved container changes or the view is\n        // (re)mounted. On the server we never relocate — the nodes render in place.\n        effect(() => {\n            const container = this.elementContainer();\n            const nodes = this.mountedNodes();\n            if (!this.isBrowser || !container) {\n                return;\n            }\n            for (const node of nodes) {\n                container.appendChild(node);\n            }\n        });\n\n        inject(DestroyRef).onDestroy(() => machine.dispose());\n    }\n\n    /** Imperatively override the portal container (parity with `RdxPortal.setContainer`). */\n    setContainer(container: RdxPortalContainer): void {\n        this._computedContainer.set(container);\n    }\n\n    private mountView(): HTMLElement[] {\n        this.viewRef = this.viewContainerRef.createEmbeddedView(this.templateRef);\n        const rootNodes = this.viewRef.rootNodes as Node[];\n        this.mountedNodes.set(rootNodes);\n        // Watch every element root for exit animations (dialog returns backdrop + popup).\n        return rootNodes.filter((node): node is HTMLElement => node instanceof HTMLElement);\n    }\n\n    private destroyView(): void {\n        // Destroying the view removes the nodes from wherever they currently live (the container) —\n        // no anchor-comment juggling, unlike `RdxPortal` which restores its host element.\n        this.viewRef?.destroy();\n        this.viewRef = null;\n        this.mountedNodes.set([]);\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

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

@@ -336,10 +336,10 @@ class RdxPresenceDirective {
         this.viewRef?.destroy();
         this.viewRef = null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPresenceDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxPresenceDirective, isStandalone: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPresenceDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxPresenceDirective, isStandalone: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPresenceDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPresenceDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true

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

@@ -36,14 +36,18 @@ class RdxPreviewCardRoot {
         this.hasAppliedDefaultTriggerId = false;
         this.hoverDelay = 600;
         this.hoverCloseDelay = 300;
-        this.isHoverActive = signal(false, ...(ngDevMode ? [{ debugName: "isHoverActive" }] : /* istanbul ignore next */ []));
-        this.instant = signal(false, ...(ngDevMode ? [{ debugName: "instant" }] : /* istanbul ignore next */ []));
-        this.openChangeReason = signal('none', ...(ngDevMode ? [{ debugName: "openChangeReason" }] : /* istanbul ignore next */ []));
+        this.isHoverActive = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isHoverActive" }] : /* istanbul ignore next */ []));
+        this.instant = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "instant" }] : /* istanbul ignore next */ []));
+        this.openChangeReason = signal('none', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "openChangeReason" }] : /* istanbul ignore next */ []));
         this.transitionStatus = this.transition.status;
         /**
          * Whether the preview-card is currently open.
          */
-        this.open = model(false, ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+        this.open = model(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
         /**
          * Whether the preview-card is initially open.
          */
@@ -51,27 +55,51 @@ class RdxPreviewCardRoot {
         /**
          * ID of the trigger associated with a controlled preview-card.
          */
-        this.triggerId = model(null, ...(ngDevMode ? [{ debugName: "triggerId" }] : /* istanbul ignore next */ []));
+        this.triggerId = model(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "triggerId" }] : /* istanbul ignore next */ []));
         /**
          * ID of the trigger associated with an initially open uncontrolled preview-card.
          */
-        this.defaultTriggerId = input(null, ...(ngDevMode ? [{ debugName: "defaultTriggerId" }] : /* istanbul ignore next */ []));
+        this.defaultTriggerId = input(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "defaultTriggerId" }] : /* istanbul ignore next */ []));
         /**
          * Associates this root with detached trigger elements.
          */
-        this.handle = input(...(ngDevMode ? [undefined, { debugName: "handle" }] : /* istanbul ignore next */ []));
+        this.handle = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "handle" }] : /* istanbul ignore next */ []));
         this.contentId = injectId('rdx-preview-card-content-');
-        this.trigger = signal(undefined, ...(ngDevMode ? [{ debugName: "trigger" }] : /* istanbul ignore next */ []));
-        this.triggers = signal([], ...(ngDevMode ? [{ debugName: "triggers" }] : /* istanbul ignore next */ []));
-        this.payload = signal(undefined, ...(ngDevMode ? [{ debugName: "payload" }] : /* istanbul ignore next */ []));
-        this.isPointerDownOnTrigger = signal(false, ...(ngDevMode ? [{ debugName: "isPointerDownOnTrigger" }] : /* istanbul ignore next */ []));
-        this.preventUnmountOnClose = signal(false, ...(ngDevMode ? [{ debugName: "preventUnmountOnClose" }] : /* istanbul ignore next */ []));
+        this.trigger = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "trigger" }] : /* istanbul ignore next */ []));
+        this.triggers = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "triggers" }] : /* istanbul ignore next */ []));
+        this.payload = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "payload" }] : /* istanbul ignore next */ []));
+        this.isPointerDownOnTrigger = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isPointerDownOnTrigger" }] : /* istanbul ignore next */ []));
+        this.preventUnmountOnClose = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "preventUnmountOnClose" }] : /* istanbul ignore next */ []));
         this.onOpenChange = output();
         this.onOpenChangeComplete = output();
         this.registeredTriggers = new Map();
         this.viewportTriggerChange = new Set();
-        this.state = computed(() => (this.open() ? 'open' : 'closed'), ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
-        this.present = computed(() => this.open() || this.preventUnmountOnClose(), ...(ngDevMode ? [{ debugName: "present" }] : /* istanbul ignore next */ []));
+        this.present = computed(() => this.open() || this.preventUnmountOnClose(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "present" }] : /* istanbul ignore next */ []));
+        /**
+         * Base UI `data-instant` enum, derived from the instant flag + reason: `'focus'` for a focus open,
+         * `'dismiss'` for a trigger-press / Escape close, `undefined` otherwise — including an outside-press
+         * close and a trigger switch, which Base UI animates rather than marking instant.
+         */
+        this.instantType = computed(() => {
+            if (!this.instant()) {
+                return undefined;
+            }
+            const reason = this.openChangeReason();
+            if (this.open()) {
+                return reason === 'trigger-focus' ? 'focus' : undefined;
+            }
+            return reason === 'trigger-press' || reason === 'escape-key' ? 'dismiss' : undefined;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "instantType" }] : /* istanbul ignore next */ []));
         let previousOpen = this.open();
         effect(() => {
             const defaultOpen = this.defaultOpen();
@@ -316,14 +344,14 @@ class RdxPreviewCardRoot {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardRoot, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: RdxPreviewCardRoot, isStandalone: true, selector: "[rdxPreviewCardRoot]", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, triggerId: { classPropertyName: "triggerId", publicName: "triggerId", isSignal: true, isRequired: false, transformFunction: null }, defaultTriggerId: { classPropertyName: "defaultTriggerId", publicName: "defaultTriggerId", isSignal: true, isRequired: false, transformFunction: null }, handle: { classPropertyName: "handle", publicName: "handle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", triggerId: "triggerIdChange", onOpenChange: "onOpenChange", onOpenChangeComplete: "onOpenChangeComplete" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardRoot, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", type: RdxPreviewCardRoot, isStandalone: true, selector: "[rdxPreviewCardRoot]", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, triggerId: { classPropertyName: "triggerId", publicName: "triggerId", isSignal: true, isRequired: false, transformFunction: null }, defaultTriggerId: { classPropertyName: "defaultTriggerId", publicName: "defaultTriggerId", isSignal: true, isRequired: false, transformFunction: null }, handle: { classPropertyName: "handle", publicName: "handle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", triggerId: "triggerIdChange", onOpenChange: "onOpenChange", onOpenChangeComplete: "onOpenChangeComplete" }, providers: [
             provideRdxPreviewCardRootContext(context),
             provideFloatingTree(),
             provideFloatingRootContext(() => inject(RdxPreviewCardRoot).floatingContext)
         ], exportAs: ["rdxPreviewCardRoot"], hostDirectives: [{ directive: i1.RdxPopper }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardRoot, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardRoot, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPreviewCardRoot]',
@@ -346,6 +374,7 @@ function contextFor(root) {
         payload: root.payload.asReadonly(),
         isHoverActive: root.isHoverActive.asReadonly(),
         instant: root.instant.asReadonly(),
+        instantType: root.instantType,
         openChangeReason: root.openChangeReason.asReadonly(),
         isPointerDownOnTrigger: root.isPointerDownOnTrigger.asReadonly(),
         close: (reason, event) => root.close(reason, event),
@@ -371,14 +400,17 @@ class RdxPreviewCardArrow {
     constructor() {
         this.rootContext = injectRdxPreviewCardRootContext();
         this.wrapper = inject(RdxPopperContentWrapper, { optional: true });
-        this.side = computed(() => this.wrapper?.placedSide(), ...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
-        this.align = computed(() => this.wrapper?.placedAlign(), ...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
-        this.uncentered = computed(() => this.wrapper?.arrowUncentered() ?? false, ...(ngDevMode ? [{ debugName: "uncentered" }] : /* istanbul ignore next */ []));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardArrow, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxPreviewCardArrow, isStandalone: true, selector: "[rdxPreviewCardArrow]", host: { properties: { "attr.data-open": "rootContext.isOpen() ? \"\" : undefined", "attr.data-closed": "rootContext.isOpen() ? undefined : \"\"", "attr.data-side": "side()", "attr.data-align": "align()", "attr.data-uncentered": "uncentered() ? \"\" : undefined" } }, hostDirectives: [{ directive: i1.RdxPopperArrow }], ngImport: i0 }); }
+        this.side = computed(() => this.wrapper?.placedSide(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
+        this.align = computed(() => this.wrapper?.placedAlign(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
+        this.uncentered = computed(() => this.wrapper?.arrowUncentered() ?? false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "uncentered" }] : /* istanbul ignore next */ []));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardArrow, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxPreviewCardArrow, isStandalone: true, selector: "[rdxPreviewCardArrow]", host: { properties: { "attr.data-open": "rootContext.isOpen() ? \"\" : undefined", "attr.data-closed": "rootContext.isOpen() ? undefined : \"\"", "attr.data-side": "side()", "attr.data-align": "align()", "attr.data-uncentered": "uncentered() ? \"\" : undefined" } }, hostDirectives: [{ directive: i1.RdxPopperArrow }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardArrow, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardArrow, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPreviewCardArrow]',
@@ -400,20 +432,19 @@ class RdxPreviewCardBackdrop {
     constructor() {
         this.rootContext = injectRdxPreviewCardRootContext();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardBackdrop, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxPreviewCardBackdrop, isStandalone: true, selector: "[rdxPreviewCardBackdrop]", host: { properties: { "attr.data-closed": "rootContext.isOpen() ? undefined : \"\"", "attr.data-ending-style": "rootContext.transitionStatus() === \"ending\" ? \"\" : undefined", "attr.data-instant": "rootContext.instant() ? \"\" : undefined", "attr.data-open": "rootContext.isOpen() ? \"\" : undefined", "attr.data-starting-style": "rootContext.transitionStatus() === \"starting\" ? \"\" : undefined", "attr.data-state": "rootContext.isOpen() ? \"open\" : \"closed\"" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardBackdrop, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxPreviewCardBackdrop, isStandalone: true, selector: "[rdxPreviewCardBackdrop]", host: { properties: { "attr.data-closed": "rootContext.isOpen() ? undefined : \"\"", "attr.data-ending-style": "rootContext.transitionStatus() === \"ending\" ? \"\" : undefined", "attr.data-instant": "rootContext.instantType()", "attr.data-open": "rootContext.isOpen() ? \"\" : undefined", "attr.data-starting-style": "rootContext.transitionStatus() === \"starting\" ? \"\" : undefined" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardBackdrop, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardBackdrop, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPreviewCardBackdrop]',
                     host: {
                         '[attr.data-closed]': 'rootContext.isOpen() ? undefined : ""',
                         '[attr.data-ending-style]': 'rootContext.transitionStatus() === "ending" ? "" : undefined',
-                        '[attr.data-instant]': 'rootContext.instant() ? "" : undefined',
+                        '[attr.data-instant]': 'rootContext.instantType()',
                         '[attr.data-open]': 'rootContext.isOpen() ? "" : undefined',
-                        '[attr.data-starting-style]': 'rootContext.transitionStatus() === "starting" ? "" : undefined',
-                        '[attr.data-state]': 'rootContext.isOpen() ? "open" : "closed"'
+                        '[attr.data-starting-style]': 'rootContext.transitionStatus() === "starting" ? "" : undefined'
                     }
                 }]
         }] });
@@ -434,8 +465,10 @@ class RdxPreviewCardPopup {
         this.floatingContext = inject(RDX_FLOATING_ROOT_CONTEXT);
         this.registration = inject(RDX_FLOATING_REGISTRATION, { optional: true });
         this.wrapper = inject(RdxPopperContentWrapper, { optional: true });
-        this.align = computed(() => this.wrapper?.placedAlign(), ...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
-        this.side = computed(() => this.wrapper?.placedSide(), ...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
+        this.align = computed(() => this.wrapper?.placedAlign(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
+        this.side = computed(() => this.wrapper?.placedSide(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
         /**
          * Event handler called when the escape key is down. Can be prevented.
          */
@@ -479,10 +512,10 @@ class RdxPreviewCardPopup {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardPopup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxPreviewCardPopup, isStandalone: true, selector: "[rdxPreviewCardPopup]", outputs: { escapeKeyDown: "escapeKeyDown", pointerDownOutside: "pointerDownOutside", focusOutside: "focusOutside", interactOutside: "interactOutside" }, host: { listeners: { "pointerenter": "rootContext.cancelHoverClose()" }, properties: { "attr.data-closed": "rootContext.isOpen() ? undefined : \"\"", "attr.data-ending-style": "rootContext.transitionStatus() === \"ending\" ? \"\" : undefined", "attr.data-instant": "rootContext.instant() ? \"\" : undefined", "attr.data-open": "rootContext.isOpen() ? \"\" : undefined", "attr.data-starting-style": "rootContext.transitionStatus() === \"starting\" ? \"\" : undefined", "attr.data-state": "rootContext.isOpen() ? \"open\" : \"closed\"", "attr.data-align": "align()", "attr.data-side": "side()", "id": "rootContext.contentId" } }, hostDirectives: [{ directive: i1.RdxPopperContent }, { directive: i2.RdxFloatingNodeRegistration }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardPopup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxPreviewCardPopup, isStandalone: true, selector: "[rdxPreviewCardPopup]", outputs: { escapeKeyDown: "escapeKeyDown", pointerDownOutside: "pointerDownOutside", focusOutside: "focusOutside", interactOutside: "interactOutside" }, host: { listeners: { "pointerenter": "rootContext.cancelHoverClose()" }, properties: { "attr.data-closed": "rootContext.isOpen() ? undefined : \"\"", "attr.data-ending-style": "rootContext.transitionStatus() === \"ending\" ? \"\" : undefined", "attr.data-instant": "rootContext.instantType()", "attr.data-open": "rootContext.isOpen() ? \"\" : undefined", "attr.data-starting-style": "rootContext.transitionStatus() === \"starting\" ? \"\" : undefined", "attr.data-align": "align()", "attr.data-side": "side()", "id": "rootContext.contentId" } }, hostDirectives: [{ directive: i1.RdxPopperContent }, { directive: i2.RdxFloatingNodeRegistration }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardPopup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardPopup, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPreviewCardPopup]',
@@ -490,10 +523,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                     host: {
                         '[attr.data-closed]': 'rootContext.isOpen() ? undefined : ""',
                         '[attr.data-ending-style]': 'rootContext.transitionStatus() === "ending" ? "" : undefined',
-                        '[attr.data-instant]': 'rootContext.instant() ? "" : undefined',
+                        '[attr.data-instant]': 'rootContext.instantType()',
                         '[attr.data-open]': 'rootContext.isOpen() ? "" : undefined',
                         '[attr.data-starting-style]': 'rootContext.transitionStatus() === "starting" ? "" : undefined',
-                        '[attr.data-state]': 'rootContext.isOpen() ? "open" : "closed"',
                         '[attr.data-align]': 'align()',
                         '[attr.data-side]': 'side()',
                         '[id]': 'rootContext.contentId',
@@ -512,10 +544,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
  * `<ng-template rdxPreviewCardPortal>`. For a custom container use the explicit form with `[container]`.
  */
 class RdxPreviewCardPortal {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardPortal, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxPreviewCardPortal, isStandalone: true, selector: "ng-template[rdxPreviewCardPortal]", providers: [provideRdxPresenceContext(() => ({ present: injectRdxPreviewCardRootContext().present }))], exportAs: ["rdxPreviewCardPortal"], hostDirectives: [{ directive: i1$1.RdxPortalPresence, inputs: ["container", "container"] }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardPortal, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxPreviewCardPortal, isStandalone: true, selector: "ng-template[rdxPreviewCardPortal]", providers: [provideRdxPresenceContext(() => ({ present: injectRdxPreviewCardRootContext().present }))], exportAs: ["rdxPreviewCardPortal"], hostDirectives: [{ directive: i1$1.RdxPortalPresence, inputs: ["container", "container"] }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardPortal, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardPortal, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ng-template[rdxPreviewCardPortal]',
@@ -537,10 +569,10 @@ class RdxPreviewCardPortalMisuseGuard {
                 'rdxPreviewCardPortalPresence has been removed.', 'components/preview-card');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardPortalMisuseGuard, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxPreviewCardPortalMisuseGuard, isStandalone: true, selector: "[rdxPreviewCardPortal]:not(ng-template)", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardPortalMisuseGuard, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxPreviewCardPortalMisuseGuard, isStandalone: true, selector: "[rdxPreviewCardPortal]:not(ng-template)", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardPortalMisuseGuard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardPortalMisuseGuard, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPreviewCardPortal]:not(ng-template)'
@@ -561,21 +593,23 @@ class RdxPreviewCardPositioner extends RdxPopperContentWrapper {
         this.rootContext = injectRdxPreviewCardRootContext();
         this.legacyVars = legacyPopperVars('preview-card');
         this.containerRef = inject(ElementRef);
-        this.triggerEl = signal(null, ...(ngDevMode ? [{ debugName: "triggerEl" }] : /* istanbul ignore next */ []));
-        this.containerEl = signal(this.containerRef.nativeElement, ...(ngDevMode ? [{ debugName: "containerEl" }] : /* istanbul ignore next */ []));
+        this.triggerEl = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "triggerEl" }] : /* istanbul ignore next */ []));
+        this.containerEl = signal(this.containerRef.nativeElement, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "containerEl" }] : /* istanbul ignore next */ []));
         this.graceArea = useGraceArea(this.triggerEl, this.containerEl);
         effect(() => this.triggerEl.set(this.rootContext.trigger() ?? null));
         this.graceArea.onPointerExit(() => {
             this.rootContext.closeOnHover();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardPositioner, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxPreviewCardPositioner, isStandalone: true, selector: "[rdxPreviewCardPositioner]", host: { properties: { "attr.data-open": "rootContext.isOpen() ? \"\" : undefined", "attr.data-closed": "rootContext.isOpen() ? undefined : \"\"", "attr.data-instant": "rootContext.instant() ? \"\" : undefined", "style": "legacyVars" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardPositioner, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxPreviewCardPositioner, isStandalone: true, selector: "[rdxPreviewCardPositioner]", host: { properties: { "attr.data-open": "rootContext.isOpen() ? \"\" : undefined", "attr.data-closed": "rootContext.isOpen() ? undefined : \"\"", "attr.data-instant": "rootContext.instantType()", "style": "legacyVars" } }, providers: [
             ...provideRdxPopperContentWrapper(RdxPreviewCardPositioner),
             provideRdxPopperContentConfig({ arrowPadding: 5, collisionPadding: 5, updatePositionStrategy: 'always' })
         ], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardPositioner, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardPositioner, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPreviewCardPositioner]',
@@ -586,7 +620,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                     host: {
                         '[attr.data-open]': 'rootContext.isOpen() ? "" : undefined',
                         '[attr.data-closed]': 'rootContext.isOpen() ? undefined : ""',
-                        '[attr.data-instant]': 'rootContext.instant() ? "" : undefined',
+                        '[attr.data-instant]': 'rootContext.instantType()',
                         // `data-side`/`data-align`/`data-anchor-hidden` and the unified `--anchor-*`/`--available-*`/
                         // `--transform-origin` vars come from the inherited wrapper (ADR 0012); only the deprecated
                         // `--radix-preview-card-*` aliases remain, for one release of back-compat.
@@ -605,15 +639,18 @@ class RdxPreviewCardTrigger {
         /**
          * Associates this trigger with a detached preview-card root.
          */
-        this.handle = input(...(ngDevMode ? [undefined, { debugName: "handle" }] : /* istanbul ignore next */ []));
+        this.handle = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "handle" }] : /* istanbul ignore next */ []));
         /**
          * Data associated with this trigger while it is active.
          */
-        this.payload = input(...(ngDevMode ? [undefined, { debugName: "payload" }] : /* istanbul ignore next */ []));
+        this.payload = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "payload" }] : /* istanbul ignore next */ []));
         /**
          * ID used to identify this trigger when opening a detached preview-card imperatively.
          */
-        this.id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : /* istanbul ignore next */ []));
+        this.id = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "id" }] : /* istanbul ignore next */ []));
         /**
          * Whether the trigger should ignore user interaction.
          */
@@ -626,10 +663,14 @@ class RdxPreviewCardTrigger {
          * How long to wait before closing a hover-opened preview-card, in milliseconds.
          */
         this.closeDelay = input(300, { ...(ngDevMode ? { debugName: "closeDelay" } : /* istanbul ignore next */ {}), transform: numberAttribute });
-        this.triggerId = computed(() => this.id() ?? this.generatedId, ...(ngDevMode ? [{ debugName: "triggerId" }] : /* istanbul ignore next */ []));
-        this.rootContext = computed(() => this.handle()?.context() ?? this.parentRootContext, ...(ngDevMode ? [{ debugName: "rootContext" }] : /* istanbul ignore next */ []));
-        this.isOpen = computed(() => this.rootContext()?.isOpen() === true && this.rootContext()?.trigger() === this.elementRef.nativeElement, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
-        this.isPressed = computed(() => this.isOpen() && this.rootContext()?.openChangeReason() === 'trigger-press', ...(ngDevMode ? [{ debugName: "isPressed" }] : /* istanbul ignore next */ []));
+        this.triggerId = computed(() => this.id() ?? this.generatedId, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "triggerId" }] : /* istanbul ignore next */ []));
+        this.rootContext = computed(() => this.handle()?.context() ?? this.parentRootContext, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "rootContext" }] : /* istanbul ignore next */ []));
+        this.isOpen = computed(() => this.rootContext()?.isOpen() === true && this.rootContext()?.trigger() === this.elementRef.nativeElement, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+        this.isPressed = computed(() => this.isOpen() && this.rootContext()?.openChangeReason() === 'trigger-press', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isPressed" }] : /* istanbul ignore next */ []));
         this.generatedId = injectId('rdx-preview-card-trigger-');
         rdxCheckTriggerElement('rdxPreviewCardTrigger', 'preview-card/trigger-element', 'components/preview-card');
         effect((onCleanup) => {
@@ -680,21 +721,20 @@ class RdxPreviewCardTrigger {
     handlePointerUp() {
         this.rootContext()?.setPointerDownOnTrigger(false);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: RdxPreviewCardTrigger, isStandalone: true, selector: "[rdxPreviewCardTrigger]", inputs: { handle: { classPropertyName: "handle", publicName: "handle", isSignal: true, isRequired: false, transformFunction: null }, payload: { classPropertyName: "payload", publicName: "payload", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, delay: { classPropertyName: "delay", publicName: "delay", isSignal: true, isRequired: false, transformFunction: null }, closeDelay: { classPropertyName: "closeDelay", publicName: "closeDelay", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "handleClick($event)", "pointerenter": "handlePointerEnter($event)", "pointerleave": "handlePointerLeave($event)", "focus": "handleFocus($event)", "blur": "handleBlur($event)", "pointerdown": "handlePointerDown()", "pointerup": "handlePointerUp()", "pointercancel": "handlePointerUp()" }, properties: { "attr.aria-controls": "rootContext()?.contentId", "attr.aria-disabled": "disabled() ? \"true\" : undefined", "attr.aria-expanded": "isOpen()", "attr.aria-haspopup": "\"dialog\"", "attr.data-disabled": "disabled() ? \"\" : undefined", "attr.data-state": "isOpen() ? \"open\" : \"closed\"", "attr.data-popup-open": "isOpen() ? \"\" : undefined", "attr.data-pressed": "isPressed() ? \"\" : undefined", "id": "triggerId()" } }, hostDirectives: [{ directive: i1.RdxPopperAnchor }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", type: RdxPreviewCardTrigger, isStandalone: true, selector: "[rdxPreviewCardTrigger]", inputs: { handle: { classPropertyName: "handle", publicName: "handle", isSignal: true, isRequired: false, transformFunction: null }, payload: { classPropertyName: "payload", publicName: "payload", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, delay: { classPropertyName: "delay", publicName: "delay", isSignal: true, isRequired: false, transformFunction: null }, closeDelay: { classPropertyName: "closeDelay", publicName: "closeDelay", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "handleClick($event)", "pointerenter": "handlePointerEnter($event)", "pointerleave": "handlePointerLeave($event)", "focus": "handleFocus($event)", "blur": "handleBlur($event)", "pointerdown": "handlePointerDown()", "pointerup": "handlePointerUp()", "pointercancel": "handlePointerUp()" }, properties: { "attr.aria-disabled": "disabled() ? \"true\" : undefined", "attr.data-disabled": "disabled() ? \"\" : undefined", "attr.data-popup-open": "isOpen() ? \"\" : undefined", "attr.data-pressed": "isPressed() ? \"\" : undefined", "id": "triggerId()" } }, hostDirectives: [{ directive: i1.RdxPopperAnchor }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPreviewCardTrigger]',
                     hostDirectives: [RdxPopperAnchor],
                     host: {
-                        '[attr.aria-controls]': 'rootContext()?.contentId',
+                        // A preview card is supplementary content reached from a link, NOT a dialog — Base UI's trigger
+                        // emits no `aria-haspopup`/`aria-expanded`/`aria-controls` (announcing a dialog would mis-describe
+                        // it to AT). Only the disabled state is surfaced.
                         '[attr.aria-disabled]': 'disabled() ? "true" : undefined',
-                        '[attr.aria-expanded]': 'isOpen()',
-                        '[attr.aria-haspopup]': '"dialog"',
                         '[attr.data-disabled]': 'disabled() ? "" : undefined',
-                        '[attr.data-state]': 'isOpen() ? "open" : "closed"',
                         '[attr.data-popup-open]': 'isOpen() ? "" : undefined',
                         '[attr.data-pressed]': 'isPressed() ? "" : undefined',
                         '[id]': 'triggerId()',
@@ -722,8 +762,10 @@ class RdxPreviewCardViewport {
         this.rootContext = injectRdxPreviewCardRootContext();
         this.elementRef = inject(ElementRef);
         this.destroyRef = inject(DestroyRef);
-        this.activationDirection = signal(undefined, ...(ngDevMode ? [{ debugName: "activationDirection" }] : /* istanbul ignore next */ []));
-        this.transitioning = signal(false, ...(ngDevMode ? [{ debugName: "transitioning" }] : /* istanbul ignore next */ []));
+        this.activationDirection = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "activationDirection" }] : /* istanbul ignore next */ []));
+        this.transitioning = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "transitioning" }] : /* istanbul ignore next */ []));
         const unregister = this.rootContext.registerViewport((previousTrigger, nextTrigger) => {
             this.startTransition(previousTrigger, nextTrigger);
         });
@@ -787,15 +829,16 @@ class RdxPreviewCardViewport {
         this.previous = undefined;
         this.transitioning.set(false);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardViewport, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxPreviewCardViewport, isStandalone: true, selector: "[rdxPreviewCardViewport]", host: { properties: { "attr.data-activation-direction": "activationDirection()", "attr.data-transitioning": "transitioning() ? \"\" : undefined" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardViewport, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxPreviewCardViewport, isStandalone: true, selector: "[rdxPreviewCardViewport]", host: { properties: { "attr.data-activation-direction": "activationDirection()", "attr.data-instant": "rootContext.instantType()", "attr.data-transitioning": "transitioning() ? \"\" : undefined" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardViewport, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardViewport, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxPreviewCardViewport]',
                     host: {
                         '[attr.data-activation-direction]': 'activationDirection()',
+                        '[attr.data-instant]': 'rootContext.instantType()',
                         '[attr.data-transitioning]': 'transitioning() ? "" : undefined'
                     }
                 }]
@@ -845,10 +888,12 @@ function parseDuration(value) {
 
 class RdxPreviewCardHandle {
     constructor() {
-        this.rootContext = signal(undefined, ...(ngDevMode ? [{ debugName: "rootContext" }] : /* istanbul ignore next */ []));
+        this.rootContext = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "rootContext" }] : /* istanbul ignore next */ []));
         this.triggers = new Map();
         this.rootTriggerCleanups = new Map();
-        this.isOpen = computed(() => this.rootContext()?.isOpen() ?? false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+        this.isOpen = computed(() => this.rootContext()?.isOpen() ?? false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
     }
     open(triggerId) {
         const trigger = this.triggers.get(triggerId);
@@ -915,8 +960,8 @@ const previewCardImports = [
     RdxPreviewCardViewport
 ];
 class RdxPreviewCardModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardModule, imports: [RdxPreviewCardRoot,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardModule, imports: [RdxPreviewCardRoot,
             RdxPreviewCardTrigger,
             RdxPreviewCardPortal,
             RdxPreviewCardPortalMisuseGuard,
@@ -933,9 +978,9 @@ class RdxPreviewCardModule {
             RdxPreviewCardPopup,
             RdxPreviewCardArrow,
             RdxPreviewCardViewport] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardModule }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxPreviewCardModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxPreviewCardModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...previewCardImports],