@daffodil/design 0.87.1 → 0.88.1

package/fesm2022/daffodil-design-menu.mjs

@@ -2,7 +2,7 @@ import * as i1 from '@angular/cdk/overlay';
 import { OverlayModule } from '@angular/cdk/overlay';
 import { ComponentPortal, TemplatePortal } from '@angular/cdk/portal';
 import * as i0 from '@angular/core';
-import { Type, TemplateRef, Injectable, HostListener, Input, HostBinding, Directive, ContentChild, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
+import { Type, TemplateRef, Injectable, Input, Directive, ContentChild, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
 import { BehaviorSubject, map, Subject, takeUntil, fromEvent, filter } from 'rxjs';
 import { CommonModule } from '@angular/common';
 import * as i1$1 from '@angular/cdk/a11y';
@@ -84,12 +84,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
         }], ctorParameters: () => [{ type: i1.Overlay }, { type: i0.Injector }] });
 
 class DaffMenuActivatorDirective {
-    /**
-     * @docs-private
-     */
-    get openClass() {
-        return this._open;
-    }
     constructor(service, viewContainerRef, cdRef) {
         this.service = service;
         this.viewContainerRef = viewContainerRef;
@@ -107,78 +101,52 @@ class DaffMenuActivatorDirective {
     focus() {
         this.viewContainerRef.element.nativeElement.focus();
     }
-    openMenu(event) {
+    /**
+     * @docs-private
+     */
+    onClick(event) {
         event.preventDefault();
         this.service.open(this.viewContainerRef, this.daffMenuActivator);
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffMenuActivatorDirective, deps: [{ token: DaffMenuService }, { token: i0.ViewContainerRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.11", type: DaffMenuActivatorDirective, isStandalone: true, selector: "[daffMenuActivator]", inputs: { daffMenuActivator: "daffMenuActivator" }, host: { listeners: { "click": "openMenu($event)" }, properties: { "class.open": "this.openClass" } }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.11", type: DaffMenuActivatorDirective, isStandalone: true, selector: "[daffMenuActivator]", inputs: { daffMenuActivator: "daffMenuActivator" }, host: { listeners: { "click": "onClick($event)" } }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffMenuActivatorDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[daffMenuActivator]',
-                    standalone: true,
+                    host: {
+                        '(click)': 'onClick($event)',
+                    },
                 }]
-        }], ctorParameters: () => [{ type: DaffMenuService }, { type: i0.ViewContainerRef }, { type: i0.ChangeDetectorRef }], propDecorators: { openClass: [{
-                type: HostBinding,
-                args: ['class.open']
-            }], daffMenuActivator: [{
+        }], ctorParameters: () => [{ type: DaffMenuService }, { type: i0.ViewContainerRef }, { type: i0.ChangeDetectorRef }], propDecorators: { daffMenuActivator: [{
                 type: Input
-            }], openMenu: [{
-                type: HostListener,
-                args: ['click', ['$event']]
             }] } });
 
+/* eslint-disable quote-props */
 class DaffMenuItemComponent {
-    constructor() {
-        /**
-         * @docs-private
-         */
-        this.class = true;
-        /**
-         * Sets the role of the component to menuitem.
-         *
-         * @docs-private
-         */
-        this.role = 'menuitem';
-    }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.11", type: DaffMenuItemComponent, isStandalone: true, selector: "a[daff-menu-item],button[daff-menu-item]", host: { properties: { "class.daff-menu-item": "this.class", "attr.role": "this.role" } }, queries: [{ propertyName: "_prefix", first: true, predicate: DaffPrefixDirective, descendants: true }], ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-menu-item__content\">\n  <ng-content></ng-content>\n</div>", styles: [":host{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:flex;align-items:center;gap:8px;border:none;border-radius:4px;margin:0;padding:12px 16px;text-decoration:none;width:100%}.daff-menu-item__content{font-size:1rem;line-height:1.25rem;text-align:left}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.11", type: DaffMenuItemComponent, isStandalone: true, selector: "a[daff-menu-item],button[daff-menu-item]", host: { attributes: { "role": "menuitem" }, classAttribute: "daff-menu-item" }, queries: [{ propertyName: "_prefix", first: true, predicate: DaffPrefixDirective, descendants: true }], ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-menu-item__content\">\n  <ng-content></ng-content>\n</div>", styles: [":host{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:flex;align-items:center;gap:8px;border:none;border-radius:4px;margin:0;padding:12px 16px;text-decoration:none;width:100%}.daff-menu-item__content{font-size:1rem;line-height:1.25rem;text-align:left}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffMenuItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'a[daff-menu-item]' + ',' +
-                        'button[daff-menu-item]', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-menu-item__content\">\n  <ng-content></ng-content>\n</div>", styles: [":host{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:flex;align-items:center;gap:8px;border:none;border-radius:4px;margin:0;padding:12px 16px;text-decoration:none;width:100%}.daff-menu-item__content{font-size:1rem;line-height:1.25rem;text-align:left}\n"] }]
-        }], propDecorators: { class: [{
-                type: HostBinding,
-                args: ['class.daff-menu-item']
-            }], role: [{
-                type: HostBinding,
-                args: ['attr.role']
-            }], _prefix: [{
+                        'button[daff-menu-item]', host: {
+                        'class': 'daff-menu-item',
+                        'role': 'menuitem',
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-menu-item__content\">\n  <ng-content></ng-content>\n</div>", styles: [":host{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:flex;align-items:center;gap:8px;border:none;border-radius:4px;margin:0;padding:12px 16px;text-decoration:none;width:100%}.daff-menu-item__content{font-size:1rem;line-height:1.25rem;text-align:left}\n"] }]
+        }], propDecorators: { _prefix: [{
                 type: ContentChild,
                 args: [DaffPrefixDirective]
             }] } });
 
