@daffodil/design 0.63.2 → 0.64.0

package/fesm2015/daffodil-design-callout-examples.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"daffodil-design-callout-examples.mjs","sources":["../../../libs/design/callout/examples/src/callout-theming/callout-theming.component.ts","../../../libs/design/callout/examples/src/callout-theming/callout-theming.component.html","../../../libs/design/callout/examples/src/callout-theming/callout-theming.module.ts","../../../libs/design/callout/examples/src/callout-text-alignment/callout-text-alignment.component.ts","../../../libs/design/callout/examples/src/callout-text-alignment/callout-text-alignment.component.html","../../../libs/design/callout/examples/src/callout-text-alignment/callout-text-alignment.module.ts","../../../libs/design/callout/examples/src/callout-with-grid/callout-with-grid.component.ts","../../../libs/design/callout/examples/src/callout-with-grid/callout-with-grid.component.html","../../../libs/design/callout/examples/src/callout-with-grid/callout-with-grid.module.ts","../../../libs/design/callout/examples/src/compact-callout/compact-callout.component.ts","../../../libs/design/callout/examples/src/compact-callout/compact-callout.component.html","../../../libs/design/callout/examples/src/compact-callout/compact-callout.module.ts","../../../libs/design/callout/examples/src/examples.ts","../../../libs/design/callout/examples/src/daffodil-design-callout-examples.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { FormControl } from '@angular/forms';\nimport { faMobile } from '@fortawesome/free-solid-svg-icons';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'callout-theming',\n  templateUrl: './callout-theming.component.html',\n  styleUrls: ['./callout-theming.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class CalloutThemingComponent {\n  faMobile = faMobile;\n  colorControl: FormControl = new FormControl('');\n\n  options = [\n    { value: '', label: 'Default' },\n    { value: 'primary', label: 'Primary' },\n    { value: 'secondary', label: 'Secondary' },\n    { value: 'tertiary', label: 'Tertiary' },\n    { value: 'white', label: 'White' },\n    { value: 'black', label: 'Black' },\n    { value: 'theme', label: 'Theme' },\n    { value: 'theme-contrast', label: 'Theme Contrast' },\n  ];\n}\n","<daff-callout [color]=\"colorControl.value\">\n\t<div class=\"daff-callout-theming__icon\" daffCalloutIcon>\n\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t</div>\n\t<div daffCalloutTagline>Frontend framework for ecommerce PWAs</div>\n\t<h3 daffCalloutTitle>Daffodil: The next great leap in ecommerce.</h3>\n\t<div daffCalloutSubtitle>\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</div>\n\t<div daffCalloutBody>\n\t\t<a daff-button color=\"theme-contrast\" href=\"https://www.daff.io\">What is Daffodil?</a>\n\t</div>\n</daff-callout>\n\n<select [formControl]=\"colorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\n\nimport {\n  DaffButtonModule,\n  DaffCalloutModule,\n} from '@daffodil/design';\n\nimport { CalloutThemingComponent } from './callout-theming.component';\n\n@NgModule({\n  declarations: [\n    CalloutThemingComponent,\n  ],\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    DaffCalloutModule,\n    DaffButtonModule,\n    FontAwesomeModule,\n  ],\n})\nexport class CalloutThemingModule { }\n","import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { FormControl } from '@angular/forms';\nimport { faMobile } from '@fortawesome/free-solid-svg-icons';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'callout-text-alignment',\n  templateUrl: './callout-text-alignment.component.html',\n  styleUrls: ['./callout-text-alignment.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class CalloutTextAlignmentComponent {\n  faMobile = faMobile;\n  textAlignControl: FormControl = new FormControl('');\n\n  options = [\n    { value: '', label: 'Default' },\n    { value: 'left', label: 'Left' },\n    { value: 'center', label: 'Center' },\n    { value: 'right', label: 'Right' },\n  ];\n}\n","<daff-callout [textAlignment]=\"textAlignControl.value\">\n\t<daff-container size=\"md\">\n\t\t<div class=\"daff-callout-text-alignment__icon\" daffCalloutIcon>\n\t\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t\t</div>\n\t\t<div daffCalloutTagline>Frontend framework for ecommerce PWAs</div>\n\t\t<h3 daffCalloutTitle>Daffodil: The next great leap in ecommerce.</h3>\n\t\t<div daffCalloutSubtitle>\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</div>\n\t\t<div daffCalloutBody>\n\t\t\t<a daff-button color=\"theme-contrast\" href=\"https://www.daff.io\">What is Daffodil?</a>\n\t\t</div>\n\t</daff-container>\n</daff-callout>\n\n<select [formControl]=\"textAlignControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\n\nimport {\n  DaffButtonModule,\n  DaffCalloutModule,\n  DaffContainerModule,\n} from '@daffodil/design';\n\nimport { CalloutTextAlignmentComponent } from './callout-text-alignment.component';\n\n@NgModule({\n  declarations: [\n    CalloutTextAlignmentComponent,\n  ],\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    DaffCalloutModule,\n    DaffContainerModule,\n    DaffButtonModule,\n    FontAwesomeModule,\n  ],\n})\nexport class CalloutTextAlignmentModule { }\n","import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { faMobile } from '@fortawesome/free-solid-svg-icons';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'callout-with-grid',\n  templateUrl: './callout-with-grid.component.html',\n  styleUrls: ['./callout-with-grid.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class CalloutWithGridComponent {\n  faMobile = faMobile;\n}\n","<daff-callout color=\"theme\">\n\t<daff-container class=\"daff-callout-with-grid__grid\">\n\t\t<div class=\"daff-callout-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-callout-with-grid__content-wrapper\">\n\t\t\t<div class=\"daff-callout-with-grid__icon\" daffCalloutIcon>\n\t\t\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t\t\t</div>\n\t\t\t<div daffCalloutTagline>Frontend framework for ecommerce PWAs</div>\n\t\t\t<h3 daffCalloutTitle>Daffodil: The next great leap in ecommerce.</h3>\n\t\t\t<div daffCalloutSubtitle>\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 daffCalloutBody>\n\t\t\t\t<div class=\"daff-callout-with-grid__actions\">\n\t\t\t\t\t<a daff-button color=\"theme-contrast\" href=\"https://www.daff.io\" class=\"daff-callout-with-grid__daffodil-action\">What is Daffodil?</a>\n\t\t\t\t\t<a daff-underline-button color=\"theme-contrast\" routerLink=\"/contact\" class=\"daff-callout-with-grid__demo-action\">Sign up for a demo</a>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t</daff-container>\n</daff-callout>","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\n\nimport {\n  DaffCalloutModule,\n  DaffContainerModule,\n  DaffButtonModule,\n} from '@daffodil/design';\n\nimport { CalloutWithGridComponent } from './callout-with-grid.component';\n\n@NgModule({\n  declarations: [\n    CalloutWithGridComponent,\n  ],\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    DaffCalloutModule,\n    DaffContainerModule,\n    DaffButtonModule,\n    FontAwesomeModule,\n  ],\n})\nexport class CalloutWithGridModule { }\n","import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { faMobile } from '@fortawesome/free-solid-svg-icons';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'compact-callout',\n  templateUrl: './compact-callout.component.html',\n  styleUrls: ['./compact-callout.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class CompactCalloutComponent {\n  faMobile = faMobile;\n}\n","<daff-callout [compact]=\"true\">\n\t<daff-container size=\"md\">\n\t\t<div class=\"daff-compact-callout__icon\" daffCalloutIcon>\n\t\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t\t</div>\n\t\t<div daffCalloutTagline>Frontend framework for ecommerce PWAs</div>\n\t\t<h3 daffCalloutTitle>Daffodil: The next great leap in ecommerce.</h3>\n\t\t<div daffCalloutSubtitle>\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</div>\n\t\t<div daffCalloutBody>\n\t\t\t<a daff-button color=\"theme-contrast\" href=\"https://www.daff.io\">What is Daffodil?</a>\n\t\t</div>\n\t</daff-container>\n</daff-callout>","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\n\nimport {\n  DaffButtonModule,\n  DaffCalloutModule,\n  DaffContainerModule,\n} from '@daffodil/design';\n\nimport { CompactCalloutComponent } from './compact-callout.component';\n\n@NgModule({\n  declarations: [\n    CompactCalloutComponent,\n  ],\n  imports: [\n    CommonModule,\n\n    DaffCalloutModule,\n    DaffContainerModule,\n    DaffButtonModule,\n    FontAwesomeModule,\n  ],\n})\nexport class CompactCalloutModule { }\n","import { CalloutTextAlignmentComponent } from './callout-text-alignment/callout-text-alignment.component';\nimport { CalloutThemingComponent } from './callout-theming/callout-theming.component';\nimport { CalloutWithGridComponent } from './callout-with-grid/callout-with-grid.component';\nimport { CompactCalloutComponent } from './compact-callout/compact-callout.component';\n\nexport const CALLOUT_EXAMPLES = [\n  CalloutThemingComponent,\n  CalloutTextAlignmentComponent,\n  CalloutWithGridComponent,\n  CompactCalloutComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"daffodil-design-callout-examples.mjs","sources":["../../../libs/design/callout/examples/src/callout-theming/callout-theming.component.ts","../../../libs/design/callout/examples/src/callout-theming/callout-theming.component.html","../../../libs/design/callout/examples/src/callout-theming/callout-theming.module.ts","../../../libs/design/callout/examples/src/callout-text-alignment/callout-text-alignment.component.ts","../../../libs/design/callout/examples/src/callout-text-alignment/callout-text-alignment.component.html","../../../libs/design/callout/examples/src/callout-text-alignment/callout-text-alignment.module.ts","../../../libs/design/callout/examples/src/callout-with-grid/callout-with-grid.component.ts","../../../libs/design/callout/examples/src/callout-with-grid/callout-with-grid.component.html","../../../libs/design/callout/examples/src/callout-with-grid/callout-with-grid.module.ts","../../../libs/design/callout/examples/src/compact-callout/compact-callout.component.ts","../../../libs/design/callout/examples/src/compact-callout/compact-callout.component.html","../../../libs/design/callout/examples/src/compact-callout/compact-callout.module.ts","../../../libs/design/callout/examples/src/examples.ts","../../../libs/design/callout/examples/src/daffodil-design-callout-examples.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { UntypedFormControl } from '@angular/forms';\nimport { faMobile } from '@fortawesome/free-solid-svg-icons';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'callout-theming',\n  templateUrl: './callout-theming.component.html',\n  styleUrls: ['./callout-theming.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class CalloutThemingComponent {\n  faMobile = faMobile;\n  colorControl: UntypedFormControl = new UntypedFormControl('');\n\n  options = [\n    { value: '', label: 'Default' },\n    { value: 'primary', label: 'Primary' },\n    { value: 'secondary', label: 'Secondary' },\n    { value: 'tertiary', label: 'Tertiary' },\n    { value: 'white', label: 'White' },\n    { value: 'black', label: 'Black' },\n    { value: 'theme', label: 'Theme' },\n    { value: 'theme-contrast', label: 'Theme Contrast' },\n  ];\n}\n","<daff-callout [color]=\"colorControl.value\">\n\t<div class=\"daff-callout-theming__icon\" daffCalloutIcon>\n\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t</div>\n\t<div daffCalloutTagline>Frontend framework for ecommerce PWAs</div>\n\t<h3 daffCalloutTitle>Daffodil: The next great leap in ecommerce.</h3>\n\t<div daffCalloutSubtitle>\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</div>\n\t<div daffCalloutBody>\n\t\t<a daff-button color=\"theme-contrast\" href=\"https://www.daff.io\">What is Daffodil?</a>\n\t</div>\n</daff-callout>\n\n<select [formControl]=\"colorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\n\nimport {\n  DaffButtonModule,\n  DaffCalloutModule,\n} from '@daffodil/design';\n\nimport { CalloutThemingComponent } from './callout-theming.component';\n\n@NgModule({\n  declarations: [\n    CalloutThemingComponent,\n  ],\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    DaffCalloutModule,\n    DaffButtonModule,\n    FontAwesomeModule,\n  ],\n})\nexport class CalloutThemingModule { }\n","import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { UntypedFormControl } from '@angular/forms';\nimport { faMobile } from '@fortawesome/free-solid-svg-icons';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'callout-text-alignment',\n  templateUrl: './callout-text-alignment.component.html',\n  styleUrls: ['./callout-text-alignment.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class CalloutTextAlignmentComponent {\n  faMobile = faMobile;\n  textAlignControl: UntypedFormControl = new UntypedFormControl('');\n\n  options = [\n    { value: '', label: 'Default' },\n    { value: 'left', label: 'Left' },\n    { value: 'center', label: 'Center' },\n    { value: 'right', label: 'Right' },\n  ];\n}\n","<daff-callout [textAlignment]=\"textAlignControl.value\">\n\t<daff-container size=\"md\">\n\t\t<div class=\"daff-callout-text-alignment__icon\" daffCalloutIcon>\n\t\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t\t</div>\n\t\t<div daffCalloutTagline>Frontend framework for ecommerce PWAs</div>\n\t\t<h3 daffCalloutTitle>Daffodil: The next great leap in ecommerce.</h3>\n\t\t<div daffCalloutSubtitle>\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</div>\n\t\t<div daffCalloutBody>\n\t\t\t<a daff-button color=\"theme-contrast\" href=\"https://www.daff.io\">What is Daffodil?</a>\n\t\t</div>\n\t</daff-container>\n</daff-callout>\n\n<select [formControl]=\"textAlignControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\n\nimport {\n  DaffButtonModule,\n  DaffCalloutModule,\n  DaffContainerModule,\n} from '@daffodil/design';\n\nimport { CalloutTextAlignmentComponent } from './callout-text-alignment.component';\n\n@NgModule({\n  declarations: [\n    CalloutTextAlignmentComponent,\n  ],\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    DaffCalloutModule,\n    DaffContainerModule,\n    DaffButtonModule,\n    FontAwesomeModule,\n  ],\n})\nexport class CalloutTextAlignmentModule { }\n","import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { faMobile } from '@fortawesome/free-solid-svg-icons';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'callout-with-grid',\n  templateUrl: './callout-with-grid.component.html',\n  styleUrls: ['./callout-with-grid.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class CalloutWithGridComponent {\n  faMobile = faMobile;\n}\n","<daff-callout color=\"theme\">\n\t<daff-container class=\"daff-callout-with-grid__grid\">\n\t\t<div class=\"daff-callout-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-callout-with-grid__content-wrapper\">\n\t\t\t<div class=\"daff-callout-with-grid__icon\" daffCalloutIcon>\n\t\t\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t\t\t</div>\n\t\t\t<div daffCalloutTagline>Frontend framework for ecommerce PWAs</div>\n\t\t\t<h3 daffCalloutTitle>Daffodil: The next great leap in ecommerce.</h3>\n\t\t\t<div daffCalloutSubtitle>\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 daffCalloutBody>\n\t\t\t\t<div class=\"daff-callout-with-grid__actions\">\n\t\t\t\t\t<a daff-button color=\"theme-contrast\" href=\"https://www.daff.io\" class=\"daff-callout-with-grid__daffodil-action\">What is Daffodil?</a>\n\t\t\t\t\t<a daff-underline-button color=\"theme-contrast\" routerLink=\"/contact\" class=\"daff-callout-with-grid__demo-action\">Sign up for a demo</a>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t</daff-container>\n</daff-callout>","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\n\nimport {\n  DaffCalloutModule,\n  DaffContainerModule,\n  DaffButtonModule,\n} from '@daffodil/design';\n\nimport { CalloutWithGridComponent } from './callout-with-grid.component';\n\n@NgModule({\n  declarations: [\n    CalloutWithGridComponent,\n  ],\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    DaffCalloutModule,\n    DaffContainerModule,\n    DaffButtonModule,\n    FontAwesomeModule,\n  ],\n})\nexport class CalloutWithGridModule { }\n","import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { faMobile } from '@fortawesome/free-solid-svg-icons';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'compact-callout',\n  templateUrl: './compact-callout.component.html',\n  styleUrls: ['./compact-callout.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class CompactCalloutComponent {\n  faMobile = faMobile;\n}\n","<daff-callout [compact]=\"true\">\n\t<daff-container size=\"md\">\n\t\t<div class=\"daff-compact-callout__icon\" daffCalloutIcon>\n\t\t\t<fa-icon [icon]=\"faMobile\"></fa-icon>\n\t\t</div>\n\t\t<div daffCalloutTagline>Frontend framework for ecommerce PWAs</div>\n\t\t<h3 daffCalloutTitle>Daffodil: The next great leap in ecommerce.</h3>\n\t\t<div daffCalloutSubtitle>\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</div>\n\t\t<div daffCalloutBody>\n\t\t\t<a daff-button color=\"theme-contrast\" href=\"https://www.daff.io\">What is Daffodil?</a>\n\t\t</div>\n\t</daff-container>\n</daff-callout>","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\n\nimport {\n  DaffButtonModule,\n  DaffCalloutModule,\n  DaffContainerModule,\n} from '@daffodil/design';\n\nimport { CompactCalloutComponent } from './compact-callout.component';\n\n@NgModule({\n  declarations: [\n    CompactCalloutComponent,\n  ],\n  imports: [\n    CommonModule,\n\n    DaffCalloutModule,\n    DaffContainerModule,\n    DaffButtonModule,\n    FontAwesomeModule,\n  ],\n})\nexport class CompactCalloutModule { }\n","import { CalloutTextAlignmentComponent } from './callout-text-alignment/callout-text-alignment.component';\nimport { CalloutThemingComponent } from './callout-theming/callout-theming.component';\nimport { CalloutWithGridComponent } from './callout-with-grid/callout-with-grid.component';\nimport { CompactCalloutComponent } from './compact-callout/compact-callout.component';\n\nexport const CALLOUT_EXAMPLES = [\n  CalloutThemingComponent,\n  CalloutTextAlignmentComponent,\n  CalloutWithGridComponent,\n  CompactCalloutComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i3","i1","i2"],"mappings":"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"}

