@daffodil/design 0.60.0 → 0.62.0

package/esm2020/hero/examples/hero-text-alignment/hero-text-alignment.component.mjs

@@ -19,7 +19,7 @@ export class HeroTextAlignmentComponent {
     }
 }
 /** @nocollapse */ HeroTextAlignmentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: HeroTextAlignmentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ HeroTextAlignmentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: HeroTextAlignmentComponent, selector: "hero-text-alignment", ngImport: i0, template: "<daff-hero [textAlignment]=\"textAlignControl.value\">\n\t<daff-container size=\"md\">\n\t\t<div class=\"daff-hero-text-alignment__icon\" daffHeroIcon>\n\t\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t\t</div>\n\t\t<p daffHeroTagline>Frontend framework for ecommerce PWAs</p>\n\t\t<h1 daffHeroTitle>Daffodil: The next great leap in ecommerce.</h1>\n\t\t<h2 daffHeroSubtitle>\n\t\t\t<p>Daffodil provides everything you need to create powerful and flexible ecommerce experiences.</p>\n\t\t\t<p>With Daffodil, ambitious businesses are able to achieve more while minimizing development and maintenance costs.</p>\n\t\t</h2>\n\t\t<div daffHeroBody>\n\t\t\t<a href=\"https://www.daff.io\" target=\"_blank\" daff-button>Get Started</a>\n\t\t</div>\n\t</daff-container>\n</daff-hero>\n\n<select [formControl]=\"textAlignControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: [".daff-hero-text-alignment__icon{display:flex;background:rgba(var(--daff-theme-rgb),.2);border-radius:50%;color:var(--daff-theme-contrast-rgb);width:48px;height:48px;justify-content:center;align-items:center;padding:12px 0}\n"], components: [{ type: i1.DaffHeroComponent, selector: "daff-hero", inputs: ["color", "compact", "textAlignment", "layout", "size"] }, { type: i1.DaffContainerComponent, selector: "daff-container", inputs: ["size"] }, { type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i1.DaffButtonComponent, selector: "button[daff-button],button[daff-stroked-button],button[daff-raised-button],button[daff-icon-button],button[daff-underline-button],a[daff-button],a[daff-stroked-button],a[daff-raised-button],a[daff-icon-button],a[daff-underline-button]", inputs: ["color", "size", "status"] }], directives: [{ type: i1.DaffHeroIconDirective, selector: "[daffHeroIcon]" }, { type: i1.DaffHeroTaglineDirective, selector: "[daffHeroTagline]" }, { type: i1.DaffHeroTitleDirective, selector: "[daffHeroTitle]" }, { type: i1.DaffHeroSubtitleDirective, selector: "[daffHeroSubtitle]" }, { type: i1.DaffHeroBodyDirective, selector: "[daffHeroBody]" }, { type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+/** @nocollapse */ HeroTextAlignmentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: HeroTextAlignmentComponent, selector: "hero-text-alignment", ngImport: i0, template: "<daff-hero [textAlignment]=\"textAlignControl.value\">\n\t<daff-container size=\"md\">\n\t\t<div class=\"daff-hero-text-alignment__icon\" daffHeroIcon>\n\t\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t\t</div>\n\t\t<p daffHeroTagline>Frontend framework for ecommerce PWAs</p>\n\t\t<h1 daffHeroTitle>Daffodil: The next great leap in ecommerce.</h1>\n\t\t<h2 daffHeroSubtitle>\n\t\t\t<p>Daffodil provides everything you need to create powerful and flexible ecommerce experiences.</p>\n\t\t\t<p>With Daffodil, ambitious businesses are able to achieve more while minimizing development and maintenance costs.</p>\n\t\t</h2>\n\t\t<div daffHeroBody>\n\t\t\t<a href=\"https://www.daff.io\" target=\"_blank\" daff-button>Get Started</a>\n\t\t</div>\n\t</daff-container>\n</daff-hero>\n\n<select [formControl]=\"textAlignControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: [".daff-hero-text-alignment__icon{display:flex;background:rgba(var(--daff-theme-rgb),.2);border-radius:50%;color:var(--daff-theme-contrast-rgb);width:48px;height:48px;justify-content:center;align-items:center;padding:12px 0}\n"], components: [{ type: i1.DaffHeroComponent, selector: "daff-hero", inputs: ["color", "compact", "textAlignment", "layout", "size"] }, { type: i1.DaffContainerComponent, selector: "daff-container", inputs: ["size"] }, { type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i1.DaffButtonComponent, selector: "button[daff-button],button[daff-stroked-button],button[daff-raised-button],button[daff-flat-button],button[daff-icon-button],button[daff-underline-button],a[daff-button],a[daff-stroked-button],a[daff-raised-button],a[daff-flat-button],a[daff-icon-button],a[daff-underline-button]", inputs: ["color", "size", "status", "loading", "tabindex", "disabled"] }], directives: [{ type: i1.DaffHeroIconDirective, selector: "[daffHeroIcon]" }, { type: i1.DaffHeroTaglineDirective, selector: "[daffHeroTagline]" }, { type: i1.DaffHeroTitleDirective, selector: "[daffHeroTitle]" }, { type: i1.DaffHeroSubtitleDirective, selector: "[daffHeroSubtitle]" }, { type: i1.DaffHeroBodyDirective, selector: "[daffHeroBody]" }, { type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: HeroTextAlignmentComponent, decorators: [{
             type: Component,
             args: [{ selector: 'hero-text-alignment', changeDetection: ChangeDetectionStrategy.OnPush, template: "<daff-hero [textAlignment]=\"textAlignControl.value\">\n\t<daff-container size=\"md\">\n\t\t<div class=\"daff-hero-text-alignment__icon\" daffHeroIcon>\n\t\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t\t</div>\n\t\t<p daffHeroTagline>Frontend framework for ecommerce PWAs</p>\n\t\t<h1 daffHeroTitle>Daffodil: The next great leap in ecommerce.</h1>\n\t\t<h2 daffHeroSubtitle>\n\t\t\t<p>Daffodil provides everything you need to create powerful and flexible ecommerce experiences.</p>\n\t\t\t<p>With Daffodil, ambitious businesses are able to achieve more while minimizing development and maintenance costs.</p>\n\t\t</h2>\n\t\t<div daffHeroBody>\n\t\t\t<a href=\"https://www.daff.io\" target=\"_blank\" daff-button>Get Started</a>\n\t\t</div>\n\t</daff-container>\n</daff-hero>\n\n<select [formControl]=\"textAlignControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: [".daff-hero-text-alignment__icon{display:flex;background:rgba(var(--daff-theme-rgb),.2);border-radius:50%;color:var(--daff-theme-contrast-rgb);width:48px;height:48px;justify-content:center;align-items:center;padding:12px 0}\n"] }]

package/esm2020/hero/examples/hero-theming/hero-theming.component.mjs

@@ -13,7 +13,7 @@ export class HeroThemingComponent {
     }
 }
 /** @nocollapse */ HeroThemingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: HeroThemingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ HeroThemingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: HeroThemingComponent, selector: "hero-theming", ngImport: i0, template: "<daff-hero [color]=\"colorControl.value\">\n\t<div class=\"daff-hero-theming__icon\" daffHeroIcon>\n\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t</div>\n\t<p daffHeroTagline>Frontend framework for ecommerce PWAs</p>\n\t<h1 daffHeroTitle>Daffodil: The next great leap in ecommerce.</h1>\n\t<h2 daffHeroSubtitle>\n\t\t<p>Daffodil provides everything you need to create powerful and flexible ecommerce experiences.</p>\n\t\t<p>With Daffodil, ambitious businesses are able to achieve more while minimizing development and maintenance costs.</p>\n\t</h2>\n\t<div daffHeroBody>\n\t\t<a href=\"https://www.daff.io\" target=\"_blank\" daff-button>Get Started</a>\n\t</div>\n</daff-hero>\n\n<select [formControl]=\"colorControl\">\n\t<option value=\"\">Default</option>\n\t<option value=\"primary\">Primary</option>\n\t<option value=\"secondary\">Secondary</option>\n\t<option value=\"tertiary\">Tertiary</option>\n\t<option value=\"white\">White</option>\n\t<option value=\"black\">Black</option>\n\t<option value=\"theme\">Theme</option>\n\t<option value=\"theme-contrast\">Theme Contrast</option>\n</select>", styles: [".daff-hero-theming__icon{display:flex;background:rgba(var(--daff-theme-rgb),.2);border-radius:50%;color:var(--daff-theme-contrast-rgb);width:48px;height:48px;justify-content:center;align-items:center;padding:12px 0}\n"], components: [{ type: i1.DaffHeroComponent, selector: "daff-hero", inputs: ["color", "compact", "textAlignment", "layout", "size"] }, { type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i1.DaffButtonComponent, selector: "button[daff-button],button[daff-stroked-button],button[daff-raised-button],button[daff-icon-button],button[daff-underline-button],a[daff-button],a[daff-stroked-button],a[daff-raised-button],a[daff-icon-button],a[daff-underline-button]", inputs: ["color", "size", "status"] }], directives: [{ type: i1.DaffHeroIconDirective, selector: "[daffHeroIcon]" }, { type: i1.DaffHeroTaglineDirective, selector: "[daffHeroTagline]" }, { type: i1.DaffHeroTitleDirective, selector: "[daffHeroTitle]" }, { type: i1.DaffHeroSubtitleDirective, selector: "[daffHeroSubtitle]" }, { type: i1.DaffHeroBodyDirective, selector: "[daffHeroBody]" }, { type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+/** @nocollapse */ HeroThemingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: HeroThemingComponent, selector: "hero-theming", ngImport: i0, template: "<daff-hero [color]=\"colorControl.value\">\n\t<div class=\"daff-hero-theming__icon\" daffHeroIcon>\n\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t</div>\n\t<p daffHeroTagline>Frontend framework for ecommerce PWAs</p>\n\t<h1 daffHeroTitle>Daffodil: The next great leap in ecommerce.</h1>\n\t<h2 daffHeroSubtitle>\n\t\t<p>Daffodil provides everything you need to create powerful and flexible ecommerce experiences.</p>\n\t\t<p>With Daffodil, ambitious businesses are able to achieve more while minimizing development and maintenance costs.</p>\n\t</h2>\n\t<div daffHeroBody>\n\t\t<a href=\"https://www.daff.io\" target=\"_blank\" daff-button>Get Started</a>\n\t</div>\n</daff-hero>\n\n<select [formControl]=\"colorControl\">\n\t<option value=\"\">Default</option>\n\t<option value=\"primary\">Primary</option>\n\t<option value=\"secondary\">Secondary</option>\n\t<option value=\"tertiary\">Tertiary</option>\n\t<option value=\"white\">White</option>\n\t<option value=\"black\">Black</option>\n\t<option value=\"theme\">Theme</option>\n\t<option value=\"theme-contrast\">Theme Contrast</option>\n</select>", styles: [".daff-hero-theming__icon{display:flex;background:rgba(var(--daff-theme-rgb),.2);border-radius:50%;color:var(--daff-theme-contrast-rgb);width:48px;height:48px;justify-content:center;align-items:center;padding:12px 0}\n"], components: [{ type: i1.DaffHeroComponent, selector: "daff-hero", inputs: ["color", "compact", "textAlignment", "layout", "size"] }, { type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i1.DaffButtonComponent, selector: "button[daff-button],button[daff-stroked-button],button[daff-raised-button],button[daff-flat-button],button[daff-icon-button],button[daff-underline-button],a[daff-button],a[daff-stroked-button],a[daff-raised-button],a[daff-flat-button],a[daff-icon-button],a[daff-underline-button]", inputs: ["color", "size", "status", "loading", "tabindex", "disabled"] }], directives: [{ type: i1.DaffHeroIconDirective, selector: "[daffHeroIcon]" }, { type: i1.DaffHeroTaglineDirective, selector: "[daffHeroTagline]" }, { type: i1.DaffHeroTitleDirective, selector: "[daffHeroTitle]" }, { type: i1.DaffHeroSubtitleDirective, selector: "[daffHeroSubtitle]" }, { type: i1.DaffHeroBodyDirective, selector: "[daffHeroBody]" }, { type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: HeroThemingComponent, decorators: [{
             type: Component,
             args: [{ selector: 'hero-theming', changeDetection: ChangeDetectionStrategy.OnPush, template: "<daff-hero [color]=\"colorControl.value\">\n\t<div class=\"daff-hero-theming__icon\" daffHeroIcon>\n\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t</div>\n\t<p daffHeroTagline>Frontend framework for ecommerce PWAs</p>\n\t<h1 daffHeroTitle>Daffodil: The next great leap in ecommerce.</h1>\n\t<h2 daffHeroSubtitle>\n\t\t<p>Daffodil provides everything you need to create powerful and flexible ecommerce experiences.</p>\n\t\t<p>With Daffodil, ambitious businesses are able to achieve more while minimizing development and maintenance costs.</p>\n\t</h2>\n\t<div daffHeroBody>\n\t\t<a href=\"https://www.daff.io\" target=\"_blank\" daff-button>Get Started</a>\n\t</div>\n</daff-hero>\n\n<select [formControl]=\"colorControl\">\n\t<option value=\"\">Default</option>\n\t<option value=\"primary\">Primary</option>\n\t<option value=\"secondary\">Secondary</option>\n\t<option value=\"tertiary\">Tertiary</option>\n\t<option value=\"white\">White</option>\n\t<option value=\"black\">Black</option>\n\t<option value=\"theme\">Theme</option>\n\t<option value=\"theme-contrast\">Theme Contrast</option>\n</select>", styles: [".daff-hero-theming__icon{display:flex;background:rgba(var(--daff-theme-rgb),.2);border-radius:50%;color:var(--daff-theme-contrast-rgb);width:48px;height:48px;justify-content:center;align-items:center;padding:12px 0}\n"] }]

package/esm2020/hero/examples/hero-with-grid/hero-with-grid.component.mjs

@@ -9,7 +9,7 @@ export class HeroWithGridComponent {
     }
 }
 /** @nocollapse */ HeroWithGridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: HeroWithGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ HeroWithGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: HeroWithGridComponent, selector: "hero-with-grid", ngImport: i0, template: "<daff-hero color=\"theme\">\n\t<daff-container class=\"daff-hero-with-grid__grid\">\n\t\t<div class=\"daff-hero-with-grid__image\">\n\t\t\t<img src=\"/assets/design/callout/pwa-illustration.svg\" alt=\"PWA Illustration\">\n\t\t</div>\n\t\t<div class=\"daff-hero-with-grid__content-wrapper\">\n\t\t\t<div class=\"daff-hero-with-grid__icon\" daffHeroIcon>\n\t\t\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t\t\t</div>\n\t\t\t<p daffHeroTagline>Frontend framework for ecommerce PWAs</p>\n\t\t\t<h3 daffHeroTitle>Daffodil: The next great leap in ecommerce.</h3>\n\t\t\t<div daffHeroSubtitle>\n\t\t\t\t<p>Daffodil provides everything you need to create powerful and flexible ecommerce experiences.</p>\n\t\t\t\t<p>With Daffodil, ambitious businesses are able to achieve more while minimizing development and maintenance costs.</p>\n\t\t\t</div>\n\t\t\t<div daffHeroBody>\n\t\t\t\t<a href=\"https://www.daff.io\" target=\"_blank\" daff-button>Get Started</a>\n\t\t\t</div>\n\t\t</div>\n\t</daff-container>\n</daff-hero>", styles: [".daff-hero-with-grid__grid{display:grid;grid-template:\"image\" \"content\"/1fr;grid-gap:24px}@media (min-width: 768px){.daff-hero-with-grid__grid{grid-template:\"image content\"/1fr 1fr;grid-gap:48px;align-items:center}}.daff-hero-with-grid__image{grid-area:image}.daff-hero-with-grid__content-wrapper{grid-area:content}.daff-hero-with-grid__icon{display:flex;background:rgba(var(--daff-theme-rgb),.2);border-radius:50%;color:var(--daff-theme-contrast-rgb);width:48px;height:48px;justify-content:center;align-items:center;padding:12px 0}\n"], components: [{ type: i1.DaffHeroComponent, selector: "daff-hero", inputs: ["color", "compact", "textAlignment", "layout", "size"] }, { type: i1.DaffContainerComponent, selector: "daff-container", inputs: ["size"] }, { type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i1.DaffButtonComponent, selector: "button[daff-button],button[daff-stroked-button],button[daff-raised-button],button[daff-icon-button],button[daff-underline-button],a[daff-button],a[daff-stroked-button],a[daff-raised-button],a[daff-icon-button],a[daff-underline-button]", inputs: ["color", "size", "status"] }], directives: [{ type: i1.DaffHeroIconDirective, selector: "[daffHeroIcon]" }, { type: i1.DaffHeroTaglineDirective, selector: "[daffHeroTagline]" }, { type: i1.DaffHeroTitleDirective, selector: "[daffHeroTitle]" }, { type: i1.DaffHeroSubtitleDirective, selector: "[daffHeroSubtitle]" }, { type: i1.DaffHeroBodyDirective, selector: "[daffHeroBody]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+/** @nocollapse */ HeroWithGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: HeroWithGridComponent, selector: "hero-with-grid", ngImport: i0, template: "<daff-hero color=\"theme\">\n\t<daff-container class=\"daff-hero-with-grid__grid\">\n\t\t<div class=\"daff-hero-with-grid__image\">\n\t\t\t<img src=\"/assets/design/callout/pwa-illustration.svg\" alt=\"PWA Illustration\">\n\t\t</div>\n\t\t<div class=\"daff-hero-with-grid__content-wrapper\">\n\t\t\t<div class=\"daff-hero-with-grid__icon\" daffHeroIcon>\n\t\t\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t\t\t</div>\n\t\t\t<p daffHeroTagline>Frontend framework for ecommerce PWAs</p>\n\t\t\t<h3 daffHeroTitle>Daffodil: The next great leap in ecommerce.</h3>\n\t\t\t<div daffHeroSubtitle>\n\t\t\t\t<p>Daffodil provides everything you need to create powerful and flexible ecommerce experiences.</p>\n\t\t\t\t<p>With Daffodil, ambitious businesses are able to achieve more while minimizing development and maintenance costs.</p>\n\t\t\t</div>\n\t\t\t<div daffHeroBody>\n\t\t\t\t<a href=\"https://www.daff.io\" target=\"_blank\" daff-button>Get Started</a>\n\t\t\t</div>\n\t\t</div>\n\t</daff-container>\n</daff-hero>", styles: [".daff-hero-with-grid__grid{display:grid;grid-template:\"image\" \"content\"/1fr;grid-gap:24px}@media (min-width: 768px){.daff-hero-with-grid__grid{grid-template:\"image content\"/1fr 1fr;grid-gap:48px;align-items:center}}.daff-hero-with-grid__image{grid-area:image}.daff-hero-with-grid__content-wrapper{grid-area:content}.daff-hero-with-grid__icon{display:flex;background:rgba(var(--daff-theme-rgb),.2);border-radius:50%;color:var(--daff-theme-contrast-rgb);width:48px;height:48px;justify-content:center;align-items:center;padding:12px 0}\n"], components: [{ type: i1.DaffHeroComponent, selector: "daff-hero", inputs: ["color", "compact", "textAlignment", "layout", "size"] }, { type: i1.DaffContainerComponent, selector: "daff-container", inputs: ["size"] }, { type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i1.DaffButtonComponent, selector: "button[daff-button],button[daff-stroked-button],button[daff-raised-button],button[daff-flat-button],button[daff-icon-button],button[daff-underline-button],a[daff-button],a[daff-stroked-button],a[daff-raised-button],a[daff-flat-button],a[daff-icon-button],a[daff-underline-button]", inputs: ["color", "size", "status", "loading", "tabindex", "disabled"] }], directives: [{ type: i1.DaffHeroIconDirective, selector: "[daffHeroIcon]" }, { type: i1.DaffHeroTaglineDirective, selector: "[daffHeroTagline]" }, { type: i1.DaffHeroTitleDirective, selector: "[daffHeroTitle]" }, { type: i1.DaffHeroSubtitleDirective, selector: "[daffHeroSubtitle]" }, { type: i1.DaffHeroBodyDirective, selector: "[daffHeroBody]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: HeroWithGridComponent, decorators: [{
             type: Component,
             args: [{ selector: 'hero-with-grid', changeDetection: ChangeDetectionStrategy.OnPush, template: "<daff-hero color=\"theme\">\n\t<daff-container class=\"daff-hero-with-grid__grid\">\n\t\t<div class=\"daff-hero-with-grid__image\">\n\t\t\t<img src=\"/assets/design/callout/pwa-illustration.svg\" alt=\"PWA Illustration\">\n\t\t</div>\n\t\t<div class=\"daff-hero-with-grid__content-wrapper\">\n\t\t\t<div class=\"daff-hero-with-grid__icon\" daffHeroIcon>\n\t\t\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t\t\t</div>\n\t\t\t<p daffHeroTagline>Frontend framework for ecommerce PWAs</p>\n\t\t\t<h3 daffHeroTitle>Daffodil: The next great leap in ecommerce.</h3>\n\t\t\t<div daffHeroSubtitle>\n\t\t\t\t<p>Daffodil provides everything you need to create powerful and flexible ecommerce experiences.</p>\n\t\t\t\t<p>With Daffodil, ambitious businesses are able to achieve more while minimizing development and maintenance costs.</p>\n\t\t\t</div>\n\t\t\t<div daffHeroBody>\n\t\t\t\t<a href=\"https://www.daff.io\" target=\"_blank\" daff-button>Get Started</a>\n\t\t\t</div>\n\t\t</div>\n\t</daff-container>\n</daff-hero>", styles: [".daff-hero-with-grid__grid{display:grid;grid-template:\"image\" \"content\"/1fr;grid-gap:24px}@media (min-width: 768px){.daff-hero-with-grid__grid{grid-template:\"image content\"/1fr 1fr;grid-gap:48px;align-items:center}}.daff-hero-with-grid__image{grid-area:image}.daff-hero-with-grid__content-wrapper{grid-area:content}.daff-hero-with-grid__icon{display:flex;background:rgba(var(--daff-theme-rgb),.2);border-radius:50%;color:var(--daff-theme-contrast-rgb);width:48px;height:48px;justify-content:center;align-items:center;padding:12px 0}\n"] }]

package/esm2020/menu/examples/basic-menu/basic-menu.component.mjs

@@ -8,7 +8,7 @@ export class BasicMenuComponent {
     }
 }
 /** @nocollapse */ BasicMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BasicMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ BasicMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: BasicMenuComponent, selector: "basic-menu", ngImport: i0, template: "<button daff-button color=\"theme\" [daffMenuActivator]=\"menu\">\n\tMenu\n</button>", components: [{ type: i1.DaffButtonComponent, selector: "button[daff-button],button[daff-stroked-button],button[daff-raised-button],button[daff-icon-button],button[daff-underline-button],a[daff-button],a[daff-stroked-button],a[daff-raised-button],a[daff-icon-button],a[daff-underline-button]", inputs: ["color", "size", "status"] }], directives: [{ type: i1.DaffMenuActivatorDirective, selector: "[daffMenuActivator]", inputs: ["daffMenuActivator"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+/** @nocollapse */ BasicMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: BasicMenuComponent, selector: "basic-menu", ngImport: i0, template: "<button daff-button color=\"theme\" [daffMenuActivator]=\"menu\">\n\tMenu\n</button>", components: [{ type: i1.DaffButtonComponent, selector: "button[daff-button],button[daff-stroked-button],button[daff-raised-button],button[daff-flat-button],button[daff-icon-button],button[daff-underline-button],a[daff-button],a[daff-stroked-button],a[daff-raised-button],a[daff-flat-button],a[daff-icon-button],a[daff-underline-button]", inputs: ["color", "size", "status", "loading", "tabindex", "disabled"] }], directives: [{ type: i1.DaffMenuActivatorDirective, selector: "[daffMenuActivator]", inputs: ["daffMenuActivator"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BasicMenuComponent, decorators: [{
             type: Component,
             args: [{ selector: 'basic-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button daff-button color=\"theme\" [daffMenuActivator]=\"menu\">\n\tMenu\n</button>" }]

package/esm2020/modal/examples/basic-modal/basic-modal.component.mjs

@@ -12,7 +12,7 @@ export class BasicModalComponent {
     }
 }
 /** @nocollapse */ BasicModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BasicModalComponent, deps: [{ token: i1.DaffModalService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ BasicModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: BasicModalComponent, selector: "basic-modal", ngImport: i0, template: "<button daff-button (click)=\"showModal()\">Open Modal</button>\n", components: [{ type: i1.DaffButtonComponent, selector: "button[daff-button],button[daff-stroked-button],button[daff-raised-button],button[daff-icon-button],button[daff-underline-button],a[daff-button],a[daff-stroked-button],a[daff-raised-button],a[daff-icon-button],a[daff-underline-button]", inputs: ["color", "size", "status"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+/** @nocollapse */ BasicModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: BasicModalComponent, selector: "basic-modal", ngImport: i0, template: "<button daff-button (click)=\"showModal()\">Open Modal</button>\n", components: [{ type: i1.DaffButtonComponent, selector: "button[daff-button],button[daff-stroked-button],button[daff-raised-button],button[daff-flat-button],button[daff-icon-button],button[daff-underline-button],a[daff-button],a[daff-stroked-button],a[daff-raised-button],a[daff-flat-button],a[daff-icon-button],a[daff-underline-button]", inputs: ["color", "size", "status", "loading", "tabindex", "disabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BasicModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'basic-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button daff-button (click)=\"showModal()\">Open Modal</button>\n" }]

package/esm2020/modal/examples/basic-modal/modal-content.component.mjs

@@ -4,7 +4,7 @@ import * as i1 from "@daffodil/design";
 export class BasicModalContentComponent {
 }
 /** @nocollapse */ BasicModalContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BasicModalContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ BasicModalContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: BasicModalContentComponent, selector: "basic-modal-content", ngImport: i0, template: "<daff-modal-header>\n\t<h5 daffModalTitle>Modal Title</h5>\n</daff-modal-header>\n<daff-modal-content>\n\tModal content goes here. Components can be placed in here. The content is scrollable.\n</daff-modal-content>\n<daff-modal-actions>\n\t<button daff-button>Save Changes</button>\n</daff-modal-actions>", components: [{ type: i1.DaffModalHeaderComponent, selector: "daff-modal-header" }, { type: i1.DaffModalContentComponent, selector: "daff-modal-content" }, { type: i1.DaffModalActionsComponent, selector: "daff-modal-actions" }, { type: i1.DaffButtonComponent, selector: "button[daff-button],button[daff-stroked-button],button[daff-raised-button],button[daff-icon-button],button[daff-underline-button],a[daff-button],a[daff-stroked-button],a[daff-raised-button],a[daff-icon-button],a[daff-underline-button]", inputs: ["color", "size", "status"] }], directives: [{ type: i1.DaffModalTitleDirective, selector: "[daffModalTitle]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+/** @nocollapse */ BasicModalContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: BasicModalContentComponent, selector: "basic-modal-content", ngImport: i0, template: "<daff-modal-header>\n\t<h5 daffModalTitle>Modal Title</h5>\n</daff-modal-header>\n<daff-modal-content>\n\tModal content goes here. Components can be placed in here. The content is scrollable.\n</daff-modal-content>\n<daff-modal-actions>\n\t<button daff-button>Save Changes</button>\n</daff-modal-actions>", components: [{ type: i1.DaffModalHeaderComponent, selector: "daff-modal-header" }, { type: i1.DaffModalContentComponent, selector: "daff-modal-content" }, { type: i1.DaffModalActionsComponent, selector: "daff-modal-actions" }, { type: i1.DaffButtonComponent, selector: "button[daff-button],button[daff-stroked-button],button[daff-raised-button],button[daff-flat-button],button[daff-icon-button],button[daff-underline-button],a[daff-button],a[daff-stroked-button],a[daff-raised-button],a[daff-flat-button],a[daff-icon-button],a[daff-underline-button]", inputs: ["color", "size", "status", "loading", "tabindex", "disabled"] }], directives: [{ type: i1.DaffModalTitleDirective, selector: "[daffModalTitle]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BasicModalContentComponent, decorators: [{
             type: Component,
             args: [{ selector: 'basic-modal-content', changeDetection: ChangeDetectionStrategy.OnPush, template: "<daff-modal-header>\n\t<h5 daffModalTitle>Modal Title</h5>\n</daff-modal-header>\n<daff-modal-content>\n\tModal content goes here. Components can be placed in here. The content is scrollable.\n</daff-modal-content>\n<daff-modal-actions>\n\t<button daff-button>Save Changes</button>\n</daff-modal-actions>" }]

package/esm2020/molecules/backdrop/animation/backdrop-animation-state.mjs

@@ -0,0 +1,2 @@
+export const getAnimationState = (interactable) => interactable ? 'interactable' : 'non-interactable';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFja2Ryb3AtYW5pbWF0aW9uLXN0YXRlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9kZXNpZ24vc3JjL21vbGVjdWxlcy9iYWNrZHJvcC9hbmltYXRpb24vYmFja2Ryb3AtYW5pbWF0aW9uLXN0YXRlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNBLE1BQU0sQ0FBQyxNQUFNLGlCQUFpQixHQUFHLENBQUMsWUFBcUIsRUFBNkIsRUFBRSxDQUFDLFlBQVksQ0FBQyxDQUFDLENBQUMsY0FBYyxDQUFDLENBQUMsQ0FBQyxrQkFBa0IsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCB0eXBlIERhZmZCYWNrZHJvcEFuaW1hdGlvblN0YXRlID0gJ2ludGVyYWN0YWJsZScgfCAnbm9uLWludGVyYWN0YWJsZSc7XG5leHBvcnQgY29uc3QgZ2V0QW5pbWF0aW9uU3RhdGUgPSAoaW50ZXJhY3RhYmxlOiBib29sZWFuKTogRGFmZkJhY2tkcm9wQW5pbWF0aW9uU3RhdGU9PiBpbnRlcmFjdGFibGUgPyAnaW50ZXJhY3RhYmxlJyA6ICdub24taW50ZXJhY3RhYmxlJztcbiJdfQ==

package/esm2020/molecules/backdrop/animation/backdrop-animation.mjs

@@ -1,9 +1,13 @@
-import { animate, style, transition, trigger, } from '@angular/animations';
+import { animate, state, style, transition, trigger, } from '@angular/animations';
 const animationDuration = '350ms';
 const backdropTransitionOut = 'cubic-bezier(0.4, 0.0, 1, 1)';
 const backdropTransitionIn = 'cubic-bezier(0.0, 0.0, 0.2, 1)';
 export const daffBackdropAnimations = {
     fadeBackdrop: trigger('fadeBackdrop', [
+        state('interactable', style({ opacity: 1 })),
+        state('non-interactable', style({ opacity: 0 })),
+        transition('interactable => non-interactable', animate(animationDuration + ' ' + backdropTransitionOut)),
+        transition('non-interactable => interactable', animate(animationDuration + ' ' + backdropTransitionIn)),
         transition(':enter', [
             style({ opacity: 0 }),
             animate(animationDuration + ' ' + backdropTransitionIn, style({ opacity: 1 })),
@@ -13,4 +17,4 @@ export const daffBackdropAnimations = {
         ]),
     ]),
 };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFja2Ryb3AtYW5pbWF0aW9uLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9kZXNpZ24vc3JjL21vbGVjdWxlcy9iYWNrZHJvcC9hbmltYXRpb24vYmFja2Ryb3AtYW5pbWF0aW9uLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxPQUFPLEVBRVAsS0FBSyxFQUNMLFVBQVUsRUFDVixPQUFPLEdBRVIsTUFBTSxxQkFBcUIsQ0FBQztBQUU3QixNQUFNLGlCQUFpQixHQUFHLE9BQU8sQ0FBQztBQUNsQyxNQUFNLHFCQUFxQixHQUFHLDhCQUE4QixDQUFDO0FBQzdELE1BQU0sb0JBQW9CLEdBQUcsZ0NBQWdDLENBQUM7QUFFOUQsTUFBTSxDQUFDLE1BQU0sc0JBQXNCLEdBRS9CO0lBQ0YsWUFBWSxFQUFFLE9BQU8sQ0FBQyxjQUFjLEVBQUU7UUFDcEMsVUFBVSxDQUFDLFFBQVEsRUFBRTtZQUNuQixLQUFLLENBQUMsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLENBQUM7WUFDckIsT0FBTyxDQUFDLGlCQUFpQixHQUFHLEdBQUcsR0FBRyxvQkFBb0IsRUFBRSxLQUFLLENBQUMsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQztTQUMvRSxDQUFDO1FBQ0YsVUFBVSxDQUFDLFFBQVEsRUFBRTtZQUNuQixPQUFPLENBQUMsaUJBQWlCLEdBQUcsR0FBRyxHQUFHLHFCQUFxQixFQUFFLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFDO1NBQ2hGLENBQUM7S0FDSCxDQUFDO0NBQ0gsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIGFuaW1hdGUsXG4gIHN0YXRlLFxuICBzdHlsZSxcbiAgdHJhbnNpdGlvbixcbiAgdHJpZ2dlcixcbiAgQW5pbWF0aW9uVHJpZ2dlck1ldGFkYXRhLFxufSBmcm9tICdAYW5ndWxhci9hbmltYXRpb25zJztcblxuY29uc3QgYW5pbWF0aW9uRHVyYXRpb24gPSAnMzUwbXMnO1xuY29uc3QgYmFja2Ryb3BUcmFuc2l0aW9uT3V0ID0gJ2N1YmljLWJlemllcigwLjQsIDAuMCwgMSwgMSknO1xuY29uc3QgYmFja2Ryb3BUcmFuc2l0aW9uSW4gPSAnY3ViaWMtYmV6aWVyKDAuMCwgMC4wLCAwLjIsIDEpJztcblxuZXhwb3J0IGNvbnN0IGRhZmZCYWNrZHJvcEFuaW1hdGlvbnM6IHtcbiAgcmVhZG9ubHkgZmFkZUJhY2tkcm9wOiBBbmltYXRpb25UcmlnZ2VyTWV0YWRhdGE7XG59ID0ge1xuICBmYWRlQmFja2Ryb3A6IHRyaWdnZXIoJ2ZhZGVCYWNrZHJvcCcsIFtcbiAgICB0cmFuc2l0aW9uKCc6ZW50ZXInLCBbXG4gICAgICBzdHlsZSh7IG9wYWNpdHk6IDAgfSksXG4gICAgICBhbmltYXRlKGFuaW1hdGlvbkR1cmF0aW9uICsgJyAnICsgYmFja2Ryb3BUcmFuc2l0aW9uSW4sIHN0eWxlKHsgb3BhY2l0eTogMSB9KSksXG4gICAgXSksXG4gICAgdHJhbnNpdGlvbignOmxlYXZlJywgW1xuICAgICAgYW5pbWF0ZShhbmltYXRpb25EdXJhdGlvbiArICcgJyArIGJhY2tkcm9wVHJhbnNpdGlvbk91dCwgc3R5bGUoeyBvcGFjaXR5OiAwIH0pKSxcbiAgICBdKSxcbiAgXSksXG59O1xuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFja2Ryb3AtYW5pbWF0aW9uLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9kZXNpZ24vc3JjL21vbGVjdWxlcy9iYWNrZHJvcC9hbmltYXRpb24vYmFja2Ryb3AtYW5pbWF0aW9uLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxPQUFPLEVBQ1AsS0FBSyxFQUNMLEtBQUssRUFDTCxVQUFVLEVBQ1YsT0FBTyxHQUVSLE1BQU0scUJBQXFCLENBQUM7QUFFN0IsTUFBTSxpQkFBaUIsR0FBRyxPQUFPLENBQUM7QUFDbEMsTUFBTSxxQkFBcUIsR0FBRyw4QkFBOEIsQ0FBQztBQUM3RCxNQUFNLG9CQUFvQixHQUFHLGdDQUFnQyxDQUFDO0FBRTlELE1BQU0sQ0FBQyxNQUFNLHNCQUFzQixHQUUvQjtJQUNGLFlBQVksRUFBRSxPQUFPLENBQUMsY0FBYyxFQUFFO1FBQ3BDLEtBQUssQ0FBQyxjQUFjLEVBQUUsS0FBSyxDQUFDLEVBQUUsT0FBTyxFQUFFLENBQUMsRUFBRSxDQUFDLENBQUM7UUFDNUMsS0FBSyxDQUFDLGtCQUFrQixFQUFFLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFDO1FBQ2hELFVBQVUsQ0FBQyxrQ0FBa0MsRUFBRSxPQUFPLENBQUMsaUJBQWlCLEdBQUcsR0FBRyxHQUFHLHFCQUFxQixDQUFDLENBQUM7UUFDeEcsVUFBVSxDQUFDLGtDQUFrQyxFQUFFLE9BQU8sQ0FBQyxpQkFBaUIsR0FBRyxHQUFHLEdBQUcsb0JBQW9CLENBQUMsQ0FBQztRQUN2RyxVQUFVLENBQUMsUUFBUSxFQUFFO1lBQ25CLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsQ0FBQztZQUNyQixPQUFPLENBQUMsaUJBQWlCLEdBQUcsR0FBRyxHQUFHLG9CQUFvQixFQUFFLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFDO1NBQy9FLENBQUM7UUFDRixVQUFVLENBQUMsUUFBUSxFQUFFO1lBQ25CLE9BQU8sQ0FBQyxpQkFBaUIsR0FBRyxHQUFHLEdBQUcscUJBQXFCLEVBQUUsS0FBSyxDQUFDLEVBQUUsT0FBTyxFQUFFLENBQUMsRUFBRSxDQUFDLENBQUM7U0FDaEYsQ0FBQztLQUNILENBQUM7Q0FDSCxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgYW5pbWF0ZSxcbiAgc3RhdGUsXG4gIHN0eWxlLFxuICB0cmFuc2l0aW9uLFxuICB0cmlnZ2VyLFxuICBBbmltYXRpb25UcmlnZ2VyTWV0YWRhdGEsXG59IGZyb20gJ0Bhbmd1bGFyL2FuaW1hdGlvbnMnO1xuXG5jb25zdCBhbmltYXRpb25EdXJhdGlvbiA9ICczNTBtcyc7XG5jb25zdCBiYWNrZHJvcFRyYW5zaXRpb25PdXQgPSAnY3ViaWMtYmV6aWVyKDAuNCwgMC4wLCAxLCAxKSc7XG5jb25zdCBiYWNrZHJvcFRyYW5zaXRpb25JbiA9ICdjdWJpYy1iZXppZXIoMC4wLCAwLjAsIDAuMiwgMSknO1xuXG5leHBvcnQgY29uc3QgZGFmZkJhY2tkcm9wQW5pbWF0aW9uczoge1xuICByZWFkb25seSBmYWRlQmFja2Ryb3A6IEFuaW1hdGlvblRyaWdnZXJNZXRhZGF0YTtcbn0gPSB7XG4gIGZhZGVCYWNrZHJvcDogdHJpZ2dlcignZmFkZUJhY2tkcm9wJywgW1xuICAgIHN0YXRlKCdpbnRlcmFjdGFibGUnLCBzdHlsZSh7IG9wYWNpdHk6IDEgfSkpLFxuICAgIHN0YXRlKCdub24taW50ZXJhY3RhYmxlJywgc3R5bGUoeyBvcGFjaXR5OiAwIH0pKSxcbiAgICB0cmFuc2l0aW9uKCdpbnRlcmFjdGFibGUgPT4gbm9uLWludGVyYWN0YWJsZScsIGFuaW1hdGUoYW5pbWF0aW9uRHVyYXRpb24gKyAnICcgKyBiYWNrZHJvcFRyYW5zaXRpb25PdXQpKSxcbiAgICB0cmFuc2l0aW9uKCdub24taW50ZXJhY3RhYmxlID0+IGludGVyYWN0YWJsZScsIGFuaW1hdGUoYW5pbWF0aW9uRHVyYXRpb24gKyAnICcgKyBiYWNrZHJvcFRyYW5zaXRpb25JbikpLFxuICAgIHRyYW5zaXRpb24oJzplbnRlcicsIFtcbiAgICAgIHN0eWxlKHsgb3BhY2l0eTogMCB9KSxcbiAgICAgIGFuaW1hdGUoYW5pbWF0aW9uRHVyYXRpb24gKyAnICcgKyBiYWNrZHJvcFRyYW5zaXRpb25Jbiwgc3R5bGUoeyBvcGFjaXR5OiAxIH0pKSxcbiAgICBdKSxcbiAgICB0cmFuc2l0aW9uKCc6bGVhdmUnLCBbXG4gICAgICBhbmltYXRlKGFuaW1hdGlvbkR1cmF0aW9uICsgJyAnICsgYmFja2Ryb3BUcmFuc2l0aW9uT3V0LCBzdHlsZSh7IG9wYWNpdHk6IDAgfSkpLFxuICAgIF0pLFxuICBdKSxcbn07XG4iXX0=

package/esm2020/molecules/backdrop/backdrop/backdrop.component.mjs

@@ -1,5 +1,6 @@
 import { Component, Output, EventEmitter, Input, ChangeDetectionStrategy, HostListener, HostBinding, } from '@angular/core';
 import { daffBackdropAnimations } from '../animation/backdrop-animation';
+import { getAnimationState } from '../animation/backdrop-animation-state';
 import * as i0 from "@angular/core";
 export class DaffBackdropComponent {
     constructor() {
@@ -8,6 +9,10 @@ export class DaffBackdropComponent {
          */
         // eslint-disable-next-line @typescript-eslint/no-inferrable-types
         this.transparent = false;
+        /**
+         * Determines whether or not the backdrop is interactable.
+         */
+        this.interactable = true;
         /**
          * Boolean property that determines whether or not the
          * backdrop should fill up its containing window.
@@ -18,35 +23,65 @@ export class DaffBackdropComponent {
          * Output event triggered when the backdrop is clicked.
          */
         this.backdropClicked = new EventEmitter();
+        this.interactableClass = true;
+    }
+    ngOnInit() {
+        this.interactableClass = this.interactable;
     }
     /**
      * Animation hook for that controls the backdrops
      * entrance and fade animations.
      */
+    get fadeBackdropTrigger() {
+        return getAnimationState(this.interactable);
+    }
+    animationDone(e) {
+        this.interactableClass = !(e.toState === ':leave' || e.toState === 'non-interactable');
+    }
+    animationStart(e) {
+        if (e.toState === ':enter' || e.toState === 'interactable') {
+            this.interactableClass = true;
+        }
+    }
+    /**
+     * @deprecated
+     * Backdrop event that triggers when the backdrop element is clicked.
+     */
     onBackdropClicked() {
         this.backdropClicked.emit();
     }
 }
 /** @nocollapse */ DaffBackdropComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: DaffBackdropComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ DaffBackdropComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: DaffBackdropComponent, selector: "daff-backdrop", inputs: { transparent: "transparent", fullscreen: "fullscreen" }, outputs: { backdropClicked: "backdropClicked" }, host: { listeners: { "click": "onBackdropClicked()" }, properties: { "@fadeBackdrop": "this.onBackdropClicked" } }, ngImport: i0, template: "<div class=\"daff-backdrop\" [class.daff-backdrop--fullscreen]=\"fullscreen\" [class.daff-backdrop--transparent]=\"transparent\"></div>\n", styles: [":host{cursor:pointer;-webkit-user-select:none;user-select:none;display:block;-webkit-tap-highlight-color:rgba(0,0,0,0)}.daff-backdrop{background:rgba(0,0,0,.3);height:100%;width:100%}.daff-backdrop--transparent{background:none}.daff-backdrop:focus,.daff-backdrop:active,.daff-backdrop:visited{outline:0}.daff-backdrop--fullscreen{position:absolute}\n"], animations: [
+/** @nocollapse */ DaffBackdropComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: DaffBackdropComponent, selector: "daff-backdrop", inputs: { transparent: "transparent", interactable: "interactable", fullscreen: "fullscreen" }, outputs: { backdropClicked: "backdropClicked" }, host: { listeners: { "@fadeBackdrop.done": "animationDone($event)", "@fadeBackdrop.start": "animationStart($event)", "click": "onBackdropClicked()" }, properties: { "class.interactable": "this.interactableClass", "@fadeBackdrop": "this.fadeBackdropTrigger" } }, ngImport: i0, template: "<div class=\"daff-backdrop\" [class.daff-backdrop--fullscreen]=\"fullscreen\" [class.daff-backdrop--transparent]=\"transparent\"></div>\n", styles: [":host{display:block;-webkit-tap-highlight-color:rgba(0,0,0,0);visibility:hidden;pointer-events:none}:host.interactable{visibility:visible;pointer-events:all;cursor:pointer;-webkit-user-select:none;user-select:none}.daff-backdrop{background:rgba(0,0,0,.3);height:100%;width:100%}.daff-backdrop--transparent{background:none}.daff-backdrop:focus,.daff-backdrop:active,.daff-backdrop:visited{outline:0}.daff-backdrop--fullscreen{position:absolute}\n"], animations: [
         daffBackdropAnimations.fadeBackdrop,
     ], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: DaffBackdropComponent, decorators: [{
             type: Component,
             args: [{ selector: 'daff-backdrop', animations: [
                         daffBackdropAnimations.fadeBackdrop,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"daff-backdrop\" [class.daff-backdrop--fullscreen]=\"fullscreen\" [class.daff-backdrop--transparent]=\"transparent\"></div>\n", styles: [":host{cursor:pointer;-webkit-user-select:none;user-select:none;display:block;-webkit-tap-highlight-color:rgba(0,0,0,0)}.daff-backdrop{background:rgba(0,0,0,.3);height:100%;width:100%}.daff-backdrop--transparent{background:none}.daff-backdrop:focus,.daff-backdrop:active,.daff-backdrop:visited{outline:0}.daff-backdrop--fullscreen{position:absolute}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"daff-backdrop\" [class.daff-backdrop--fullscreen]=\"fullscreen\" [class.daff-backdrop--transparent]=\"transparent\"></div>\n", styles: [":host{display:block;-webkit-tap-highlight-color:rgba(0,0,0,0);visibility:hidden;pointer-events:none}:host.interactable{visibility:visible;pointer-events:all;cursor:pointer;-webkit-user-select:none;user-select:none}.daff-backdrop{background:rgba(0,0,0,.3);height:100%;width:100%}.daff-backdrop--transparent{background:none}.daff-backdrop:focus,.daff-backdrop:active,.daff-backdrop:visited{outline:0}.daff-backdrop--fullscreen{position:absolute}\n"] }]
         }], propDecorators: { transparent: [{
                 type: Input
+            }], interactable: [{
+                type: Input
             }], fullscreen: [{
                 type: Input
             }], backdropClicked: [{
                 type: Output
-            }], onBackdropClicked: [{
+            }], interactableClass: [{
+                type: HostBinding,
+                args: ['class.interactable']
+            }], fadeBackdropTrigger: [{
                 type: HostBinding,
                 args: ['@fadeBackdrop']
-            }, {
+            }], animationDone: [{
+                type: HostListener,
+                args: ['@fadeBackdrop.done', ['$event']]
+            }], animationStart: [{
+                type: HostListener,
+                args: ['@fadeBackdrop.start', ['$event']]
+            }], onBackdropClicked: [{
                 type: HostListener,
                 args: ['click']
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFja2Ryb3AuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9kZXNpZ24vc3JjL21vbGVjdWxlcy9iYWNrZHJvcC9iYWNrZHJvcC9iYWNrZHJvcC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2Rlc2lnbi9zcmMvbW9sZWN1bGVzL2JhY2tkcm9wL2JhY2tkcm9wL2JhY2tkcm9wLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsTUFBTSxFQUNOLFlBQVksRUFDWixLQUFLLEVBQ0wsdUJBQXVCLEVBQ3ZCLFlBQVksRUFDWixXQUFXLEdBQ1osTUFBTSxlQUFlLENBQUM7QUFFdkIsT0FBTyxFQUFFLHNCQUFzQixFQUFFLE1BQU0saUNBQWlDLENBQUM7O0FBV3pFLE1BQU0sT0FBTyxxQkFBcUI7SUFUbEM7UUFXRTs7V0FFRztRQUNILGtFQUFrRTtRQUN6RCxnQkFBVyxHQUFZLEtBQUssQ0FBQztRQUV0Qzs7O1dBR0c7UUFDSCxrRUFBa0U7UUFDekQsZUFBVSxHQUFZLEtBQUssQ0FBQztRQUVyQzs7V0FFRztRQUNPLG9CQUFlLEdBQXVCLElBQUksWUFBWSxFQUFRLENBQUM7S0FnQjFFO0lBZEM7OztPQUdHO0lBUUgsaUJBQWlCO1FBQ2YsSUFBSSxDQUFDLGVBQWUsQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUM5QixDQUFDOztxSUFqQ1UscUJBQXFCO3lIQUFyQixxQkFBcUIsNFJDckJsQywySUFDQSwwWERlYztRQUNWLHNCQUFzQixDQUFDLFlBQVk7S0FDcEM7MkZBR1UscUJBQXFCO2tCQVRqQyxTQUFTOytCQUNFLGVBQWUsY0FHYjt3QkFDVixzQkFBc0IsQ0FBQyxZQUFZO3FCQUNwQyxtQkFDZ0IsdUJBQXVCLENBQUMsTUFBTTs4QkFRdEMsV0FBVztzQkFBbkIsS0FBSztnQkFPRyxVQUFVO3NCQUFsQixLQUFLO2dCQUtJLGVBQWU7c0JBQXhCLE1BQU07Z0JBYVAsaUJBQWlCO3NCQVBoQixXQUFXO3VCQUFDLGVBQWU7O3NCQU0zQixZQUFZO3VCQUFDLE9BQU8iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDb21wb25lbnQsXG4gIE91dHB1dCxcbiAgRXZlbnRFbWl0dGVyLFxuICBJbnB1dCxcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIEhvc3RMaXN0ZW5lcixcbiAgSG9zdEJpbmRpbmcsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5pbXBvcnQgeyBkYWZmQmFja2Ryb3BBbmltYXRpb25zIH0gZnJvbSAnLi4vYW5pbWF0aW9uL2JhY2tkcm9wLWFuaW1hdGlvbic7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2RhZmYtYmFja2Ryb3AnLFxuICB0ZW1wbGF0ZVVybDogJy4vYmFja2Ryb3AuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9iYWNrZHJvcC5jb21wb25lbnQuc2NzcyddLFxuICBhbmltYXRpb25zOiBbXG4gICAgZGFmZkJhY2tkcm9wQW5pbWF0aW9ucy5mYWRlQmFja2Ryb3AsXG4gIF0sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBEYWZmQmFja2Ryb3BDb21wb25lbnQge1xuXG4gIC8qKlxuICAgKiBEZXRlcm1pbmVzIHdoZXRoZXIgb3Igbm90IHRoZSBiYWNrZHJvcCBpcyB0cmFuc3BhcmVudC5cbiAgICovXG4gIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbm8taW5mZXJyYWJsZS10eXBlc1xuICBASW5wdXQoKSB0cmFuc3BhcmVudDogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIC8qKlxuICAgKiBCb29sZWFuIHByb3BlcnR5IHRoYXQgZGV0ZXJtaW5lcyB3aGV0aGVyIG9yIG5vdCB0aGVcbiAgICogYmFja2Ryb3Agc2hvdWxkIGZpbGwgdXAgaXRzIGNvbnRhaW5pbmcgd2luZG93LlxuICAgKi9cbiAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uby1pbmZlcnJhYmxlLXR5cGVzXG4gIEBJbnB1dCgpIGZ1bGxzY3JlZW46IGJvb2xlYW4gPSBmYWxzZTtcblxuICAvKipcbiAgICogT3V0cHV0IGV2ZW50IHRyaWdnZXJlZCB3aGVuIHRoZSBiYWNrZHJvcCBpcyBjbGlja2VkLlxuICAgKi9cbiAgQE91dHB1dCgpIGJhY2tkcm9wQ2xpY2tlZDogRXZlbnRFbWl0dGVyPHZvaWQ+ID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xuXG4gIC8qKlxuICAgKiBBbmltYXRpb24gaG9vayBmb3IgdGhhdCBjb250cm9scyB0aGUgYmFja2Ryb3BzXG4gICAqIGVudHJhbmNlIGFuZCBmYWRlIGFuaW1hdGlvbnMuXG4gICAqL1xuICBASG9zdEJpbmRpbmcoJ0BmYWRlQmFja2Ryb3AnKVxuXG4gIC8qKlxuICAgKiBAZGVwcmVjYXRlZFxuICAgKiBCYWNrZHJvcCBldmVudCB0aGF0IHRyaWdnZXJzIHdoZW4gdGhlIGJhY2tkcm9wIGVsZW1lbnQgaXMgY2xpY2tlZC5cbiAgICovXG4gIEBIb3N0TGlzdGVuZXIoJ2NsaWNrJylcbiAgb25CYWNrZHJvcENsaWNrZWQoKTogdm9pZCB7XG4gICAgdGhpcy5iYWNrZHJvcENsaWNrZWQuZW1pdCgpO1xuICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwiZGFmZi1iYWNrZHJvcFwiIFtjbGFzcy5kYWZmLWJhY2tkcm9wLS1mdWxsc2NyZWVuXT1cImZ1bGxzY3JlZW5cIiBbY2xhc3MuZGFmZi1iYWNrZHJvcC0tdHJhbnNwYXJlbnRdPVwidHJhbnNwYXJlbnRcIj48L2Rpdj5cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFja2Ryb3AuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9kZXNpZ24vc3JjL21vbGVjdWxlcy9iYWNrZHJvcC9iYWNrZHJvcC9iYWNrZHJvcC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2Rlc2lnbi9zcmMvbW9sZWN1bGVzL2JhY2tkcm9wL2JhY2tkcm9wL2JhY2tkcm9wLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsTUFBTSxFQUNOLFlBQVksRUFDWixLQUFLLEVBQ0wsdUJBQXVCLEVBQ3ZCLFlBQVksRUFDWixXQUFXLEdBR1osTUFBTSxlQUFlLENBQUM7QUFFdkIsT0FBTyxFQUFFLHNCQUFzQixFQUFFLE1BQU0saUNBQWlDLENBQUM7QUFDekUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sdUNBQXVDLENBQUM7O0FBVzFFLE1BQU0sT0FBTyxxQkFBcUI7SUFUbEM7UUFXRTs7V0FFRztRQUNILGtFQUFrRTtRQUN6RCxnQkFBVyxHQUFZLEtBQUssQ0FBQztRQUV0Qzs7V0FFRztRQUNNLGlCQUFZLEdBQUcsSUFBSSxDQUFDO1FBRTdCOzs7V0FHRztRQUNILGtFQUFrRTtRQUN6RCxlQUFVLEdBQVksS0FBSyxDQUFDO1FBRXJDOztXQUVHO1FBQ08sb0JBQWUsR0FBdUIsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUV0QyxzQkFBaUIsR0FBRyxJQUFJLENBQUM7S0FrQzdEO0lBaENDLFFBQVE7UUFDTixJQUFJLENBQUMsaUJBQWlCLEdBQUcsSUFBSSxDQUFDLFlBQVksQ0FBQztJQUM3QyxDQUFDO0lBRUQ7OztPQUdHO0lBQ0gsSUFBa0MsbUJBQW1CO1FBQ25ELE9BQU8saUJBQWlCLENBQUMsSUFBSSxDQUFDLFlBQVksQ0FBQyxDQUFDO0lBQzlDLENBQUM7SUFHRCxhQUFhLENBQUMsQ0FBaUI7UUFDOUIsSUFBSSxDQUFDLGlCQUFpQixHQUFHLENBQUMsQ0FBQyxDQUFDLENBQUMsT0FBTyxLQUFLLFFBQVEsSUFBSSxDQUFDLENBQUMsT0FBTyxLQUFLLGtCQUFrQixDQUFDLENBQUM7SUFDeEYsQ0FBQztJQUdELGNBQWMsQ0FBQyxDQUFpQjtRQUMvQixJQUFHLENBQUMsQ0FBQyxPQUFPLEtBQUssUUFBUSxJQUFJLENBQUMsQ0FBQyxPQUFPLEtBQUssY0FBYyxFQUFDO1lBQ3hELElBQUksQ0FBQyxpQkFBaUIsR0FBRyxJQUFJLENBQUM7U0FDL0I7SUFDRixDQUFDO0lBRUQ7OztPQUdHO0lBRUgsaUJBQWlCO1FBQ2hCLElBQUksQ0FBQyxlQUFlLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDN0IsQ0FBQzs7cUlBMURVLHFCQUFxQjt5SEFBckIscUJBQXFCLDRjQ3pCbEMsMklBQ0EseWREbUJjO1FBQ1Ysc0JBQXNCLENBQUMsWUFBWTtLQUNwQzsyRkFHVSxxQkFBcUI7a0JBVGpDLFNBQVM7K0JBQ0UsZUFBZSxjQUdiO3dCQUNWLHNCQUFzQixDQUFDLFlBQVk7cUJBQ3BDLG1CQUNnQix1QkFBdUIsQ0FBQyxNQUFNOzhCQVF0QyxXQUFXO3NCQUFuQixLQUFLO2dCQUtHLFlBQVk7c0JBQXBCLEtBQUs7Z0JBT0csVUFBVTtzQkFBbEIsS0FBSztnQkFLSSxlQUFlO3NCQUF4QixNQUFNO2dCQUU0QixpQkFBaUI7c0JBQW5ELFdBQVc7dUJBQUMsb0JBQW9CO2dCQVVDLG1CQUFtQjtzQkFBcEQsV0FBVzt1QkFBQyxlQUFlO2dCQUs1QixhQUFhO3NCQURaLFlBQVk7dUJBQUMsb0JBQW9CLEVBQUUsQ0FBQyxRQUFRLENBQUM7Z0JBTTlDLGNBQWM7c0JBRGIsWUFBWTt1QkFBQyxxQkFBcUIsRUFBRSxDQUFDLFFBQVEsQ0FBQztnQkFZL0MsaUJBQWlCO3NCQURoQixZQUFZO3VCQUFDLE9BQU8iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBbmltYXRpb25FdmVudCB9IGZyb20gJ0Bhbmd1bGFyL2FuaW1hdGlvbnMnO1xuaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBPdXRwdXQsXG4gIEV2ZW50RW1pdHRlcixcbiAgSW5wdXQsXG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBIb3N0TGlzdGVuZXIsXG4gIEhvc3RCaW5kaW5nLFxuICBFbGVtZW50UmVmLFxuICBPbkluaXQsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5pbXBvcnQgeyBkYWZmQmFja2Ryb3BBbmltYXRpb25zIH0gZnJvbSAnLi4vYW5pbWF0aW9uL2JhY2tkcm9wLWFuaW1hdGlvbic7XG5pbXBvcnQgeyBnZXRBbmltYXRpb25TdGF0ZSB9IGZyb20gJy4uL2FuaW1hdGlvbi9iYWNrZHJvcC1hbmltYXRpb24tc3RhdGUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdkYWZmLWJhY2tkcm9wJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2JhY2tkcm9wLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vYmFja2Ryb3AuY29tcG9uZW50LnNjc3MnXSxcbiAgYW5pbWF0aW9uczogW1xuICAgIGRhZmZCYWNrZHJvcEFuaW1hdGlvbnMuZmFkZUJhY2tkcm9wLFxuICBdLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgRGFmZkJhY2tkcm9wQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcblxuICAvKipcbiAgICogRGV0ZXJtaW5lcyB3aGV0aGVyIG9yIG5vdCB0aGUgYmFja2Ryb3AgaXMgdHJhbnNwYXJlbnQuXG4gICAqL1xuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25vLWluZmVycmFibGUtdHlwZXNcbiAgQElucHV0KCkgdHJhbnNwYXJlbnQ6IGJvb2xlYW4gPSBmYWxzZTtcblxuICAvKipcbiAgICogRGV0ZXJtaW5lcyB3aGV0aGVyIG9yIG5vdCB0aGUgYmFja2Ryb3AgaXMgaW50ZXJhY3RhYmxlLlxuICAgKi9cbiAgQElucHV0KCkgaW50ZXJhY3RhYmxlID0gdHJ1ZTtcblxuICAvKipcbiAgICogQm9vbGVhbiBwcm9wZXJ0eSB0aGF0IGRldGVybWluZXMgd2hldGhlciBvciBub3QgdGhlXG4gICAqIGJhY2tkcm9wIHNob3VsZCBmaWxsIHVwIGl0cyBjb250YWluaW5nIHdpbmRvdy5cbiAgICovXG4gIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbm8taW5mZXJyYWJsZS10eXBlc1xuICBASW5wdXQoKSBmdWxsc2NyZWVuOiBib29sZWFuID0gZmFsc2U7XG5cbiAgLyoqXG4gICAqIE91dHB1dCBldmVudCB0cmlnZ2VyZWQgd2hlbiB0aGUgYmFja2Ryb3AgaXMgY2xpY2tlZC5cbiAgICovXG4gIEBPdXRwdXQoKSBiYWNrZHJvcENsaWNrZWQ6IEV2ZW50RW1pdHRlcjx2b2lkPiA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcblxuICBASG9zdEJpbmRpbmcoJ2NsYXNzLmludGVyYWN0YWJsZScpIGludGVyYWN0YWJsZUNsYXNzID0gdHJ1ZTtcblxuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLmludGVyYWN0YWJsZUNsYXNzID0gdGhpcy5pbnRlcmFjdGFibGU7XG4gIH1cblxuICAvKipcbiAgICogQW5pbWF0aW9uIGhvb2sgZm9yIHRoYXQgY29udHJvbHMgdGhlIGJhY2tkcm9wc1xuICAgKiBlbnRyYW5jZSBhbmQgZmFkZSBhbmltYXRpb25zLlxuICAgKi9cbiAgQEhvc3RCaW5kaW5nKCdAZmFkZUJhY2tkcm9wJykgZ2V0IGZhZGVCYWNrZHJvcFRyaWdnZXIoKSB7XG4gICAgcmV0dXJuIGdldEFuaW1hdGlvblN0YXRlKHRoaXMuaW50ZXJhY3RhYmxlKTtcbiAgfVxuXG4gIEBIb3N0TGlzdGVuZXIoJ0BmYWRlQmFja2Ryb3AuZG9uZScsIFsnJGV2ZW50J10pXG4gIGFuaW1hdGlvbkRvbmUoZTogQW5pbWF0aW9uRXZlbnQpIHtcblx0ICB0aGlzLmludGVyYWN0YWJsZUNsYXNzID0gIShlLnRvU3RhdGUgPT09ICc6bGVhdmUnIHx8IGUudG9TdGF0ZSA9PT0gJ25vbi1pbnRlcmFjdGFibGUnKTtcbiAgfVxuXG4gIEBIb3N0TGlzdGVuZXIoJ0BmYWRlQmFja2Ryb3Auc3RhcnQnLCBbJyRldmVudCddKVxuICBhbmltYXRpb25TdGFydChlOiBBbmltYXRpb25FdmVudCkge1xuXHQgIGlmKGUudG9TdGF0ZSA9PT0gJzplbnRlcicgfHwgZS50b1N0YXRlID09PSAnaW50ZXJhY3RhYmxlJyl7XG5cdCAgICB0aGlzLmludGVyYWN0YWJsZUNsYXNzID0gdHJ1ZTtcblx0ICB9XG4gIH1cblxuICAvKipcbiAgICogQGRlcHJlY2F0ZWRcbiAgICogQmFja2Ryb3AgZXZlbnQgdGhhdCB0cmlnZ2VycyB3aGVuIHRoZSBiYWNrZHJvcCBlbGVtZW50IGlzIGNsaWNrZWQuXG4gICAqL1xuICBASG9zdExpc3RlbmVyKCdjbGljaycpXG4gIG9uQmFja2Ryb3BDbGlja2VkKCk6IHZvaWQge1xuXHQgIHRoaXMuYmFja2Ryb3BDbGlja2VkLmVtaXQoKTtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cImRhZmYtYmFja2Ryb3BcIiBbY2xhc3MuZGFmZi1iYWNrZHJvcC0tZnVsbHNjcmVlbl09XCJmdWxsc2NyZWVuXCIgW2NsYXNzLmRhZmYtYmFja2Ryb3AtLXRyYW5zcGFyZW50XT1cInRyYW5zcGFyZW50XCI+PC9kaXY+XG4iXX0=

package/esm2020/molecules/media-gallery/media-gallery.component.mjs

@@ -44,13 +44,13 @@ export class DaffMediaGalleryComponent extends _daffMediaGalleryBase {
 /** @nocollapse */ DaffMediaGalleryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: DaffMediaGalleryComponent, selector: "daff-media-gallery", inputs: { skeleton: "skeleton", name: "name" }, host: { properties: { "class.daff-media-gallery": "this.class" } }, providers: [
         // eslint-disable-next-line @typescript-eslint/no-use-before-define
         { provide: DAFF_MEDIA_GALLERY_TOKEN, useExisting: DaffMediaGalleryComponent },
-    ], usesInheritance: true, ngImport: i0, template: "<div class=\"daff-media-gallery__thumbnails\">\n\t<ng-content select=\"[daffThumbnail]\"></ng-content>\n</div>\n<div class=\"daff-media-gallery__selected-thumbnail\">\n\t<daff-media-renderer></daff-media-renderer>\n</div>", styles: [":host(.daff-media-gallery){display:flex;flex-direction:column}@media (min-width: 1024px){:host(.daff-media-gallery){flex-direction:row}}:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{cursor:pointer;-webkit-user-select:none;display:inline-block;height:64px;width:64px;margin:0 2px;max-width:100%;overflow:hidden;user-select:none}@media (min-width: 480px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{height:72px;width:72px}}@media (min-width: 1024px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{display:block;margin:0 0 4px;height:80px;width:80px}}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1.5s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:72px;width:72px;position:absolute;top:0;left:0}@media (min-width: 1024px){:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1.5s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:80px;width:80px;position:absolute;top:0;left:0}}:host(.daff-media-gallery).daff-skeleton ::ng-deep img{opacity:0}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail{display:flex}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail:before{animation-name:loading;animation-duration:1.5s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:100%;width:100%;position:absolute;top:0;left:0}.daff-media-gallery__thumbnails{margin:0 -2px;max-height:100%;order:2}@media (min-width: 1024px){.daff-media-gallery__thumbnails{margin:0 8px 0 0;order:1}}.daff-media-gallery__selected-thumbnail{display:block;flex-grow:1;order:1;position:relative}@media (min-width: 1024px){.daff-media-gallery__selected-thumbnail{order:2}}\n"], components: [{ type: i2.DaffMediaRendererComponent, selector: "daff-media-renderer" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    ], usesInheritance: true, ngImport: i0, template: "<div class=\"daff-media-gallery__thumbnails\">\n\t<ng-content select=\"[daffThumbnail]\"></ng-content>\n</div>\n<div class=\"daff-media-gallery__selected-thumbnail\">\n\t<daff-media-renderer></daff-media-renderer>\n</div>", styles: [":host(.daff-media-gallery){display:flex;flex-direction:column}@media (min-width: 1024px){:host(.daff-media-gallery){flex-direction:row}}:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{cursor:pointer;-webkit-user-select:none;display:inline-block;height:64px;width:64px;margin:0 2px;max-width:100%;overflow:hidden;user-select:none}@media (min-width: 480px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{height:72px;width:72px}}@media (min-width: 1024px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{display:block;margin:0 0 4px;height:80px;width:80px}}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1.5s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:72px;width:72px;position:absolute;top:0;left:0}@media (min-width: 1024px){:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1.5s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:80px;width:80px;position:absolute;top:0;left:0}}:host(.daff-media-gallery).daff-skeleton ::ng-deep img{opacity:0}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail:before{animation-name:loading;animation-duration:1.5s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:100%;width:100%;position:absolute;top:0;left:0}.daff-media-gallery__thumbnails{margin:0 -2px;max-height:100%;order:2}@media (min-width: 1024px){.daff-media-gallery__thumbnails{margin:0 8px 0 0;order:1}}.daff-media-gallery__selected-thumbnail{display:block;flex-grow:1;order:1;position:relative}@media (min-width: 1024px){.daff-media-gallery__selected-thumbnail{order:2}}\n"], components: [{ type: i2.DaffMediaRendererComponent, selector: "daff-media-renderer" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: DaffMediaGalleryComponent, decorators: [{
             type: Component,
             args: [{ selector: 'daff-media-gallery', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         // eslint-disable-next-line @typescript-eslint/no-use-before-define
                         { provide: DAFF_MEDIA_GALLERY_TOKEN, useExisting: DaffMediaGalleryComponent },
-                    ], inputs: ['skeleton'], template: "<div class=\"daff-media-gallery__thumbnails\">\n\t<ng-content select=\"[daffThumbnail]\"></ng-content>\n</div>\n<div class=\"daff-media-gallery__selected-thumbnail\">\n\t<daff-media-renderer></daff-media-renderer>\n</div>", styles: [":host(.daff-media-gallery){display:flex;flex-direction:column}@media (min-width: 1024px){:host(.daff-media-gallery){flex-direction:row}}:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{cursor:pointer;-webkit-user-select:none;display:inline-block;height:64px;width:64px;margin:0 2px;max-width:100%;overflow:hidden;user-select:none}@media (min-width: 480px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{height:72px;width:72px}}@media (min-width: 1024px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{display:block;margin:0 0 4px;height:80px;width:80px}}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1.5s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:72px;width:72px;position:absolute;top:0;left:0}@media (min-width: 1024px){:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1.5s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:80px;width:80px;position:absolute;top:0;left:0}}:host(.daff-media-gallery).daff-skeleton ::ng-deep img{opacity:0}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail{display:flex}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail:before{animation-name:loading;animation-duration:1.5s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:100%;width:100%;position:absolute;top:0;left:0}.daff-media-gallery__thumbnails{margin:0 -2px;max-height:100%;order:2}@media (min-width: 1024px){.daff-media-gallery__thumbnails{margin:0 8px 0 0;order:1}}.daff-media-gallery__selected-thumbnail{display:block;flex-grow:1;order:1;position:relative}@media (min-width: 1024px){.daff-media-gallery__selected-thumbnail{order:2}}\n"] }]
+                    ], inputs: ['skeleton'], template: "<div class=\"daff-media-gallery__thumbnails\">\n\t<ng-content select=\"[daffThumbnail]\"></ng-content>\n</div>\n<div class=\"daff-media-gallery__selected-thumbnail\">\n\t<daff-media-renderer></daff-media-renderer>\n</div>", styles: [":host(.daff-media-gallery){display:flex;flex-direction:column}@media (min-width: 1024px){:host(.daff-media-gallery){flex-direction:row}}:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{cursor:pointer;-webkit-user-select:none;display:inline-block;height:64px;width:64px;margin:0 2px;max-width:100%;overflow:hidden;user-select:none}@media (min-width: 480px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{height:72px;width:72px}}@media (min-width: 1024px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{display:block;margin:0 0 4px;height:80px;width:80px}}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1.5s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:72px;width:72px;position:absolute;top:0;left:0}@media (min-width: 1024px){:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1.5s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:80px;width:80px;position:absolute;top:0;left:0}}:host(.daff-media-gallery).daff-skeleton ::ng-deep img{opacity:0}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail:before{animation-name:loading;animation-duration:1.5s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:100%;width:100%;position:absolute;top:0;left:0}.daff-media-gallery__thumbnails{margin:0 -2px;max-height:100%;order:2}@media (min-width: 1024px){.daff-media-gallery__thumbnails{margin:0 8px 0 0;order:1}}.daff-media-gallery__selected-thumbnail{display:block;flex-grow:1;order:1;position:relative}@media (min-width: 1024px){.daff-media-gallery__selected-thumbnail{order:2}}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.DaffMediaGalleryRegistry }]; }, propDecorators: { class: [{
                 type: HostBinding,
                 args: ['class.daff-media-gallery']

package/esm2020/molecules/qty-dropdown/qty-dropdown.component.mjs

@@ -1,7 +1,7 @@
 import { Component, Input, Renderer2, Output, EventEmitter, } from '@angular/core';
 import * as i0 from "@angular/core";
 import * as i1 from "../../atoms/form/form-field/form-field/form-field.component";
-import * as i2 from "../../atoms/form/select/select/select.component";
+import * as i2 from "../../atoms/form/native-select/native-select.component";
 import * as i3 from "../../atoms/form/input/input.component";
 import * as i4 from "@angular/common";
 import * as i5 from "@angular/forms";

package/esm2020/molecules/qty-dropdown/qty-dropdown.module.mjs

@@ -3,7 +3,7 @@ import { NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { DaffFormFieldModule } from '../../atoms/form/form-field/form-field.module';
 import { DaffInputModule } from '../../atoms/form/input/input.module';
-import { DaffNativeSelectModule } from '../../atoms/form/select/select.module';
+import { DaffNativeSelectModule } from '../../atoms/form/native-select/public_api';
 import { DaffQtyDropdownComponent } from './qty-dropdown.component';
 import * as i0 from "@angular/core";
 export class DaffQtyDropdownModule {
@@ -39,4 +39,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
                     ],
                 }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicXR5LWRyb3Bkb3duLm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMvZGVzaWduL3NyYy9tb2xlY3VsZXMvcXR5LWRyb3Bkb3duL3F0eS1kcm9wZG93bi5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBRTdDLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLCtDQUErQyxDQUFDO0FBQ3BGLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxxQ0FBcUMsQ0FBQztBQUN0RSxPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSx1Q0FBdUMsQ0FBQztBQUMvRSxPQUFPLEVBQUUsd0JBQXdCLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQzs7QUFpQnBFLE1BQU0sT0FBTyxxQkFBcUI7O3FJQUFyQixxQkFBcUI7c0lBQXJCLHFCQUFxQixpQkFOOUIsd0JBQXdCLGFBUHhCLFlBQVk7UUFDWixXQUFXO1FBQ1gsbUJBQW1CO1FBQ25CLHNCQUFzQjtRQUN0QixlQUFlLGFBTWYsd0JBQXdCO3NJQUdmLHFCQUFxQixZQWR2QjtZQUNQLFlBQVk7WUFDWixXQUFXO1lBQ1gsbUJBQW1CO1lBQ25CLHNCQUFzQjtZQUN0QixlQUFlO1NBQ2hCOzJGQVFVLHFCQUFxQjtrQkFmakMsUUFBUTttQkFBQztvQkFDUixPQUFPLEVBQUU7d0JBQ1AsWUFBWTt3QkFDWixXQUFXO3dCQUNYLG1CQUFtQjt3QkFDbkIsc0JBQXNCO3dCQUN0QixlQUFlO3FCQUNoQjtvQkFDRCxZQUFZLEVBQUU7d0JBQ1osd0JBQXdCO3FCQUN6QjtvQkFDRCxPQUFPLEVBQUU7d0JBQ1Asd0JBQXdCO3FCQUN6QjtpQkFDRiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRm9ybXNNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5cbmltcG9ydCB7IERhZmZGb3JtRmllbGRNb2R1bGUgfSBmcm9tICcuLi8uLi9hdG9tcy9mb3JtL2Zvcm0tZmllbGQvZm9ybS1maWVsZC5tb2R1bGUnO1xuaW1wb3J0IHsgRGFmZklucHV0TW9kdWxlIH0gZnJvbSAnLi4vLi4vYXRvbXMvZm9ybS9pbnB1dC9pbnB1dC5tb2R1bGUnO1xuaW1wb3J0IHsgRGFmZk5hdGl2ZVNlbGVjdE1vZHVsZSB9IGZyb20gJy4uLy4uL2F0b21zL2Zvcm0vc2VsZWN0L3NlbGVjdC5tb2R1bGUnO1xuaW1wb3J0IHsgRGFmZlF0eURyb3Bkb3duQ29tcG9uZW50IH0gZnJvbSAnLi9xdHktZHJvcGRvd24uY29tcG9uZW50JztcblxuQE5nTW9kdWxlKHtcbiAgaW1wb3J0czogW1xuICAgIENvbW1vbk1vZHVsZSxcbiAgICBGb3Jtc01vZHVsZSxcbiAgICBEYWZmRm9ybUZpZWxkTW9kdWxlLFxuICAgIERhZmZOYXRpdmVTZWxlY3RNb2R1bGUsXG4gICAgRGFmZklucHV0TW9kdWxlLFxuICBdLFxuICBkZWNsYXJhdGlvbnM6IFtcbiAgICBEYWZmUXR5RHJvcGRvd25Db21wb25lbnQsXG4gIF0sXG4gIGV4cG9ydHM6IFtcbiAgICBEYWZmUXR5RHJvcGRvd25Db21wb25lbnQsXG4gIF0sXG59KVxuZXhwb3J0IGNsYXNzIERhZmZRdHlEcm9wZG93bk1vZHVsZSB7IH1cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicXR5LWRyb3Bkb3duLm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMvZGVzaWduL3NyYy9tb2xlY3VsZXMvcXR5LWRyb3Bkb3duL3F0eS1kcm9wZG93bi5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBRTdDLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLCtDQUErQyxDQUFDO0FBQ3BGLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxxQ0FBcUMsQ0FBQztBQUN0RSxPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSwyQ0FBMkMsQ0FBQztBQUNuRixPQUFPLEVBQUUsd0JBQXdCLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQzs7QUFpQnBFLE1BQU0sT0FBTyxxQkFBcUI7O3FJQUFyQixxQkFBcUI7c0lBQXJCLHFCQUFxQixpQkFOOUIsd0JBQXdCLGFBUHhCLFlBQVk7UUFDWixXQUFXO1FBQ1gsbUJBQW1CO1FBQ25CLHNCQUFzQjtRQUN0QixlQUFlLGFBTWYsd0JBQXdCO3NJQUdmLHFCQUFxQixZQWR2QjtZQUNQLFlBQVk7WUFDWixXQUFXO1lBQ1gsbUJBQW1CO1lBQ25CLHNCQUFzQjtZQUN0QixlQUFlO1NBQ2hCOzJGQVFVLHFCQUFxQjtrQkFmakMsUUFBUTttQkFBQztvQkFDUixPQUFPLEVBQUU7d0JBQ1AsWUFBWTt3QkFDWixXQUFXO3dCQUNYLG1CQUFtQjt3QkFDbkIsc0JBQXNCO3dCQUN0QixlQUFlO3FCQUNoQjtvQkFDRCxZQUFZLEVBQUU7d0JBQ1osd0JBQXdCO3FCQUN6QjtvQkFDRCxPQUFPLEVBQUU7d0JBQ1Asd0JBQXdCO3FCQUN6QjtpQkFDRiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRm9ybXNNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5cbmltcG9ydCB7IERhZmZGb3JtRmllbGRNb2R1bGUgfSBmcm9tICcuLi8uLi9hdG9tcy9mb3JtL2Zvcm0tZmllbGQvZm9ybS1maWVsZC5tb2R1bGUnO1xuaW1wb3J0IHsgRGFmZklucHV0TW9kdWxlIH0gZnJvbSAnLi4vLi4vYXRvbXMvZm9ybS9pbnB1dC9pbnB1dC5tb2R1bGUnO1xuaW1wb3J0IHsgRGFmZk5hdGl2ZVNlbGVjdE1vZHVsZSB9IGZyb20gJy4uLy4uL2F0b21zL2Zvcm0vbmF0aXZlLXNlbGVjdC9wdWJsaWNfYXBpJztcbmltcG9ydCB7IERhZmZRdHlEcm9wZG93bkNvbXBvbmVudCB9IGZyb20gJy4vcXR5LWRyb3Bkb3duLmNvbXBvbmVudCc7XG5cbkBOZ01vZHVsZSh7XG4gIGltcG9ydHM6IFtcbiAgICBDb21tb25Nb2R1bGUsXG4gICAgRm9ybXNNb2R1bGUsXG4gICAgRGFmZkZvcm1GaWVsZE1vZHVsZSxcbiAgICBEYWZmTmF0aXZlU2VsZWN0TW9kdWxlLFxuICAgIERhZmZJbnB1dE1vZHVsZSxcbiAgXSxcbiAgZGVjbGFyYXRpb25zOiBbXG4gICAgRGFmZlF0eURyb3Bkb3duQ29tcG9uZW50LFxuICBdLFxuICBleHBvcnRzOiBbXG4gICAgRGFmZlF0eURyb3Bkb3duQ29tcG9uZW50LFxuICBdLFxufSlcbmV4cG9ydCBjbGFzcyBEYWZmUXR5RHJvcGRvd25Nb2R1bGUgeyB9XG4iXX0=

package/esm2020/molecules/sidebar/animation/sidebar-animation-state.mjs

@@ -1,6 +1,6 @@
 export const getAnimationState = (open, enabled = true) => {
     if (!enabled) {
-        return 'open';
+        return 'none';
     }
     if (open && enabled) {
         return 'open';
@@ -9,4 +9,4 @@ export const getAnimationState = (open, enabled = true) => {
         return 'closed';
     }
 };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZWJhci1hbmltYXRpb24tc3RhdGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2Rlc2lnbi9zcmMvbW9sZWN1bGVzL3NpZGViYXIvYW5pbWF0aW9uL3NpZGViYXItYW5pbWF0aW9uLXN0YXRlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE1BQU0sQ0FBQyxNQUFNLGlCQUFpQixHQUFHLENBQUMsSUFBYSxFQUFFLFVBQW1CLElBQUksRUFBRSxFQUFFO0lBQzFFLElBQUcsQ0FBQyxPQUFPLEVBQUM7UUFDVixPQUFPLE1BQU0sQ0FBQztLQUNmO0lBQ0QsSUFBRyxJQUFJLElBQUksT0FBTyxFQUFDO1FBQ2pCLE9BQU8sTUFBTSxDQUFDO0tBQ2Y7U0FBTTtRQUNMLE9BQU8sUUFBUSxDQUFDO0tBQ2pCO0FBQ0gsQ0FBQyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0IGNvbnN0IGdldEFuaW1hdGlvblN0YXRlID0gKG9wZW46IGJvb2xlYW4sIGVuYWJsZWQ6IGJvb2xlYW4gPSB0cnVlKSA9PiB7XG4gIGlmKCFlbmFibGVkKXtcbiAgICByZXR1cm4gJ29wZW4nO1xuICB9XG4gIGlmKG9wZW4gJiYgZW5hYmxlZCl7XG4gICAgcmV0dXJuICdvcGVuJztcbiAgfSBlbHNlIHtcbiAgICByZXR1cm4gJ2Nsb3NlZCc7XG4gIH1cbn07XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZWJhci1hbmltYXRpb24tc3RhdGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2Rlc2lnbi9zcmMvbW9sZWN1bGVzL3NpZGViYXIvYW5pbWF0aW9uL3NpZGViYXItYW5pbWF0aW9uLXN0YXRlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUVBLE1BQU0sQ0FBQyxNQUFNLGlCQUFpQixHQUFHLENBQUMsSUFBYSxFQUFFLFVBQW1CLElBQUksRUFBNkIsRUFBRTtJQUNyRyxJQUFHLENBQUMsT0FBTyxFQUFDO1FBQ1YsT0FBTyxNQUFNLENBQUM7S0FDZjtJQUNELElBQUcsSUFBSSxJQUFJLE9BQU8sRUFBQztRQUNqQixPQUFPLE1BQU0sQ0FBQztLQUNmO1NBQU07UUFDTCxPQUFPLFFBQVEsQ0FBQztLQUNqQjtBQUNILENBQUMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCB0eXBlIERhZmZTaWRlYmFyQW5pbWF0aW9uU3RhdGUgPSAnb3BlbicgfCAnY2xvc2VkJyB8ICdub25lJztcblxuZXhwb3J0IGNvbnN0IGdldEFuaW1hdGlvblN0YXRlID0gKG9wZW46IGJvb2xlYW4sIGVuYWJsZWQ6IGJvb2xlYW4gPSB0cnVlKTogRGFmZlNpZGViYXJBbmltYXRpb25TdGF0ZSA9PiB7XG4gIGlmKCFlbmFibGVkKXtcbiAgICByZXR1cm4gJ25vbmUnO1xuICB9XG4gIGlmKG9wZW4gJiYgZW5hYmxlZCl7XG4gICAgcmV0dXJuICdvcGVuJztcbiAgfSBlbHNlIHtcbiAgICByZXR1cm4gJ2Nsb3NlZCc7XG4gIH1cbn07XG4iXX0=

package/esm2020/molecules/sidebar/animation/sidebar-animation-width.mjs

@@ -0,0 +1,2 @@
+export const getSidebarAnimationWidth = (side, width) => side === 'left' ? -1 * width + 'px' : width + 'px';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZWJhci1hbmltYXRpb24td2lkdGguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2Rlc2lnbi9zcmMvbW9sZWN1bGVzL3NpZGViYXIvYW5pbWF0aW9uL3NpZGViYXItYW5pbWF0aW9uLXdpZHRoLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUVBLE1BQU0sQ0FBQyxNQUFNLHdCQUF3QixHQUNuQyxDQUFDLElBQXFCLEVBQUUsS0FBYSxFQUFVLEVBQUUsQ0FBQyxJQUFJLEtBQUssTUFBTSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsR0FBRyxLQUFLLEdBQUcsSUFBSSxDQUFDLENBQUMsQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGFmZlNpZGViYXJTaWRlIH0gZnJvbSAnLi4vaGVscGVyL3NpZGViYXItc2lkZSc7XG5cbmV4cG9ydCBjb25zdCBnZXRTaWRlYmFyQW5pbWF0aW9uV2lkdGggPVxuICAoc2lkZTogRGFmZlNpZGViYXJTaWRlLCB3aWR0aDogbnVtYmVyKTogc3RyaW5nID0+IHNpZGUgPT09ICdsZWZ0JyA/IC0xICogd2lkdGggKyAncHgnIDogd2lkdGggKyAncHgnO1xuIl19

package/esm2020/molecules/sidebar/animation/sidebar-animation.mjs

@@ -1,6 +1,5 @@
 import { animate, state, style, transition, trigger, } from '@angular/animations';
-const duration = '350ms';
-const sidebarAnimateRemainTransition = 'cubic-bezier(0.4, 0.0, 0.2, 1)';
+const duration = '200ms';
 const sidebarAnimateInTransition = 'cubic-bezier(0.0, 0.0, 0.2, 1)';
 const sidebarAnimateOutTransition = 'cubic-bezier(0.4, 0.0, 1, 1)';
 export const daffSidebarAnimations = {
@@ -9,15 +8,32 @@ export const daffSidebarAnimations = {
         // 1. 3d transforms causes text to appear blurry on IE and Edge.
         state('open', style({
             transform: 'none',
-            visibility: 'visible',
         })),
+        state('closed', style({
+            transform: 'translateX({{width}})',
+        }), { params: { width: '-240px' } }),
         transition('open => closed', animate(duration + ' ' + sidebarAnimateOutTransition)),
         transition('closed => open', animate(duration + ' ' + sidebarAnimateInTransition)),
     ]),
     transformContent: trigger('transformContent', [
+        // We remove the `transform` here completely, rather than setting it to zero, because:
+        // 1. 3d transforms causes text to appear blurry on IE and Edge.
         state('closed', style({
             transform: 'none',
         })),
+        state('open', style({
+            transform: 'translateX({{shift}})',
+        }), { params: { shift: '-240px' } }),
+        transition('open => closed', animate(duration + ' ' + sidebarAnimateInTransition)),
+        transition('closed => open', animate(duration + ' ' + sidebarAnimateOutTransition)),
+    ]),
+    backdropTrigger: trigger('backdropTrigger', [
+        state('open', style({
+            opacity: 1,
+        })),
+        state('closed', style({
+            opacity: 0,
+        })),
         transition('open => closed', animate(duration + ' ' + sidebarAnimateOutTransition)),
         transition('closed => open', animate(duration + ' ' + sidebarAnimateInTransition)),
     ]),
@@ -26,5 +42,6 @@ export var DaffSidebarAnimationStates;
 (function (DaffSidebarAnimationStates) {
     DaffSidebarAnimationStates["OPEN"] = "open";
     DaffSidebarAnimationStates["CLOSED"] = "closed";
+    DaffSidebarAnimationStates["NONE"] = "none";
 })(DaffSidebarAnimationStates || (DaffSidebarAnimationStates = {}));
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZWJhci1hbmltYXRpb24uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2Rlc2lnbi9zcmMvbW9sZWN1bGVzL3NpZGViYXIvYW5pbWF0aW9uL3NpZGViYXItYW5pbWF0aW9uLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxPQUFPLEVBQ1AsS0FBSyxFQUNMLEtBQUssRUFDTCxVQUFVLEVBQ1YsT0FBTyxHQUVSLE1BQU0scUJBQXFCLENBQUM7QUFFN0IsTUFBTSxRQUFRLEdBQUcsT0FBTyxDQUFDO0FBQ3pCLE1BQU0sOEJBQThCLEdBQUcsZ0NBQWdDLENBQUM7QUFDeEUsTUFBTSwwQkFBMEIsR0FBRyxnQ0FBZ0MsQ0FBQztBQUNwRSxNQUFNLDJCQUEyQixHQUFHLDhCQUE4QixDQUFDO0FBRW5FLE1BQU0sQ0FBQyxNQUFNLHFCQUFxQixHQUc5QjtJQUNGLGdCQUFnQixFQUFFLE9BQU8sQ0FBQyxrQkFBa0IsRUFBRTtRQUM1QyxzRkFBc0Y7UUFDdEYsZ0VBQWdFO1FBQ2hFLEtBQUssQ0FBQyxNQUFNLEVBQUUsS0FBSyxDQUFDO1lBQ2xCLFNBQVMsRUFBRSxNQUFNO1lBQ2pCLFVBQVUsRUFBRSxTQUFTO1NBQ3RCLENBQUMsQ0FBQztRQUNILFVBQVUsQ0FBQyxnQkFBZ0IsRUFBRSxPQUFPLENBQUMsUUFBUSxHQUFHLEdBQUcsR0FBRywyQkFBMkIsQ0FBQyxDQUFDO1FBQ25GLFVBQVUsQ0FBQyxnQkFBZ0IsRUFBRSxPQUFPLENBQUMsUUFBUSxHQUFHLEdBQUcsR0FBRywwQkFBMEIsQ0FBQyxDQUFDO0tBQ25GLENBQUM7SUFDRixnQkFBZ0IsRUFBRSxPQUFPLENBQUMsa0JBQWtCLEVBQUU7UUFDNUMsS0FBSyxDQUFDLFFBQVEsRUFBRSxLQUFLLENBQUM7WUFDcEIsU0FBUyxFQUFFLE1BQU07U0FDbEIsQ0FBQyxDQUFDO1FBQ0gsVUFBVSxDQUFDLGdCQUFnQixFQUFFLE9BQU8sQ0FBQyxRQUFRLEdBQUcsR0FBRyxHQUFHLDJCQUEyQixDQUFDLENBQUM7UUFDbkYsVUFBVSxDQUFDLGdCQUFnQixFQUFFLE9BQU8sQ0FBQyxRQUFRLEdBQUcsR0FBRyxHQUFHLDBCQUEwQixDQUFDLENBQUM7S0FDbkYsQ0FBQztDQUNILENBQUM7QUFFRixNQUFNLENBQU4sSUFBWSwwQkFHWDtBQUhELFdBQVksMEJBQTBCO0lBQ3BDLDJDQUFjLENBQUE7SUFDZCwrQ0FBaUIsQ0FBQTtBQUNuQixDQUFDLEVBSFcsMEJBQTBCLEtBQTFCLDBCQUEwQixRQUdyQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIGFuaW1hdGUsXG4gIHN0YXRlLFxuICBzdHlsZSxcbiAgdHJhbnNpdGlvbixcbiAgdHJpZ2dlcixcbiAgQW5pbWF0aW9uVHJpZ2dlck1ldGFkYXRhLFxufSBmcm9tICdAYW5ndWxhci9hbmltYXRpb25zJztcblxuY29uc3QgZHVyYXRpb24gPSAnMzUwbXMnO1xuY29uc3Qgc2lkZWJhckFuaW1hdGVSZW1haW5UcmFuc2l0aW9uID0gJ2N1YmljLWJlemllcigwLjQsIDAuMCwgMC4yLCAxKSc7XG5jb25zdCBzaWRlYmFyQW5pbWF0ZUluVHJhbnNpdGlvbiA9ICdjdWJpYy1iZXppZXIoMC4wLCAwLjAsIDAuMiwgMSknO1xuY29uc3Qgc2lkZWJhckFuaW1hdGVPdXRUcmFuc2l0aW9uID0gJ2N1YmljLWJlemllcigwLjQsIDAuMCwgMSwgMSknO1xuXG5leHBvcnQgY29uc3QgZGFmZlNpZGViYXJBbmltYXRpb25zOiB7XG4gIHJlYWRvbmx5IHRyYW5zZm9ybVNpZGViYXI6IEFuaW1hdGlvblRyaWdnZXJNZXRhZGF0YTtcbiAgcmVhZG9ubHkgdHJhbnNmb3JtQ29udGVudDogQW5pbWF0aW9uVHJpZ2dlck1ldGFkYXRhO1xufSA9IHtcbiAgdHJhbnNmb3JtU2lkZWJhcjogdHJpZ2dlcigndHJhbnNmb3JtU2lkZWJhcicsIFtcbiAgICAvLyBXZSByZW1vdmUgdGhlIGB0cmFuc2Zvcm1gIGhlcmUgY29tcGxldGVseSwgcmF0aGVyIHRoYW4gc2V0dGluZyBpdCB0byB6ZXJvLCBiZWNhdXNlOlxuICAgIC8vIDEuIDNkIHRyYW5zZm9ybXMgY2F1c2VzIHRleHQgdG8gYXBwZWFyIGJsdXJyeSBvbiBJRSBhbmQgRWRnZS5cbiAgICBzdGF0ZSgnb3BlbicsIHN0eWxlKHtcbiAgICAgIHRyYW5zZm9ybTogJ25vbmUnLFxuICAgICAgdmlzaWJpbGl0eTogJ3Zpc2libGUnLFxuICAgIH0pKSxcbiAgICB0cmFuc2l0aW9uKCdvcGVuID0+IGNsb3NlZCcsIGFuaW1hdGUoZHVyYXRpb24gKyAnICcgKyBzaWRlYmFyQW5pbWF0ZU91dFRyYW5zaXRpb24pKSxcbiAgICB0cmFuc2l0aW9uKCdjbG9zZWQgPT4gb3BlbicsIGFuaW1hdGUoZHVyYXRpb24gKyAnICcgKyBzaWRlYmFyQW5pbWF0ZUluVHJhbnNpdGlvbikpLFxuICBdKSxcbiAgdHJhbnNmb3JtQ29udGVudDogdHJpZ2dlcigndHJhbnNmb3JtQ29udGVudCcsIFtcbiAgICBzdGF0ZSgnY2xvc2VkJywgc3R5bGUoe1xuICAgICAgdHJhbnNmb3JtOiAnbm9uZScsXG4gICAgfSkpLFxuICAgIHRyYW5zaXRpb24oJ29wZW4gPT4gY2xvc2VkJywgYW5pbWF0ZShkdXJhdGlvbiArICcgJyArIHNpZGViYXJBbmltYXRlT3V0VHJhbnNpdGlvbikpLFxuICAgIHRyYW5zaXRpb24oJ2Nsb3NlZCA9PiBvcGVuJywgYW5pbWF0ZShkdXJhdGlvbiArICcgJyArIHNpZGViYXJBbmltYXRlSW5UcmFuc2l0aW9uKSksXG4gIF0pLFxufTtcblxuZXhwb3J0IGVudW0gRGFmZlNpZGViYXJBbmltYXRpb25TdGF0ZXMge1xuICBPUEVOID0gICdvcGVuJyxcbiAgQ0xPU0VEID0gJ2Nsb3NlZCdcbn1cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZWJhci1hbmltYXRpb24uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2Rlc2lnbi9zcmMvbW9sZWN1bGVzL3NpZGViYXIvYW5pbWF0aW9uL3NpZGViYXItYW5pbWF0aW9uLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxPQUFPLEVBQ1AsS0FBSyxFQUNMLEtBQUssRUFDTCxVQUFVLEVBQ1YsT0FBTyxHQUVSLE1BQU0scUJBQXFCLENBQUM7QUFFN0IsTUFBTSxRQUFRLEdBQUcsT0FBTyxDQUFDO0FBQ3pCLE1BQU0sMEJBQTBCLEdBQUcsZ0NBQWdDLENBQUM7QUFDcEUsTUFBTSwyQkFBMkIsR0FBRyw4QkFBOEIsQ0FBQztBQUVuRSxNQUFNLENBQUMsTUFBTSxxQkFBcUIsR0FJOUI7SUFDRixnQkFBZ0IsRUFBRSxPQUFPLENBQUMsa0JBQWtCLEVBQUU7UUFDNUMsc0ZBQXNGO1FBQ3RGLGdFQUFnRTtRQUNoRSxLQUFLLENBQUMsTUFBTSxFQUFFLEtBQUssQ0FBQztZQUNsQixTQUFTLEVBQUUsTUFBTTtTQUNsQixDQUFDLENBQUM7UUFDSCxLQUFLLENBQUMsUUFBUSxFQUFFLEtBQUssQ0FBQztZQUNwQixTQUFTLEVBQUUsdUJBQXVCO1NBQ25DLENBQUMsRUFBRSxFQUFFLE1BQU0sRUFBRSxFQUFFLEtBQUssRUFBRSxRQUFRLEVBQUUsRUFBQyxDQUFDO1FBQ25DLFVBQVUsQ0FBQyxnQkFBZ0IsRUFBRSxPQUFPLENBQUMsUUFBUSxHQUFHLEdBQUcsR0FBRywyQkFBMkIsQ0FBQyxDQUFDO1FBQ25GLFVBQVUsQ0FBQyxnQkFBZ0IsRUFBRSxPQUFPLENBQUMsUUFBUSxHQUFHLEdBQUcsR0FBRywwQkFBMEIsQ0FBQyxDQUFDO0tBQ25GLENBQUM7SUFDRixnQkFBZ0IsRUFBRSxPQUFPLENBQUMsa0JBQWtCLEVBQUU7UUFDNUMsc0ZBQXNGO1FBQ3RGLGdFQUFnRTtRQUNoRSxLQUFLLENBQUMsUUFBUSxFQUFFLEtBQUssQ0FBQztZQUNwQixTQUFTLEVBQUUsTUFBTTtTQUNsQixDQUFDLENBQUM7UUFDSCxLQUFLLENBQUMsTUFBTSxFQUFFLEtBQUssQ0FBQztZQUNsQixTQUFTLEVBQUUsdUJBQXVCO1NBQ25DLENBQUMsRUFBRSxFQUFFLE1BQU0sRUFBRSxFQUFFLEtBQUssRUFBRSxRQUFRLEVBQUUsRUFBQyxDQUFDO1FBQ25DLFVBQVUsQ0FBQyxnQkFBZ0IsRUFBRSxPQUFPLENBQUMsUUFBUSxHQUFHLEdBQUcsR0FBRywwQkFBMEIsQ0FBQyxDQUFDO1FBQ2xGLFVBQVUsQ0FBQyxnQkFBZ0IsRUFBRSxPQUFPLENBQUMsUUFBUSxHQUFHLEdBQUcsR0FBRywyQkFBMkIsQ0FBQyxDQUFDO0tBQ3BGLENBQUM7SUFDRixlQUFlLEVBQUUsT0FBTyxDQUFDLGlCQUFpQixFQUFFO1FBQzFDLEtBQUssQ0FBQyxNQUFNLEVBQUUsS0FBSyxDQUFDO1lBQ2xCLE9BQU8sRUFBRSxDQUFDO1NBQ1gsQ0FBQyxDQUFDO1FBQ0gsS0FBSyxDQUFDLFFBQVEsRUFBRSxLQUFLLENBQUM7WUFDcEIsT0FBTyxFQUFFLENBQUM7U0FDWCxDQUFDLENBQUM7UUFDSCxVQUFVLENBQUMsZ0JBQWdCLEVBQUUsT0FBTyxDQUFDLFFBQVEsR0FBRyxHQUFHLEdBQUcsMkJBQTJCLENBQUMsQ0FBQztRQUNuRixVQUFVLENBQUMsZ0JBQWdCLEVBQUUsT0FBTyxDQUFDLFFBQVEsR0FBRyxHQUFHLEdBQUcsMEJBQTBCLENBQUMsQ0FBQztLQUNuRixDQUFDO0NBQ0gsQ0FBQztBQUVGLE1BQU0sQ0FBTixJQUFZLDBCQUlYO0FBSkQsV0FBWSwwQkFBMEI7SUFDcEMsMkNBQWEsQ0FBQTtJQUNiLCtDQUFpQixDQUFBO0lBQ2pCLDJDQUFhLENBQUE7QUFDZixDQUFDLEVBSlcsMEJBQTBCLEtBQTFCLDBCQUEwQixRQUlyQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIGFuaW1hdGUsXG4gIHN0YXRlLFxuICBzdHlsZSxcbiAgdHJhbnNpdGlvbixcbiAgdHJpZ2dlcixcbiAgQW5pbWF0aW9uVHJpZ2dlck1ldGFkYXRhLFxufSBmcm9tICdAYW5ndWxhci9hbmltYXRpb25zJztcblxuY29uc3QgZHVyYXRpb24gPSAnMjAwbXMnO1xuY29uc3Qgc2lkZWJhckFuaW1hdGVJblRyYW5zaXRpb24gPSAnY3ViaWMtYmV6aWVyKDAuMCwgMC4wLCAwLjIsIDEpJztcbmNvbnN0IHNpZGViYXJBbmltYXRlT3V0VHJhbnNpdGlvbiA9ICdjdWJpYy1iZXppZXIoMC40LCAwLjAsIDEsIDEpJztcblxuZXhwb3J0IGNvbnN0IGRhZmZTaWRlYmFyQW5pbWF0aW9uczoge1xuICByZWFkb25seSB0cmFuc2Zvcm1TaWRlYmFyOiBBbmltYXRpb25UcmlnZ2VyTWV0YWRhdGE7XG4gIHJlYWRvbmx5IHRyYW5zZm9ybUNvbnRlbnQ6IEFuaW1hdGlvblRyaWdnZXJNZXRhZGF0YTtcbiAgcmVhZG9ubHkgYmFja2Ryb3BUcmlnZ2VyOiBBbmltYXRpb25UcmlnZ2VyTWV0YWRhdGE7XG59ID0ge1xuICB0cmFuc2Zvcm1TaWRlYmFyOiB0cmlnZ2VyKCd0cmFuc2Zvcm1TaWRlYmFyJywgW1xuICAgIC8vIFdlIHJlbW92ZSB0aGUgYHRyYW5zZm9ybWAgaGVyZSBjb21wbGV0ZWx5LCByYXRoZXIgdGhhbiBzZXR0aW5nIGl0IHRvIHplcm8sIGJlY2F1c2U6XG4gICAgLy8gMS4gM2QgdHJhbnNmb3JtcyBjYXVzZXMgdGV4dCB0byBhcHBlYXIgYmx1cnJ5IG9uIElFIGFuZCBFZGdlLlxuICAgIHN0YXRlKCdvcGVuJywgc3R5bGUoe1xuICAgICAgdHJhbnNmb3JtOiAnbm9uZScsXG4gICAgfSkpLFxuICAgIHN0YXRlKCdjbG9zZWQnLCBzdHlsZSh7XG4gICAgICB0cmFuc2Zvcm06ICd0cmFuc2xhdGVYKHt7d2lkdGh9fSknLFxuICAgIH0pLCB7IHBhcmFtczogeyB3aWR0aDogJy0yNDBweCcgfX0pLFxuICAgIHRyYW5zaXRpb24oJ29wZW4gPT4gY2xvc2VkJywgYW5pbWF0ZShkdXJhdGlvbiArICcgJyArIHNpZGViYXJBbmltYXRlT3V0VHJhbnNpdGlvbikpLFxuICAgIHRyYW5zaXRpb24oJ2Nsb3NlZCA9PiBvcGVuJywgYW5pbWF0ZShkdXJhdGlvbiArICcgJyArIHNpZGViYXJBbmltYXRlSW5UcmFuc2l0aW9uKSksXG4gIF0pLFxuICB0cmFuc2Zvcm1Db250ZW50OiB0cmlnZ2VyKCd0cmFuc2Zvcm1Db250ZW50JywgW1xuICAgIC8vIFdlIHJlbW92ZSB0aGUgYHRyYW5zZm9ybWAgaGVyZSBjb21wbGV0ZWx5LCByYXRoZXIgdGhhbiBzZXR0aW5nIGl0IHRvIHplcm8sIGJlY2F1c2U6XG4gICAgLy8gMS4gM2QgdHJhbnNmb3JtcyBjYXVzZXMgdGV4dCB0byBhcHBlYXIgYmx1cnJ5IG9uIElFIGFuZCBFZGdlLlxuICAgIHN0YXRlKCdjbG9zZWQnLCBzdHlsZSh7XG4gICAgICB0cmFuc2Zvcm06ICdub25lJyxcbiAgICB9KSksXG4gICAgc3RhdGUoJ29wZW4nLCBzdHlsZSh7XG4gICAgICB0cmFuc2Zvcm06ICd0cmFuc2xhdGVYKHt7c2hpZnR9fSknLFxuICAgIH0pLCB7IHBhcmFtczogeyBzaGlmdDogJy0yNDBweCcgfX0pLFxuICAgIHRyYW5zaXRpb24oJ29wZW4gPT4gY2xvc2VkJywgYW5pbWF0ZShkdXJhdGlvbiArICcgJyArIHNpZGViYXJBbmltYXRlSW5UcmFuc2l0aW9uKSksXG4gICAgdHJhbnNpdGlvbignY2xvc2VkID0+IG9wZW4nLCBhbmltYXRlKGR1cmF0aW9uICsgJyAnICsgc2lkZWJhckFuaW1hdGVPdXRUcmFuc2l0aW9uKSksXG4gIF0pLFxuICBiYWNrZHJvcFRyaWdnZXI6IHRyaWdnZXIoJ2JhY2tkcm9wVHJpZ2dlcicsIFtcbiAgICBzdGF0ZSgnb3BlbicsIHN0eWxlKHtcbiAgICAgIG9wYWNpdHk6IDEsXG4gICAgfSkpLFxuICAgIHN0YXRlKCdjbG9zZWQnLCBzdHlsZSh7XG4gICAgICBvcGFjaXR5OiAwLFxuICAgIH0pKSxcbiAgICB0cmFuc2l0aW9uKCdvcGVuID0+IGNsb3NlZCcsIGFuaW1hdGUoZHVyYXRpb24gKyAnICcgKyBzaWRlYmFyQW5pbWF0ZU91dFRyYW5zaXRpb24pKSxcbiAgICB0cmFuc2l0aW9uKCdjbG9zZWQgPT4gb3BlbicsIGFuaW1hdGUoZHVyYXRpb24gKyAnICcgKyBzaWRlYmFyQW5pbWF0ZUluVHJhbnNpdGlvbikpLFxuICBdKSxcbn07XG5cbmV4cG9ydCBlbnVtIERhZmZTaWRlYmFyQW5pbWF0aW9uU3RhdGVzIHtcbiAgT1BFTiA9ICdvcGVuJyxcbiAgQ0xPU0VEID0gJ2Nsb3NlZCcsXG4gIE5PTkUgPSAnbm9uZSdcbn1cbiJdfQ==

package/esm2020/molecules/sidebar/animation/sidebar-viewport-animation-state.mjs

@@ -0,0 +1,3 @@
+;
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZWJhci12aWV3cG9ydC1hbmltYXRpb24tc3RhdGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2Rlc2lnbi9zcmMvbW9sZWN1bGVzL3NpZGViYXIvYW5pbWF0aW9uL3NpZGViYXItdmlld3BvcnQtYW5pbWF0aW9uLXN0YXRlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUtDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBbmltYXRpb25TdGF0ZVdpdGhQYXJhbXMgfSBmcm9tICcuLi8uLi8uLi9jb3JlL3B1YmxpY19hcGknO1xuaW1wb3J0IHsgRGFmZlNpZGViYXJBbmltYXRpb25TdGF0ZSB9IGZyb20gJy4vc2lkZWJhci1hbmltYXRpb24tc3RhdGUnO1xuXG5leHBvcnQgaW50ZXJmYWNlIERhZmZTaWRlYmFyQW5pbWF0aW9uU3RhdGVQYXJhbXMge1xuICBzaGlmdDogc3RyaW5nO1xufTtcblxuZXhwb3J0IHR5cGUgRGFmZlNpZGViYXJWaWV3cG9ydEFuaW1hdGlvblN0YXRlID0gQW5pbWF0aW9uU3RhdGVXaXRoUGFyYW1zPERhZmZTaWRlYmFyQW5pbWF0aW9uU3RhdGUsIERhZmZTaWRlYmFyQW5pbWF0aW9uU3RhdGVQYXJhbXM+O1xuIl19

package/esm2020/molecules/sidebar/helper/sidebar-mode.mjs

@@ -1,2 +1,2 @@
 export {};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZWJhci1tb2RlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9kZXNpZ24vc3JjL21vbGVjdWxlcy9zaWRlYmFyL2hlbHBlci9zaWRlYmFyLW1vZGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCB0eXBlIERhZmZTaWRlYmFyTW9kZSA9ICdvdmVyJyB8ICdwdXNoJyB8ICdzaWRlJyB8ICdmaXhlZCc7XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZWJhci1tb2RlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9kZXNpZ24vc3JjL21vbGVjdWxlcy9zaWRlYmFyL2hlbHBlci9zaWRlYmFyLW1vZGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogVGhlIHZhcmlvdXMgbW9kZXMgdGhhdCBhIERhZmZTaWRlYmFyIGNhbiBiZSBpbi5cbiAqXG4gKiAqIGBzaWRlYCBpcyBhIG1vZGUgdGhhdCBhbGxvd3MgeW91IHRvIHBsYWNlIHRoZSBzaWRlYmFyIGFsb25nc2lkZVxuICogICAgdGhlIGNvbnRlbnQuXG4gKlxuICogKiBgc2lkZS1maXhlZGAgaXMgYSBtb2RlIHRoYXQgYWxsb3dzIHlvdSB3YW50IHRvIHBsYWNlIHRoZSBzaWRlYmFyXG4gKiAgICBhbG9uZ3NpZGUgdGhlIGNvbnRlbnQsIGhvd2V2ZXIgdGhlIHNpZGViYXIgd2lsbCBzY3JvbGwgc2VwYXJhdGVseVxuICogICAgZnJvbSB0aGUgY29udGVudC5cbiAqXG4gKiAqIGBvdmVyYCBpcyBhIG1vZGUgd2hpY2ggYWxsb3dzIHRoZSBzaWRlYmFyIHRvIHNsaWRlICpvdmVyKiB0aGUgcmVzdCBvZlxuICogICAgdGhlIGNvbnRlbnQgaW4gdGhlIHZpZXdwb3J0LlxuICpcbiAqICogYHVuZGVyYCBpcyBhIG1vZGUgdGhhdCBmcmVlemVzIHRoZSBzaWRlYmFyIGluIHBsYWNlIGFuZCBhbGxvd3MgdGhlIGNvbnRlbnRcbiAqICAgc2xpZGUgYWJvdmUgaXQuXG4gKi9cbmV4cG9ydCB0eXBlIERhZmZTaWRlYmFyTW9kZSA9ICdzaWRlJyB8ICdvdmVyJyB8ICd1bmRlcicgfCAnc2lkZS1maXhlZCc7XG5cbi8qKlxuICogQSBlbnVtIHJlcHJlc2VudGluZyB0aGUgZGlmZmVyZW50IHNpZGViYXIgbW9kZXMuXG4gKiBTZWUge0BsaW5rIERhZmZTaWRlYmFyTW9kZX1cbiAqL1xuZXhwb3J0IGNvbnN0IGVudW0gRGFmZlNpZGViYXJNb2RlRW51bSAge1xuICBTaWRlID0gJ3NpZGUnLFxuICBTaWRlRml4ZWQgPSAnc2lkZS1maXhlZCcsXG4gIE92ZXIgPSAnb3ZlcicsXG4gIFVuZGVyID0gJ3VuZGVyJyxcbn1cbiJdfQ==

package/esm2020/molecules/sidebar/helper/sidebar-side.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZWJhci1zaWRlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9kZXNpZ24vc3JjL21vbGVjdWxlcy9zaWRlYmFyL2hlbHBlci9zaWRlYmFyLXNpZGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogVGhlIHNpZGVzIG9mIGEgdmlld3BvcnQgdGhhdCB0aGF0IGEgc2lkZWJhciBjYW4gYXBwZWFyIG9uLlxuICovXG5leHBvcnQgdHlwZSBEYWZmU2lkZWJhclNpZGUgPSAnbGVmdCcgfCAncmlnaHQnO1xuXG5cbi8qKlxuICogQSBlbnVtIHJlcHJlc2VudGluZyB0aGUgZGlmZmVyZW50IHNpZGViYXIgbW9kZXMuXG4gKiBTZWUge0BsaW5rIERhZmZTaWRlYmFyU2lkZX1cbiAqL1xuZXhwb3J0IGNvbnN0IGVudW0gRGFmZlNpZGViYXJTaWRlRW51bSB7XG4gIExlZnQgPSAnbGVmdCcsXG4gIFJpZ2h0ID0gJ3JpZ2h0J1xufVxuIl19

package/esm2020/molecules/sidebar/public_api.mjs

@@ -1,5 +1,4 @@
 export { DaffSidebarModule } from './sidebar.module';
 export * from './sidebar-viewport/sidebar-viewport.component';
 export * from './sidebar/sidebar.component';
-export * from './helper/sidebar-mode';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljX2FwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMvZGVzaWduL3NyYy9tb2xlY3VsZXMvc2lkZWJhci9wdWJsaWNfYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGtCQUFrQixDQUFDO0FBQ3JELGNBQWMsK0NBQStDLENBQUM7QUFDOUQsY0FBYyw2QkFBNkIsQ0FBQztBQUM1QyxjQUFjLHVCQUF1QixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0IHsgRGFmZlNpZGViYXJNb2R1bGUgfSBmcm9tICcuL3NpZGViYXIubW9kdWxlJztcbmV4cG9ydCAqIGZyb20gJy4vc2lkZWJhci12aWV3cG9ydC9zaWRlYmFyLXZpZXdwb3J0LmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL3NpZGViYXIvc2lkZWJhci5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9oZWxwZXIvc2lkZWJhci1tb2RlJztcbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljX2FwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMvZGVzaWduL3NyYy9tb2xlY3VsZXMvc2lkZWJhci9wdWJsaWNfYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGtCQUFrQixDQUFDO0FBQ3JELGNBQWMsK0NBQStDLENBQUM7QUFDOUQsY0FBYyw2QkFBNkIsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCB7IERhZmZTaWRlYmFyTW9kdWxlIH0gZnJvbSAnLi9zaWRlYmFyLm1vZHVsZSc7XG5leHBvcnQgKiBmcm9tICcuL3NpZGViYXItdmlld3BvcnQvc2lkZWJhci12aWV3cG9ydC5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9zaWRlYmFyL3NpZGViYXIuY29tcG9uZW50JztcbmV4cG9ydCB7XG4gIERhZmZTaWRlYmFyTW9kZSxcbiAgRGFmZlNpZGViYXJNb2RlRW51bSxcbn0gZnJvbSAnLi9oZWxwZXIvc2lkZWJhci1tb2RlJztcbmV4cG9ydCB7XG4gIERhZmZTaWRlYmFyU2lkZSxcbiAgRGFmZlNpZGViYXJTaWRlRW51bSxcbn0gZnJvbSAnLi9oZWxwZXIvc2lkZWJhci1zaWRlJztcbiJdfQ==