+/* eslint-disable quote-props */
 class DaffMenuComponent {
     constructor(_focusTrapFactory, _ngZone, _elementRef, menuService) {
         this._focusTrapFactory = _focusTrapFactory;
         this._ngZone = _ngZone;
         this._elementRef = _elementRef;
         this.menuService = menuService;
-        /**
-         * @docs-private
-         */
-        this.class = true;
-        /**
-         * @docs-private
-         */
-        this.tabindex = 0;
-        /**
-         * @docs-private
-         */
-        this.role = 'menu';
         /**
          * Listen to `keydown` events outside the zone so that change detection is not run every
          * time a key is pressed. Instead we re-enter the zone only if the `ESC` key is pressed.
@@ -215,23 +183,18 @@ class DaffMenuComponent {
         }
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffMenuComponent, deps: [{ token: i1$1.ConfigurableFocusTrapFactory }, { token: i0.NgZone }, { token: i0.ElementRef }, { token: DaffMenuService }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.11", type: DaffMenuComponent, isStandalone: true, selector: "daff-menu", host: { properties: { "class.daff-menu": "this.class", "tabindex": "this.tabindex", "attr.role": "this.role" } }, ngImport: i0, template: '<ng-content select="[daff-menu-item]"></ng-content>', isInline: true, styles: [":host{display:block;min-width:112px;max-width:320px;border-radius:4px;padding:8px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.11", type: DaffMenuComponent, isStandalone: true, selector: "daff-menu", host: { attributes: { "tabindex": "0", "role": "menu" }, classAttribute: "daff-menu" }, ngImport: i0, template: "<ng-content select=\"[daff-menu-item]\"></ng-content>", styles: [":host{display:block;min-width:112px;max-width:320px;border-radius:4px;padding:8px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffMenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'daff-menu', template: '<ng-content select="[daff-menu-item]"></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+            args: [{ selector: 'daff-menu', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        'class': 'daff-menu',
+                        'tabindex': '0',
+                        'role': 'menu',
+                    }, imports: [
                         DaffMenuItemComponent,
-                    ], styles: [":host{display:block;min-width:112px;max-width:320px;border-radius:4px;padding:8px}\n"] }]
-        }], ctorParameters: () => [{ type: i1$1.ConfigurableFocusTrapFactory }, { type: i0.NgZone }, { type: i0.ElementRef }, { type: DaffMenuService }], propDecorators: { class: [{
-                type: HostBinding,
-                args: ['class.daff-menu']
-            }], tabindex: [{
-                type: HostBinding,
-                args: ['tabindex']
-            }], role: [{
-                type: HostBinding,
-                args: ['attr.role']
-            }] } });
+                    ], template: "<ng-content select=\"[daff-menu-item]\"></ng-content>", styles: [":host{display:block;min-width:112px;max-width:320px;border-radius:4px;padding:8px}\n"] }]
+        }], ctorParameters: () => [{ type: i1$1.ConfigurableFocusTrapFactory }, { type: i0.NgZone }, { type: i0.ElementRef }, { type: DaffMenuService }] });
 
 class DaffMenuModule {
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }

package/fesm2022/daffodil-design-menu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"daffodil-design-menu.mjs","sources":["../../../libs/design/menu/src/helpers/create-overlay.ts","../../../libs/design/menu/src/services/menu.service.ts","../../../libs/design/menu/src/menu-activator/menu-activator.component.ts","../../../libs/design/menu/src/menu-item/menu-item.component.ts","../../../libs/design/menu/src/menu-item/menu-item.component.html","../../../libs/design/menu/src/menu/menu.component.ts","../../../libs/design/menu/src/menu.module.ts","../../../libs/design/menu/src/daffodil-design-menu.ts"],"sourcesContent":["import {\n  Overlay,\n  OverlayConfig,\n} from '@angular/cdk/overlay';\nimport { ElementRef } from '@angular/core';\n\nexport function daffMenuCreateOverlay(overlay: Overlay, element: ElementRef, config: OverlayConfig = {}) {\n  return overlay.create({\n    hasBackdrop: true,\n    backdropClass: 'cdk-overlay-transparent-backdrop',\n    scrollStrategy: overlay.scrollStrategies.block(),\n    disposeOnNavigation: true,\n    positionStrategy: overlay\n      .position()\n      .flexibleConnectedTo(element)\n      .withPositions([\n        {\n          originX: 'start',\n          originY: 'bottom',\n          overlayX: 'start',\n          overlayY: 'top',\n          offsetY: 0,\n        },\n        {\n          originX: 'start',\n          originY: 'top',\n          overlayX: 'start',\n          overlayY: 'bottom',\n        },\n      ]),\n    ...config,\n  });\n};\n","import {\n  Overlay,\n  OverlayRef,\n} from '@angular/cdk/overlay';\nimport {\n  ComponentPortal,\n  TemplatePortal,\n} from '@angular/cdk/portal';\nimport {\n  ElementRef,\n  Injectable,\n  Injector,\n  TemplateRef,\n  Type,\n  ViewContainerRef,\n} from '@angular/core';\nimport {\n  BehaviorSubject,\n  map,\n  Observable,\n} from 'rxjs';\n\nimport { DaffLazyComponent } from '@daffodil/design';\n\nimport { daffMenuCreateOverlay } from '../helpers/public_api';\n\nexport interface DaffActivatedMenu {\n  el: ElementRef;\n  component: Type<unknown>;\n}\n\nexport type DaffMenuSlot = TemplateRef<unknown> | DaffLazyComponent | Type<unknown>;\n\n@Injectable()\nexport class DaffMenuService {\n  protected _overlay: OverlayRef | null;\n  private _activator: ViewContainerRef;\n\n  private $_open: BehaviorSubject<boolean> = new BehaviorSubject(false);\n  public open$: Observable<boolean> = this.$_open.asObservable();\n\n  constructor(\n    protected overlay: Overlay,\n    private injector: Injector,\n  ) {}\n\n  protected async _createOverlay(activatorElement: ViewContainerRef, component: DaffMenuSlot) {\n    if (!this._overlay) {\n      this._overlay = daffMenuCreateOverlay(this.overlay, activatorElement.element);\n      if(typeof component === 'object' && (<DaffLazyComponent>component)?.import) {\n        component = await (<DaffLazyComponent>component).import();\n      }\n\n      if(component instanceof Type) {\n        this._overlay.attach(new ComponentPortal(<Type<unknown>>component, null, this.injector));\n      } else if (component instanceof TemplateRef) {\n        this._overlay.attach(new TemplatePortal(component, activatorElement, null, this.injector));\n      }\n\n      this._overlay.backdropClick().pipe(\n        map(() => this._destroyOverlay()),\n      ).subscribe();\n    }\n  }\n\n  protected _destroyOverlay() {\n    if (this._overlay) {\n      this._overlay.detach();\n      this._overlay.dispose();\n      this._overlay = null;\n    }\n  }\n\n  close() {\n    this._destroyOverlay();\n    this.$_open.next(false);\n    this._activator.element.nativeElement.focus();\n  }\n\n  open(activator: ViewContainerRef, component: DaffMenuSlot) {\n    this._createOverlay(activator, component);\n    this._activator = activator;\n    this.$_open.next(true);\n  }\n}\n","import {\n  ChangeDetectorRef,\n  Directive,\n  HostBinding,\n  HostListener,\n  Input,\n  OnDestroy,\n  TemplateRef,\n  Type,\n  ViewContainerRef,\n} from '@angular/core';\nimport {\n  Subject,\n  takeUntil,\n} from 'rxjs';\n\nimport { DaffMenuService } from '../services/menu.service';\n\n@Directive({\n  selector: '[daffMenuActivator]',\n  standalone: true,\n})\nexport class DaffMenuActivatorDirective implements OnDestroy {\n\n  private _destroyed$ = new Subject<boolean>();\n  private _open: boolean;\n\n  /**\n   * @docs-private\n   */\n  @HostBinding('class.open') get openClass() {\n    return this._open;\n  }\n\n  @Input() daffMenuActivator: Type<unknown> | TemplateRef<unknown>;\n\n  constructor(\n    private service: DaffMenuService,\n    private viewContainerRef: ViewContainerRef,\n    private cdRef: ChangeDetectorRef,\n  ) {\n    this.service.open$.pipe(\n      takeUntil(this._destroyed$),\n    ).subscribe((val: boolean) => {\n      this._open = val;\n      this.cdRef.markForCheck();\n    });\n  }\n\n  ngOnDestroy(): void {\n    this._destroyed$.next(true);\n    this._destroyed$.complete();\n  }\n\n  focus() {\n    this.viewContainerRef.element.nativeElement.focus();\n  }\n\n  @HostListener('click', ['$event'])\n  openMenu(event) {\n    event.preventDefault();\n    this.service.open(this.viewContainerRef, this.daffMenuActivator);\n  }\n}\n","import {\n  Component,\n  ChangeDetectionStrategy,\n  HostBinding,\n  ContentChild,\n} from '@angular/core';\n\nimport { DaffPrefixDirective } from '@daffodil/design';\n\n@Component({\n  selector: 'a[daff-menu-item]' + ',' +\n        'button[daff-menu-item]',\n  templateUrl: './menu-item.component.html',\n  styleUrls: ['./menu-item.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\n\nexport class DaffMenuItemComponent {\n  /**\n   * @docs-private\n   */\n  @HostBinding('class.daff-menu-item') class = true;\n\n  /**\n   * Sets the role of the component to menuitem.\n   *\n   * @docs-private\n   */\n  @HostBinding('attr.role') role = 'menuitem';\n\n  /**\n   * @docs-private\n   */\n  @ContentChild(DaffPrefixDirective) _prefix: DaffPrefixDirective;\n}\n","@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-menu-item__content\">\n  <ng-content></ng-content>\n</div>","import {\n  ConfigurableFocusTrapFactory,\n  ConfigurableFocusTrap,\n} from '@angular/cdk/a11y';\nimport {\n  AfterContentInit,\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  HostBinding,\n  NgZone,\n} from '@angular/core';\nimport {\n  filter,\n  fromEvent,\n} from 'rxjs';\n\nimport { daffFocusableElementsSelector } from '@daffodil/design';\n\nimport { DaffMenuItemComponent } from '../menu-item/menu-item.component';\nimport { DaffMenuService } from '../services/menu.service';\n\n@Component({\n  selector: 'daff-menu',\n  template: '<ng-content select=\"[daff-menu-item]\"></ng-content>',\n  styleUrls: ['./menu.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    DaffMenuItemComponent,\n  ],\n})\nexport class DaffMenuComponent implements AfterContentInit, AfterViewInit {\n  /**\n   * @docs-private\n   */\n  @HostBinding('class.daff-menu') class = true;\n  /**\n   * @docs-private\n   */\n  @HostBinding('tabindex') tabindex = 0;\n  /**\n   * @docs-private\n   */\n  @HostBinding('attr.role') role = 'menu';\n\n  private _focusTrap: ConfigurableFocusTrap;\n\n  constructor(\n    private _focusTrapFactory: ConfigurableFocusTrapFactory,\n    private _ngZone: NgZone,\n    private _elementRef: ElementRef<HTMLElement>,\n    private menuService: DaffMenuService,\n  ) {\n    /**\n     * Listen to `keydown` events outside the zone so that change detection is not run every\n     * time a key is pressed. Instead we re-enter the zone only if the `ESC` key is pressed.\n     *\n     */\n    this._ngZone.runOutsideAngular(() => {\n      fromEvent<KeyboardEvent>(this._elementRef.nativeElement, 'keyup')\n        .pipe(\n          filter((event) => event.key === 'Escape'),\n        )\n        .subscribe((event) =>\n          this._ngZone.run(() => {\n            this.menuService.close();\n            event.stopPropagation();\n          }),\n        );\n    });\n  }\n\n  /**\n   * @docs-private\n   */\n  ngAfterContentInit() {\n    this._focusTrap = this._focusTrapFactory.create(\n      this._elementRef.nativeElement,\n    );\n  }\n\n  /**\n   * @docs-private\n   */\n  ngAfterViewInit() {\n    const focusableChild = (<HTMLElement>this._elementRef.nativeElement.querySelector(\n      daffFocusableElementsSelector)\n    );\n\n    if(focusableChild) {\n      focusableChild.focus();\n    } else {\n      // There's a timing condition when computing HostBindings afterContentInit\n      // so to allow the menu to be focused, we manually set the tabindex.\n      this._elementRef.nativeElement.tabIndex = 0;\n      (<HTMLElement>this._elementRef.nativeElement).focus();\n    }\n  }\n}\n","import { OverlayModule } from '@angular/cdk/overlay';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DaffMenuComponent } from './menu/menu.component';\nimport { DaffMenuActivatorDirective } from './menu-activator/menu-activator.component';\nimport { DaffMenuItemComponent } from './menu-item/menu-item.component';\nimport { DaffMenuService } from './services/menu.service';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    OverlayModule,\n    DaffMenuActivatorDirective,\n    DaffMenuComponent,\n    DaffMenuItemComponent,\n  ],\n  exports: [\n    DaffMenuActivatorDirective,\n    DaffMenuComponent,\n    DaffMenuItemComponent,\n  ],\n  providers: [\n    DaffMenuService,\n  ],\n})\n\nexport class DaffMenuModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1.DaffMenuService","i1","i2.DaffMenuService"],"mappings":"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"}
+{"version":3,"file":"daffodil-design-menu.mjs","sources":["../../../libs/design/menu/src/helpers/create-overlay.ts","../../../libs/design/menu/src/services/menu.service.ts","../../../libs/design/menu/src/menu-activator/menu-activator.component.ts","../../../libs/design/menu/src/menu-item/menu-item.component.ts","../../../libs/design/menu/src/menu-item/menu-item.component.html","../../../libs/design/menu/src/menu/menu.component.ts","../../../libs/design/menu/src/menu/menu.component.html","../../../libs/design/menu/src/menu.module.ts","../../../libs/design/menu/src/daffodil-design-menu.ts"],"sourcesContent":["import {\n  Overlay,\n  OverlayConfig,\n} from '@angular/cdk/overlay';\nimport { ElementRef } from '@angular/core';\n\nexport function daffMenuCreateOverlay(overlay: Overlay, element: ElementRef, config: OverlayConfig = {}) {\n  return overlay.create({\n    hasBackdrop: true,\n    backdropClass: 'cdk-overlay-transparent-backdrop',\n    scrollStrategy: overlay.scrollStrategies.block(),\n    disposeOnNavigation: true,\n    positionStrategy: overlay\n      .position()\n      .flexibleConnectedTo(element)\n      .withPositions([\n        {\n          originX: 'start',\n          originY: 'bottom',\n          overlayX: 'start',\n          overlayY: 'top',\n          offsetY: 0,\n        },\n        {\n          originX: 'start',\n          originY: 'top',\n          overlayX: 'start',\n          overlayY: 'bottom',\n        },\n      ]),\n    ...config,\n  });\n};\n","import {\n  Overlay,\n  OverlayRef,\n} from '@angular/cdk/overlay';\nimport {\n  ComponentPortal,\n  TemplatePortal,\n} from '@angular/cdk/portal';\nimport {\n  ElementRef,\n  Injectable,\n  Injector,\n  TemplateRef,\n  Type,\n  ViewContainerRef,\n} from '@angular/core';\nimport {\n  BehaviorSubject,\n  map,\n  Observable,\n} from 'rxjs';\n\nimport { DaffLazyComponent } from '@daffodil/design';\n\nimport { daffMenuCreateOverlay } from '../helpers/public_api';\n\nexport interface DaffActivatedMenu {\n  el: ElementRef;\n  component: Type<unknown>;\n}\n\nexport type DaffMenuSlot = TemplateRef<unknown> | DaffLazyComponent | Type<unknown>;\n\n@Injectable()\nexport class DaffMenuService {\n  protected _overlay: OverlayRef | null;\n  private _activator: ViewContainerRef;\n\n  private $_open: BehaviorSubject<boolean> = new BehaviorSubject(false);\n  public open$: Observable<boolean> = this.$_open.asObservable();\n\n  constructor(\n    protected overlay: Overlay,\n    private injector: Injector,\n  ) {}\n\n  protected async _createOverlay(activatorElement: ViewContainerRef, component: DaffMenuSlot) {\n    if (!this._overlay) {\n      this._overlay = daffMenuCreateOverlay(this.overlay, activatorElement.element);\n      if(typeof component === 'object' && (<DaffLazyComponent>component)?.import) {\n        component = await (<DaffLazyComponent>component).import();\n      }\n\n      if(component instanceof Type) {\n        this._overlay.attach(new ComponentPortal(<Type<unknown>>component, null, this.injector));\n      } else if (component instanceof TemplateRef) {\n        this._overlay.attach(new TemplatePortal(component, activatorElement, null, this.injector));\n      }\n\n      this._overlay.backdropClick().pipe(\n        map(() => this._destroyOverlay()),\n      ).subscribe();\n    }\n  }\n\n  protected _destroyOverlay() {\n    if (this._overlay) {\n      this._overlay.detach();\n      this._overlay.dispose();\n      this._overlay = null;\n    }\n  }\n\n  close() {\n    this._destroyOverlay();\n    this.$_open.next(false);\n    this._activator.element.nativeElement.focus();\n  }\n\n  open(activator: ViewContainerRef, component: DaffMenuSlot) {\n    this._createOverlay(activator, component);\n    this._activator = activator;\n    this.$_open.next(true);\n  }\n}\n","import {\n  ChangeDetectorRef,\n  Directive,\n  Input,\n  OnDestroy,\n  TemplateRef,\n  Type,\n  ViewContainerRef,\n} from '@angular/core';\nimport {\n  Subject,\n  takeUntil,\n} from 'rxjs';\n\nimport { DaffMenuService } from '../services/menu.service';\n\n@Directive({\n  selector: '[daffMenuActivator]',\n  host: {\n    '(click)': 'onClick($event)',\n  },\n})\nexport class DaffMenuActivatorDirective implements OnDestroy {\n\n  private _destroyed$ = new Subject<boolean>();\n  private _open: boolean;\n\n  @Input() daffMenuActivator: Type<unknown> | TemplateRef<unknown>;\n\n  constructor(\n    private service: DaffMenuService,\n    private viewContainerRef: ViewContainerRef,\n    private cdRef: ChangeDetectorRef,\n  ) {\n    this.service.open$.pipe(\n      takeUntil(this._destroyed$),\n    ).subscribe((val: boolean) => {\n      this._open = val;\n      this.cdRef.markForCheck();\n    });\n  }\n\n  ngOnDestroy(): void {\n    this._destroyed$.next(true);\n    this._destroyed$.complete();\n  }\n\n  focus() {\n    this.viewContainerRef.element.nativeElement.focus();\n  }\n\n  /**\n   * @docs-private\n   */\n  onClick(event: MouseEvent) {\n    event.preventDefault();\n    this.service.open(this.viewContainerRef, this.daffMenuActivator);\n  }\n}\n","/* eslint-disable quote-props */\nimport {\n  Component,\n  ChangeDetectionStrategy,\n  ContentChild,\n} from '@angular/core';\n\nimport { DaffPrefixDirective } from '@daffodil/design';\n\n@Component({\n  selector:\n    'a[daff-menu-item]' + ',' +\n    'button[daff-menu-item]',\n  templateUrl: './menu-item.component.html',\n  styleUrls: ['./menu-item.component.scss'],\n  host: {\n    'class': 'daff-menu-item',\n    'role': 'menuitem',\n  },\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\n\nexport class DaffMenuItemComponent {\n  /**\n   * @docs-private\n   */\n  @ContentChild(DaffPrefixDirective) _prefix: DaffPrefixDirective;\n}\n","@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-menu-item__content\">\n  <ng-content></ng-content>\n</div>","/* eslint-disable quote-props */\nimport {\n  ConfigurableFocusTrapFactory,\n  ConfigurableFocusTrap,\n} from '@angular/cdk/a11y';\nimport {\n  AfterContentInit,\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  NgZone,\n} from '@angular/core';\nimport {\n  filter,\n  fromEvent,\n} from 'rxjs';\n\nimport { daffFocusableElementsSelector } from '@daffodil/design';\n\nimport { DaffMenuItemComponent } from '../menu-item/menu-item.component';\nimport { DaffMenuService } from '../services/menu.service';\n\n@Component({\n  selector: 'daff-menu',\n  templateUrl: './menu.component.html',\n  styleUrl: './menu.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    'class': 'daff-menu',\n    'tabindex': '0',\n    'role': 'menu',\n  },\n  imports: [\n    DaffMenuItemComponent,\n  ],\n})\nexport class DaffMenuComponent implements AfterContentInit, AfterViewInit {\n  private _focusTrap: ConfigurableFocusTrap;\n\n  constructor(\n    private _focusTrapFactory: ConfigurableFocusTrapFactory,\n    private _ngZone: NgZone,\n    private _elementRef: ElementRef<HTMLElement>,\n    private menuService: DaffMenuService,\n  ) {\n    /**\n     * Listen to `keydown` events outside the zone so that change detection is not run every\n     * time a key is pressed. Instead we re-enter the zone only if the `ESC` key is pressed.\n     *\n     */\n    this._ngZone.runOutsideAngular(() => {\n      fromEvent<KeyboardEvent>(this._elementRef.nativeElement, 'keyup')\n        .pipe(\n          filter((event) => event.key === 'Escape'),\n        )\n        .subscribe((event) =>\n          this._ngZone.run(() => {\n            this.menuService.close();\n            event.stopPropagation();\n          }),\n        );\n    });\n  }\n\n  /**\n   * @docs-private\n   */\n  ngAfterContentInit() {\n    this._focusTrap = this._focusTrapFactory.create(\n      this._elementRef.nativeElement,\n    );\n  }\n\n  /**\n   * @docs-private\n   */\n  ngAfterViewInit() {\n    const focusableChild = (<HTMLElement>this._elementRef.nativeElement.querySelector(\n      daffFocusableElementsSelector)\n    );\n\n    if(focusableChild) {\n      focusableChild.focus();\n    } else {\n      // There's a timing condition when computing HostBindings afterContentInit\n      // so to allow the menu to be focused, we manually set the tabindex.\n      this._elementRef.nativeElement.tabIndex = 0;\n      (<HTMLElement>this._elementRef.nativeElement).focus();\n    }\n  }\n}\n","<ng-content select=\"[daff-menu-item]\"></ng-content>","import { OverlayModule } from '@angular/cdk/overlay';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DaffMenuComponent } from './menu/menu.component';\nimport { DaffMenuActivatorDirective } from './menu-activator/menu-activator.component';\nimport { DaffMenuItemComponent } from './menu-item/menu-item.component';\nimport { DaffMenuService } from './services/menu.service';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    OverlayModule,\n    DaffMenuActivatorDirective,\n    DaffMenuComponent,\n    DaffMenuItemComponent,\n  ],\n  exports: [\n    DaffMenuActivatorDirective,\n    DaffMenuComponent,\n    DaffMenuItemComponent,\n  ],\n  providers: [\n    DaffMenuService,\n  ],\n})\n\nexport class DaffMenuModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1.DaffMenuService","i1","i2.DaffMenuService"],"mappings":"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"}

package/fesm2022/daffodil-design-modal.mjs

@@ -5,10 +5,12 @@ import * as i4 from '@angular/cdk/portal';
 import { ComponentPortal, PortalModule, CdkPortalOutlet } from '@angular/cdk/portal';
 import * as i0 from '@angular/core';
 import { Injector, Injectable, EventEmitter, HostListener, HostBinding, ViewChild, ViewEncapsulation, ChangeDetectionStrategy, Component, Optional, Directive, Input, NgModule } from '@angular/core';
+import { Subject } from 'rxjs';
 import * as i3 from '@daffodil/design';
 import { daffFocusableElementsSelector, DaffOpenableDirective } from '@daffodil/design';
 import { trigger, state, transition, style, animate } from '@angular/animations';
-import { NgIf, CommonModule } from '@angular/common';
+import { take } from 'rxjs/operators';
+import { CommonModule } from '@angular/common';
 import { FaIconComponent, FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 import { DaffIconButtonComponent, DaffButtonModule } from '@daffodil/design/button';
 import { faXmark } from '@fortawesome/free-solid-svg-icons';
@@ -82,7 +84,7 @@ class DaffModalService {
         component.hide();
         const modal = this._modals.get(component);
         modal.overlay.detachBackdrop();
-        component.closedAnimationCompleted.subscribe((e) => this._removeModal(modal));
+        component.closedAnimationCompleted$.pipe(take(1)).subscribe((e) => this._removeModal(modal));
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalService, deps: [{ token: i1.Overlay }], target: i0.ɵɵFactoryTarget.Injectable }); }
     /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalService }); }
