ngx-com 0.1.16 → 0.1.18

package/fesm2022/ngx-com-components-datepicker-testing.mjs

@@ -0,0 +1,137 @@
+import { ComponentHarness, HarnessPredicate, TestKey } from '@angular/cdk/testing';
+
+/**
+ * Harness for interacting with a ComDatepicker in tests.
+ */
+class ComDatepickerHarness extends ComponentHarness {
+    static hostSelector = 'com-datepicker';
+    triggerGroup = this.locatorFor('div[role="group"]');
+    input = this.locatorFor('input[type="text"]');
+    clearButton = this.locatorForOptional('button[aria-label="Clear date"]');
+    calendarButton = this.locatorFor('button[aria-label$="calendar"]');
+    /**
+     * Gets a HarnessPredicate for matching datepickers.
+     * @param options Filter options.
+     */
+    static with(options = {}) {
+        return new HarnessPredicate(ComDatepickerHarness, options)
+            .addOption('placeholder', options.placeholder, async (harness, placeholder) => {
+            const text = await harness.getPlaceholder();
+            return HarnessPredicate.stringMatches(text, placeholder);
+        })
+            .addOption('disabled', options.disabled, async (harness, disabled) => {
+            return (await harness.isDisabled()) === disabled;
+        })
+            .addOption('open', options.open, async (harness, open) => {
+            return (await harness.isOpen()) === open;
+        });
+    }
+    /** Whether the datepicker panel is currently open. */
+    async isOpen() {
+        const trigger = await this.triggerGroup();
+        return (await trigger.getAttribute('aria-expanded')) === 'true';
+    }
+    /** Opens the datepicker panel if it is closed. */
+    async open() {
+        if (!(await this.isOpen())) {
+            const btn = await this.calendarButton();
+            await btn.click();
+        }
+    }
+    /** Closes the datepicker panel if it is open. */
+    async close() {
+        if (await this.isOpen()) {
+            const host = await this.host();
+            await host.sendKeys(TestKey.ESCAPE);
+        }
+    }
+    /** Whether the datepicker is disabled. */
+    async isDisabled() {
+        const trigger = await this.triggerGroup();
+        return (await trigger.getAttribute('aria-disabled')) === 'true';
+    }
+    /** Whether the datepicker input has the required attribute. */
+    async isRequired() {
+        const inputEl = await this.input();
+        return (await inputEl.getAttribute('aria-required')) === 'true';
+    }
+    /** Whether the datepicker input is in an invalid state. */
+    async isInvalid() {
+        const inputEl = await this.input();
+        return (await inputEl.getAttribute('aria-invalid')) === 'true';
+    }
+    /** Gets the current value displayed in the input. */
+    async getInputValue() {
+        const inputEl = await this.input();
+        return inputEl.getProperty('value');
+    }
+    /** Sets the input value by clearing and typing the given text. */
+    async setInputValue(text) {
+        const inputEl = await this.input();
+        await inputEl.clear();
+        await inputEl.sendKeys(text);
+    }
+    /** Gets the placeholder text of the input. */
+    async getPlaceholder() {
+        const inputEl = await this.input();
+        return (await inputEl.getAttribute('placeholder')) ?? '';
+    }
+    /** Whether the datepicker currently has a value (clear button is visible). */
+    async hasValue() {
+        const clearBtn = await this.clearButton();
+        return clearBtn !== null;
+    }
+    /** Clears the current value by clicking the clear button. Throws if no value is set. */
+    async clear() {
+        const clearBtn = await this.clearButton();
+        if (!clearBtn) {
+            throw new Error('Datepicker does not have a clearable value');
+        }
+        return clearBtn.click();
+    }
+    /** Gets the calendar panel element from the overlay. The datepicker must be open. */
+    async getCalendarPanel() {
+        if (!(await this.isOpen())) {
+            throw new Error('Datepicker panel is not open');
+        }
+        return this.documentRootLocatorFactory().locatorFor('com-calendar')();
+    }
+    /** Selects a day by its visible number. Opens the panel if closed. */
+    async selectDate(day) {
+        await this.open();
+        const rootLocator = this.documentRootLocatorFactory();
+        const dayButtons = await rootLocator.locatorForAll('div[role="dialog"] com-calendar-cell button')();
+        for (const btn of dayButtons) {
+            const text = (await btn.text()).trim();
+            if (text === String(day)) {
+                await btn.click();
+                return;
+            }
+        }
+        throw new Error(`Could not find day cell with number: ${day}`);
+    }
+    /** Focuses the datepicker input. */
+    async focus() {
+        const inputEl = await this.input();
+        return inputEl.focus();
+    }
+    /** Blurs the datepicker input. */
+    async blur() {
+        const inputEl = await this.input();
+        return inputEl.blur();
+    }
+    /** Whether the datepicker input is currently focused. */
+    async isFocused() {
+        const inputEl = await this.input();
+        return inputEl.isFocused();
+    }
+}
+
+// Testing utilities for the datepicker component
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ComDatepickerHarness };
+//# sourceMappingURL=ngx-com-components-datepicker-testing.mjs.map

