@daffodil/design 0.79.0 → 0.81.0

package/button/src/button/underline/underline-theme.scss

@@ -2,9 +2,7 @@
 @use '../../../../scss/theming';
 @use '../../../../scss/core';
 
-@mixin daff-underline-button-theme-variant(
-	$base-color: currentColor,
-) {
+@mixin daff-underline-button-theme-variant($base-color: currentColor) {
 	color: $base-color;
 
 	&::after {
@@ -13,18 +11,18 @@
 }
 
 @mixin daff-underline-button-theme($theme) {
-	$primary: map.get($theme, primary);
-	$secondary: map.get($theme, secondary);
-	$tertiary: map.get($theme, tertiary);
-	$info: map.get($theme, info);
-	$warn: map.get($theme, warn);
-	$critical: map.get($theme, critical);
-	$success: map.get($theme, success);
-	$base: core.daff-map-deep-get($theme, 'core.base');
-	$base-contrast: core.daff-map-deep-get($theme, 'core.base-contrast');
-	$white: core.daff-map-deep-get($theme, 'core.white');
-	$black: core.daff-map-deep-get($theme, 'core.black');
-	$neutral: core.daff-map-deep-get($theme, 'core.neutral');
+	$primary: core.daff-map-get($theme, primary);
+	$secondary: core.daff-map-get($theme, secondary);
+	$tertiary: core.daff-map-get($theme, tertiary);
+	$info: core.daff-map-get($theme, informational);
+	$warn: core.daff-map-get($theme, warn);
+	$critical: core.daff-map-get($theme, critical);
+	$success: core.daff-map-get($theme, success);
+	$base: core.daff-map-get($theme, 'core', 'base');
+	$base-contrast: core.daff-map-get($theme, 'core', 'base-contrast');
+	$white: core.daff-map-get($theme, 'core', 'white');
+	$black: core.daff-map-get($theme, 'core', 'black');
+	$neutral: core.daff-map-get($theme, 'core', 'neutral');
 
 	.daff-underline-button {
 		@include daff-underline-button-theme-variant(
@@ -73,9 +71,7 @@
 		}
 
 		&.daff-warn {
-			@include daff-underline-button-theme-variant(
-				theming.daff-color($warn)
-			);
+			@include daff-underline-button-theme-variant(theming.daff-color($warn));
 		}
 
 		&.daff-critical {

package/callout/callout.module.d.ts

@@ -6,7 +6,9 @@ import * as i4 from "./callout-title/callout-title.directive";
 import * as i5 from "./callout-subtitle/callout-subtitle.directive";
 import * as i6 from "./callout-tagline/callout-tagline.directive";
 import * as i7 from "./callout-body/callout-body.directive";
-/** @deprecated in favor of {@link DAFF_CALLOUT_COMPONENTS} */
+/**
+ * @deprecated in favor of {@link DAFF_CALLOUT_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.
+ */
 export declare class DaffCalloutModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCalloutModule, never>;
     static ɵmod: i0.ɵɵNgModuleDeclaration<DaffCalloutModule, never, [typeof i1.CommonModule, typeof i2.DaffCalloutComponent, typeof i3.DaffCalloutIconDirective, typeof i4.DaffCalloutTitleDirective, typeof i5.DaffCalloutSubtitleDirective, typeof i6.DaffCalloutTaglineDirective, typeof i7.DaffCalloutBodyDirective], [typeof i2.DaffCalloutComponent, typeof i3.DaffCalloutIconDirective, typeof i5.DaffCalloutSubtitleDirective, typeof i4.DaffCalloutTitleDirective, typeof i6.DaffCalloutTaglineDirective, typeof i7.DaffCalloutBodyDirective]>;

package/callout/src/callout-theme.scss

@@ -8,14 +8,14 @@
 }
 
 @mixin daff-callout-theme($theme) {
-	$primary: map.get($theme, primary);
-	$secondary: map.get($theme, secondary);
-	$tertiary: map.get($theme, tertiary);
-	$neutral: core.daff-map-deep-get($theme, 'core.neutral');
-	$base: core.daff-map-deep-get($theme, 'core.base');
-	$base-contrast: core.daff-map-deep-get($theme, 'core.base-contrast');
-	$white: core.daff-map-deep-get($theme, 'core.white');
-	$black: core.daff-map-deep-get($theme, 'core.black');
+	$primary: core.daff-map-get($theme, primary);
+	$secondary: core.daff-map-get($theme, secondary);
+	$tertiary: core.daff-map-get($theme, tertiary);
+	$neutral: core.daff-map-get($theme, 'core', 'neutral');
+	$base: core.daff-map-get($theme, 'core', 'base');
+	$base-contrast: core.daff-map-get($theme, 'core', 'base-contrast');
+	$white: core.daff-map-get($theme, 'core', 'white');
+	$black: core.daff-map-get($theme, 'core', 'black');
 
 	.daff-callout {
 		@include daff-callout-theme-variant(
@@ -23,21 +23,15 @@
 		);
 
 		&.daff-primary {
-			@include daff-callout-theme-variant(
-				theming.daff-color($primary)
-			);
+			@include daff-callout-theme-variant(theming.daff-color($primary));
 		}
 
 		&.daff-secondary {
-			@include daff-callout-theme-variant(
-				theming.daff-color($secondary)
-			);
+			@include daff-callout-theme-variant(theming.daff-color($secondary));
 		}
 
 		&.daff-tertiary {
-			@include daff-callout-theme-variant(
-				theming.daff-color($tertiary)
-			);
+			@include daff-callout-theme-variant(theming.daff-color($tertiary));
 		}
 
 		&.daff-theme {

package/card/card.module.d.ts

@@ -8,7 +8,7 @@ import * as i6 from "./card-title/card-title.directive";
 import * as i7 from "./card-content/card-content.directive";
 import * as i8 from "./card-actions/card-actions.directive";
 /**
- * @deprecated in favor of {@link DAFF_CARD_COMPONENTS} Deprecated in version 0.78.0. Will be removed in version 0.81.0.
+ * @deprecated in favor of {@link DAFF_CARD_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.
  */
 export declare class DaffCardModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCardModule, never>;

package/card/src/card-theme-variants/linkable-card.scss

@@ -4,7 +4,7 @@
 	$hover-color,
 ) {
 	.daff-card__wrapper {
-		&:after {
+		&::after {
 			background: $hover-color;
 		}
 	}

package/card/src/card-theme.scss

@@ -6,14 +6,14 @@
 @use './card-theme-variants/linkable-card' as linkable;
 
 @mixin daff-card-theme($theme) {
-	$primary: map.get($theme, primary);
-	$secondary: map.get($theme, secondary);
-	$tertiary: map.get($theme, tertiary);
-	$base: core.daff-map-deep-get($theme, 'core.base');
-	$base-contrast: core.daff-map-deep-get($theme, 'core.base-contrast');
-	$white: core.daff-map-deep-get($theme, 'core.white');
-	$black: core.daff-map-deep-get($theme, 'core.black');
-	$neutral: core.daff-map-deep-get($theme, 'core.neutral');
+	$primary: core.daff-map-get($theme, primary);
+	$secondary: core.daff-map-get($theme, secondary);
+	$tertiary: core.daff-map-get($theme, tertiary);
+	$base: core.daff-map-get($theme, 'core', 'base');
+	$base-contrast: core.daff-map-get($theme, 'core', 'base-contrast');
+	$white: core.daff-map-get($theme, 'core', 'white');
+	$black: core.daff-map-get($theme, 'core', 'black');
+	$neutral: core.daff-map-get($theme, 'core', 'neutral');
 
 	.daff-card {
 		$root: &;
@@ -160,7 +160,7 @@
 
 		&.daff-raised-card {
 			.daff-card__wrapper {
-				&:after {
+				&::after {
 					box-shadow: 0 16px 32px -4px rgba($black, 0.12),
 						0 8px 12px -2px rgba($black, 0.06);
 				}

package/container/container.module.d.ts

@@ -2,7 +2,7 @@ import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
 import * as i2 from "./container/container.component";
 /**
- * @deprecated in favor of {@link DAFF_CONTAINER_COMPONENTS} Deprecated in version 0.78.0. Will be removed in version 0.81.0.
+ * @deprecated in favor of {@link DAFF_CONTAINER_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.
  */
 export declare class DaffContainerModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffContainerModule, never>;

package/core/article-encapsulated/article-encapsulated.directive.d.ts

@@ -3,15 +3,13 @@ import * as i0 from "@angular/core";
  * `DaffArticleEncapsulatedDirective` is used to encapsulate custom components within an article,
  * preventing {@link DaffArticleComponent } styles from bleeding into the component.
  *
- * ## Usage
- *
- * ### Implementing it as an attribute directive
+ * @example Implementing it as an attribute directive
  *
  * ```html
  * <my-custom-component daffArticleEncapsulated></my-custom-component>
  * ```
  *
- * ### Implementing it as an Angular host directive
+ * @example Implementing it as an Angular host directive
  *
  * ```ts
  * @Component({
@@ -21,8 +19,9 @@ import * as i0 from "@angular/core";
  *  hostDirectives: [{ directive: DaffArticleEncapsulatedDirective }],
  * })
  * export class CustomComponent { }
+ * ```
  *
- * This directive will apply the `daff-ae` class to your component, ensuring that it is encapsulated from the article's styles.
+ * This directive will apply the `daff-ae` class to the component, ensuring that it is encapsulated from the article's styles.
  */
 export declare class DaffArticleEncapsulatedDirective {
     class: boolean;

package/core/colorable/colorable.directive.d.ts

@@ -6,15 +6,36 @@ import * as i0 from "@angular/core";
  * styles by setting CSS classes based on the specified color. This directive is useful
  * for applying different color palettes to a component in an Angular application.
  *
- * ## Usage
+ * Supported colors: `primary | secondary | tertiary | black | white | theme | theme-contrast`
  *
- * ### Implementing it as an attribute directive
+ * | Color | Class |
+ * | -------- | ----- |
+ * | `primary` | `.daff-primary`|
+ * | `secondary` | `.daff-secondary`|
+ * | `tertiary` | `.daff-tertiary`|
+ * | `black` | `.daff-black`|
+ * | `white` | `.daff-white`|
+ * | `theme` | `daff-theme`|
+ * | `theme-contrast` | `.daff-theme-contrast`|
+ *
+ * @example Implementing it as an attribute directive
  *
  * ```html
- * <div daffColorable [color]="componentColor">Colored content</div>
+ * <div daffColorable [color]="primary">Colored content</div>
+ * ```
+ *
+ *  ```scss
+ * .div {
+ *  &.daff-primary {
+ *    color: daff-color($primary);
+ *  }
+ * }
  * ```
  *
- * ### Implementing it as an Angular host directive
+ * In this example, the `daff-primary` class is applied to the `div` element, allowing you to
+ * use the color class to style the `div`.
+ *
+ * @example Implementing it as an Angular host directive
  *
  * ```ts
  * @Component({
@@ -28,30 +49,19 @@ import * as i0 from "@angular/core";
  *    },
  *  ],
  * })
- * export class CustomComponent { }
+ * export class CustomComponent {
+ *  @HostBinding('class.custom-component') class = true;
+ * }
  * ```
  *
  * ```scss
  * .custom-component {
- *
  *  &.daff-primary {
  *    background: daff-color($primary, 10);
  *    color: daff-color($primary, 90);
  *  }
  * }
  * ```
- *
- * ## Styles
- *
- * The directive applies the following CSS classes based on the color:
- *
- * - `daff-primary`: Applied when the color is `primary`.
- * - `daff-secondary`: Applied when the color is `secondary`.
- * - `daff-tertiary`: Applied when the color is `tertiary`.
- * - `daff-black`: Applied when the color is `black`.
- * - `daff-white`: Applied when the color is `white`.
- * - `daff-theme`: Applied when the color is `theme`.
- * - `daff-theme-contrast`: Applied when the color is `theme-contrast`.
  */
 export declare class DaffColorableDirective implements DaffColorable, OnChanges, OnInit {
     /**

package/core/compactable/compactable.directive.d.ts

@@ -4,9 +4,7 @@ import * as i0 from "@angular/core";
  * style by toggling a CSS class. This is useful for creating components that can
  * switch between regular and compact styles based on the `compact` property.
  *
- * ## Usage
- *
- * ### Implementing it as an attribute directive
+ * @example Implementing it as an attribute directive
  *
  * ```html
  * <div daffCompactable [compact]="isCompact">Content goes here</div>
@@ -15,7 +13,7 @@ import * as i0 from "@angular/core";
  * In this example, the `daff-compact` class is applied to the `div` element when
  * `isCompact` is `true`, making the `div` display its compact state.
  *
- * ### Implementing it as an Angular host directive
+ * @example Implementing it as an Angular host directive
  *
  * ```ts
  * @Component({
@@ -32,8 +30,11 @@ import * as i0 from "@angular/core";
  * export class CustomComponent { }
  * ```
  *
+ * The directive applies the `daff-compact` class to the component and
+ * should be defined in your styles to display the compact state as desired.
+ *
  * ```scss
- * .custom-component {
+ * :host {
  *  padding: 8px 16px;
  *
  *  &.daff-compact {
@@ -41,11 +42,6 @@ import * as i0 from "@angular/core";
  *  }
  * }
  * ```
- *
- * ## Styles
- *
- * The `daff-compact` class should be defined in your styles to display the compact
- * state as desired.
  */
 export declare class DaffCompactableDirective {
     compact: boolean;

package/core/focus/stack.service.d.ts

@@ -13,6 +13,7 @@ export declare class DaffFocusStackService {
      * Generally, you will probably want to call this before you transition focus
      * onto a new element.
      *
+     * @example Using the push function
      * ```ts
      * this._focusStack.push(this._doc.activeElement);
      * ```
@@ -21,8 +22,9 @@ export declare class DaffFocusStackService {
     /**
      * Focuses on the HTML element at the top of a stack.
      *
+     * @example Using the focus function
      * ```ts
-     * this._focusStack.push(this._doc.activeElement);
+     * this._focusStack.focus(this._doc.activeElement);
      * ```
      */
     focus(): void;

package/core/manage-container-layout/manage-container-layout.directive.d.ts

@@ -22,9 +22,7 @@ import * as i0 from "@angular/core";
  * while the latter (without `DaffManageContainerLayoutDirective`) may unexpectedly
  * interfere in the layout features of its parent element (i.e. display: grid, display: flex).
  *
- * ## Usage
- *
- * ### Implementing it as an attribute directive
+ * @example Implementing it as an attribute directive
  *
  * ```html
  * <my-custom-component daffManageContainerLayout>
@@ -39,7 +37,7 @@ import * as i0 from "@angular/core";
  * }
  * ```
  *
- * ### Implementing it as an Angular host directive
+ * @example Implementing it as an Angular host directive
  *
  * ```ts
  * @Component({

package/core/openable/openable.directive.d.ts

@@ -5,7 +5,7 @@ import * as i0 from "@angular/core";
  * A directive that opens or closes a component. It should only be used as an [Angular Host Directive](https://angular.dev/guide/directives/directive-composition-api).
  * This directive is stateless by default, but it supports both a state and stateless implementation. Only one version should be used within a component.
  *
- * ## Example
+ * @example Using the DaffOpenableDirective
  * ```ts
  * import {
  *  Component,
@@ -52,6 +52,7 @@ export declare class DaffOpenableDirective implements DaffOpenable, OnChanges {
     private _setOpen;
     /** Whether or not a component should handle state
      *
+     * @example Setting the `stateless` property on a component
      * ```ts
      * constructor(private openDirective: DaffOpenableDirective) {
      *  this.openDirective.stateless = false;

package/core/public_api.d.ts

@@ -15,3 +15,4 @@ export * from './lazy/public_api';
 export * from './focus/public_api';
 export * from './sizable/public_api';
 export * from './openable/public_api';
+export * from './selectable/public_api';

package/core/selectable/public_api.d.ts

@@ -0,0 +1,2 @@
+export { DaffSelectable } from './selectable';
+export { DaffSelectableDirective } from './selectable.directive';

package/core/selectable/selectable.d.ts

@@ -0,0 +1,7 @@
+/**
+ * An interface for giving a component the ability to display a selected UI.
+ * In order to be selectable, the class must implement this property.
+ */
+export interface DaffSelectable {
+    selected: boolean;
+}

package/core/selectable/selectable.directive.d.ts

@@ -0,0 +1,17 @@
+import { ChangeDetectorRef, EventEmitter } from '@angular/core';
+import { DaffSelectable } from '../selectable/selectable';
+import * as i0 from "@angular/core";
+export declare class DaffSelectableDirective implements DaffSelectable {
+    private cd;
+    /** Whether or not a component implementing the directive is selected */
+    selected: boolean;
+    /**
+     * An event that fires after the media element becomes selected.
+     */
+    becameSelected: EventEmitter<void>;
+    constructor(cd: ChangeDetectorRef);
+    select(): this;
+    deselect(): this;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DaffSelectableDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffSelectableDirective, "[daffSelected]", never, { "selected": { "alias": "selected"; "required": false; }; }, { "becameSelected": "becameSelected"; }, never, never, true, never>;
+}

package/core/sizable/sizable.directive.d.ts

@@ -5,9 +5,7 @@ import * as i0 from "@angular/core";
  * `DaffSizableDirective` allows for dynamic sizing of a component by setting
  * CSS classes based on the specified size.
  *
- * ## Usage
- *
- * ### Implementing it as an attribute directive
+ * @example Implementing it as an attribute directive
  *
  * ```html
  * <div daffSizable [size]="small">Sized content</div>
@@ -15,7 +13,7 @@ import * as i0 from "@angular/core";
  * In this example, the `daff-small` class is applied to the `div` element, allowing you to
  * use the class to style the `div`.
  *
- * ### Implementing it as an Angular host directive
+ * @example Implementing it as an Angular host directive
  *
  * ```ts
  * @Component({
@@ -33,7 +31,7 @@ import * as i0 from "@angular/core";
  * ```
  *
  * ```scss
- * .custom-component {
+ * :host {
  *  &.daff-sm {
  *    width: 24px;
  *  }
@@ -44,9 +42,7 @@ import * as i0 from "@angular/core";
  * }
  * ```
  *
- * ## Styles
- *
- * The directive applies the following CSS classes based on the size:
+ * The directive applies the following CSS classes to the component based on the size:
  *
  * - `daff-xs`: Applied when the size is `xs`.
  * - `daff-sm`: Applied when the size is `sm`.

package/core/skeletonable/skeletonable.directive.d.ts

@@ -7,15 +7,13 @@ import * as i0 from "@angular/core";
  * input property. When `skeleton` is `true`, the `daff-skeleton` CSS class
  * is applied, which should style the component to look like a loading placeholder.
  *
- * ## Usage
- *
- * ### Implementing it as an attribute directive
+ * @example Implementing it as an attribute directive
  *
  * ```html
  * <div daffSkeletonable [skeleton]="isLoading">Content</div>
  * ```
  *
- * ### Implementing it as an Angular host directive
+ * @example Implementing it as an Angular host directive
  *
  * ```ts
  * @Component({
@@ -33,14 +31,14 @@ import * as i0 from "@angular/core";
  * ```
  *
  * ```scss
- * .daff-skeleton {
- *  @include state.skeleton-screen(48px, 24px);
+ * :host {
+ *  .daff-skeleton {
+ *    @include state.skeleton-screen(48px, 24px);
+ *  }
  * }
  * ```
  *
- * ## Styles
- *
- * The `daff-skeleton` class should be defined in your styles to display the loading
+ * The directive applies the `daff-skeleton` class to the component should be defined in your styles to display the loading
  * state as desired. It can be used in conjuction with the `skeleton-screen` mixin, which provides predefined loading styles.
  */
 export declare class DaffSkeletonableDirective {

package/core/statusable/statusable.directive.d.ts

@@ -5,15 +5,13 @@ import * as i0 from "@angular/core";
  * styles by setting CSS classes based on the specified status. This directive is useful
  * for indicating different statuses such as info, warning, critical, or success states.
  *
- * ## Usage
- *
- * ### Implementing it as an attribute directive
+ * @example Implementing it as an attribute directive
  *
  * ```html
  * <div daffStatusable [status]="componentStatus">Status content</div>
  * ```
  *
- * ### Implementing it as an Angular host directive
+ * @example Implementing it as an Angular host directive
  *
  * ```ts
  * @Component({
@@ -30,17 +28,15 @@ import * as i0 from "@angular/core";
  * export class CustomComponent { }
  *
  * ```scss
- * .custom-component {
- *
+ * :host {
  *  &.daff-critical {
  *    background: daff-color($red, 10);
  *    color: daff-color($red, 90);
  *  }
  * }
  * ```
- * ## Styles
  *
- * The directive applies the following CSS classes based on the status:
+ * The directive applies the following CSS classes to the component based on the status:
  *
  * - `daff-info`: Applied when the status is `info`.
  * - `daff-warn`: Applied when the status is `warn`.

package/core/text-alignable/text-alignable.directive.d.ts

@@ -6,19 +6,23 @@ import * as i0 from "@angular/core";
  * setting CSS classes based on the specified text alignment. This directive is
  * useful when text alignment needs to be managed dynamically in an Angular component.
  *
- * ## Usage
+ * ## Why not just use CSS?
+ *
+ * While the native CSS `text-align` property can be used for static text alignment,
+ * the `DaffTextAlignableDirective` provides a structured and consistent way to handle
+ * dynamic text alignment within Angular components in more complex use cases where the
+ * application of `text-align: center;` would cause unexpected side effects.
  *
- * ### Implementing it as an attribute directive
+ * @example Implementing it as an attribute directive
  *
  * ```html
  * <div daffTextAlignable textAlignment="center">Aligned text</div>
+ * ```
  *
  * In this example, the `daff-center` class is added to the `div` element, allowing
  * you to style the `div` as you wish using the class.
  *
- * ```
- *
- * ### Implementing it as an Angular host directive
+ * @example Implementing it as an Angular host directive
  *
  * ```ts
  * @Component({
@@ -42,13 +46,6 @@ import * as i0 from "@angular/core";
  *  }
  * }
  * ```
- *
- * ## Why not just use CSS?
- *
- * While the native CSS `text-align` property can be used for static text alignment,
- * the `DaffTextAlignableDirective` provides a structured and consistent way to handle
- * dynamic text alignment within Angular components in more complex use-cases where the
- * application of `text-align:center` would cause unexpected side effects.
  */
 export declare class DaffTextAlignableDirective implements DaffTextAlignable, OnChanges {
     /**

package/core/theming/initializer.d.ts

@@ -1,8 +1,7 @@
-import { Provider } from '@angular/core';
 import { DaffThemeClassSetterService } from './services/class-setter/theme-class-setter.service';
 export declare const DAFF_THEME_INIT: (classSetter: DaffThemeClassSetterService) => () => void;
 /**
  * The theme provider for the app.
  * This configures updating the body with the theme class.
  */
-export declare const DAFF_THEME_INITIALIZER: Provider[];
+export declare const DAFF_THEME_INITIALIZER: import("@angular/core").EnvironmentProviders;

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

@@ -4,12 +4,12 @@ import * as i1 from '@daffodil/design/accordion';
 import { DAFF_ACCORDION_COMPONENTS } from '@daffodil/design/accordion';
 
 class BasicAccordionComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.2", ngImport: i0, type: BasicAccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.2", type: BasicAccordionComponent, isStandalone: true, selector: "basic-accordion", ngImport: i0, template: "<daff-accordion>\n\t<daff-accordion-item [initiallyExpanded]=\"true\">\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n\t<daff-accordion-item>\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n\t<daff-accordion-item>\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n</daff-accordion>\n", dependencies: [{ kind: "component", type: i1.DaffAccordionComponent, selector: "daff-accordion" }, { kind: "component", type: i1.DaffAccordionItemComponent, selector: "daff-accordion-item", inputs: ["id", "initiallyExpanded"] }, { kind: "directive", type: i1.DaffAccordionItemTitleDirective, selector: "[daffAccordionItemTitle]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: BasicAccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: BasicAccordionComponent, isStandalone: true, selector: "basic-accordion", ngImport: i0, template: "<daff-accordion>\n\t<daff-accordion-item [initiallyExpanded]=\"true\">\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n\t<daff-accordion-item>\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n\t<daff-accordion-item>\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n</daff-accordion>\n", dependencies: [{ kind: "component", type: i1.DaffAccordionComponent, selector: "daff-accordion" }, { kind: "component", type: i1.DaffAccordionItemComponent, selector: "daff-accordion-item", inputs: ["id", "initiallyExpanded"] }, { kind: "directive", type: i1.DaffAccordionItemTitleDirective, selector: "[daffAccordionItemTitle]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.2", ngImport: i0, type: BasicAccordionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: BasicAccordionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'basic-accordion', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
+            args: [{ selector: 'basic-accordion', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         DAFF_ACCORDION_COMPONENTS,
                     ], template: "<daff-accordion>\n\t<daff-accordion-item [initiallyExpanded]=\"true\">\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n\t<daff-accordion-item>\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n\t<daff-accordion-item>\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n</daff-accordion>\n" }]
         }] });

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

@@ -1 +1 @@
-{"version":3,"file":"daffodil-design-accordion-examples.mjs","sources":["../../../libs/design/accordion/examples/src/basic-accordion/basic-accordion.component.ts","../../../libs/design/accordion/examples/src/basic-accordion/basic-accordion.component.html","../../../libs/design/accordion/examples/src/examples.ts","../../../libs/design/accordion/examples/src/daffodil-design-accordion-examples.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\n\nimport { DAFF_ACCORDION_COMPONENTS } from '@daffodil/design/accordion';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'basic-accordion',\n  templateUrl: './basic-accordion.component.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  standalone: true,\n  imports: [\n    DAFF_ACCORDION_COMPONENTS,\n  ],\n})\nexport class BasicAccordionComponent {}\n","<daff-accordion>\n\t<daff-accordion-item [initiallyExpanded]=\"true\">\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n\t<daff-accordion-item>\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n\t<daff-accordion-item>\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n</daff-accordion>\n","import { BasicAccordionComponent } from './basic-accordion/basic-accordion.component';\n\nexport const ACCORDION_EXAMPLES = [\n  BasicAccordionComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAiBa,uBAAuB,CAAA;iIAAvB,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAvB,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,uBAAuB,2ECjBpC,4qCAuBA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,sBAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,0BAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,CAAA,IAAA,EAAA,mBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,+BAAA,EAAA,QAAA,EAAA,0BAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FDNa,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAVnC,SAAS;AAEE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,iBAAiB,mBAEV,uBAAuB,CAAC,MAAM,EAAA,UAAA,EACnC,IAAI,EACP,OAAA,EAAA;wBACP,yBAAyB;AAC1B,qBAAA,EAAA,QAAA,EAAA,4qCAAA,EAAA,CAAA;;;AEbU,MAAA,kBAAkB,GAAG;IAChC,uBAAuB;;;ACHzB;;AAEG;;;;"}
+{"version":3,"file":"daffodil-design-accordion-examples.mjs","sources":["../../../libs/design/accordion/examples/src/basic-accordion/basic-accordion.component.ts","../../../libs/design/accordion/examples/src/basic-accordion/basic-accordion.component.html","../../../libs/design/accordion/examples/src/examples.ts","../../../libs/design/accordion/examples/src/daffodil-design-accordion-examples.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\n\nimport { DAFF_ACCORDION_COMPONENTS } from '@daffodil/design/accordion';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'basic-accordion',\n  templateUrl: './basic-accordion.component.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    DAFF_ACCORDION_COMPONENTS,\n  ],\n})\nexport class BasicAccordionComponent {}\n","<daff-accordion>\n\t<daff-accordion-item [initiallyExpanded]=\"true\">\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n\t<daff-accordion-item>\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n\t<daff-accordion-item>\n\t\t<div daffAccordionItemTitle>This is the accordion item title</div>\n\t\t<p>\n\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo lacus ut sapien consectetur, et ultricies leo rutrum. Integer iaculis ultrices nunc, et maximus quam efficitur sed.\n\t\t\t<a href=\"/\">Learn More.</a>\n\t\t</p>\n\t</daff-accordion-item>\n</daff-accordion>\n","import { BasicAccordionComponent } from './basic-accordion/basic-accordion.component';\n\nexport const ACCORDION_EXAMPLES = [\n  BasicAccordionComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAgBa,uBAAuB,CAAA;iIAAvB,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAvB,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,uBAAuB,2EChBpC,4qCAuBA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,sBAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,0BAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,CAAA,IAAA,EAAA,mBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,+BAAA,EAAA,QAAA,EAAA,0BAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FDPa,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBATnC,SAAS;AAEE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,iBAAiB,EAEV,eAAA,EAAA,uBAAuB,CAAC,MAAM,EACtC,OAAA,EAAA;wBACP,yBAAyB;AAC1B,qBAAA,EAAA,QAAA,EAAA,4qCAAA,EAAA;;;AEZU,MAAA,kBAAkB,GAAG;IAChC,uBAAuB;;;ACHzB;;AAEG;;;;"}