@@ -92,14 +94,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
         }], ctorParameters: () => [{ type: i1.Overlay }] });
 
 class DaffModalComponent {
-    /**
-     * The aria-labelledby for the modal. This is set by the id of
-     * {@link DaffModalTitleDirective} when it is used.
-     *
-     */
-    /**
-     * @docs-private
-     */
     get ariaLabelledBy() {
         return this._ariaLabelledBy;
     }
@@ -119,36 +113,19 @@ class DaffModalComponent {
         this.openDirective = openDirective;
         this._focusStack = _focusStack;
         this.changeDetector = changeDetector;
-        /**
-         * Sets a class of .daff-modal to the host element.
-         */
-        /**
-         * @docs-private
-         */
-        this.modalClass = true;
-        /**
-         * Sets the role to dialog.
-         */
-        /**
-         * @docs-private
-         */
-        this.role = 'dialog';
-        /**
-         * Sets aria-modal to true.
-         */
-        /**
-         * @docs-private
-         */
-        this.ariaModal = true;
         this._ariaLabelledBy = null;
         /**
          * Event fired when the close animation is completed.
          */
         this.animationCompleted = new EventEmitter();
         /**
-         * Event fired when the close animation is completed.
+         * Private subject for closed animation completion events.
+         */
+        this._closedAnimationCompleted = new Subject();
+        /**
+         * Observable that emits when the close animation is completed.
          */
-        this.closedAnimationCompleted = new EventEmitter();
+        this.closedAnimationCompleted$ = this._closedAnimationCompleted.asObservable();
         this.openDirective.stateless = false;
     }
     /**
@@ -168,7 +145,7 @@ class DaffModalComponent {
         }
         else {
             // There's a timing condition when computing HostBindings afterContentInit
-            // so to allow the menu to be focused, we manually set the tabindex.
+            // so to allow the modal to be focused, we manually set the tabindex.
             this.elementRef.nativeElement.tabIndex = 0;
             this.elementRef.nativeElement.focus();
         }
@@ -197,7 +174,8 @@ class DaffModalComponent {
         this.animationCompleted.emit(e);
         if (e.toState === 'closed') {
             this._focusStack.pop();
-            this.closedAnimationCompleted.emit(e);
+            this._closedAnimationCompleted.next(e);
+            this._closedAnimationCompleted.complete();
         }
     }
     get open() {
@@ -224,36 +202,33 @@ class DaffModalComponent {
         this.openDirective.toggle();
         this.changeDetector.markForCheck();
     }
+    /**
+     * @docs-private
+     */
+    ngOnDestroy() {
+        this._closedAnimationCompleted.complete();
+    }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalComponent, deps: [{ token: DaffModalService }, { token: i2.ConfigurableFocusTrapFactory }, { token: i0.ElementRef }, { token: i3.DaffOpenableDirective }, { token: i3.DaffFocusStackService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.11", type: DaffModalComponent, isStandalone: true, selector: "daff-modal", host: { listeners: { "keydown.escape": "onEscape()", "@fade.done": "animationDone($event)" }, properties: { "class.daff-modal": "this.modalClass", "attr.role": "this.role", "attr.aria-modal": "this.ariaModal", "attr.aria-labelledby": "this.ariaLabelledBy", "@fade": "this.fadeState" } }, viewQueries: [{ propertyName: "_portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }], hostDirectives: [{ directive: i3.DaffOpenableDirective, outputs: ["toggled", "toggled"] }], ngImport: i0, template: "<ng-template cdkPortalOutlet></ng-template>\n", styles: [".daff-modal{display:flex;flex-direction:column;justify-content:space-between;border-radius:.25rem;max-height:90vh;max-width:90vw;overflow:hidden;z-index:3}@media (min-width: 480px){.daff-modal{max-height:80vh;max-width:80vw}}.daff-modal>*{display:inherit;flex-direction:inherit;justify-content:inherit;border-radius:inherit;max-height:inherit;max-width:inherit;overflow:inherit;z-index:inherit}@media (min-width: 480px){.daff-modal>*{max-height:inherit;max-width:inherit}}.daff-modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem;position:relative}.daff-modal-header .daff-modal-title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1.25rem;font-weight:500;line-height:1.5rem;margin:0;padding:0 2rem 0 0}.daff-modal-header__dismiss-button{position:absolute;right:7px;top:12px}.daff-modal-content{display:block;flex-grow:1;max-height:60vh;overflow-y:auto;padding:1.5rem}.daff-modal-actions{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:.5rem;padding:1.5rem}.daff-modal-content+.daff-modal-actions{padding:0 1.5rem 1.5rem}.daff-modal-header+.daff-modal-content{padding-top:0}\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i4.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "ngmodule", type: OverlayModule }], animations: [daffFadeAnimations.fade], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.11", type: DaffModalComponent, isStandalone: true, selector: "daff-modal", host: { attributes: { "role": "dialog", "aria-modal": "true" }, listeners: { "keydown.escape": "onEscape()", "@fade.done": "animationDone($event)" }, properties: { "attr.aria-labelledby": "ariaLabelledBy", "@fade": "this.fadeState" }, classAttribute: "daff-modal" }, viewQueries: [{ propertyName: "_portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }], hostDirectives: [{ directive: i3.DaffOpenableDirective, outputs: ["toggled", "toggled"] }], ngImport: i0, template: "<ng-template cdkPortalOutlet></ng-template>\n", styles: [".daff-modal{display:flex;flex-direction:column;justify-content:space-between;border-radius:.25rem;max-height:90vh;max-width:90vw;overflow:hidden;z-index:3}@media (min-width: 480px){.daff-modal{max-height:80vh;max-width:80vw}}.daff-modal>*{display:inherit;flex-direction:inherit;justify-content:inherit;border-radius:inherit;max-height:inherit;max-width:inherit;overflow:inherit;z-index:inherit}@media (min-width: 480px){.daff-modal>*{max-height:inherit;max-width:inherit}}.daff-modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem;position:relative}.daff-modal-header .daff-modal-title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1.25rem;font-weight:500;line-height:1.5rem;margin:0;padding:0 2rem 0 0}.daff-modal-header__dismiss-button{position:absolute;right:7px;top:12px}.daff-modal-content{display:block;flex-grow:1;max-height:60vh;overflow-y:auto;padding:1.5rem}.daff-modal-actions{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:.5rem;padding:1.5rem}.daff-modal-content+.daff-modal-actions{padding:0 1.5rem 1.5rem}.daff-modal-header+.daff-modal-content{padding-top:0}\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i4.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "ngmodule", type: OverlayModule }], animations: [daffFadeAnimations.fade], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'daff-modal', hostDirectives: [{
                             directive: DaffOpenableDirective,
                             outputs: ['toggled'],
-                        }], animations: [daffFadeAnimations.fade], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
+                        }], host: {
+                        'class': 'daff-modal',
+                        'role': 'dialog',
+                        'aria-modal': 'true',
+                        '[attr.aria-labelledby]': 'ariaLabelledBy',
+                        '(keydown.escape)': 'onEscape()',
+                    }, animations: [daffFadeAnimations.fade], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
                         PortalModule,
                         OverlayModule,
                     ], template: "<ng-template cdkPortalOutlet></ng-template>\n", styles: [".daff-modal{display:flex;flex-direction:column;justify-content:space-between;border-radius:.25rem;max-height:90vh;max-width:90vw;overflow:hidden;z-index:3}@media (min-width: 480px){.daff-modal{max-height:80vh;max-width:80vw}}.daff-modal>*{display:inherit;flex-direction:inherit;justify-content:inherit;border-radius:inherit;max-height:inherit;max-width:inherit;overflow:inherit;z-index:inherit}@media (min-width: 480px){.daff-modal>*{max-height:inherit;max-width:inherit}}.daff-modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem;position:relative}.daff-modal-header .daff-modal-title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1.25rem;font-weight:500;line-height:1.5rem;margin:0;padding:0 2rem 0 0}.daff-modal-header__dismiss-button{position:absolute;right:7px;top:12px}.daff-modal-content{display:block;flex-grow:1;max-height:60vh;overflow-y:auto;padding:1.5rem}.daff-modal-actions{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:.5rem;padding:1.5rem}.daff-modal-content+.daff-modal-actions{padding:0 1.5rem 1.5rem}.daff-modal-header+.daff-modal-content{padding-top:0}\n"] }]