package/fesm2022/ngx-com-components-datepicker-testing.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngx-com-components-datepicker-testing.mjs","sources":["../../../projects/com/components/datepicker/testing/datepicker.harness.ts","../../../projects/com/components/datepicker/testing/index.ts","../../../projects/com/components/datepicker/testing/ngx-com-components-datepicker-testing.ts"],"sourcesContent":["import {\n  ComponentHarness,\n  HarnessPredicate,\n  TestKey,\n} from '@angular/cdk/testing';\nimport type { BaseHarnessFilters, TestElement } from '@angular/cdk/testing';\n\n/** Harness filters for ComDatepickerHarness. */\nexport interface ComDatepickerHarnessFilters extends BaseHarnessFilters {\n  /** Filter by the datepicker's placeholder text. */\n  placeholder?: string | RegExp;\n  /** Filter by whether the datepicker is disabled. */\n  disabled?: boolean;\n  /** Filter by whether the datepicker panel is open. */\n  open?: boolean;\n}\n\n/**\n * Harness for interacting with a ComDatepicker in tests.\n */\nexport class ComDatepickerHarness extends ComponentHarness {\n  static hostSelector = 'com-datepicker';\n\n  private readonly triggerGroup = this.locatorFor('div[role=\"group\"]');\n  private readonly input = this.locatorFor('input[type=\"text\"]');\n  private readonly clearButton = this.locatorForOptional('button[aria-label=\"Clear date\"]');\n  private readonly calendarButton = this.locatorFor('button[aria-label$=\"calendar\"]');\n\n  /**\n   * Gets a HarnessPredicate for matching datepickers.\n   * @param options Filter options.\n   */\n  static with(options: ComDatepickerHarnessFilters = {}): HarnessPredicate<ComDatepickerHarness> {\n    return new HarnessPredicate(ComDatepickerHarness, options)\n      .addOption('placeholder', options.placeholder, async (harness, placeholder) => {\n        const text = await harness.getPlaceholder();\n        return HarnessPredicate.stringMatches(text, placeholder);\n      })\n      .addOption('disabled', options.disabled, async (harness, disabled) => {\n        return (await harness.isDisabled()) === disabled;\n      })\n      .addOption('open', options.open, async (harness, open) => {\n        return (await harness.isOpen()) === open;\n      });\n  }\n\n  /** Whether the datepicker panel is currently open. */\n  async isOpen(): Promise<boolean> {\n    const trigger = await this.triggerGroup();\n    return (await trigger.getAttribute('aria-expanded')) === 'true';\n  }\n\n  /** Opens the datepicker panel if it is closed. */\n  async open(): Promise<void> {\n    if (!(await this.isOpen())) {\n      const btn = await this.calendarButton();\n      await btn.click();\n    }\n  }\n\n  /** Closes the datepicker panel if it is open. */\n  async close(): Promise<void> {\n    if (await this.isOpen()) {\n      const host = await this.host();\n      await host.sendKeys(TestKey.ESCAPE);\n    }\n  }\n\n  /** Whether the datepicker is disabled. */\n  async isDisabled(): Promise<boolean> {\n    const trigger = await this.triggerGroup();\n    return (await trigger.getAttribute('aria-disabled')) === 'true';\n  }\n\n  /** Whether the datepicker input has the required attribute. */\n  async isRequired(): Promise<boolean> {\n    const inputEl = await this.input();\n    return (await inputEl.getAttribute('aria-required')) === 'true';\n  }\n\n  /** Whether the datepicker input is in an invalid state. */\n  async isInvalid(): Promise<boolean> {\n    const inputEl = await this.input();\n    return (await inputEl.getAttribute('aria-invalid')) === 'true';\n  }\n\n  /** Gets the current value displayed in the input. */\n  async getInputValue(): Promise<string> {\n    const inputEl = await this.input();\n    return inputEl.getProperty<string>('value');\n  }\n\n  /** Sets the input value by clearing and typing the given text. */\n  async setInputValue(text: string): Promise<void> {\n    const inputEl = await this.input();\n    await inputEl.clear();\n    await inputEl.sendKeys(text);\n  }\n\n  /** Gets the placeholder text of the input. */\n  async getPlaceholder(): Promise<string> {\n    const inputEl = await this.input();\n    return (await inputEl.getAttribute('placeholder')) ?? '';\n  }\n\n  /** Whether the datepicker currently has a value (clear button is visible). */\n  async hasValue(): Promise<boolean> {\n    const clearBtn = await this.clearButton();\n    return clearBtn !== null;\n  }\n\n  /** Clears the current value by clicking the clear button. Throws if no value is set. */\n  async clear(): Promise<void> {\n    const clearBtn = await this.clearButton();\n    if (!clearBtn) {\n      throw new Error('Datepicker does not have a clearable value');\n    }\n    return clearBtn.click();\n  }\n\n  /** Gets the calendar panel element from the overlay. The datepicker must be open. */\n  async getCalendarPanel(): Promise<TestElement> {\n    if (!(await this.isOpen())) {\n      throw new Error('Datepicker panel is not open');\n    }\n    return this.documentRootLocatorFactory().locatorFor('com-calendar')();\n  }\n\n  /** Selects a day by its visible number. Opens the panel if closed. */\n  async selectDate(day: number): Promise<void> {\n    await this.open();\n    const rootLocator = this.documentRootLocatorFactory();\n    const dayButtons = await rootLocator.locatorForAll('div[role=\"dialog\"] com-calendar-cell button')();\n    for (const btn of dayButtons) {\n      const text = (await btn.text()).trim();\n      if (text === String(day)) {\n        await btn.click();\n        return;\n      }\n    }\n    throw new Error(`Could not find day cell with number: ${day}`);\n  }\n\n  /** Focuses the datepicker input. */\n  async focus(): Promise<void> {\n    const inputEl = await this.input();\n    return inputEl.focus();\n  }\n\n  /** Blurs the datepicker input. */\n  async blur(): Promise<void> {\n    const inputEl = await this.input();\n    return inputEl.blur();\n  }\n\n  /** Whether the datepicker input is currently focused. */\n  async isFocused(): Promise<boolean> {\n    const inputEl = await this.input();\n    return inputEl.isFocused();\n  }\n}\n","// Testing utilities for the datepicker component\n\nexport { ComDatepickerHarness } from './datepicker.harness';\n\nexport type { ComDatepickerHarnessFilters } from './datepicker.harness';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngx-com-components-dialog-testing.mjs