package/fesm2015/daffodil-design-card-examples.mjs

@@ -1,14 +1,14 @@
 import * as i0 from '@angular/core';
 import { Component, ChangeDetectionStrategy, NgModule } from '@angular/core';
 import { faMapMarked } from '@fortawesome/free-solid-svg-icons';
-import * as i1 from '@daffodil/design';
+import * as i3 from '@daffodil/design';
 import { DaffCardModule, DaffImageModule, DaffButtonModule } from '@daffodil/design';
 import * as i2 from '@fortawesome/angular-fontawesome';
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
-import * as i3 from '@angular/common';
+import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i2$1 from '@angular/forms';
-import { FormControl, ReactiveFormsModule } from '@angular/forms';
+import { UntypedFormControl, ReactiveFormsModule } from '@angular/forms';
 import { RouterModule } from '@angular/router';
 
 class BasicCardComponent {
@@ -16,29 +16,27 @@ class BasicCardComponent {
         this.faMapMarked = faMapMarked;
     }
 }
-/** @nocollapse */ BasicCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BasicCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ BasicCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: BasicCardComponent, selector: "basic-card", ngImport: i0, template: "<daff-card>\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n  <fa-icon daffCardIcon [icon]=\"faMapMarked\"></fa-icon>\n  <div daffCardTagline>Basel, Switzerland</div>\n  <h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n    <p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors.</p>\n    <p>The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n  </div>\n  <div daffCardActions>\n    <button daff-button color=\"theme-contrast\">Learn More</button>\n  </div>\n</daff-card>\n", styles: ["daff-card{max-width:480px}\n"], components: [{ type: i1.DaffCardComponent, selector: "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", inputs: ["color", "orientation"] }, { type: i1.DaffImageComponent, selector: "daff-image", inputs: ["skeleton", "src", "alt", "width", "height"], outputs: ["load"] }, { 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.DaffCardImageDirective, selector: "[daffCardImage]" }, { type: i1.DaffCardIconDirective, selector: "[daffCardIcon]" }, { type: i1.DaffCardTaglineDirective, selector: "[daffCardTagline]" }, { type: i1.DaffCardTitleDirective, selector: "[daffCardTitle]" }, { type: i1.DaffCardContentDirective, selector: "[daffCardContent]" }, { type: i1.DaffCardActionsDirective, selector: "[daffCardActions]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BasicCardComponent, decorators: [{
+/** @nocollapse */ BasicCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BasicCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ BasicCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: BasicCardComponent, selector: "basic-card", ngImport: i0, template: "<daff-card>\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n  <fa-icon daffCardIcon [icon]=\"faMapMarked\"></fa-icon>\n  <div daffCardTagline>Basel, Switzerland</div>\n  <h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n    <p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors.</p>\n    <p>The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n  </div>\n  <div daffCardActions>\n    <button daff-button color=\"theme-contrast\">Learn More</button>\n  </div>\n</daff-card>\n", styles: ["daff-card{max-width:480px}\n"], dependencies: [{ kind: "component", type: i3.DaffCardComponent, selector: "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", inputs: ["color", "orientation"] }, { kind: "directive", type: i3.DaffCardIconDirective, selector: "[daffCardIcon]" }, { kind: "directive", type: i3.DaffCardImageDirective, selector: "[daffCardImage]" }, { kind: "directive", type: i3.DaffCardTaglineDirective, selector: "[daffCardTagline]" }, { kind: "directive", type: i3.DaffCardTitleDirective, selector: "[daffCardTitle]" }, { kind: "directive", type: i3.DaffCardContentDirective, selector: "[daffCardContent]" }, { kind: "directive", type: i3.DaffCardActionsDirective, selector: "[daffCardActions]" }, { kind: "component", type: i3.DaffImageComponent, selector: "daff-image", inputs: ["skeleton", "src", "alt", "width", "height"], outputs: ["load"] }, { kind: "component", type: i3.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"] }, { kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BasicCardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'basic-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<daff-card>\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n  <fa-icon daffCardIcon [icon]=\"faMapMarked\"></fa-icon>\n  <div daffCardTagline>Basel, Switzerland</div>\n  <h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n    <p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors.</p>\n    <p>The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n  </div>\n  <div daffCardActions>\n    <button daff-button color=\"theme-contrast\">Learn More</button>\n  </div>\n</daff-card>\n", styles: ["daff-card{max-width:480px}\n"] }]
         }] });
 
 class BasicCardModule {
 }