-        }], ctorParameters: () => [{ type: DaffModalService }, { type: i2.ConfigurableFocusTrapFactory }, { type: i0.ElementRef }, { type: i3.DaffOpenableDirective }, { type: i3.DaffFocusStackService }, { type: i0.ChangeDetectorRef }], propDecorators: { modalClass: [{
-                type: HostBinding,
-                args: ['class.daff-modal']
-            }], role: [{
-                type: HostBinding,
-                args: ['attr.role']
-            }], ariaModal: [{
-                type: HostBinding,
-                args: ['attr.aria-modal']
-            }], ariaLabelledBy: [{
-                type: HostBinding,
-                args: ['attr.aria-labelledby']
-            }], _portalOutlet: [{
+        }], ctorParameters: () => [{ type: DaffModalService }, { type: i2.ConfigurableFocusTrapFactory }, { type: i0.ElementRef }, { type: i3.DaffOpenableDirective }, { type: i3.DaffFocusStackService }, { type: i0.ChangeDetectorRef }], propDecorators: { _portalOutlet: [{
                 type: ViewChild,
                 args: [CdkPortalOutlet, { static: true }]
-            }], onEscape: [{
-                type: HostListener,
-                args: ['keydown.escape']
             }], fadeState: [{
                 type: HostBinding,
                 args: ['@fade']
@@ -262,15 +237,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
                 args: ['@fade.done', ['$event']]
             }] } });
 
+/* eslint-disable quote-props */
 class DaffModalActionsComponent {
-    constructor() {
-        /**
-         * @docs-private
-         */
-        this.class = true;
-    }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.11", type: DaffModalActionsComponent, isStandalone: true, selector: "daff-modal-actions", host: { properties: { "class.daff-modal-actions": "this.class" } }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.11", type: DaffModalActionsComponent, isStandalone: true, selector: "daff-modal-actions", host: { classAttribute: "daff-modal-actions" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalActionsComponent, decorators: [{
             type: Component,
@@ -278,13 +248,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
                     selector: 'daff-modal-actions',
                     template: '<ng-content></ng-content>',
                     changeDetection: ChangeDetectionStrategy.OnPush,
-                    standalone: true,
+                    host: {
+                        'class': 'daff-modal-actions',
+                    },
                 }]
-        }], propDecorators: { class: [{
-                type: HostBinding,
-                args: ['class.daff-modal-actions']
-            }] } });
+        }] });
 
+/* eslint-disable quote-props */
 /**
  * The DaffModalCloseDirective is a helper directive that passes a click
  * event to the button it's used with to close a modal. It needs to be
@@ -295,50 +265,35 @@ class DaffModalCloseDirective {
     constructor(modalService, modal) {
         this.modalService = modalService;
         this.modal = modal;
-        /**
-         * Sets the button type attribute to button.
-         */
-        /**
-         * @docs-private
-         */
-        this.typeAttribute = 'button';
     }
     /**
-     * Event fired when the button the directive is attached to is clicked. This is used to close a modal.
+     * @docs-private
      */
-    _onCloseModal(event) {
+    onClick(event) {
         if (this.modal) {
             this.modalService.close(this.modal);
         }
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalCloseDirective, deps: [{ token: DaffModalService }, { token: DaffModalComponent, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.11", type: DaffModalCloseDirective, isStandalone: true, selector: "button[daffModalClose]", host: { listeners: { "click": "_onCloseModal()" }, properties: { "attr.type": "this.typeAttribute" } }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.11", type: DaffModalCloseDirective, isStandalone: true, selector: "button[daffModalClose]", host: { attributes: { "type": "button" }, listeners: { "click": "onClick($event)" } }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalCloseDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[daffModalClose]',
-                    standalone: true,
+                    host: {
+                        'type': 'button',
+                        '(click)': 'onClick($event)',
+                    },
                 }]
         }], ctorParameters: () => [{ type: DaffModalService }, { type: DaffModalComponent, decorators: [{
                     type: Optional
-                }] }], propDecorators: { _onCloseModal: [{
-                type: HostListener,
-                args: ['click']
-            }], typeAttribute: [{
-                type: HostBinding,
-                args: ['attr.type']
-            }] } });
+                }] }] });
 
+/* eslint-disable quote-props */
 class DaffModalContentComponent {
-    constructor() {
-        /**
-         * @docs-private
-         */
-        this.class = true;
-    }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.11", type: DaffModalContentComponent, isStandalone: true, selector: "daff-modal-content", host: { properties: { "class.daff-modal-content": "this.class" } }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.11", type: DaffModalContentComponent, isStandalone: true, selector: "daff-modal-content", host: { classAttribute: "daff-modal-content" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalContentComponent, decorators: [{
             type: Component,
@@ -346,40 +301,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
                     selector: 'daff-modal-content',
                     template: '<ng-content></ng-content>',
                     changeDetection: ChangeDetectionStrategy.OnPush,
-                    standalone: true,
+                    host: {
+                        'class': 'daff-modal-content',
+                    },
                 }]
-        }], propDecorators: { class: [{
-                type: HostBinding,
-                args: ['class.daff-modal-content']
-            }] } });
+        }] });
 
+/* eslint-disable quote-props */
 class DaffModalHeaderComponent {
     constructor() {
         this.faXmark = faXmark;
-        /**
-         * @docs-private
-         */
-        this.class = true;
         /**
          * Whether or not a modal is dismissible.
          */
         this.dismissible = true;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.11", type: DaffModalHeaderComponent, isStandalone: true, selector: "daff-modal-header", inputs: { dismissible: "dismissible" }, host: { properties: { "class.daff-modal-header": "this.class" } }, ngImport: i0, template: "<ng-content select=\"[daffModalTitle]\"></ng-content>\n<ng-container *ngIf=\"dismissible\">\n\t<button daff-icon-button color=\"theme-contrast\"\n\t\tdaffModalClose\n\t\tclass=\"daff-modal-header__dismiss-button\"\n\t\taria-label=\"Close modal\">\n\t\t\t<fa-icon [icon]=\"faXmark\" size=\"lg\"></fa-icon>\n\t</button>\n</ng-container>", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DaffIconButtonComponent, selector: "button[daff-icon-button],a[daff-icon-button]" }, { kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "directive", type: DaffModalCloseDirective, selector: "button[daffModalClose]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.11", type: DaffModalHeaderComponent, isStandalone: true, selector: "daff-modal-header", inputs: { dismissible: "dismissible" }, host: { classAttribute: "daff-modal-header" }, ngImport: i0, template: "<ng-content select=\"[daffModalTitle]\"></ng-content>\n@if (dismissible) {\n\t<button daff-icon-button color=\"theme-contrast\"\n\t\tdaffModalClose\n\t\tclass=\"daff-modal-header__dismiss-button\"\n\t\taria-label=\"Close modal\">\n\t\t\t<fa-icon [icon]=\"faXmark\" size=\"lg\"></fa-icon>\n\t</button>\n}", dependencies: [{ kind: "component", type: DaffIconButtonComponent, selector: "button[daff-icon-button],a[daff-icon-button]" }, { kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "directive", type: DaffModalCloseDirective, selector: "button[daffModalClose]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalHeaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'daff-modal-header', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
-                        NgIf,
+            args: [{ selector: 'daff-modal-header', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        'class': 'daff-modal-header',
+                    }, imports: [
                         DaffIconButtonComponent,
                         FaIconComponent,
                         DaffModalCloseDirective,
-                    ], template: "<ng-content select=\"[daffModalTitle]\"></ng-content>\n<ng-container *ngIf=\"dismissible\">\n\t<button daff-icon-button color=\"theme-contrast\"\n\t\tdaffModalClose\n\t\tclass=\"daff-modal-header__dismiss-button\"\n\t\taria-label=\"Close modal\">\n\t\t\t<fa-icon [icon]=\"faXmark\" size=\"lg\"></fa-icon>\n\t</button>\n</ng-container>" }]
-        }], propDecorators: { class: [{
-                type: HostBinding,
-                args: ['class.daff-modal-header']
-            }], dismissible: [{
+                    ], template: "<ng-content select=\"[daffModalTitle]\"></ng-content>\n@if (dismissible) {\n\t<button daff-icon-button color=\"theme-contrast\"\n\t\tdaffModalClose\n\t\tclass=\"daff-modal-header__dismiss-button\"\n\t\taria-label=\"Close modal\">\n\t\t\t<fa-icon [icon]=\"faXmark\" size=\"lg\"></fa-icon>\n\t</button>\n}" }]
+        }], propDecorators: { dismissible: [{
                 type: Input
             }] } });
 