@@ -0,0 +1,109 @@
+import { ComponentHarness, HarnessPredicate, TestKey } from '@angular/cdk/testing';
+
+/**
+ * Harness for interacting with a dialog container in tests.
+ *
+ * Because dialogs render inside a CDK overlay (outside the component tree),
+ * obtain this harness via `TestbedHarnessEnvironment.documentRootLoader(fixture)`.
+ */
+class ComDialogContainerHarness extends ComponentHarness {
+    static hostSelector = 'com-dialog-container';
+    panel = this.locatorFor('[role="dialog"], [role="alertdialog"]');
+    titleEl = this.locatorForOptional('[comDialogTitle]');
+    contentEl = this.locatorForOptional('[comDialogContent]');
+    actionsEl = this.locatorForOptional('[comDialogActions]');
+    closeButton = this.locatorForOptional('[comDialogClose]');
+    /**
+     * Gets a HarnessPredicate for matching dialog containers.
+     * @param options Filter options.
+     */
+    static with(options = {}) {
+        return new HarnessPredicate(ComDialogContainerHarness, options);
+    }
+    /** Gets the dialog panel's `aria-label` attribute. */
+    async getAriaLabel() {
+        const el = await this.panel();
+        return el.getAttribute('aria-label');
+    }
+    /** Gets the dialog panel's `aria-labelledby` attribute. */
+    async getAriaLabelledby() {
+        const el = await this.panel();
+        return el.getAttribute('aria-labelledby');
+    }
+    /** Gets the dialog panel's `aria-describedby` attribute. */
+    async getAriaDescribedby() {
+        const el = await this.panel();
+        return el.getAttribute('aria-describedby');
+    }
+    /** Gets the role attribute on the dialog panel. */
+    async getRole() {
+        const el = await this.panel();
+        return el.getAttribute('role');
+    }
+    /** Gets the text content of the `[comDialogTitle]` element, or null if none exists. */
+    async getTitleText() {
+        const el = await this.titleEl();
+        return el ? el.text() : null;
+    }
+    /** Gets the text content of the `[comDialogContent]` element, or null if none exists. */
+    async getContentText() {
+        const el = await this.contentEl();
+        return el ? el.text() : null;
+    }
+    /** Gets the text content of the `[comDialogActions]` element, or null if none exists. */
+    async getActionsText() {
+        const el = await this.actionsEl();
+        return el ? el.text() : null;
+    }
+    /** Gets the `data-state` attribute on the dialog panel. */
+    async getState() {
+        const el = await this.panel();
+        return el.getAttribute('data-state');
+    }
+    /**
+     * Closes the dialog by clicking the `[comDialogClose]` button.
+     * Throws if no close button is found.
+     */
+    async close() {
+        const btn = await this.closeButton();
+        if (!btn) {
+            throw new Error('Could not find a [comDialogClose] element. ' +
+                'Make sure the dialog template includes a button with the comDialogClose directive.');
+        }
+        await btn.click();
+    }
+    /** Sends an Escape key press to the dialog panel to close it. */
+    async sendEscapeKey() {
+        const el = await this.panel();
+        await el.sendKeys(TestKey.ESCAPE);
+    }
+    /** Whether the dialog container is disabled. */
+    async isDisabled() {
+        const host = await this.host();
+        return (await host.getAttribute('aria-disabled')) === 'true';
+    }
+    /** Whether the dialog panel is focused. */
+    async isFocused() {
+        const el = await this.panel();
+        return el.isFocused();
+    }
+    /** Focuses the dialog panel. */
+    async focus() {
+        const el = await this.panel();
+        return el.focus();
+    }
+    /** Blurs the dialog panel. */
+    async blur() {
+        const el = await this.panel();
+        return el.blur();
+    }
+}
+
+// Testing utilities for the dialog component
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ComDialogContainerHarness };
+//# sourceMappingURL=ngx-com-components-dialog-testing.mjs.map