-/** @nocollapse */ BasicCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BasicCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ BasicCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BasicCardModule, declarations: [BasicCardComponent], imports: [CommonModule,
+/** @nocollapse */ BasicCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BasicCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ BasicCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: BasicCardModule, declarations: [BasicCardComponent], imports: [CommonModule,
         DaffCardModule,
         DaffImageModule,
         DaffButtonModule,
         FontAwesomeModule], exports: [BasicCardComponent] });
-/** @nocollapse */ BasicCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BasicCardModule, imports: [[
-            CommonModule,
-            DaffCardModule,
-            DaffImageModule,
-            DaffButtonModule,
-            FontAwesomeModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BasicCardModule, decorators: [{
+/** @nocollapse */ BasicCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BasicCardModule, imports: [CommonModule,
+        DaffCardModule,
+        DaffImageModule,
+        DaffButtonModule,
+        FontAwesomeModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BasicCardModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -60,7 +58,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 class CardOrientationComponent {
     constructor() {
         this.faMapMarked = faMapMarked;
-        this.orientationControl = new FormControl('');
+        this.orientationControl = new UntypedFormControl('');
         this.options = [
             { value: '', label: 'Default' },
             { value: 'vertical', label: 'Vertical' },
@@ -68,31 +66,29 @@ class CardOrientationComponent {
         ];
     }
 }
-/** @nocollapse */ CardOrientationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: CardOrientationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ CardOrientationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: CardOrientationComponent, selector: "card-orientation", ngImport: i0, template: "<daff-card [orientation]=\"orientationControl.value\">\n  <daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n  <fa-icon daffCardIcon [icon]=\"faMapMarked\"></fa-icon>\n  <div daffCardTagline>Basel, Switzerland</div>\n  <h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n    <p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n  </div>\n\t<div daffCardActions>\n    <button daff-button color=\"theme-contrast\">Learn More</button>\n  </div>\n</daff-card>\n\n<select [formControl]=\"orientationControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: [".daff-card--vertical{max-width:560px}\n"], components: [{ type: i1.DaffCardComponent, selector: "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", inputs: ["color", "orientation"] }, { type: i1.DaffImageComponent, selector: "daff-image", inputs: ["skeleton", "src", "alt", "width", "height"], outputs: ["load"] }, { 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.DaffCardImageDirective, selector: "[daffCardImage]" }, { type: i1.DaffCardIconDirective, selector: "[daffCardIcon]" }, { type: i1.DaffCardTaglineDirective, selector: "[daffCardTagline]" }, { type: i1.DaffCardTitleDirective, selector: "[daffCardTitle]" }, { type: i1.DaffCardContentDirective, selector: "[daffCardContent]" }, { type: i1.DaffCardActionsDirective, selector: "[daffCardActions]" }, { type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: CardOrientationComponent, decorators: [{
+/** @nocollapse */ CardOrientationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardOrientationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ CardOrientationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CardOrientationComponent, selector: "card-orientation", ngImport: i0, template: "<daff-card [orientation]=\"orientationControl.value\">\n  <daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n  <fa-icon daffCardIcon [icon]=\"faMapMarked\"></fa-icon>\n  <div daffCardTagline>Basel, Switzerland</div>\n  <h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n    <p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n  </div>\n\t<div daffCardActions>\n    <button daff-button color=\"theme-contrast\">Learn More</button>\n  </div>\n</daff-card>\n\n<select [formControl]=\"orientationControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: [".daff-card--vertical{max-width:560px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.DaffCardComponent, selector: "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", inputs: ["color", "orientation"] }, { kind: "directive", type: i3.DaffCardIconDirective, selector: "[daffCardIcon]" }, { kind: "directive", type: i3.DaffCardImageDirective, selector: "[daffCardImage]" }, { kind: "directive", type: i3.DaffCardTaglineDirective, selector: "[daffCardTagline]" }, { kind: "directive", type: i3.DaffCardTitleDirective, selector: "[daffCardTitle]" }, { kind: "directive", type: i3.DaffCardContentDirective, selector: "[daffCardContent]" }, { kind: "directive", type: i3.DaffCardActionsDirective, selector: "[daffCardActions]" }, { kind: "component", type: i3.DaffImageComponent, selector: "daff-image", inputs: ["skeleton", "src", "alt", "width", "height"], outputs: ["load"] }, { kind: "component", type: i3.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"] }, { kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardOrientationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'card-orientation', changeDetection: ChangeDetectionStrategy.OnPush, template: "<daff-card [orientation]=\"orientationControl.value\">\n  <daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n  <fa-icon daffCardIcon [icon]=\"faMapMarked\"></fa-icon>\n  <div daffCardTagline>Basel, Switzerland</div>\n  <h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n    <p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n  </div>\n\t<div daffCardActions>\n    <button daff-button color=\"theme-contrast\">Learn More</button>\n  </div>\n</daff-card>\n\n<select [formControl]=\"orientationControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: [".daff-card--vertical{max-width:560px}\n"] }]
         }] });
 
 class CardOrientationModule {
 }
-/** @nocollapse */ CardOrientationModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: CardOrientationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ CardOrientationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: CardOrientationModule, declarations: [CardOrientationComponent], imports: [CommonModule,
+/** @nocollapse */ CardOrientationModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardOrientationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ CardOrientationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: CardOrientationModule, declarations: [CardOrientationComponent], imports: [CommonModule,
         ReactiveFormsModule,
         DaffCardModule,
         DaffImageModule,
         DaffButtonModule,
         FontAwesomeModule], exports: [CardOrientationComponent] });
-/** @nocollapse */ CardOrientationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: CardOrientationModule, imports: [[
-            CommonModule,
-            ReactiveFormsModule,
-            DaffCardModule,
-            DaffImageModule,
-            DaffButtonModule,
-            FontAwesomeModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: CardOrientationModule, decorators: [{
+/** @nocollapse */ CardOrientationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardOrientationModule, imports: [CommonModule,
+        ReactiveFormsModule,
+        DaffCardModule,
+        DaffImageModule,
+        DaffButtonModule,
+        FontAwesomeModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardOrientationModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -114,7 +110,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class CardThemingComponent {
     constructor() {
-        this.colorControl = new FormControl('');
+        this.colorControl = new UntypedFormControl('');
         this.options = [
             { value: '', label: 'Default' },
             { value: 'primary', label: 'Primary' },
@@ -127,31 +123,25 @@ class CardThemingComponent {
         ];
     }
 }
-/** @nocollapse */ CardThemingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: CardThemingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ CardThemingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: CardThemingComponent, selector: "card-theming", ngImport: i0, template: "<daff-card [color]=\"colorControl.value\">\n  <div daffCardTagline>Card Tagline</div>\n  <div daffCardTitle>Title</div>\n  <div daffCardContent>\n    <p>Cards are themable.</p>\n  </div>\n</daff-card>\n\n<select [formControl]=\"colorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: ["daff-card{max-width:480px}\n"], components: [{ type: i1.DaffCardComponent, selector: "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", inputs: ["color", "orientation"] }], directives: [{ type: i1.DaffCardTaglineDirective, selector: "[daffCardTagline]" }, { type: i1.DaffCardTitleDirective, selector: "[daffCardTitle]" }, { type: i1.DaffCardContentDirective, selector: "[daffCardContent]" }, { type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: CardThemingComponent, decorators: [{
+/** @nocollapse */ CardThemingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardThemingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ CardThemingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CardThemingComponent, selector: "card-theming", ngImport: i0, template: "<daff-card [color]=\"colorControl.value\">\n  <div daffCardTagline>Card Tagline</div>\n  <div daffCardTitle>Title</div>\n  <div daffCardContent>\n    <p>Cards are themable.</p>\n  </div>\n</daff-card>\n\n<select [formControl]=\"colorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: ["daff-card{max-width:480px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.DaffCardComponent, selector: "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", inputs: ["color", "orientation"] }, { kind: "directive", type: i3.DaffCardTaglineDirective, selector: "[daffCardTagline]" }, { kind: "directive", type: i3.DaffCardTitleDirective, selector: "[daffCardTitle]" }, { kind: "directive", type: i3.DaffCardContentDirective, selector: "[daffCardContent]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardThemingComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'card-theming', styles: [`
-    daff-card {
-      max-width: 480px;
-    }
-  `], changeDetection: ChangeDetectionStrategy.OnPush, template: "<daff-card [color]=\"colorControl.value\">\n  <div daffCardTagline>Card Tagline</div>\n  <div daffCardTitle>Title</div>\n  <div daffCardContent>\n    <p>Cards are themable.</p>\n  </div>\n</daff-card>\n\n<select [formControl]=\"colorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>" }]
+            args: [{ selector: 'card-theming', changeDetection: ChangeDetectionStrategy.OnPush, template: "<daff-card [color]=\"colorControl.value\">\n  <div daffCardTagline>Card Tagline</div>\n  <div daffCardTitle>Title</div>\n  <div daffCardContent>\n    <p>Cards are themable.</p>\n  </div>\n</daff-card>\n\n<select [formControl]=\"colorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: ["daff-card{max-width:480px}\n"] }]
         }] });
 
 class CardThemingModule {
 }
-/** @nocollapse */ CardThemingModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: CardThemingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ CardThemingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: CardThemingModule, declarations: [CardThemingComponent], imports: [CommonModule,
+/** @nocollapse */ CardThemingModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardThemingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ CardThemingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: CardThemingModule, declarations: [CardThemingComponent], imports: [CommonModule,
         ReactiveFormsModule,
         DaffCardModule,
         DaffImageModule], exports: [CardThemingComponent] });
-/** @nocollapse */ CardThemingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: CardThemingModule, imports: [[
-            CommonModule,
-            ReactiveFormsModule,
-            DaffCardModule,
-            DaffImageModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: CardThemingModule, decorators: [{
+/** @nocollapse */ CardThemingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardThemingModule, imports: [CommonModule,
+        ReactiveFormsModule,
+        DaffCardModule,
+        DaffImageModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardThemingModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -171,9 +161,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class LinkableCardComponent {
     constructor() {
-        this.basicColorControl = new FormControl('');
-        this.raisedColorControl = new FormControl('');
-        this.strokedColorControl = new FormControl('');
+        this.basicColorControl = new UntypedFormControl('');
+        this.raisedColorControl = new UntypedFormControl('');
+        this.strokedColorControl = new UntypedFormControl('');
         this.options = [
             { value: '', label: 'Default' },
             { value: 'primary', label: 'Primary' },
@@ -186,31 +176,29 @@ class LinkableCardComponent {
         ];
     }
 }
-/** @nocollapse */ LinkableCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: LinkableCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ LinkableCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: LinkableCardComponent, selector: "linkable-card", ngImport: i0, template: "<a daff-card href=\"https://www.basel.com/en/attractions/basel-exhibition-centre-f45d5dd6f0\" target=\"_blank\" [color]=\"basicColorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</a>\n\n<select [formControl]=\"basicColorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>\n\n<a daff-raised-card href=\"https://www.basel.com/en/attractions/basel-exhibition-centre-f45d5dd6f0\" target=\"_blank\" [color]=\"raisedColorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</a>\n\n<select [formControl]=\"strokedColorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>\n\n<a daff-stroked-card href=\"https://www.basel.com/en/attractions/basel-exhibition-centre-f45d5dd6f0\" target=\"_blank\" [color]=\"strokedColorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</a>\n\n<select [formControl]=\"strokedColorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: ["a.daff-card,a.daff-raised-card,a.daff-stroked-card{max-width:480px}\n"], components: [{ type: i1.DaffCardComponent, selector: "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", inputs: ["color", "orientation"] }, { type: i1.DaffImageComponent, selector: "daff-image", inputs: ["skeleton", "src", "alt", "width", "height"], outputs: ["load"] }], directives: [{ type: i1.DaffCardImageDirective, selector: "[daffCardImage]" }, { type: i1.DaffCardTaglineDirective, selector: "[daffCardTagline]" }, { type: i1.DaffCardTitleDirective, selector: "[daffCardTitle]" }, { type: i1.DaffCardContentDirective, selector: "[daffCardContent]" }, { type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: LinkableCardComponent, decorators: [{
+/** @nocollapse */ LinkableCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LinkableCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ LinkableCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: LinkableCardComponent, selector: "linkable-card", ngImport: i0, template: "<a daff-card href=\"https://www.basel.com/en/attractions/basel-exhibition-centre-f45d5dd6f0\" target=\"_blank\" [color]=\"basicColorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</a>\n\n<select [formControl]=\"basicColorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>\n\n<a daff-raised-card href=\"https://www.basel.com/en/attractions/basel-exhibition-centre-f45d5dd6f0\" target=\"_blank\" [color]=\"raisedColorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</a>\n\n<select [formControl]=\"strokedColorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>\n\n<a daff-stroked-card href=\"https://www.basel.com/en/attractions/basel-exhibition-centre-f45d5dd6f0\" target=\"_blank\" [color]=\"strokedColorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</a>\n\n<select [formControl]=\"strokedColorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: ["a.daff-card,a.daff-raised-card,a.daff-stroked-card{max-width:480px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.DaffCardComponent, selector: "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", inputs: ["color", "orientation"] }, { kind: "directive", type: i3.DaffCardImageDirective, selector: "[daffCardImage]" }, { kind: "directive", type: i3.DaffCardTaglineDirective, selector: "[daffCardTagline]" }, { kind: "directive", type: i3.DaffCardTitleDirective, selector: "[daffCardTitle]" }, { kind: "directive", type: i3.DaffCardContentDirective, selector: "[daffCardContent]" }, { kind: "component", type: i3.DaffImageComponent, selector: "daff-image", inputs: ["skeleton", "src", "alt", "width", "height"], outputs: ["load"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LinkableCardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'linkable-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<a daff-card href=\"https://www.basel.com/en/attractions/basel-exhibition-centre-f45d5dd6f0\" target=\"_blank\" [color]=\"basicColorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</a>\n\n<select [formControl]=\"basicColorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>\n\n<a daff-raised-card href=\"https://www.basel.com/en/attractions/basel-exhibition-centre-f45d5dd6f0\" target=\"_blank\" [color]=\"raisedColorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</a>\n\n<select [formControl]=\"strokedColorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>\n\n<a daff-stroked-card href=\"https://www.basel.com/en/attractions/basel-exhibition-centre-f45d5dd6f0\" target=\"_blank\" [color]=\"strokedColorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</a>\n\n<select [formControl]=\"strokedColorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: ["a.daff-card,a.daff-raised-card,a.daff-stroked-card{max-width:480px}\n"] }]
         }] });
 
 class LinkableCardModule {
 }
-/** @nocollapse */ LinkableCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: LinkableCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ LinkableCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: LinkableCardModule, declarations: [LinkableCardComponent], imports: [CommonModule,
+/** @nocollapse */ LinkableCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LinkableCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ LinkableCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: LinkableCardModule, declarations: [LinkableCardComponent], imports: [CommonModule,
         RouterModule,
         ReactiveFormsModule,
         DaffCardModule,
         DaffImageModule,
         DaffButtonModule], exports: [LinkableCardComponent] });
-/** @nocollapse */ LinkableCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: LinkableCardModule, imports: [[
-            CommonModule,
-            RouterModule,
-            ReactiveFormsModule,
-            DaffCardModule,
-            DaffImageModule,
-            DaffButtonModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: LinkableCardModule, decorators: [{
+/** @nocollapse */ LinkableCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LinkableCardModule, imports: [CommonModule,
+        RouterModule,
+        ReactiveFormsModule,
+        DaffCardModule,
+        DaffImageModule,
+        DaffButtonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LinkableCardModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -232,7 +220,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class RaisedCardComponent {
     constructor() {
-        this.colorControl = new FormControl('');
+        this.colorControl = new UntypedFormControl('');
         this.options = [
             { value: '', label: 'Default' },
             { value: 'primary', label: 'Primary' },
@@ -245,29 +233,27 @@ class RaisedCardComponent {
         ];
     }
 }
-/** @nocollapse */ RaisedCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RaisedCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ RaisedCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: RaisedCardComponent, selector: "raised-card", ngImport: i0, template: "<daff-raised-card [color]=\"colorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</daff-raised-card>\n\n<select [formControl]=\"colorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: ["daff-raised-card{max-width:480px}\n"], components: [{ type: i1.DaffCardComponent, selector: "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", inputs: ["color", "orientation"] }, { type: i1.DaffImageComponent, selector: "daff-image", inputs: ["skeleton", "src", "alt", "width", "height"], outputs: ["load"] }], directives: [{ type: i1.DaffCardImageDirective, selector: "[daffCardImage]" }, { type: i1.DaffCardTaglineDirective, selector: "[daffCardTagline]" }, { type: i1.DaffCardTitleDirective, selector: "[daffCardTitle]" }, { type: i1.DaffCardContentDirective, selector: "[daffCardContent]" }, { type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RaisedCardComponent, decorators: [{
+/** @nocollapse */ RaisedCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RaisedCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ RaisedCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: RaisedCardComponent, selector: "raised-card", ngImport: i0, template: "<daff-raised-card [color]=\"colorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</daff-raised-card>\n\n<select [formControl]=\"colorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: ["daff-raised-card{max-width:480px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.DaffCardComponent, selector: "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", inputs: ["color", "orientation"] }, { kind: "directive", type: i3.DaffCardImageDirective, selector: "[daffCardImage]" }, { kind: "directive", type: i3.DaffCardTaglineDirective, selector: "[daffCardTagline]" }, { kind: "directive", type: i3.DaffCardTitleDirective, selector: "[daffCardTitle]" }, { kind: "directive", type: i3.DaffCardContentDirective, selector: "[daffCardContent]" }, { kind: "component", type: i3.DaffImageComponent, selector: "daff-image", inputs: ["skeleton", "src", "alt", "width", "height"], outputs: ["load"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RaisedCardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'raised-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<daff-raised-card [color]=\"colorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</daff-raised-card>\n\n<select [formControl]=\"colorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: ["daff-raised-card{max-width:480px}\n"] }]
         }] });
 
 class RaisedCardModule {
 }
-/** @nocollapse */ RaisedCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RaisedCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ RaisedCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RaisedCardModule, declarations: [RaisedCardComponent], imports: [CommonModule,
+/** @nocollapse */ RaisedCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RaisedCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ RaisedCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: RaisedCardModule, declarations: [RaisedCardComponent], imports: [CommonModule,
         ReactiveFormsModule,
         DaffCardModule,
         DaffImageModule,
         DaffButtonModule], exports: [RaisedCardComponent] });
-/** @nocollapse */ RaisedCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RaisedCardModule, imports: [[
-            CommonModule,
-            ReactiveFormsModule,
-            DaffCardModule,
-            DaffImageModule,
-            DaffButtonModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RaisedCardModule, decorators: [{
+/** @nocollapse */ RaisedCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RaisedCardModule, imports: [CommonModule,
+        ReactiveFormsModule,
+        DaffCardModule,
+        DaffImageModule,
+        DaffButtonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RaisedCardModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -288,7 +274,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class StrokedCardComponent {
     constructor() {
-        this.colorControl = new FormControl('');
+        this.colorControl = new UntypedFormControl('');
         this.options = [
             { value: '', label: 'Default' },
             { value: 'primary', label: 'Primary' },
@@ -301,31 +287,29 @@ class StrokedCardComponent {
         ];
     }
 }
-/** @nocollapse */ StrokedCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: StrokedCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ StrokedCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: StrokedCardComponent, selector: "stroked-card", ngImport: i0, template: "<daff-stroked-card [color]=\"colorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</daff-stroked-card>\n\n<select [formControl]=\"colorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: [":host{display:block;max-width:340px}\n"], components: [{ type: i1.DaffCardComponent, selector: "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", inputs: ["color", "orientation"] }, { type: i1.DaffImageComponent, selector: "daff-image", inputs: ["skeleton", "src", "alt", "width", "height"], outputs: ["load"] }], directives: [{ type: i1.DaffCardImageDirective, selector: "[daffCardImage]" }, { type: i1.DaffCardTaglineDirective, selector: "[daffCardTagline]" }, { type: i1.DaffCardTitleDirective, selector: "[daffCardTitle]" }, { type: i1.DaffCardContentDirective, selector: "[daffCardContent]" }, { type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: StrokedCardComponent, decorators: [{
+/** @nocollapse */ StrokedCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: StrokedCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ StrokedCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: StrokedCardComponent, selector: "stroked-card", ngImport: i0, template: "<daff-stroked-card [color]=\"colorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</daff-stroked-card>\n\n<select [formControl]=\"colorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: [":host{display:block;max-width:340px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.DaffCardComponent, selector: "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", inputs: ["color", "orientation"] }, { kind: "directive", type: i3.DaffCardImageDirective, selector: "[daffCardImage]" }, { kind: "directive", type: i3.DaffCardTaglineDirective, selector: "[daffCardTagline]" }, { kind: "directive", type: i3.DaffCardTitleDirective, selector: "[daffCardTitle]" }, { kind: "directive", type: i3.DaffCardContentDirective, selector: "[daffCardContent]" }, { kind: "component", type: i3.DaffImageComponent, selector: "daff-image", inputs: ["skeleton", "src", "alt", "width", "height"], outputs: ["load"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: StrokedCardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'stroked-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<daff-stroked-card [color]=\"colorControl.value\">\n\t<daff-image daffCardImage\n\t\tsrc=\"https://images.unsplash.com/photo-1593519749347-80f101e93113?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3774&q=80\"\n\t\talt=\"Bottom up view of Basel exhibition centre\"\n\t\twidth=\"1261\"\n\t\theight=\"946\">\n\t</daff-image>\n\t<div daffCardTagline>Basel, Switzerland</div>\n\t<h4 daffCardTitle>Basel Exhibition Centre</h4>\n\t<div daffCardContent>\n\t\t<p>This covered, public space not only marks the entrance to the exhibitions, but also functions as a meeting place for locals and visitors. The architects called the prominent hole in the middle the \"Fenster zum Himmel\" (\"window to heaven\").</p>\n\t</div>\n</daff-stroked-card>\n\n<select [formControl]=\"colorControl\">\n\t<option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.label }}</option>\n</select>", styles: [":host{display:block;max-width:340px}\n"] }]
         }] });
 
 class StrokedCardModule {
 }
-/** @nocollapse */ StrokedCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: StrokedCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ StrokedCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: StrokedCardModule, declarations: [StrokedCardComponent], imports: [CommonModule,
+/** @nocollapse */ StrokedCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: StrokedCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ StrokedCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: StrokedCardModule, declarations: [StrokedCardComponent], imports: [CommonModule,
         RouterModule,
         ReactiveFormsModule,
         DaffCardModule,
         DaffImageModule,
         DaffButtonModule], exports: [StrokedCardComponent] });
-/** @nocollapse */ StrokedCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: StrokedCardModule, imports: [[
-            CommonModule,
-            RouterModule,
-            ReactiveFormsModule,
-            DaffCardModule,
-            DaffImageModule,
-            DaffButtonModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: StrokedCardModule, decorators: [{
+/** @nocollapse */ StrokedCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: StrokedCardModule, imports: [CommonModule,
+        RouterModule,
+        ReactiveFormsModule,
+        DaffCardModule,
+        DaffImageModule,
+        DaffButtonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: StrokedCardModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [