@daffodil/design 0.89.0 → 0.91.0

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

@@ -1 +1 @@
-{"version":3,"file":"daffodil-design-accordion.mjs","sources":["../../../libs/design/accordion/src/accordion/accordion/accordion.component.ts","../../../libs/design/accordion/src/accordion/accordion-item/accordion-item.component.ts","../../../libs/design/accordion/src/accordion/accordion-item/accordion-item.component.html","../../../libs/design/accordion/src/accordion/accordion-item-title/accordion-item-title.directive.ts","../../../libs/design/accordion/src/accordion.module.ts","../../../libs/design/accordion/src/accordion.ts","../../../libs/design/accordion/src/daffodil-design-accordion.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\n\nimport { DaffArticleEncapsulatedDirective } from '@daffodil/design';\n\n/**\n * Groups accordion items.\n *\n * @example\n * ```html\n * <daff-accordion>\n *  <daff-accordion-item>\n *    <div daffAccordionItemTitle>Title</div>\n *    <div>Expandable content</div>\n *  </daff-accordion-item>\n *  <daff-accordion-item>\n *    <div daffAccordionItemTitle>Title</div>\n *    <div>Expandable content</div>\n *  </daff-accordion-item>\n * </daff-accordion>\n * ```\n */\n@Component({\n  selector: 'daff-accordion',\n  template: '<ng-content></ng-content>',\n  styles: [`\n    :host {\n      display: block;\n    }\n  `],\n  hostDirectives: [{\n    directive: DaffArticleEncapsulatedDirective,\n  }],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\n\nexport class DaffAccordionComponent {}\n","/* eslint-disable quote-props */\nimport {\n  Component,\n  Input,\n  OnInit,\n  ViewEncapsulation,\n  ChangeDetectionStrategy,\n} from '@angular/core';\n\nimport {\n  DaffOpenable,\n  DaffOpenableDirective,\n} from '@daffodil/design';\n\n\nlet daffAccordionItemId = 0;\nlet daffAccordionItemContentId = 0;\n\n/**\n * Contains the title and collapsible content. Handles expansion and collapse on user interaction. All `<daff-accordion-item>`s should be grouped inside a `<daff-accordion>`.\n *\n * @example\n * ```html\n *  <daff-accordion-item>\n *    <div daffAccordionItemTitle>Title</div>\n *    <div>Accordion content</div>\n *  </daff-accordion-item>\n * ```\n */\n@Component({\n  selector: 'daff-accordion-item',\n  templateUrl: './accordion-item.component.html',\n  styleUrls: ['./accordion-item.component.scss'],\n  hostDirectives: [{\n    directive: DaffOpenableDirective,\n    outputs: ['toggled'],\n  }],\n  host: {\n    'class': 'daff-accordion-item',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DaffAccordionItemComponent implements OnInit, DaffOpenable {\n  /**\n   * The unique id of an accordion item. Defaults to an autogenerated value.\n   */\n  @Input() itemId: string = 'daff-accordion-item' + '-' + ++daffAccordionItemId;\n\n  /**\n   * The unique id of an accordion item content. Defaults to an autogenerated value.\n   */\n  @Input() contentId: string = 'daff-accordion-item-content' + '-' + ++daffAccordionItemContentId;\n\n  /**\n   * Whether or not an accordion item is initially expanded by default.\n   */\n  @Input() initiallyExpanded = false;\n\n  /**\n   * Disables an accordion item and prevents it from being expanded or collapsed.\n   */\n  @Input() disabled = false;\n\n  constructor(private openDirective: DaffOpenableDirective) {\n    this.openDirective.stateless = false;\n  }\n\n  /**\n   * @docs-private\n   */\n  ngOnInit() {\n    this.openDirective.open = this.initiallyExpanded ? this.initiallyExpanded : this.openDirective.open;\n  }\n\n  /**\n   * @docs-private\n   */\n  get open() {\n    return this.openDirective.open;\n  }\n\n  /**\n   * Reveals the contents of the accordion item.\n   */\n  reveal() {\n    this.openDirective.reveal();\n  }\n\n  /**\n   * Hides the contents of the accordion item.\n   */\n  hide() {\n    this.openDirective.hide();\n  }\n\n  /**\n   * Toggles the visibility of the contents of the accordion item.\n   */\n  toggle() {\n    this.openDirective.toggle();\n  }\n}\n","<button type=\"button\" class=\"daff-accordion-item__header\"\n  (click)=\"toggle()\"\n  [attr.aria-expanded]=\"open\"\n  [attr.aria-controls]=\"contentId\"\n  [id]=\"itemId\"\n  [disabled]=\"disabled\"\n  [attr.aria-disabled]=\"disabled\">\n  <ng-content select=\"[daffAccordionItemTitle]\"></ng-content>\n</button>\n<div class=\"daff-accordion-item__content\" [id]=\"contentId\" [attr.aria-labelledby]=\"itemId\" role=\"region\">\n    <ng-content></ng-content>\n</div>","/* eslint-disable quote-props */\nimport { Directive } from '@angular/core';\n\n/**\n * Used to provide a high level overview of the panel content. It should be wrapped by a `<daff-accordion-item>`.\n *\n * @example\n * ```html\n * <div daffAccordionItemTitle>Title</div>\n * ```\n */\n@Directive({\n  selector: '[daffAccordionItemTitle]',\n  host: {\n    'class': 'daff-accordion-item__title',\n  },\n})\nexport class DaffAccordionItemTitleDirective {}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DaffAccordionComponent } from './accordion/accordion/accordion.component';\nimport { DaffAccordionItemComponent } from './accordion/accordion-item/accordion-item.component';\nimport { DaffAccordionItemTitleDirective } from './accordion/accordion-item-title/accordion-item-title.directive';\n\n/**\n * @deprecated in favor of {@link DAFF_ACCORDION_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.\n */\n@NgModule({\n  imports: [\n    CommonModule,\n    DaffAccordionComponent,\n    DaffAccordionItemComponent,\n    DaffAccordionItemTitleDirective,\n  ],\n  exports: [\n    DaffAccordionComponent,\n    DaffAccordionItemComponent,\n    DaffAccordionItemTitleDirective,\n  ],\n})\nexport class DaffAccordionModule { }\n","import { DaffAccordionComponent } from './accordion/accordion/accordion.component';\nimport { DaffAccordionItemComponent } from './accordion/accordion-item/accordion-item.component';\nimport { DaffAccordionItemTitleDirective } from './accordion/accordion-item-title/accordion-item-title.directive';\n\n/**\n * @docs-private\n *\n * `DAFF_ACCORDION_COMPONENTS` imports all the available components and directives related to the component.\n */\nexport const DAFF_ACCORDION_COMPONENTS = <const> [\n  DaffAccordionComponent,\n  DaffAccordionItemComponent,\n  DaffAccordionItemTitleDirective,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"daffodil-design-accordion.mjs","sources":["../../../libs/design/accordion/src/accordion/accordion/accordion.component.ts","../../../libs/design/accordion/src/accordion/accordion-item/accordion-item.component.ts","../../../libs/design/accordion/src/accordion/accordion-item/accordion-item.component.html","../../../libs/design/accordion/src/accordion/accordion-item-title/accordion-item-title.directive.ts","../../../libs/design/accordion/src/accordion.module.ts","../../../libs/design/accordion/src/accordion.ts","../../../libs/design/accordion/src/daffodil-design-accordion.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\n\nimport { DaffArticleEncapsulatedDirective } from '@daffodil/design';\n\n/**\n * Groups accordion items.\n *\n * @example\n * ```html\n * <daff-accordion>\n *  <daff-accordion-item>\n *    <div daffAccordionItemTitle>Title</div>\n *    <div>Expandable content</div>\n *  </daff-accordion-item>\n *  <daff-accordion-item>\n *    <div daffAccordionItemTitle>Title</div>\n *    <div>Expandable content</div>\n *  </daff-accordion-item>\n * </daff-accordion>\n * ```\n */\n@Component({\n  selector: 'daff-accordion',\n  template: '<ng-content></ng-content>',\n  styles: [`\n    :host {\n      display: block;\n    }\n  `],\n  hostDirectives: [{\n    directive: DaffArticleEncapsulatedDirective,\n  }],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\n\nexport class DaffAccordionComponent {}\n","/* eslint-disable quote-props */\nimport {\n  Component,\n  Input,\n  OnInit,\n  ViewEncapsulation,\n  ChangeDetectionStrategy,\n} from '@angular/core';\n\nimport {\n  DaffDisableableDirective,\n  DaffOpenable,\n  DaffOpenableDirective,\n} from '@daffodil/design';\n\n\nlet daffAccordionItemId = 0;\nlet daffAccordionItemContentId = 0;\n\n/**\n * Contains the title and collapsible content. Handles expansion and collapse on user interaction. All `<daff-accordion-item>`s should be grouped inside a `<daff-accordion>`.\n *\n * @example\n * ```html\n *  <daff-accordion-item>\n *    <div daffAccordionItemTitle>Title</div>\n *    <div>Accordion content</div>\n *  </daff-accordion-item>\n * ```\n */\n@Component({\n  selector: 'daff-accordion-item',\n  templateUrl: './accordion-item.component.html',\n  styleUrls: ['./accordion-item.component.scss'],\n  hostDirectives: [\n    {\n      directive: DaffOpenableDirective,\n      outputs: ['toggled'],\n    },\n    {\n      directive: DaffDisableableDirective,\n      inputs: ['disabled'],\n    },\n  ],\n  host: {\n    'class': 'daff-accordion-item',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DaffAccordionItemComponent implements OnInit, DaffOpenable {\n  /**\n   * The unique id of an accordion item. Defaults to an autogenerated value.\n   */\n  @Input() itemId: string = 'daff-accordion-item' + '-' + ++daffAccordionItemId;\n\n  /**\n   * The unique id of an accordion item content. Defaults to an autogenerated value.\n   */\n  @Input() contentId: string = 'daff-accordion-item-content' + '-' + ++daffAccordionItemContentId;\n\n  /**\n   * Whether or not an accordion item is initially expanded by default.\n   */\n  @Input() initiallyExpanded = false;\n\n  /**\n   * @docs-private\n   *\n   * Internal function to access the disabled property of the DaffDisableableDirective\n   */\n  get disabled() {\n    return this.disabledDirective.disabled;\n  }\n\n  constructor(\n    private openDirective: DaffOpenableDirective,\n    private disabledDirective: DaffDisableableDirective,\n  ) {\n    this.openDirective.stateless = false;\n  }\n\n  /**\n   * @docs-private\n   */\n  ngOnInit() {\n    this.openDirective.open = this.initiallyExpanded ? this.initiallyExpanded : this.openDirective.open;\n  }\n\n  /**\n   * @docs-private\n   */\n  get open() {\n    return this.openDirective.open;\n  }\n\n  /**\n   * Reveals the contents of the accordion item.\n   */\n  reveal() {\n    this.openDirective.reveal();\n  }\n\n  /**\n   * Hides the contents of the accordion item.\n   */\n  hide() {\n    this.openDirective.hide();\n  }\n\n  /**\n   * Toggles the visibility of the contents of the accordion item.\n   */\n  toggle() {\n    this.openDirective.toggle();\n  }\n}\n","<button type=\"button\" class=\"daff-accordion-item__header\"\n  (click)=\"toggle()\"\n  [attr.aria-expanded]=\"open\"\n  [attr.aria-controls]=\"contentId\"\n  [id]=\"itemId\"\n  [disabled]=\"disabled\"\n  [attr.aria-disabled]=\"disabled\">\n  <ng-content select=\"[daffAccordionItemTitle]\"></ng-content>\n</button>\n<div class=\"daff-accordion-item__content\" [id]=\"contentId\" [attr.aria-labelledby]=\"itemId\" role=\"region\">\n    <ng-content></ng-content>\n</div>","/* eslint-disable quote-props */\nimport { Directive } from '@angular/core';\n\n/**\n * Used to provide a high level overview of the panel content. It should be wrapped by a `<daff-accordion-item>`.\n *\n * @example\n * ```html\n * <div daffAccordionItemTitle>Title</div>\n * ```\n */\n@Directive({\n  selector: '[daffAccordionItemTitle]',\n  host: {\n    'class': 'daff-accordion-item__title',\n  },\n})\nexport class DaffAccordionItemTitleDirective {}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DaffAccordionComponent } from './accordion/accordion/accordion.component';\nimport { DaffAccordionItemComponent } from './accordion/accordion-item/accordion-item.component';\nimport { DaffAccordionItemTitleDirective } from './accordion/accordion-item-title/accordion-item-title.directive';\n\n/**\n * @deprecated in favor of {@link DAFF_ACCORDION_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.\n */\n@NgModule({\n  imports: [\n    CommonModule,\n    DaffAccordionComponent,\n    DaffAccordionItemComponent,\n    DaffAccordionItemTitleDirective,\n  ],\n  exports: [\n    DaffAccordionComponent,\n    DaffAccordionItemComponent,\n    DaffAccordionItemTitleDirective,\n  ],\n})\nexport class DaffAccordionModule { }\n","import { DaffAccordionComponent } from './accordion/accordion/accordion.component';\nimport { DaffAccordionItemComponent } from './accordion/accordion-item/accordion-item.component';\nimport { DaffAccordionItemTitleDirective } from './accordion/accordion-item-title/accordion-item-title.directive';\n\n/**\n * @docs-private\n *\n * `DAFF_ACCORDION_COMPONENTS` imports all the available components and directives related to the component.\n */\nexport const DAFF_ACCORDION_COMPONENTS = <const> [\n  DaffAccordionComponent,\n  DaffAccordionItemComponent,\n  DaffAccordionItemTitleDirective,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/daffodil-design-article.mjs

@@ -1,22 +1,146 @@
 import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { ChangeDetectionStrategy, ViewEncapsulation, Component, Directive, NgModule } from '@angular/core';
+import { input, signal, inject, NgZone, ChangeDetectionStrategy, Component, Injectable, ElementRef, ViewContainerRef, afterEveryRender, DestroyRef, ViewEncapsulation, Directive, NgModule } from '@angular/core';
+import { FaIconComponent } from '@fortawesome/angular-fontawesome';
+import { faCopy, faCheck } from '@fortawesome/free-solid-svg-icons';
+import * as i1 from '@daffodil/design/button';
+import { DAFF_ICON_BUTTON_COMPONENTS } from '@daffodil/design/button';
+
+/**
+ * DaffArticleCopyButtonComponent is a button that copies text content to the clipboard.
+ * It provides visual feedback by changing the icon when content is successfully copied.
+ *
+ * @example
+ * ```html
+ * <daff-article-copy-button [content]="codeSnippet" />
+ * ```
+ */
+class DaffArticleCopyButtonComponent {
+    constructor() {
+        // Content to be copied to clipboard
+        this.content = input.required(...(ngDevMode ? [{ debugName: "content" }] : []));
+        this.copied = signal(false, ...(ngDevMode ? [{ debugName: "copied" }] : []));
+        this.faCopy = faCopy; // default copy icon
+        this.faCheck = faCheck; // check icon for copied state
+        this._ngZone = inject(NgZone);
+    }
+    ngOnDestroy() {
+        if (this.timeoutId) {
+            clearTimeout(this.timeoutId);
+        }
+    }
+    async copyToClipboard() {
+        try {
+            // Write content to clipboard
+            await navigator.clipboard.writeText(this.content());
+            this.copied.set(true);
+            clearTimeout(this.timeoutId);
+            this._ngZone.runOutsideAngular(() => {
+                this.timeoutId = setTimeout(() => {
+                    this._ngZone.run(() => this.copied.set(false));
+                }, 1500);
+            });
+        }
+        catch (err) {
+            console.error('Failed to copy text: ', err);
+        }
+    }
+    get ariaLabel() {
+        return this.copied() ? 'Copied to clipboard' : 'Copy to clipboard';
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffArticleCopyButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: DaffArticleCopyButtonComponent, isStandalone: true, selector: "daff-article-copy-button", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<button\n  daff-icon-button\n  class=\"daff-article__copy-button\"\n  size=\"sm\"\n  type=\"button\"\n  [attr.aria-label]=\"ariaLabel\"\n  (click)=\"copyToClipboard()\">\n  @if (copied()) {\n    <fa-icon [icon]=\"faCheck\" />\n  } @else {\n    <fa-icon [icon]=\"faCopy\" />\n  }\n</button>\n", styles: [":host{display:block;position:absolute;top:.25rem;right:.25rem;z-index:1}\n"], dependencies: [{ kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }, { kind: "component", type: i1.DaffIconButtonComponent, selector: "button[daff-icon-button],a[daff-icon-button]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffArticleCopyButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'daff-article-copy-button', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        FaIconComponent,
+                        DAFF_ICON_BUTTON_COMPONENTS,
+                    ], template: "<button\n  daff-icon-button\n  class=\"daff-article__copy-button\"\n  size=\"sm\"\n  type=\"button\"\n  [attr.aria-label]=\"ariaLabel\"\n  (click)=\"copyToClipboard()\">\n  @if (copied()) {\n    <fa-icon [icon]=\"faCheck\" />\n  } @else {\n    <fa-icon [icon]=\"faCopy\" />\n  }\n</button>\n", styles: [":host{display:block;position:absolute;top:.25rem;right:.25rem;z-index:1}\n"] }]
+        }] });
+
+class DaffArticleCopyButtonService {
+    constructor() {
+        this.buttons = [];
+    }
+    /**
+     * Finds all code blocks and adds copy buttons to them.
+     * Skips code blocks with the `nocopy` attribute.
+     * @param hostElement - The host element to search for code blocks.
+     * @param viewContainerRef - The view container to create the copy button components.
+     */
+    addCopyButtonsToCodeBlocks(hostElement, viewContainerRef) {
+        const codeBlocks = hostElement.querySelectorAll('pre');
+        codeBlocks.forEach((pre) => {
+            const code = pre.querySelector('code');
+            if (!code) {
+                return;
+            }
+            // Skip if nocopy attribute is present
+            if (pre.hasAttribute('nocopy')) {
+                return;
+            }
+            // Skip if already has a copy button
+            if (pre.querySelector('daff-article-copy-button')) {
+                return;
+            }
+            const textContent = code.textContent || '';
+            // Create the copy button component
+            const buttonRef = viewContainerRef.createComponent(DaffArticleCopyButtonComponent);
+            buttonRef.setInput('content', textContent);
+            // Insert button into pre before the code element
+            pre.insertBefore(buttonRef.location.nativeElement, code);
+            this.buttons.push({
+                buttonRef,
+                preElement: pre,
+            });
+        });
+    }
+    /**
+     * Cleanup copy button references
+     */
+    cleanup() {
+        this.buttons.forEach(({ buttonRef }) => {
+            buttonRef.destroy();
+        });
+        this.buttons = [];
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffArticleCopyButtonService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffArticleCopyButtonService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffArticleCopyButtonService, decorators: [{
+            type: Injectable
+        }] });
 
 /* eslint-disable quote-props */
 /**
  * A component for creating articles within your page.
  */
 class DaffArticleComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffArticleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: DaffArticleComponent, isStandalone: true, selector: "daff-article", host: { attributes: { "role": "article" }, classAttribute: "daff-article" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".daff-article{display:block;overflow:hidden}.daff-article a:not(.daff-ae *,.daff-ae){font-weight:500;text-decoration:none}.daff-article a:not(.daff-ae *,.daff-ae):hover{text-decoration:underline}.daff-article a:not(.daff-ae *,.daff-ae) code{font-size:.875rem;font-weight:600;line-height:.875rem}.daff-article h1:not(.daff-ae *,.daff-ae),.daff-article h2:not(.daff-ae *,.daff-ae),.daff-article h3:not(.daff-ae *,.daff-ae),.daff-article h4:not(.daff-ae *,.daff-ae),.daff-article h5:not(.daff-ae *,.daff-ae),.daff-article h6:not(.daff-ae *,.daff-ae){font-weight:600;margin-bottom:1rem;word-wrap:break-word}.daff-article h1:not(.daff-ae *,.daff-ae) code,.daff-article h2:not(.daff-ae *,.daff-ae) code,.daff-article h3:not(.daff-ae *,.daff-ae) code,.daff-article h4:not(.daff-ae *,.daff-ae) code,.daff-article h5:not(.daff-ae *,.daff-ae) code,.daff-article h6:not(.daff-ae *,.daff-ae) code{font-size:.875rem;font-weight:600;line-height:.875rem}.daff-article h1:not(.daff-ae *,.daff-ae){word-break:break-all;font-size:2rem;font-weight:600;line-height:2.25rem}@media (min-width: 768px){.daff-article h1:not(.daff-ae *,.daff-ae){font-size:3rem;line-height:3.5rem}}.daff-article h1:not(.daff-ae *,.daff-ae)+p{font-size:1.125rem;line-height:1.5rem;font-weight:400}.daff-article h1:not(.daff-ae *,.daff-ae)+p code{font-size:1rem;line-height:1rem}@media (min-width: 768px){.daff-article h1:not(.daff-ae *,.daff-ae)+p{font-size:1.25rem;font-weight:400;line-height:1.75rem}}.daff-article h2:not(.daff-ae *,.daff-ae){font-size:1.75rem;line-height:2rem;margin-top:2.5rem}@media (min-width: 768px){.daff-article h2:not(.daff-ae *,.daff-ae){font-size:2rem;line-height:2.5rem}}.daff-article h3:not(.daff-ae *,.daff-ae){font-size:1.5rem;line-height:2rem;margin-top:2.5rem}.daff-article h4:not(.daff-ae *,.daff-ae){font-size:1.25rem;line-height:1.5rem;margin-top:2rem}.daff-article h5:not(.daff-ae *,.daff-ae){font-size:1.125rem;font-weight:600;line-height:1.5rem;margin-top:1.5rem}.daff-article h6:not(.daff-ae *,.daff-ae){font-size:1rem;font-weight:600;line-height:1.5rem;margin-top:1.5rem}.daff-article p:not(.daff-ae *,.daff-ae){margin:0 0 1rem}.daff-article strong{font-weight:600}.daff-article pre{border-radius:.25rem;font-size:.875rem;line-height:1.5rem;margin:1.5rem 0;padding:1.5rem;overflow-x:auto}.daff-article pre:last-child{margin-bottom:0}.daff-article pre code{padding:0}.daff-article code{border-radius:.25rem;font-size:.875rem;line-height:1rem;padding:.125rem .25rem}.daff-article__meta{font-size:.875rem}.daff-article hr{border:0;height:1px;margin:2rem 0}.daff-article blockquote{border-radius:.25rem;margin:1.5rem 0;padding:1rem}@media (min-width: 768px){.daff-article blockquote{padding:1rem 1.5rem}}.daff-article blockquote:last-child{margin-bottom:0}.daff-article blockquote cite{font-size:.875rem;font-weight:400;line-height:1.25rem;display:block;margin-top:1rem}.daff-article blockquote p:last-of-type{margin:0}.daff-article table{display:table;border-collapse:separate;border-spacing:0;border-radius:.25rem;font-size:1rem;line-height:1.25rem;margin:1.5rem 0;overflow:hidden}.daff-article table:last-child{margin-bottom:0}.daff-article table th{font-weight:600;outline:0;padding:1rem;text-align:left;vertical-align:top;box-sizing:border-box}.daff-article table td{padding:1rem;vertical-align:top;box-sizing:border-box}.daff-article table td p:only-child,.daff-article table td p:last-child{margin:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    constructor(copyButtonService) {
+        this.copyButtonService = copyButtonService;
+        const elementRef = inject((ElementRef));
+        const viewContainerRef = inject(ViewContainerRef);
+        afterEveryRender({
+            write: () => {
+                this.copyButtonService.addCopyButtonsToCodeBlocks(elementRef.nativeElement, viewContainerRef);
+            },
+        });
+        const destroyRef = inject(DestroyRef);
+        destroyRef.onDestroy(() => {
+            this.copyButtonService.cleanup();
+        });
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffArticleComponent, deps: [{ token: DaffArticleCopyButtonService }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: DaffArticleComponent, isStandalone: true, selector: "daff-article", host: { attributes: { "role": "article" }, classAttribute: "daff-article" }, providers: [DaffArticleCopyButtonService], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".daff-article{display:block;overflow:hidden}.daff-article a:not(.daff-ae *,.daff-ae){font-weight:500;text-decoration:none}.daff-article a:not(.daff-ae *,.daff-ae):hover{text-decoration:underline}.daff-article a:not(.daff-ae *,.daff-ae) code{font-size:.875rem;font-weight:600;line-height:.875rem}.daff-article h1:not(.daff-ae *,.daff-ae),.daff-article h2:not(.daff-ae *,.daff-ae),.daff-article h3:not(.daff-ae *,.daff-ae),.daff-article h4:not(.daff-ae *,.daff-ae),.daff-article h5:not(.daff-ae *,.daff-ae),.daff-article h6:not(.daff-ae *,.daff-ae){font-weight:600;margin-bottom:1rem;word-wrap:break-word}.daff-article h1:not(.daff-ae *,.daff-ae) code,.daff-article h2:not(.daff-ae *,.daff-ae) code,.daff-article h3:not(.daff-ae *,.daff-ae) code,.daff-article h4:not(.daff-ae *,.daff-ae) code,.daff-article h5:not(.daff-ae *,.daff-ae) code,.daff-article h6:not(.daff-ae *,.daff-ae) code{font-size:.875rem;font-weight:600;line-height:.875rem}.daff-article h1:not(.daff-ae *,.daff-ae){word-break:break-all;font-size:2rem;font-weight:600;line-height:2.25rem}@media (min-width: 768px){.daff-article h1:not(.daff-ae *,.daff-ae){font-size:3rem;line-height:3.5rem}}.daff-article h1:not(.daff-ae *,.daff-ae)+p{font-size:1.125rem;line-height:1.5rem;font-weight:400}.daff-article h1:not(.daff-ae *,.daff-ae)+p code{font-size:1rem;line-height:1rem}@media (min-width: 768px){.daff-article h1:not(.daff-ae *,.daff-ae)+p{font-size:1.25rem;font-weight:400;line-height:1.75rem}}.daff-article h2:not(.daff-ae *,.daff-ae){font-size:1.75rem;line-height:2rem;margin-top:2.5rem}@media (min-width: 768px){.daff-article h2:not(.daff-ae *,.daff-ae){font-size:2rem;line-height:2.5rem}}.daff-article h3:not(.daff-ae *,.daff-ae){font-size:1.5rem;line-height:2rem;margin-top:2.5rem}.daff-article h4:not(.daff-ae *,.daff-ae){font-size:1.25rem;line-height:1.5rem;margin-top:2rem}.daff-article h5:not(.daff-ae *,.daff-ae){font-size:1.125rem;font-weight:600;line-height:1.5rem;margin-top:1.5rem}.daff-article h6:not(.daff-ae *,.daff-ae){font-size:1rem;font-weight:600;line-height:1.5rem;margin-top:1.5rem}.daff-article p:not(.daff-ae *,.daff-ae){margin:0 0 1rem}.daff-article strong{font-weight:600}.daff-article pre{border-radius:.25rem;position:relative}.daff-article pre:last-child{margin-bottom:0}.daff-article pre code{display:block;line-height:1.5rem;font-size:.875rem;overflow-x:auto;padding:1.5rem}.daff-article code{border-radius:.25rem;font-size:.875rem;line-height:1rem;padding:.125rem .25rem}.daff-article__meta{font-size:.875rem}.daff-article hr{border:0;height:1px;margin:2rem 0}.daff-article blockquote{border-radius:.25rem;margin:1.5rem 0;padding:1rem}@media (min-width: 768px){.daff-article blockquote{padding:1rem 1.5rem}}.daff-article blockquote:last-child{margin-bottom:0}.daff-article blockquote cite{font-size:.875rem;font-weight:400;line-height:1.25rem;display:block;margin-top:1rem}.daff-article blockquote p:last-of-type{margin:0}.daff-article table{display:table;border-collapse:separate;border-spacing:0;border-radius:.25rem;font-size:1rem;line-height:1.25rem;margin:1.5rem 0;overflow:hidden}.daff-article table:last-child{margin-bottom:0}.daff-article table th{font-weight:600;outline:0;padding:1rem;text-align:left;vertical-align:top;box-sizing:border-box}.daff-article table td{padding:1rem;vertical-align:top;box-sizing:border-box}.daff-article table td p:only-child,.daff-article table td p:last-child{margin:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffArticleComponent, decorators: [{
             type: Component,
             args: [{ selector: 'daff-article', template: '<ng-content></ng-content>', host: {
                         'class': 'daff-article',
                         'role': 'article',
-                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".daff-article{display:block;overflow:hidden}.daff-article a:not(.daff-ae *,.daff-ae){font-weight:500;text-decoration:none}.daff-article a:not(.daff-ae *,.daff-ae):hover{text-decoration:underline}.daff-article a:not(.daff-ae *,.daff-ae) code{font-size:.875rem;font-weight:600;line-height:.875rem}.daff-article h1:not(.daff-ae *,.daff-ae),.daff-article h2:not(.daff-ae *,.daff-ae),.daff-article h3:not(.daff-ae *,.daff-ae),.daff-article h4:not(.daff-ae *,.daff-ae),.daff-article h5:not(.daff-ae *,.daff-ae),.daff-article h6:not(.daff-ae *,.daff-ae){font-weight:600;margin-bottom:1rem;word-wrap:break-word}.daff-article h1:not(.daff-ae *,.daff-ae) code,.daff-article h2:not(.daff-ae *,.daff-ae) code,.daff-article h3:not(.daff-ae *,.daff-ae) code,.daff-article h4:not(.daff-ae *,.daff-ae) code,.daff-article h5:not(.daff-ae *,.daff-ae) code,.daff-article h6:not(.daff-ae *,.daff-ae) code{font-size:.875rem;font-weight:600;line-height:.875rem}.daff-article h1:not(.daff-ae *,.daff-ae){word-break:break-all;font-size:2rem;font-weight:600;line-height:2.25rem}@media (min-width: 768px){.daff-article h1:not(.daff-ae *,.daff-ae){font-size:3rem;line-height:3.5rem}}.daff-article h1:not(.daff-ae *,.daff-ae)+p{font-size:1.125rem;line-height:1.5rem;font-weight:400}.daff-article h1:not(.daff-ae *,.daff-ae)+p code{font-size:1rem;line-height:1rem}@media (min-width: 768px){.daff-article h1:not(.daff-ae *,.daff-ae)+p{font-size:1.25rem;font-weight:400;line-height:1.75rem}}.daff-article h2:not(.daff-ae *,.daff-ae){font-size:1.75rem;line-height:2rem;margin-top:2.5rem}@media (min-width: 768px){.daff-article h2:not(.daff-ae *,.daff-ae){font-size:2rem;line-height:2.5rem}}.daff-article h3:not(.daff-ae *,.daff-ae){font-size:1.5rem;line-height:2rem;margin-top:2.5rem}.daff-article h4:not(.daff-ae *,.daff-ae){font-size:1.25rem;line-height:1.5rem;margin-top:2rem}.daff-article h5:not(.daff-ae *,.daff-ae){font-size:1.125rem;font-weight:600;line-height:1.5rem;margin-top:1.5rem}.daff-article h6:not(.daff-ae *,.daff-ae){font-size:1rem;font-weight:600;line-height:1.5rem;margin-top:1.5rem}.daff-article p:not(.daff-ae *,.daff-ae){margin:0 0 1rem}.daff-article strong{font-weight:600}.daff-article pre{border-radius:.25rem;font-size:.875rem;line-height:1.5rem;margin:1.5rem 0;padding:1.5rem;overflow-x:auto}.daff-article pre:last-child{margin-bottom:0}.daff-article pre code{padding:0}.daff-article code{border-radius:.25rem;font-size:.875rem;line-height:1rem;padding:.125rem .25rem}.daff-article__meta{font-size:.875rem}.daff-article hr{border:0;height:1px;margin:2rem 0}.daff-article blockquote{border-radius:.25rem;margin:1.5rem 0;padding:1rem}@media (min-width: 768px){.daff-article blockquote{padding:1rem 1.5rem}}.daff-article blockquote:last-child{margin-bottom:0}.daff-article blockquote cite{font-size:.875rem;font-weight:400;line-height:1.25rem;display:block;margin-top:1rem}.daff-article blockquote p:last-of-type{margin:0}.daff-article table{display:table;border-collapse:separate;border-spacing:0;border-radius:.25rem;font-size:1rem;line-height:1.25rem;margin:1.5rem 0;overflow:hidden}.daff-article table:last-child{margin-bottom:0}.daff-article table th{font-weight:600;outline:0;padding:1rem;text-align:left;vertical-align:top;box-sizing:border-box}.daff-article table td{padding:1rem;vertical-align:top;box-sizing:border-box}.daff-article table td p:only-child,.daff-article table td p:last-child{margin:0}\n"] }]
-        }] });
+                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [DaffArticleCopyButtonService], styles: [".daff-article{display:block;overflow:hidden}.daff-article a:not(.daff-ae *,.daff-ae){font-weight:500;text-decoration:none}.daff-article a:not(.daff-ae *,.daff-ae):hover{text-decoration:underline}.daff-article a:not(.daff-ae *,.daff-ae) code{font-size:.875rem;font-weight:600;line-height:.875rem}.daff-article h1:not(.daff-ae *,.daff-ae),.daff-article h2:not(.daff-ae *,.daff-ae),.daff-article h3:not(.daff-ae *,.daff-ae),.daff-article h4:not(.daff-ae *,.daff-ae),.daff-article h5:not(.daff-ae *,.daff-ae),.daff-article h6:not(.daff-ae *,.daff-ae){font-weight:600;margin-bottom:1rem;word-wrap:break-word}.daff-article h1:not(.daff-ae *,.daff-ae) code,.daff-article h2:not(.daff-ae *,.daff-ae) code,.daff-article h3:not(.daff-ae *,.daff-ae) code,.daff-article h4:not(.daff-ae *,.daff-ae) code,.daff-article h5:not(.daff-ae *,.daff-ae) code,.daff-article h6:not(.daff-ae *,.daff-ae) code{font-size:.875rem;font-weight:600;line-height:.875rem}.daff-article h1:not(.daff-ae *,.daff-ae){word-break:break-all;font-size:2rem;font-weight:600;line-height:2.25rem}@media (min-width: 768px){.daff-article h1:not(.daff-ae *,.daff-ae){font-size:3rem;line-height:3.5rem}}.daff-article h1:not(.daff-ae *,.daff-ae)+p{font-size:1.125rem;line-height:1.5rem;font-weight:400}.daff-article h1:not(.daff-ae *,.daff-ae)+p code{font-size:1rem;line-height:1rem}@media (min-width: 768px){.daff-article h1:not(.daff-ae *,.daff-ae)+p{font-size:1.25rem;font-weight:400;line-height:1.75rem}}.daff-article h2:not(.daff-ae *,.daff-ae){font-size:1.75rem;line-height:2rem;margin-top:2.5rem}@media (min-width: 768px){.daff-article h2:not(.daff-ae *,.daff-ae){font-size:2rem;line-height:2.5rem}}.daff-article h3:not(.daff-ae *,.daff-ae){font-size:1.5rem;line-height:2rem;margin-top:2.5rem}.daff-article h4:not(.daff-ae *,.daff-ae){font-size:1.25rem;line-height:1.5rem;margin-top:2rem}.daff-article h5:not(.daff-ae *,.daff-ae){font-size:1.125rem;font-weight:600;line-height:1.5rem;margin-top:1.5rem}.daff-article h6:not(.daff-ae *,.daff-ae){font-size:1rem;font-weight:600;line-height:1.5rem;margin-top:1.5rem}.daff-article p:not(.daff-ae *,.daff-ae){margin:0 0 1rem}.daff-article strong{font-weight:600}.daff-article pre{border-radius:.25rem;position:relative}.daff-article pre:last-child{margin-bottom:0}.daff-article pre code{display:block;line-height:1.5rem;font-size:.875rem;overflow-x:auto;padding:1.5rem}.daff-article code{border-radius:.25rem;font-size:.875rem;line-height:1rem;padding:.125rem .25rem}.daff-article__meta{font-size:.875rem}.daff-article hr{border:0;height:1px;margin:2rem 0}.daff-article blockquote{border-radius:.25rem;margin:1.5rem 0;padding:1rem}@media (min-width: 768px){.daff-article blockquote{padding:1rem 1.5rem}}.daff-article blockquote:last-child{margin-bottom:0}.daff-article blockquote cite{font-size:.875rem;font-weight:400;line-height:1.25rem;display:block;margin-top:1rem}.daff-article blockquote p:last-of-type{margin:0}.daff-article table{display:table;border-collapse:separate;border-spacing:0;border-radius:.25rem;font-size:1rem;line-height:1.25rem;margin:1.5rem 0;overflow:hidden}.daff-article table:last-child{margin-bottom:0}.daff-article table th{font-weight:600;outline:0;padding:1rem;text-align:left;vertical-align:top;box-sizing:border-box}.daff-article table td{padding:1rem;vertical-align:top;box-sizing:border-box}.daff-article table td p:only-child,.daff-article table td p:last-child{margin:0}\n"] }]
+        }], ctorParameters: () => [{ type: DaffArticleCopyButtonService }] });
 
 /* eslint-disable quote-props */
 class DaffArticleMetaDirective {

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

@@ -1 +1 @@
-{"version":3,"file":"daffodil-design-article.mjs","sources":["../../../libs/design/article/src/article/article.component.ts","../../../libs/design/article/src/article-meta/article-meta.directive.ts","../../../libs/design/article/src/article.module.ts","../../../libs/design/article/src/article.ts","../../../libs/design/article/src/daffodil-design-article.ts"],"sourcesContent":["/* eslint-disable quote-props */\nimport {\n  Component,\n  ViewEncapsulation,\n  ChangeDetectionStrategy,\n} from '@angular/core';\n\n/**\n * A component for creating articles within your page.\n */\n@Component({\n  selector: 'daff-article',\n  template: '<ng-content></ng-content>',\n  styleUrls: ['./article.component.scss'],\n  host: {\n    'class': 'daff-article',\n    'role': 'article',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DaffArticleComponent {}\n","/* eslint-disable quote-props */\nimport { Directive } from '@angular/core';\n\n@Directive({\n  selector: '[daffArticleMeta]',\n  host: {\n    'class': 'daff-article__meta',\n  },\n})\nexport class DaffArticleMetaDirective {}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DaffArticleComponent } from './article/article.component';\nimport { DaffArticleMetaDirective } from './article-meta/article-meta.directive';\n\n/**\n * @deprecated in favor of {@link DAFF_ARTICLE_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.\n */\n@NgModule({\n  imports: [\n    CommonModule,\n    DaffArticleComponent,\n    DaffArticleMetaDirective,\n  ],\n  exports: [\n    DaffArticleComponent,\n    DaffArticleMetaDirective,\n  ],\n})\nexport class DaffArticleModule { }\n","import { DaffArticleComponent } from './article/article.component';\nimport { DaffArticleMetaDirective } from './article-meta/article-meta.directive';\n\n/**\n * @docs-private\n */\nexport const DAFF_ARTICLE_COMPONENTS = <const> [\n  DaffArticleComponent,\n  DaffArticleMetaDirective,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAAA;AAOA;;AAEG;MAYU,oBAAoB,CAAA;iIAApB,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,qJATrB,2BAA2B,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,+0GAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAS1B,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAXhC,SAAS;+BACE,cAAc,EAAA,QAAA,EACd,2BAA2B,EAAA,IAAA,EAE/B;AACJ,wBAAA,OAAO,EAAE,cAAc;AACvB,wBAAA,MAAM,EAAE,SAAS;AAClB,qBAAA,EAAA,aAAA,EACc,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,+0GAAA,CAAA,EAAA;;;ACnBjD;MASa,wBAAwB,CAAA;iIAAxB,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;qHAAxB,wBAAwB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,oBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAxB,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBANpC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,mBAAmB;AAC7B,oBAAA,IAAI,EAAE;AACJ,wBAAA,OAAO,EAAE,oBAAoB;AAC9B,qBAAA;AACF,iBAAA;;;ACFD;;AAEG;MAYU,iBAAiB,CAAA;iIAAjB,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAjB,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,iBAAiB,YAT1B,YAAY;YACZ,oBAAoB;AACpB,YAAA,wBAAwB,aAGxB,oBAAoB;YACpB,wBAAwB,CAAA,EAAA,CAAA,CAAA;AAGf,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,iBAAiB,YAT1B,YAAY,CAAA,EAAA,CAAA,CAAA;;2FASH,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAX7B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE;wBACP,YAAY;wBACZ,oBAAoB;wBACpB,wBAAwB;AACzB,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,oBAAoB;wBACpB,wBAAwB;AACzB,qBAAA;AACF,iBAAA;;;AChBD;;AAEG;AACI,MAAM,uBAAuB,GAAW;IAC7C,oBAAoB;IACpB,wBAAwB;;;ACR1B;;AAEG;;;;"}
+{"version":3,"file":"daffodil-design-article.mjs","sources":["../../../libs/design/article/src/article-copy-button/copy-button/copy-button.component.ts","../../../libs/design/article/src/article-copy-button/copy-button/copy-button.component.html","../../../libs/design/article/src/article-copy-button/service/copy-button.service.ts","../../../libs/design/article/src/article/article.component.ts","../../../libs/design/article/src/article-meta/article-meta.directive.ts","../../../libs/design/article/src/article.module.ts","../../../libs/design/article/src/article.ts","../../../libs/design/article/src/daffodil-design-article.ts"],"sourcesContent":["import {\n  Component,\n  NgZone,\n  ChangeDetectionStrategy,\n  input,\n  signal,\n  OnDestroy,\n  inject,\n} from '@angular/core';\nimport { FaIconComponent } from '@fortawesome/angular-fontawesome';\nimport {\n  faCheck,\n  faCopy,\n} from '@fortawesome/free-solid-svg-icons';\n\nimport { DAFF_ICON_BUTTON_COMPONENTS } from '@daffodil/design/button';\n\n/**\n * DaffArticleCopyButtonComponent is a button that copies text content to the clipboard.\n * It provides visual feedback by changing the icon when content is successfully copied.\n *\n * @example\n * ```html\n * <daff-article-copy-button [content]=\"codeSnippet\" />\n * ```\n */\n@Component({\n  selector: 'daff-article-copy-button',\n  templateUrl: './copy-button.component.html',\n  styleUrls: ['./copy-button.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    FaIconComponent,\n    DAFF_ICON_BUTTON_COMPONENTS,\n  ],\n})\nexport class DaffArticleCopyButtonComponent implements OnDestroy {\n  private timeoutId?: ReturnType<typeof setTimeout>;\n\n  // Content to be copied to clipboard\n  content = input.required<string>();\n\n  protected copied = signal(false);\n\n  protected readonly faCopy = faCopy; // default copy icon\n  protected readonly faCheck = faCheck; // check icon for copied state\n  private _ngZone = inject(NgZone);\n\n  ngOnDestroy() {\n    if (this.timeoutId) {\n      clearTimeout(this.timeoutId);\n    }\n  }\n\n  async copyToClipboard(): Promise<void> {\n    try {\n      // Write content to clipboard\n      await navigator.clipboard.writeText(this.content());\n      this.copied.set(true);\n      clearTimeout(this.timeoutId);\n      this._ngZone.runOutsideAngular(() => {\n        this.timeoutId = setTimeout(() => {\n          this._ngZone.run(() => this.copied.set(false));\n        }, 1500);\n      });\n    } catch (err) {\n      console.error('Failed to copy text: ', err);\n    }\n  }\n\n  get ariaLabel() {\n    return this.copied() ? 'Copied to clipboard' : 'Copy to clipboard';\n  }\n}\n","<button\n  daff-icon-button\n  class=\"daff-article__copy-button\"\n  size=\"sm\"\n  type=\"button\"\n  [attr.aria-label]=\"ariaLabel\"\n  (click)=\"copyToClipboard()\">\n  @if (copied()) {\n    <fa-icon [icon]=\"faCheck\" />\n  } @else {\n    <fa-icon [icon]=\"faCopy\" />\n  }\n</button>\n","import {\n  Injectable,\n  ComponentRef,\n  ViewContainerRef,\n} from '@angular/core';\n\nimport { DaffArticleCopyButtonComponent } from '../copy-button/copy-button.component';\n\ninterface ButtonEntry {\n  buttonRef: ComponentRef<DaffArticleCopyButtonComponent>;\n  preElement: HTMLPreElement;\n}\n\n@Injectable()\nexport class DaffArticleCopyButtonService {\n  private buttons: Array<ButtonEntry> = [];\n\n  /**\n   * Finds all code blocks and adds copy buttons to them.\n   * Skips code blocks with the `nocopy` attribute.\n   * @param hostElement - The host element to search for code blocks.\n   * @param viewContainerRef - The view container to create the copy button components.\n   */\n  addCopyButtonsToCodeBlocks(\n    hostElement: HTMLElement,\n    viewContainerRef: ViewContainerRef,\n  ): void {\n    const codeBlocks = hostElement.querySelectorAll('pre');\n\n    codeBlocks.forEach((pre: HTMLPreElement) => {\n      const code = pre.querySelector('code');\n      if (!code) {\n        return;\n      }\n\n      // Skip if nocopy attribute is present\n      if (pre.hasAttribute('nocopy')) {\n        return;\n      }\n\n      // Skip if already has a copy button\n      if (pre.querySelector('daff-article-copy-button')) {\n        return;\n      }\n\n      const textContent = code.textContent || '';\n\n      // Create the copy button component\n      const buttonRef = viewContainerRef.createComponent(DaffArticleCopyButtonComponent);\n      buttonRef.setInput('content', textContent);\n\n      // Insert button into pre before the code element\n      pre.insertBefore(buttonRef.location.nativeElement, code);\n\n      this.buttons.push({\n        buttonRef,\n        preElement: pre,\n      });\n    });\n  }\n\n  /**\n   * Cleanup copy button references\n   */\n  cleanup(): void {\n    this.buttons.forEach(({ buttonRef }) => {\n      buttonRef.destroy();\n    });\n    this.buttons = [];\n  }\n}\n","/* eslint-disable quote-props */\nimport {\n  Component,\n  ViewEncapsulation,\n  ChangeDetectionStrategy,\n  ElementRef,\n  ViewContainerRef,\n  inject,\n  DestroyRef,\n  afterEveryRender,\n} from '@angular/core';\n\nimport { DaffArticleCopyButtonService } from '../article-copy-button/service/copy-button.service';\n\n/**\n * A component for creating articles within your page.\n */\n@Component({\n  selector: 'daff-article',\n  template: '<ng-content></ng-content>',\n  styleUrls: ['./article.component.scss'],\n  host: {\n    'class': 'daff-article',\n    'role': 'article',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [DaffArticleCopyButtonService],\n})\nexport class DaffArticleComponent {\n  constructor(\n    private copyButtonService: DaffArticleCopyButtonService,\n  ) {\n    const elementRef = inject(ElementRef<HTMLElement>);\n    const viewContainerRef = inject(ViewContainerRef);\n\n    afterEveryRender({\n      write: () => {\n        this.copyButtonService.addCopyButtonsToCodeBlocks(elementRef.nativeElement, viewContainerRef);\n      },\n    });\n\n    const destroyRef = inject(DestroyRef);\n    destroyRef.onDestroy(() => {\n      this.copyButtonService.cleanup();\n    });\n  }\n}\n","/* eslint-disable quote-props */\nimport { Directive } from '@angular/core';\n\n@Directive({\n  selector: '[daffArticleMeta]',\n  host: {\n    'class': 'daff-article__meta',\n  },\n})\nexport class DaffArticleMetaDirective {}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DaffArticleComponent } from './article/article.component';\nimport { DaffArticleMetaDirective } from './article-meta/article-meta.directive';\n\n/**\n * @deprecated in favor of {@link DAFF_ARTICLE_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.\n */\n@NgModule({\n  imports: [\n    CommonModule,\n    DaffArticleComponent,\n    DaffArticleMetaDirective,\n  ],\n  exports: [\n    DaffArticleComponent,\n    DaffArticleMetaDirective,\n  ],\n})\nexport class DaffArticleModule { }\n","import { DaffArticleComponent } from './article/article.component';\nimport { DaffArticleMetaDirective } from './article-meta/article-meta.directive';\n\n/**\n * @docs-private\n */\nexport const DAFF_ARTICLE_COMPONENTS = <const> [\n  DaffArticleComponent,\n  DaffArticleMetaDirective,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1.DaffArticleCopyButtonService"],"mappings":"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"}

package/fesm2022/daffodil-design-button.mjs

@@ -3,7 +3,7 @@ import * as i0 from '@angular/core';
 import { Directive, Input, ContentChild, ChangeDetectionStrategy, ViewEncapsulation, Component, HostBinding, NgModule } from '@angular/core';
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import * as i2 from '@daffodil/design';
-import { DaffSizableDirective, DaffPrefixDirective, DaffSuffixDirective, DaffArticleEncapsulatedDirective, DaffStatusableDirective, DaffColorableDirective } from '@daffodil/design';
+import { DaffSizableDirective, DaffPrefixDirective, DaffSuffixDirective, DaffArticleEncapsulatedDirective, DaffStatusableDirective, DaffColorableDirective, DaffDisableableDirective } from '@daffodil/design';
 
 class DaffButtonSizableDirective extends DaffSizableDirective {
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffButtonSizableDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
@@ -15,13 +15,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
         }] });
 
 class DaffButtonBaseDirective {
-    constructor(size) {
+    constructor(size, disabledDirective) {
         this.size = size;
+        this.disabledDirective = disabledDirective;
         /**
          * Sets the tabindex.
          */
         this.tabindex = 0;
-        this._disabled = false;
         /**
          * Sets the default size of a button to medium.
          */
@@ -31,13 +31,13 @@ class DaffButtonBaseDirective {
      * The disabled state of the button.
      */
     get disabled() {
-        return this._disabled;
+        return this.disabledDirective.disabled;
     }
     set disabled(value) {
-        this._disabled = coerceBooleanProperty(value);
+        this.disabledDirective.disabled = coerceBooleanProperty(value);
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffButtonBaseDirective, deps: [{ token: DaffButtonSizableDirective }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.1", type: DaffButtonBaseDirective, isStandalone: true, selector: "[daffButtonBase]", inputs: { tabindex: "tabindex", disabled: "disabled" }, host: { properties: { "class.disabled": "disabled", "attr.disabled": "disabled ? true : null", "attr.aria-disabled": "disabled ? true : null", "attr.tabindex": "disabled ? -1 : this.tabindex" } }, queries: [{ propertyName: "_prefix", first: true, predicate: DaffPrefixDirective, descendants: true, static: true }, { propertyName: "_suffix", first: true, predicate: DaffSuffixDirective, descendants: true, static: true }], hostDirectives: [{ directive: i2.DaffArticleEncapsulatedDirective }, { directive: DaffButtonSizableDirective, inputs: ["size", "size"] }, { directive: i2.DaffStatusableDirective, inputs: ["status", "status"] }, { directive: i2.DaffColorableDirective, inputs: ["color", "color"] }], ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffButtonBaseDirective, deps: [{ token: DaffButtonSizableDirective }, { token: i2.DaffDisableableDirective }], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.1", type: DaffButtonBaseDirective, isStandalone: true, selector: "[daffButtonBase]", inputs: { tabindex: "tabindex", disabled: "disabled" }, host: { properties: { "class.disabled": "disabled", "attr.disabled": "disabled ? true : null", "attr.aria-disabled": "disabled ? true : null", "attr.tabindex": "disabled ? -1 : this.tabindex" } }, queries: [{ propertyName: "_prefix", first: true, predicate: DaffPrefixDirective, descendants: true, static: true }, { propertyName: "_suffix", first: true, predicate: DaffSuffixDirective, descendants: true, static: true }], hostDirectives: [{ directive: i2.DaffArticleEncapsulatedDirective }, { directive: DaffButtonSizableDirective, inputs: ["size", "size"] }, { directive: i2.DaffStatusableDirective, inputs: ["status", "status"] }, { directive: i2.DaffColorableDirective, inputs: ["color", "color"] }, { directive: i2.DaffDisableableDirective, inputs: ["disabled", "disabled"] }], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffButtonBaseDirective, decorators: [{
             type: Directive,
@@ -57,6 +57,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
                             directive: DaffColorableDirective,
                             inputs: ['color'],
                         },
+                        {
+                            directive: DaffDisableableDirective,
+                            inputs: ['disabled'],
+                        },
                     ],
                     host: {
                         '[class.disabled]': 'disabled',
@@ -65,7 +69,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
                         '[attr.tabindex]': 'disabled ? -1 : this.tabindex',
                     },
                 }]
-        }], ctorParameters: () => [{ type: DaffButtonSizableDirective }], propDecorators: { _prefix: [{
+        }], ctorParameters: () => [{ type: DaffButtonSizableDirective }, { type: i2.DaffDisableableDirective }], propDecorators: { _prefix: [{
                 type: ContentChild,
                 args: [DaffPrefixDirective, { static: true }]
             }], _suffix: [{
@@ -105,14 +109,14 @@ class DaffButtonComponent extends DaffButtonBaseDirective {
         this.elevated = false;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: DaffButtonComponent, isStandalone: true, selector: "button[daff-button],a[daff-button]", inputs: { elevated: "elevated" }, host: { properties: { "class.elevated": "elevated" }, classAttribute: "daff-button" }, usesInheritance: true, ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none}.daff-button[disabled],.daff-button.disabled{cursor:not-allowed;opacity:.5}.daff-button .daff-button__content,.daff-button .daff-prefix,.daff-button .daff-suffix{z-index:1}.daff-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-button:not(.daff-button[disabled],.daff-button.disabled):after{content:\"\";border-radius:4px;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-button:not(.daff-button[disabled],.daff-button.disabled):hover:after,.daff-button:not(.daff-button[disabled],.daff-button.disabled):active:after{opacity:1}.daff-button.elevated{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}.daff-button.elevated:hover{box-shadow:0 6px 12px #00000014,0 4px 6px #0000000a}.daff-button.elevated[disabled]:hover,.daff-button.elevated.disabled:hover{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}.daff-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: DaffButtonComponent, isStandalone: true, selector: "button[daff-button],a[daff-button]", inputs: { elevated: "elevated" }, host: { properties: { "class.elevated": "elevated" }, classAttribute: "daff-button" }, usesInheritance: true, ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none}.daff-button[disabled],.daff-button.daff-disabled{cursor:not-allowed;opacity:.5}.daff-button .daff-button__content,.daff-button .daff-prefix,.daff-button .daff-suffix{z-index:1}.daff-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-button:not(.daff-button[disabled],.daff-button.daff-disabled):after{content:\"\";border-radius:4px;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-button:not(.daff-button[disabled],.daff-button.daff-disabled):hover:after,.daff-button:not(.daff-button[disabled],.daff-button.daff-disabled):active:after{opacity:1}.daff-button.elevated{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}.daff-button.elevated:hover{box-shadow:0 6px 12px #00000014,0 4px 6px #0000000a}.daff-button.elevated[disabled]:hover,.daff-button.elevated.daff-disabled:hover{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}.daff-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'button[daff-button]' + ',' + 'a[daff-button]', host: {
                         'class': 'daff-button',
                         '[class.elevated]': 'elevated',
-                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none}.daff-button[disabled],.daff-button.disabled{cursor:not-allowed;opacity:.5}.daff-button .daff-button__content,.daff-button .daff-prefix,.daff-button .daff-suffix{z-index:1}.daff-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-button:not(.daff-button[disabled],.daff-button.disabled):after{content:\"\";border-radius:4px;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-button:not(.daff-button[disabled],.daff-button.disabled):hover:after,.daff-button:not(.daff-button[disabled],.daff-button.disabled):active:after{opacity:1}.daff-button.elevated{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}.daff-button.elevated:hover{box-shadow:0 6px 12px #00000014,0 4px 6px #0000000a}.daff-button.elevated[disabled]:hover,.daff-button.elevated.disabled:hover{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}.daff-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}\n"] }]
+                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none}.daff-button[disabled],.daff-button.daff-disabled{cursor:not-allowed;opacity:.5}.daff-button .daff-button__content,.daff-button .daff-prefix,.daff-button .daff-suffix{z-index:1}.daff-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-button:not(.daff-button[disabled],.daff-button.daff-disabled):after{content:\"\";border-radius:4px;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-button:not(.daff-button[disabled],.daff-button.daff-disabled):hover:after,.daff-button:not(.daff-button[disabled],.daff-button.daff-disabled):active:after{opacity:1}.daff-button.elevated{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}.daff-button.elevated:hover{box-shadow:0 6px 12px #00000014,0 4px 6px #0000000a}.daff-button.elevated[disabled]:hover,.daff-button.elevated.daff-disabled:hover{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}.daff-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}\n"] }]
         }], propDecorators: { elevated: [{
                 type: Input
             }] } });
@@ -138,13 +142,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
 /* eslint-disable quote-props */
 class DaffFlatButtonComponent extends DaffButtonBaseDirective {
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffFlatButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: DaffFlatButtonComponent, isStandalone: true, selector: "button[daff-flat-button],a[daff-flat-button]", host: { classAttribute: "daff-flat-button" }, usesInheritance: true, ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-flat-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none;background:none;border:none}.daff-flat-button[disabled],.daff-flat-button.disabled{cursor:not-allowed;opacity:.5}.daff-flat-button .daff-button__content,.daff-flat-button .daff-prefix,.daff-flat-button .daff-suffix{z-index:1}.daff-flat-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-flat-button:not(.daff-flat-button[disabled],.daff-flat-button.disabled):after{content:\"\";border-radius:4px;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-flat-button:not(.daff-flat-button[disabled],.daff-flat-button.disabled):hover:after,.daff-flat-button:not(.daff-flat-button[disabled],.daff-flat-button.disabled):active:after{opacity:1}.daff-flat-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-flat-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-flat-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: DaffFlatButtonComponent, isStandalone: true, selector: "button[daff-flat-button],a[daff-flat-button]", host: { classAttribute: "daff-flat-button" }, usesInheritance: true, ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-flat-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none;background:none;border:none}.daff-flat-button[disabled],.daff-flat-button.daff-disabled{cursor:not-allowed;opacity:.5}.daff-flat-button .daff-button__content,.daff-flat-button .daff-prefix,.daff-flat-button .daff-suffix{z-index:1}.daff-flat-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-flat-button:not(.daff-flat-button[disabled],.daff-flat-button.daff-disabled):after{content:\"\";border-radius:4px;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-flat-button:not(.daff-flat-button[disabled],.daff-flat-button.daff-disabled):hover:after,.daff-flat-button:not(.daff-flat-button[disabled],.daff-flat-button.daff-disabled):active:after{opacity:1}.daff-flat-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-flat-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-flat-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffFlatButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'button[daff-flat-button]' + ',' + 'a[daff-flat-button]', host: {
                         'class': 'daff-flat-button',
-                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-flat-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none;background:none;border:none}.daff-flat-button[disabled],.daff-flat-button.disabled{cursor:not-allowed;opacity:.5}.daff-flat-button .daff-button__content,.daff-flat-button .daff-prefix,.daff-flat-button .daff-suffix{z-index:1}.daff-flat-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-flat-button:not(.daff-flat-button[disabled],.daff-flat-button.disabled):after{content:\"\";border-radius:4px;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-flat-button:not(.daff-flat-button[disabled],.daff-flat-button.disabled):hover:after,.daff-flat-button:not(.daff-flat-button[disabled],.daff-flat-button.disabled):active:after{opacity:1}.daff-flat-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-flat-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-flat-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}\n"] }]
+                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-flat-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none;background:none;border:none}.daff-flat-button[disabled],.daff-flat-button.daff-disabled{cursor:not-allowed;opacity:.5}.daff-flat-button .daff-button__content,.daff-flat-button .daff-prefix,.daff-flat-button .daff-suffix{z-index:1}.daff-flat-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-flat-button:not(.daff-flat-button[disabled],.daff-flat-button.daff-disabled):after{content:\"\";border-radius:4px;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-flat-button:not(.daff-flat-button[disabled],.daff-flat-button.daff-disabled):hover:after,.daff-flat-button:not(.daff-flat-button[disabled],.daff-flat-button.daff-disabled):active:after{opacity:1}.daff-flat-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-flat-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-flat-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}\n"] }]
         }] });
 
 /**
@@ -164,13 +168,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
 /* eslint-disable quote-props */
 class DaffIconButtonComponent extends DaffButtonBaseDirective {
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffIconButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: DaffIconButtonComponent, isStandalone: true, selector: "button[daff-icon-button],a[daff-icon-button]", host: { classAttribute: "daff-icon-button" }, usesInheritance: true, ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-icon-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none;background:none;border:0;padding:0}.daff-icon-button[disabled],.daff-icon-button.disabled{cursor:not-allowed;opacity:.5}.daff-icon-button .daff-button__content,.daff-icon-button .daff-prefix,.daff-icon-button .daff-suffix{z-index:1}.daff-icon-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-icon-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;width:2rem}.daff-icon-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;width:3rem}.daff-icon-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;width:3.5rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: DaffIconButtonComponent, isStandalone: true, selector: "button[daff-icon-button],a[daff-icon-button]", host: { classAttribute: "daff-icon-button" }, usesInheritance: true, ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-icon-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none;background:none;border:0;padding:0}.daff-icon-button[disabled],.daff-icon-button.daff-disabled{cursor:not-allowed;opacity:.5}.daff-icon-button .daff-button__content,.daff-icon-button .daff-prefix,.daff-icon-button .daff-suffix{z-index:1}.daff-icon-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-icon-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;width:2rem}.daff-icon-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;width:3rem}.daff-icon-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;width:3.5rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffIconButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'button[daff-icon-button]' + ',' + 'a[daff-icon-button]', host: {
                         'class': 'daff-icon-button',
-                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-icon-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none;background:none;border:0;padding:0}.daff-icon-button[disabled],.daff-icon-button.disabled{cursor:not-allowed;opacity:.5}.daff-icon-button .daff-button__content,.daff-icon-button .daff-prefix,.daff-icon-button .daff-suffix{z-index:1}.daff-icon-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-icon-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;width:2rem}.daff-icon-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;width:3rem}.daff-icon-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;width:3.5rem}\n"] }]
+                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-icon-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none;background:none;border:0;padding:0}.daff-icon-button[disabled],.daff-icon-button.daff-disabled{cursor:not-allowed;opacity:.5}.daff-icon-button .daff-button__content,.daff-icon-button .daff-prefix,.daff-icon-button .daff-suffix{z-index:1}.daff-icon-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-icon-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;width:2rem}.daff-icon-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;width:3rem}.daff-icon-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;width:3.5rem}\n"] }]
         }] });
 
 /**
@@ -202,11 +206,11 @@ class DaffRaisedButtonComponent extends DaffButtonBaseDirective {
         this.class = true;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffRaisedButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: DaffRaisedButtonComponent, isStandalone: true, selector: "button[daff-raised-button],a[daff-raised-button]", host: { properties: { "class.daff-raised-button": "this.class" } }, usesInheritance: true, ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-raised-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none}.daff-raised-button[disabled],.daff-raised-button.disabled{cursor:not-allowed;opacity:.5}.daff-raised-button .daff-button__content,.daff-raised-button .daff-prefix,.daff-raised-button .daff-suffix{z-index:1}.daff-raised-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-raised-button:not(.daff-raised-button[disabled],.daff-raised-button.disabled):after{content:\"\";border-radius:0;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-raised-button:not(.daff-raised-button[disabled],.daff-raised-button.disabled):hover:after,.daff-raised-button:not(.daff-raised-button[disabled],.daff-raised-button.disabled):active:after{opacity:1}.daff-raised-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-raised-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-raised-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: DaffRaisedButtonComponent, isStandalone: true, selector: "button[daff-raised-button],a[daff-raised-button]", host: { properties: { "class.daff-raised-button": "this.class" } }, usesInheritance: true, ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-raised-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none}.daff-raised-button[disabled],.daff-raised-button.daff-disabled{cursor:not-allowed;opacity:.5}.daff-raised-button .daff-button__content,.daff-raised-button .daff-prefix,.daff-raised-button .daff-suffix{z-index:1}.daff-raised-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-raised-button:not(.daff-raised-button[disabled],.daff-raised-button.daff-disabled):after{content:\"\";border-radius:0;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-raised-button:not(.daff-raised-button[disabled],.daff-raised-button.daff-disabled):hover:after,.daff-raised-button:not(.daff-raised-button[disabled],.daff-raised-button.daff-disabled):active:after{opacity:1}.daff-raised-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-raised-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-raised-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffRaisedButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'button[daff-raised-button]' + ',' + 'a[daff-raised-button]', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-raised-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none}.daff-raised-button[disabled],.daff-raised-button.disabled{cursor:not-allowed;opacity:.5}.daff-raised-button .daff-button__content,.daff-raised-button .daff-prefix,.daff-raised-button .daff-suffix{z-index:1}.daff-raised-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-raised-button:not(.daff-raised-button[disabled],.daff-raised-button.disabled):after{content:\"\";border-radius:0;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-raised-button:not(.daff-raised-button[disabled],.daff-raised-button.disabled):hover:after,.daff-raised-button:not(.daff-raised-button[disabled],.daff-raised-button.disabled):active:after{opacity:1}.daff-raised-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-raised-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-raised-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}\n"] }]
+            args: [{ selector: 'button[daff-raised-button]' + ',' + 'a[daff-raised-button]', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-raised-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none}.daff-raised-button[disabled],.daff-raised-button.daff-disabled{cursor:not-allowed;opacity:.5}.daff-raised-button .daff-button__content,.daff-raised-button .daff-prefix,.daff-raised-button .daff-suffix{z-index:1}.daff-raised-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-raised-button:not(.daff-raised-button[disabled],.daff-raised-button.daff-disabled):after{content:\"\";border-radius:0;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-raised-button:not(.daff-raised-button[disabled],.daff-raised-button.daff-disabled):hover:after,.daff-raised-button:not(.daff-raised-button[disabled],.daff-raised-button.daff-disabled):active:after{opacity:1}.daff-raised-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-raised-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-raised-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}\n"] }]
         }], propDecorators: { class: [{
                 type: HostBinding,
                 args: ['class.daff-raised-button']
@@ -240,14 +244,14 @@ class DaffStrokedButtonComponent extends DaffButtonBaseDirective {
         this.elevated = false;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffStrokedButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: DaffStrokedButtonComponent, isStandalone: true, selector: "button[daff-stroked-button],a[daff-stroked-button]", inputs: { elevated: "elevated" }, host: { properties: { "class.elevated": "elevated" }, classAttribute: "daff-stroked-button" }, usesInheritance: true, ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-stroked-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none}.daff-stroked-button[disabled],.daff-stroked-button.disabled{cursor:not-allowed;opacity:.5}.daff-stroked-button .daff-button__content,.daff-stroked-button .daff-prefix,.daff-stroked-button .daff-suffix{z-index:1}.daff-stroked-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-stroked-button:not(.daff-stroked-button[disabled],.daff-stroked-button.disabled):after{content:\"\";border-radius:3px;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-stroked-button:not(.daff-stroked-button[disabled],.daff-stroked-button.disabled):hover:after,.daff-stroked-button:not(.daff-stroked-button[disabled],.daff-stroked-button.disabled):active:after{opacity:1}.daff-stroked-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-stroked-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-stroked-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}.daff-stroked-button.elevated{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}.daff-stroked-button.elevated:hover{box-shadow:0 6px 12px #00000014,0 4px 6px #0000000a}.daff-stroked-button.elevated[disabled]:hover,.daff-stroked-button.elevated.disabled:hover{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: DaffStrokedButtonComponent, isStandalone: true, selector: "button[daff-stroked-button],a[daff-stroked-button]", inputs: { elevated: "elevated" }, host: { properties: { "class.elevated": "elevated" }, classAttribute: "daff-stroked-button" }, usesInheritance: true, ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-stroked-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none}.daff-stroked-button[disabled],.daff-stroked-button.daff-disabled{cursor:not-allowed;opacity:.5}.daff-stroked-button .daff-button__content,.daff-stroked-button .daff-prefix,.daff-stroked-button .daff-suffix{z-index:1}.daff-stroked-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-stroked-button:not(.daff-stroked-button[disabled],.daff-stroked-button.daff-disabled):after{content:\"\";border-radius:3px;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-stroked-button:not(.daff-stroked-button[disabled],.daff-stroked-button.daff-disabled):hover:after,.daff-stroked-button:not(.daff-stroked-button[disabled],.daff-stroked-button.daff-disabled):active:after{opacity:1}.daff-stroked-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-stroked-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-stroked-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}.daff-stroked-button.elevated{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}.daff-stroked-button.elevated:hover{box-shadow:0 6px 12px #00000014,0 4px 6px #0000000a}.daff-stroked-button.elevated[disabled]:hover,.daff-stroked-button.elevated.daff-disabled:hover{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffStrokedButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'button[daff-stroked-button]' + ',' + 'a[daff-stroked-button]', host: {
                         'class': 'daff-stroked-button',
                         '[class.elevated]': 'elevated',
-                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-stroked-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none}.daff-stroked-button[disabled],.daff-stroked-button.disabled{cursor:not-allowed;opacity:.5}.daff-stroked-button .daff-button__content,.daff-stroked-button .daff-prefix,.daff-stroked-button .daff-suffix{z-index:1}.daff-stroked-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-stroked-button:not(.daff-stroked-button[disabled],.daff-stroked-button.disabled):after{content:\"\";border-radius:3px;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-stroked-button:not(.daff-stroked-button[disabled],.daff-stroked-button.disabled):hover:after,.daff-stroked-button:not(.daff-stroked-button[disabled],.daff-stroked-button.disabled):active:after{opacity:1}.daff-stroked-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-stroked-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-stroked-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}.daff-stroked-button.elevated{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}.daff-stroked-button.elevated:hover{box-shadow:0 6px 12px #00000014,0 4px 6px #0000000a}.daff-stroked-button.elevated[disabled]:hover,.daff-stroked-button.elevated.disabled:hover{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}\n"] }]
+                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-stroked-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;text-decoration:none}.daff-stroked-button[disabled],.daff-stroked-button.daff-disabled{cursor:not-allowed;opacity:.5}.daff-stroked-button .daff-button__content,.daff-stroked-button .daff-prefix,.daff-stroked-button .daff-suffix{z-index:1}.daff-stroked-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-stroked-button:not(.daff-stroked-button[disabled],.daff-stroked-button.daff-disabled):after{content:\"\";border-radius:3px;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}.daff-stroked-button:not(.daff-stroked-button[disabled],.daff-stroked-button.daff-disabled):hover:after,.daff-stroked-button:not(.daff-stroked-button[disabled],.daff-stroked-button.daff-disabled):active:after{opacity:1}.daff-stroked-button.daff-sm{font-size:.875rem;line-height:2rem;height:2rem;padding:0 1rem}.daff-stroked-button.daff-md{font-size:1rem;line-height:3rem;height:3rem;padding:0 1.5rem}.daff-stroked-button.daff-lg{font-size:1.25rem;line-height:3.5rem;height:3.5rem;padding:0 1.5rem}.daff-stroked-button.elevated{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}.daff-stroked-button.elevated:hover{box-shadow:0 6px 12px #00000014,0 4px 6px #0000000a}.daff-stroked-button.elevated[disabled]:hover,.daff-stroked-button.elevated.daff-disabled:hover{box-shadow:0 1px 5px -4px #00000080,0 4px 8px #0000000d}\n"] }]
         }], propDecorators: { elevated: [{
                 type: Input
             }] } });
@@ -273,13 +277,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
 /* eslint-disable quote-props */
 class DaffUnderlineButtonComponent extends DaffButtonBaseDirective {
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffUnderlineButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: DaffUnderlineButtonComponent, isStandalone: true, selector: "button[daff-underline-button],a[daff-underline-button]", host: { classAttribute: "daff-underline-button" }, usesInheritance: true, ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-underline-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;background:transparent;border:0;border-radius:0;line-height:1.25rem;overflow:hidden;text-decoration:none;vertical-align:middle}.daff-underline-button[disabled],.daff-underline-button.disabled{cursor:not-allowed;opacity:.5}.daff-underline-button .daff-button__content,.daff-underline-button .daff-prefix,.daff-underline-button .daff-suffix{z-index:1}.daff-underline-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-underline-button[disabled],.daff-underline-button.disabled{cursor:not-allowed}.daff-underline-button[disabled]:hover:after,.daff-underline-button[disabled]:active:after,.daff-underline-button.disabled:hover:after,.daff-underline-button.disabled:active:after{animation:none}.daff-underline-button:after{bottom:0;content:\"\";height:2px;left:0;opacity:1;position:absolute;width:100%}.daff-underline-button:hover:after{animation:none}@media (min-width: 1024px){.daff-underline-button:hover:after{animation:underline-button-hover .7s ease}}.daff-underline-button.daff-sm{font-size:.875rem;height:1.25rem;padding:0 0 .25rem}.daff-underline-button.daff-md{font-size:1rem;height:1.5rem;padding:0 0 .25rem}.daff-underline-button.daff-lg{font-size:1.25rem;height:1.75rem;padding:0 0 .5rem}@keyframes underline-button-hover{0%{transform:translate(0)}50%{transform:translate(100%)}51%{transform:translate(-100%)}to{transform:translate(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: DaffUnderlineButtonComponent, isStandalone: true, selector: "button[daff-underline-button],a[daff-underline-button]", host: { classAttribute: "daff-underline-button" }, usesInheritance: true, ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-underline-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;background:transparent;border:0;border-radius:0;line-height:1.25rem;overflow:hidden;text-decoration:none;vertical-align:middle}.daff-underline-button[disabled],.daff-underline-button.daff-disabled{cursor:not-allowed;opacity:.5}.daff-underline-button .daff-button__content,.daff-underline-button .daff-prefix,.daff-underline-button .daff-suffix{z-index:1}.daff-underline-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-underline-button[disabled],.daff-underline-button.daff-disabled{cursor:not-allowed}.daff-underline-button[disabled]:hover:after,.daff-underline-button[disabled]:active:after,.daff-underline-button.daff-disabled:hover:after,.daff-underline-button.daff-disabled:active:after{animation:none}.daff-underline-button:after{bottom:0;content:\"\";height:2px;left:0;opacity:1;position:absolute;width:100%}.daff-underline-button:hover:after{animation:none}@media (min-width: 1024px){.daff-underline-button:hover:after{animation:underline-button-hover .7s ease}}.daff-underline-button.daff-sm{font-size:.875rem;height:1.25rem;padding:0 0 .25rem}.daff-underline-button.daff-md{font-size:1rem;height:1.5rem;padding:0 0 .25rem}.daff-underline-button.daff-lg{font-size:1.25rem;height:1.75rem;padding:0 0 .5rem}@keyframes underline-button-hover{0%{transform:translate(0)}50%{transform:translate(100%)}51%{transform:translate(-100%)}to{transform:translate(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DaffUnderlineButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'button[daff-underline-button]' + ',' + 'a[daff-underline-button]', host: {
                         'class': 'daff-underline-button',
-                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-underline-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;background:transparent;border:0;border-radius:0;line-height:1.25rem;overflow:hidden;text-decoration:none;vertical-align:middle}.daff-underline-button[disabled],.daff-underline-button.disabled{cursor:not-allowed;opacity:.5}.daff-underline-button .daff-button__content,.daff-underline-button .daff-prefix,.daff-underline-button .daff-suffix{z-index:1}.daff-underline-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-underline-button[disabled],.daff-underline-button.disabled{cursor:not-allowed}.daff-underline-button[disabled]:hover:after,.daff-underline-button[disabled]:active:after,.daff-underline-button.disabled:hover:after,.daff-underline-button.disabled:active:after{animation:none}.daff-underline-button:after{bottom:0;content:\"\";height:2px;left:0;opacity:1;position:absolute;width:100%}.daff-underline-button:hover:after{animation:none}@media (min-width: 1024px){.daff-underline-button:hover:after{animation:underline-button-hover .7s ease}}.daff-underline-button.daff-sm{font-size:.875rem;height:1.25rem;padding:0 0 .25rem}.daff-underline-button.daff-md{font-size:1rem;height:1.5rem;padding:0 0 .25rem}.daff-underline-button.daff-lg{font-size:1.25rem;height:1.75rem;padding:0 0 .5rem}@keyframes underline-button-hover{0%{transform:translate(0)}50%{transform:translate(100%)}51%{transform:translate(-100%)}to{transform:translate(0)}}\n"] }]
+                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<span class=\"daff-button__content\"><ng-content></ng-content></span>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [".daff-underline-button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;gap:.5rem;appearance:none;border:none;border-radius:.25rem;position:relative;text-align:center;background:transparent;border:0;border-radius:0;line-height:1.25rem;overflow:hidden;text-decoration:none;vertical-align:middle}.daff-underline-button[disabled],.daff-underline-button.daff-disabled{cursor:not-allowed;opacity:.5}.daff-underline-button .daff-button__content,.daff-underline-button .daff-prefix,.daff-underline-button .daff-suffix{z-index:1}.daff-underline-button .daff-button__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.daff-underline-button[disabled],.daff-underline-button.daff-disabled{cursor:not-allowed}.daff-underline-button[disabled]:hover:after,.daff-underline-button[disabled]:active:after,.daff-underline-button.daff-disabled:hover:after,.daff-underline-button.daff-disabled:active:after{animation:none}.daff-underline-button:after{bottom:0;content:\"\";height:2px;left:0;opacity:1;position:absolute;width:100%}.daff-underline-button:hover:after{animation:none}@media (min-width: 1024px){.daff-underline-button:hover:after{animation:underline-button-hover .7s ease}}.daff-underline-button.daff-sm{font-size:.875rem;height:1.25rem;padding:0 0 .25rem}.daff-underline-button.daff-md{font-size:1rem;height:1.5rem;padding:0 0 .25rem}.daff-underline-button.daff-lg{font-size:1.25rem;height:1.75rem;padding:0 0 .5rem}@keyframes underline-button-hover{0%{transform:translate(0)}50%{transform:translate(100%)}51%{transform:translate(-100%)}to{transform:translate(0)}}\n"] }]
         }] });
 
 /**