package/fesm2022/ngx-com-components-dialog-testing.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngx-com-components-dialog-testing.mjs","sources":["../../../projects/com/components/dialog/testing/dialog.harness.ts","../../../projects/com/components/dialog/testing/index.ts","../../../projects/com/components/dialog/testing/ngx-com-components-dialog-testing.ts"],"sourcesContent":["import {\n  ComponentHarness,\n  HarnessPredicate,\n  TestKey,\n} from '@angular/cdk/testing';\nimport type { BaseHarnessFilters } from '@angular/cdk/testing';\n\n/** Harness filters for ComDialogContainerHarness. */\nexport type ComDialogContainerHarnessFilters = BaseHarnessFilters;\n\n/**\n * Harness for interacting with a dialog container in tests.\n *\n * Because dialogs render inside a CDK overlay (outside the component tree),\n * obtain this harness via `TestbedHarnessEnvironment.documentRootLoader(fixture)`.\n */\nexport class ComDialogContainerHarness extends ComponentHarness {\n  static hostSelector = 'com-dialog-container';\n\n  private readonly panel = this.locatorFor('[role=\"dialog\"], [role=\"alertdialog\"]');\n  private readonly titleEl = this.locatorForOptional('[comDialogTitle]');\n  private readonly contentEl = this.locatorForOptional('[comDialogContent]');\n  private readonly actionsEl = this.locatorForOptional('[comDialogActions]');\n  private readonly closeButton = this.locatorForOptional('[comDialogClose]');\n\n  /**\n   * Gets a HarnessPredicate for matching dialog containers.\n   * @param options Filter options.\n   */\n  static with(\n    options: ComDialogContainerHarnessFilters = {},\n  ): HarnessPredicate<ComDialogContainerHarness> {\n    return new HarnessPredicate(ComDialogContainerHarness, options);\n  }\n\n  /** Gets the dialog panel's `aria-label` attribute. */\n  async getAriaLabel(): Promise<string | null> {\n    const el = await this.panel();\n    return el.getAttribute('aria-label');\n  }\n\n  /** Gets the dialog panel's `aria-labelledby` attribute. */\n  async getAriaLabelledby(): Promise<string | null> {\n    const el = await this.panel();\n    return el.getAttribute('aria-labelledby');\n  }\n\n  /** Gets the dialog panel's `aria-describedby` attribute. */\n  async getAriaDescribedby(): Promise<string | null> {\n    const el = await this.panel();\n    return el.getAttribute('aria-describedby');\n  }\n\n  /** Gets the role attribute on the dialog panel. */\n  async getRole(): Promise<string | null> {\n    const el = await this.panel();\n    return el.getAttribute('role');\n  }\n\n  /** Gets the text content of the `[comDialogTitle]` element, or null if none exists. */\n  async getTitleText(): Promise<string | null> {\n    const el = await this.titleEl();\n    return el ? el.text() : null;\n  }\n\n  /** Gets the text content of the `[comDialogContent]` element, or null if none exists. */\n  async getContentText(): Promise<string | null> {\n    const el = await this.contentEl();\n    return el ? el.text() : null;\n  }\n\n  /** Gets the text content of the `[comDialogActions]` element, or null if none exists. */\n  async getActionsText(): Promise<string | null> {\n    const el = await this.actionsEl();\n    return el ? el.text() : null;\n  }\n\n  /** Gets the `data-state` attribute on the dialog panel. */\n  async getState(): Promise<string | null> {\n    const el = await this.panel();\n    return el.getAttribute('data-state');\n  }\n\n  /**\n   * Closes the dialog by clicking the `[comDialogClose]` button.\n   * Throws if no close button is found.\n   */\n  async close(): Promise<void> {\n    const btn = await this.closeButton();\n    if (!btn) {\n      throw new Error(\n        'Could not find a [comDialogClose] element. ' +\n          'Make sure the dialog template includes a button with the comDialogClose directive.',\n      );\n    }\n    await btn.click();\n  }\n\n  /** Sends an Escape key press to the dialog panel to close it. */\n  async sendEscapeKey(): Promise<void> {\n    const el = await this.panel();\n    await el.sendKeys(TestKey.ESCAPE);\n  }\n\n  /** Whether the dialog container is disabled. */\n  async isDisabled(): Promise<boolean> {\n    const host = await this.host();\n    return (await host.getAttribute('aria-disabled')) === 'true';\n  }\n\n  /** Whether the dialog panel is focused. */\n  async isFocused(): Promise<boolean> {\n    const el = await this.panel();\n    return el.isFocused();\n  }\n\n  /** Focuses the dialog panel. */\n  async focus(): Promise<void> {\n    const el = await this.panel();\n    return el.focus();\n  }\n\n  /** Blurs the dialog panel. */\n  async blur(): Promise<void> {\n    const el = await this.panel();\n    return el.blur();\n  }\n}\n","// Testing utilities for the dialog component\n\nexport { ComDialogContainerHarness } from './dialog.harness';\n\nexport type { ComDialogContainerHarnessFilters } from './dialog.harness';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngx-com-components-dialog.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, viewChild, signal, computed, ChangeDetectionStrategy, Component, InjectionToken, Injector, PLATFORM_ID, TemplateRef, Injectable, Directive, input } from '@angular/core';
+import { InjectionToken, inject, Injector, viewChild, signal, computed, forwardRef, ChangeDetectionStrategy, Component, PLATFORM_ID, TemplateRef, Injectable, Directive, input } from '@angular/core';
 import { NgTemplateOutlet, NgComponentOutlet, NgStyle, DOCUMENT, isPlatformBrowser } from '@angular/common';
 import { Overlay } from '@angular/cdk/overlay';
 import { ComponentPortal } from '@angular/cdk/portal';
@@ -62,6 +62,13 @@ class ComDialogRef {
     }
 }
 
+/**
+ * Injection token allowing dialog directives to register their element IDs
+ * with the container for ARIA binding.
+ * @internal
+ */
+const COM_DIALOG_CONTAINER_REF = new InjectionToken('COM_DIALOG_CONTAINER_REF');
+
 /**
  * CVA variants for the dialog backdrop.
  *
@@ -189,6 +196,8 @@ function toCssValue(value) {
  *         `--shadow-dialog`, `--radius-overlay`, `--font-heading`
  */
 class ComDialogContainerComponent {
+    /** @internal Injector for template outlet so directives can resolve container tokens. */
+    hostInjector = inject(Injector);
     focusTrapFactory = inject(FocusTrapFactory);
     focusTrap = null;
     animationFallback = null;
@@ -315,7 +324,9 @@ class ComDialogContainerComponent {
         // autoFocus === false: don't move focus
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComDialogContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: ComDialogContainerComponent, isStandalone: true, selector: "com-dialog-container", viewQueries: [{ propertyName: "panelElement", first: true, predicate: ["panelElement"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: ComDialogContainerComponent, isStandalone: true, selector: "com-dialog-container", providers: [
+            { provide: COM_DIALOG_CONTAINER_REF, useExisting: forwardRef(() => ComDialogContainerComponent) },
+        ], viewQueries: [{ propertyName: "panelElement", first: true, predicate: ["panelElement"], descendants: true, isSignal: true }], ngImport: i0, template: `
     @if (config()?.hasBackdrop) {
       <div
         [class]="backdropClasses()"
@@ -341,6 +352,7 @@ class ComDialogContainerComponent {
         <ng-container
           [ngTemplateOutlet]="templateContent()!"
           [ngTemplateOutletContext]="templateContext()"
+          [ngTemplateOutletInjector]="hostInjector"
         />
       } @else if (componentContent(); as comp) {
         @if (contentInjector(); as inj) {
@@ -380,6 +392,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         <ng-container
           [ngTemplateOutlet]="templateContent()!"
           [ngTemplateOutletContext]="templateContext()"
+          [ngTemplateOutletInjector]="hostInjector"
         />
       } @else if (componentContent(); as comp) {
         @if (contentInjector(); as inj) {
@@ -389,16 +402,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }
       }
     </div>
-  `, imports: [NgTemplateOutlet, NgComponentOutlet, NgStyle], changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:contents}[data-state=open]{--tw-enter-opacity: 0;--tw-enter-scale: .95}[data-state=closed]{--tw-exit-opacity: 0;--tw-exit-scale: .95}@media(prefers-reduced-motion:reduce){[data-state=open],[data-state=closed]{animation:none}}\n"] }]
+  `, imports: [NgTemplateOutlet, NgComponentOutlet, NgStyle], providers: [
+                        { provide: COM_DIALOG_CONTAINER_REF, useExisting: forwardRef(() => ComDialogContainerComponent) },
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:contents}[data-state=open]{--tw-enter-opacity: 0;--tw-enter-scale: .95}[data-state=closed]{--tw-exit-opacity: 0;--tw-exit-scale: .95}@media(prefers-reduced-motion:reduce){[data-state=open],[data-state=closed]{animation:none}}\n"] }]
         }], propDecorators: { panelElement: [{ type: i0.ViewChild, args: ['panelElement', { isSignal: true }] }] } });
 
-/**
- * Injection token allowing dialog directives to register their element IDs
- * with the container for ARIA binding.
- * @internal
- */
-const COM_DIALOG_CONTAINER_REF = new InjectionToken('COM_DIALOG_CONTAINER_REF');
-
 /**
  * Injection token for data passed to a dialog component.
  *
@@ -485,10 +493,6 @@ class ComDialog {
         const dialogRef = new ComDialogRef();
         // Create a child injector with dialog-specific providers
         const isTemplate = content instanceof TemplateRef;
-        const containerRef = {
-            registerTitleId: () => { },
-            registerContentId: () => { },
-        };
         // Resolve parent injector: config.injector > config.viewContainerRef.injector > service injector
         const parentInjector = resolvedConfig.injector ??
             resolvedConfig.viewContainerRef?.injector ??
@@ -498,7 +502,6 @@ class ComDialog {
                 ...(resolvedConfig.providers ?? []),
                 { provide: ComDialogRef, useValue: dialogRef },
                 { provide: COM_DIALOG_DATA, useValue: resolvedConfig.data },
-                { provide: COM_DIALOG_CONTAINER_REF, useValue: containerRef },
             ],
             parent: parentInjector,
         });
@@ -521,9 +524,6 @@ class ComDialog {
         const portal = new ComponentPortal(ComDialogContainerComponent, null, contentInjector);
         const containerComponentRef = overlayRef.attach(portal);
         const container = containerComponentRef.instance;
-        // Wire up the container ref for ARIA registration
-        containerRef.registerTitleId = (id) => container.registerTitleId(id);
-        containerRef.registerContentId = (id) => container.registerContentId(id);
         // Configure the container
         container.config.set(resolvedConfig);
         container.dialogRef.set(dialogRef);