@@ -388,21 +337,8 @@ let modalTitleId = 0;
  * Title of a modal.
  */
 class DaffModalTitleDirective {
-    /**
-     * The html `id` of the modal title.
-     */
-    /**
-     * @docs-private
-     */
-    get uniqueId() {
-        return this._id;
-    }
     constructor(modal) {
         this.modal = modal;
-        /**
-         * @docs-private
-         */
-        this.class = true;
         this._id = '';
         modalTitleId++;
         this._id = 'daff-modal-title-' + modalTitleId;
@@ -410,27 +346,24 @@ class DaffModalTitleDirective {
          * Sets the ariaLabelledBy of the modal to the id of the modal title.
          */
         if (this.modal) {
-            this.modal.ariaLabelledBy = this.uniqueId;
+            this.modal.ariaLabelledBy = this._id;
         }
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalTitleDirective, deps: [{ token: DaffModalComponent, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.11", type: DaffModalTitleDirective, isStandalone: true, selector: "[daffModalTitle]", host: { properties: { "class.daff-modal-title": "this.class", "attr.id": "this.uniqueId" } }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.11", type: DaffModalTitleDirective, isStandalone: true, selector: "[daffModalTitle]", host: { properties: { "attr.id": "_id" }, classAttribute: "daff-modal-title" }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DaffModalTitleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[daffModalTitle]',
-                    standalone: true,
+                    host: {
+                        class: 'daff-modal-title',
+                        '[attr.id]': '_id',
+                    },
                 }]
         }], ctorParameters: () => [{ type: DaffModalComponent, decorators: [{
                     type: Optional
-                }] }], propDecorators: { class: [{
-                type: HostBinding,
-                args: ['class.daff-modal-title']
-            }], uniqueId: [{
-                type: HostBinding,
-                args: ['attr.id']
-            }] } });
+                }] }] });
 
 /**
  * @deprecated in favor of {@link DAFF_MODAL_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.