@daffodil/design 0.39.5 → 0.39.9

package/bundles/daffodil-design-callout-examples.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"daffodil-design-callout-examples.umd.js","sources":["../../../libs/design/callout/examples/src/callout-theming/callout-theming.component.ts","../../../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.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.module.ts","../../../libs/design/callout/examples/src/examples.ts","../../../libs/design/callout/examples/src/daffodil-design-callout-examples.ts"],"sourcesContent":["import { Component } from '@angular/core';\nimport { FormControl } from '@angular/forms';\n\nimport { DaffPalette } from '@daffodil/design';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'callout-theming',\n  templateUrl: './callout-theming.component.html',\n})\nexport class CalloutThemingComponent {\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","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { DaffCalloutModule } 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  ],\n})\nexport class CalloutThemingModule { }\n","import { Component } from '@angular/core';\nimport { FormControl } from '@angular/forms';\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})\nexport class CalloutTextAlignmentComponent {\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","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport {\n  DaffCalloutModule,\n  DaffContainerModule,\n  DaffAccordionModule,\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    DaffAccordionModule,\n  ],\n})\nexport class CalloutTextAlignmentModule { }\n","import { Component } from '@angular/core';\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})\nexport class CalloutWithGridComponent {}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\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  ],\n})\nexport class CalloutWithGridModule { }\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';\n\nexport const CALLOUT_EXAMPLES = [\n  CalloutThemingComponent,\n  CalloutTextAlignmentComponent,\n  CalloutWithGridComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["FormControl","Component","NgModule","CommonModule","ReactiveFormsModule","DaffCalloutModule","DaffContainerModule","DaffAccordionModule","DaffButtonModule"],"mappings":";;;;;;;QAKA;YAME,iBAAY,GAAgB,IAAIA,iBAAW,CAAC,EAAE,CAAC,CAAC;YAEhD,YAAO,GAAG;gBACR,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;gBAC/B,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE;gBACtC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,WAAW,EAAE;gBAC1C,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE;gBACxC,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;gBAClC,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;gBAClC,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;gBAClC,EAAE,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,gBAAgB,EAAE;aACrD,CAAC;SACH;;;;gBAlBAC,cAAS,SAAC;;oBAET,QAAQ,EAAE,iBAAiB;oBAC3B,8nBAA+C;iBAChD;;;;QCSD;;;;;gBAVCC,aAAQ,SAAC;oBACR,YAAY,EAAE;wBACZ,uBAAuB;qBACxB;oBACD,OAAO,EAAE;wBACPC,mBAAY;wBACZC,yBAAmB;wBACnBC,wBAAiB;qBAClB;iBACF;;;;QCdD;YAME,qBAAgB,GAAgB,IAAIL,iBAAW,CAAC,EAAE,CAAC,CAAC;YAEpD,YAAO,GAAG;gBACR,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;gBAC/B,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE;gBAChC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE;gBACpC,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;aACnC,CAAC;SACH;;;;gBAdAC,cAAS,SAAC;;oBAET,QAAQ,EAAE,wBAAwB;oBAClC,+sBAAsD;iBACvD;;;;QCiBD;;;;;gBAZCC,aAAQ,SAAC;oBACR,YAAY,EAAE;wBACZ,6BAA6B;qBAC9B;oBACD,OAAO,EAAE;wBACPC,mBAAY;wBACZC,yBAAmB;wBACnBC,wBAAiB;wBACjBC,0BAAmB;wBACnBC,0BAAmB;qBACpB;iBACF;;;;QCfD;;;;;gBANCN,cAAS,SAAC;;oBAET,QAAQ,EAAE,mBAAmB;oBAC7B,qpCAAiD;;iBAElD;;;;QCiBD;;;;;gBAZCC,aAAQ,SAAC;oBACR,YAAY,EAAE;wBACZ,wBAAwB;qBACzB;oBACD,OAAO,EAAE;wBACPC,mBAAY;wBACZC,yBAAmB;wBACnBC,wBAAiB;wBACjBC,0BAAmB;wBACnBE,uBAAgB;qBACjB;iBACF;;;QCnBY,gBAAgB,GAAG;QAC9B,uBAAuB;QACvB,6BAA6B;QAC7B,wBAAwB;;;ICP1B;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"daffodil-design-callout-examples.umd.js","sources":["../../../libs/design/callout/examples/src/callout-theming/callout-theming.component.ts","../../../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.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.module.ts","../../../libs/design/callout/examples/src/compact-callout/compact-callout.component.ts","../../../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","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","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","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","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":["faMobile","FormControl","Component","ChangeDetectionStrategy","NgModule","CommonModule","ReactiveFormsModule","DaffCalloutModule","DaffButtonModule","FontAwesomeModule","DaffContainerModule"],"mappings":"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"}

package/bundles/daffodil-design-callout-examples.umd.min.js

@@ -1,2 +1,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/forms"),require("@angular/common"),require("@daffodil/design")):"function"==typeof define&&define.amd?define("@daffodil/design/callout/examples",["exports","@angular/core","@angular/forms","@angular/common","@daffodil/design"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self).daffodil=e.daffodil||{},e.daffodil.design=e.daffodil.design||{},e.daffodil.design.callout=e.daffodil.design.callout||{},e.daffodil.design.callout.examples={}),e.ng.core,e.ng.forms,e.ng.common,e.daffodil.design)}(this,(function(e,t,o,a,l){"use strict";var i=function(){this.colorControl=new o.FormControl(""),this.options=[{value:"",label:"Default"},{value:"primary",label:"Primary"},{value:"secondary",label:"Secondary"},{value:"tertiary",label:"Tertiary"},{value:"white",label:"White"},{value:"black",label:"Black"},{value:"theme",label:"Theme"},{value:"theme-contrast",label:"Theme Contrast"}]};i.decorators=[{type:t.Component,args:[{selector:"callout-theming",template:'<daff-callout [color]="colorControl.value">\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</daff-callout>\n\n<select [formControl]="colorControl">\n\t<option *ngFor="let option of options" [value]="option.value">{{ option.label }}</option>\n</select>'}]}];var n=function(){};n.decorators=[{type:t.NgModule,args:[{declarations:[i],imports:[a.CommonModule,o.ReactiveFormsModule,l.DaffCalloutModule]}]}];var d=function(){this.textAlignControl=new o.FormControl(""),this.options=[{value:"",label:"Default"},{value:"left",label:"Left"},{value:"center",label:"Center"},{value:"right",label:"Right"}]};d.decorators=[{type:t.Component,args:[{selector:"callout-text-alignment",template:'<daff-callout [textAlignment]="textAlignControl.value">\n\t<daff-container size="md">\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</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>'}]}];var r=function(){};r.decorators=[{type:t.NgModule,args:[{declarations:[d],imports:[a.CommonModule,o.ReactiveFormsModule,l.DaffCalloutModule,l.DaffContainerModule,l.DaffAccordionModule]}]}];var f=function(){};f.decorators=[{type:t.Component,args:[{selector:"callout-with-grid",template:'<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 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 class="daff-callout-with-grid__actions">\n\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<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</div>\n\t\t</div>\n\t</daff-container>\n</daff-callout>',styles:['.daff-callout-with-grid__grid{display:grid;grid-template:"image" "content"/1fr;grid-gap:24px}@media (min-width:768px){.daff-callout-with-grid__grid{grid-template:"image content"/1fr 1fr;grid-gap:48px}}.daff-callout-with-grid__image{grid-area:image}.daff-callout-with-grid__content-wrapper{grid-area:content}.daff-callout-with-grid__actions{display:grid;grid-template:"daffodil-action" "demo-action"/auto;grid-gap:24px}@media (min-width:768px){.daff-callout-with-grid__actions{grid-template:"daffodil-action demo-action"/auto}}.daff-callout-with-grid__daffodil-action{grid-area:daffodil-action}.daff-callout-with-grid__demo-action{grid-area:demo-action}']}]}];var c=function(){};c.decorators=[{type:t.NgModule,args:[{declarations:[f],imports:[a.CommonModule,o.ReactiveFormsModule,l.DaffCalloutModule,l.DaffContainerModule,l.DaffButtonModule]}]}];var u=[i,d,f];e.CALLOUT_EXAMPLES=u,e.CalloutTextAlignmentComponent=d,e.CalloutTextAlignmentModule=r,e.CalloutThemingComponent=i,e.CalloutThemingModule=n,e.CalloutWithGridComponent=f,e.CalloutWithGridModule=c,Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/forms"),require("@fortawesome/free-solid-svg-icons"),require("@angular/common"),require("@fortawesome/angular-fontawesome"),require("@daffodil/design")):"function"==typeof define&&define.amd?define("@daffodil/design/callout/examples",["exports","@angular/core","@angular/forms","@fortawesome/free-solid-svg-icons","@angular/common","@fortawesome/angular-fontawesome","@daffodil/design"],e):e(((t="undefined"!=typeof globalThis?globalThis:t||self).daffodil=t.daffodil||{},t.daffodil.design=t.daffodil.design||{},t.daffodil.design.callout=t.daffodil.design.callout||{},t.daffodil.design.callout.examples={}),t.ng.core,t.ng.forms,t.freeSolidSvgIcons,t.ng.common,t.angularFontawesome,t.daffodil.design)}(this,(function(t,e,o,a,n,l,i){"use strict";var f=function(){this.faMobile=a.faMobile,this.colorControl=new o.FormControl(""),this.options=[{value:"",label:"Default"},{value:"primary",label:"Primary"},{value:"secondary",label:"Secondary"},{value:"tertiary",label:"Tertiary"},{value:"white",label:"White"},{value:"black",label:"Black"},{value:"theme",label:"Theme"},{value:"theme-contrast",label:"Theme Contrast"}]};f.decorators=[{type:e.Component,args:[{selector:"callout-theming",template:'<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>',changeDetection:e.ChangeDetectionStrategy.OnPush,styles:[".daff-callout-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}"]}]}];var d=function(){};d.decorators=[{type:e.NgModule,args:[{declarations:[f],imports:[n.CommonModule,o.ReactiveFormsModule,i.DaffCalloutModule,i.DaffButtonModule,l.FontAwesomeModule]}]}];var r=function(){this.faMobile=a.faMobile,this.textAlignControl=new o.FormControl(""),this.options=[{value:"",label:"Default"},{value:"left",label:"Left"},{value:"center",label:"Center"},{value:"right",label:"Right"}]};r.decorators=[{type:e.Component,args:[{selector:"callout-text-alignment",template:'<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>',changeDetection:e.ChangeDetectionStrategy.OnPush,styles:[".daff-callout-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}"]}]}];var c=function(){};c.decorators=[{type:e.NgModule,args:[{declarations:[r],imports:[n.CommonModule,o.ReactiveFormsModule,i.DaffCalloutModule,i.DaffContainerModule,i.DaffButtonModule,l.FontAwesomeModule]}]}];var s=function(){this.faMobile=a.faMobile};s.decorators=[{type:e.Component,args:[{selector:"callout-with-grid",template:'<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>',changeDetection:e.ChangeDetectionStrategy.OnPush,styles:['.daff-callout-with-grid__grid{display:grid;grid-template:"image" "content"/1fr;grid-gap:24px}@media (min-width:768px){.daff-callout-with-grid__grid{grid-template:"image content"/1fr 1fr;grid-gap:48px}}.daff-callout-with-grid__image{grid-area:image}.daff-callout-with-grid__content-wrapper{grid-area:content}.daff-callout-with-grid__actions{display:flex;flex-direction:column}@media (min-width:480px){.daff-callout-with-grid__actions{flex-direction:row;align-items:center}}.daff-callout-with-grid__daffodil-action{margin:0 0 24px}@media (min-width:480px){.daff-callout-with-grid__daffodil-action{margin:0 24px 0 0}}.daff-callout-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}']}]}];var u=function(){};u.decorators=[{type:e.NgModule,args:[{declarations:[s],imports:[n.CommonModule,o.ReactiveFormsModule,i.DaffCalloutModule,i.DaffContainerModule,i.DaffButtonModule,l.FontAwesomeModule]}]}];var m=function(){this.faMobile=a.faMobile};m.decorators=[{type:e.Component,args:[{selector:"compact-callout",template:'<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>',changeDetection:e.ChangeDetectionStrategy.OnPush,styles:[".daff-compact-callout__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}"]}]}];var g=function(){};g.decorators=[{type:e.NgModule,args:[{declarations:[m],imports:[n.CommonModule,i.DaffCalloutModule,i.DaffContainerModule,i.DaffButtonModule,l.FontAwesomeModule]}]}];var p=[f,r,s,m];t.CALLOUT_EXAMPLES=p,t.CalloutTextAlignmentComponent=r,t.CalloutTextAlignmentModule=c,t.CalloutThemingComponent=f,t.CalloutThemingModule=d,t.CalloutWithGridComponent=s,t.CalloutWithGridModule=u,t.CompactCalloutComponent=m,t.CompactCalloutModule=g,Object.defineProperty(t,"__esModule",{value:!0})}));
 //# sourceMappingURL=daffodil-design-callout-examples.umd.min.js.map

package/bundles/daffodil-design-callout-examples.umd.min.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../libs/design/callout/examples/src/callout-theming/callout-theming.component.ts","../../../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.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.module.ts","../../../libs/design/callout/examples/src/examples.ts"],"names":["this","colorControl","FormControl","options","value","label","Component","args","selector","template","NgModule","declarations","CalloutThemingComponent","imports","CommonModule","ReactiveFormsModule","DaffCalloutModule","textAlignControl","CalloutTextAlignmentComponent","DaffContainerModule","DaffAccordionModule","CalloutWithGridComponent","DaffButtonModule","CALLOUT_EXAMPLES"],"mappings":"ypBAKA,WAMEA,KAAAC,aAA4B,IAAIC,EAAAA,YAAY,IAE5CF,KAAAG,QAAU,CACR,CAAEC,MAAO,GAAIC,MAAO,WACpB,CAAED,MAAO,UAAWC,MAAO,WAC3B,CAAED,MAAO,YAAaC,MAAO,aAC7B,CAAED,MAAO,WAAYC,MAAO,YAC5B,CAAED,MAAO,QAASC,MAAO,SACzB,CAAED,MAAO,QAASC,MAAO,SACzB,CAAED,MAAO,QAASC,MAAO,SACzB,CAAED,MAAO,iBAAkBC,MAAO,wCAhBrCC,EAAAA,UAASC,KAAA,CAAC,CAETC,SAAU,kBACVC,SAAA,unBCUF,iCAVCC,EAAAA,SAAQH,KAAA,CAAC,CACRI,aAAc,CACZC,GAEFC,QAAS,CACPC,EAAAA,aACAC,EAAAA,oBACAC,EAAAA,6BCZJ,WAMEhB,KAAAiB,iBAAgC,IAAIf,EAAAA,YAAY,IAEhDF,KAAAG,QAAU,CACR,CAAEC,MAAO,GAAIC,MAAO,WACpB,CAAED,MAAO,OAAQC,MAAO,QACxB,CAAED,MAAO,SAAUC,MAAO,UAC1B,CAAED,MAAO,QAASC,MAAO,+BAZ5BC,EAAAA,UAASC,KAAA,CAAC,CAETC,SAAU,yBACVC,SAAA,ssBCkBF,iCAZCC,EAAAA,SAAQH,KAAA,CAAC,CACRI,aAAc,CACZO,GAEFL,QAAS,CACPC,EAAAA,aACAC,EAAAA,oBACAC,EAAAA,kBACAG,EAAAA,oBACAC,EAAAA,+BCbJ,iCANCd,EAAAA,UAASC,KAAA,CAAC,CAETC,SAAU,oBACVC,SAAA,oxDCmBF,iCAZCC,EAAAA,SAAQH,KAAA,CAAC,CACRI,aAAc,CACZU,GAEFR,QAAS,CACPC,EAAAA,aACAC,EAAAA,oBACAC,EAAAA,kBACAG,EAAAA,oBACAG,EAAAA,0BCjBSC,EAAmB,CAC9BX,EACAM,EACAG","sourcesContent":["import { Component } from '@angular/core';\nimport { FormControl } from '@angular/forms';\n\nimport { DaffPalette } from '@daffodil/design';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'callout-theming',\n  templateUrl: './callout-theming.component.html',\n})\nexport class CalloutThemingComponent {\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","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { DaffCalloutModule } 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  ],\n})\nexport class CalloutThemingModule { }\n","import { Component } from '@angular/core';\nimport { FormControl } from '@angular/forms';\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})\nexport class CalloutTextAlignmentComponent {\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","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport {\n  DaffCalloutModule,\n  DaffContainerModule,\n  DaffAccordionModule,\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    DaffAccordionModule,\n  ],\n})\nexport class CalloutTextAlignmentModule { }\n","import { Component } from '@angular/core';\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})\nexport class CalloutWithGridComponent {}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\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  ],\n})\nexport class CalloutWithGridModule { }\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';\n\nexport const CALLOUT_EXAMPLES = [\n  CalloutThemingComponent,\n  CalloutTextAlignmentComponent,\n  CalloutWithGridComponent,\n];\n"]}
+{"version":3,"sources":["../../../libs/design/callout/examples/src/callout-theming/callout-theming.component.ts","../../../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.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.module.ts","../../../libs/design/callout/examples/src/compact-callout/compact-callout.component.ts","../../../libs/design/callout/examples/src/compact-callout/compact-callout.module.ts","../../../libs/design/callout/examples/src/examples.ts"],"names":["this","faMobile","colorControl","FormControl","options","value","label","Component","args","selector","template","changeDetection","ChangeDetectionStrategy","OnPush","NgModule","declarations","CalloutThemingComponent","imports","CommonModule","ReactiveFormsModule","DaffCalloutModule","DaffButtonModule","FontAwesomeModule","textAlignControl","CalloutTextAlignmentComponent","DaffContainerModule","CalloutWithGridComponent","CompactCalloutComponent","CALLOUT_EXAMPLES"],"mappings":"s2BAOA,WAQEA,KAAAC,SAAWA,EAAAA,SACXD,KAAAE,aAA4B,IAAIC,EAAAA,YAAY,IAE5CH,KAAAI,QAAU,CACR,CAAEC,MAAO,GAAIC,MAAO,WACpB,CAAED,MAAO,UAAWC,MAAO,WAC3B,CAAED,MAAO,YAAaC,MAAO,aAC7B,CAAED,MAAO,WAAYC,MAAO,YAC5B,CAAED,MAAO,QAASC,MAAO,SACzB,CAAED,MAAO,QAASC,MAAO,SACzB,CAAED,MAAO,QAASC,MAAO,SACzB,CAAED,MAAO,iBAAkBC,MAAO,wCAnBrCC,EAAAA,UAASC,KAAA,CAAC,CAETC,SAAU,kBACVC,SAAA,61BAEAC,gBAAiBC,EAAAA,wBAAwBC,uPCY3C,iCAZCC,EAAAA,SAAQN,KAAA,CAAC,CACRO,aAAc,CACZC,GAEFC,QAAS,CACPC,EAAAA,aACAC,EAAAA,oBACAC,EAAAA,kBACAC,EAAAA,iBACAC,EAAAA,6BCdJ,WAQEtB,KAAAC,SAAWA,EAAAA,SACXD,KAAAuB,iBAAgC,IAAIpB,EAAAA,YAAY,IAEhDH,KAAAI,QAAU,CACR,CAAEC,MAAO,GAAIC,MAAO,WACpB,CAAED,MAAO,OAAQC,MAAO,QACxB,CAAED,MAAO,SAAUC,MAAO,UAC1B,CAAED,MAAO,QAASC,MAAO,+BAf5BC,EAAAA,UAASC,KAAA,CAAC,CAETC,SAAU,yBACVC,SAAA,+7BAEAC,gBAAiBC,EAAAA,wBAAwBC,8PCc3C,iCAbCC,EAAAA,SAAQN,KAAA,CAAC,CACRO,aAAc,CACZS,GAEFP,QAAS,CACPC,EAAAA,aACAC,EAAAA,oBACAC,EAAAA,kBACAK,EAAAA,oBACAJ,EAAAA,iBACAC,EAAAA,6BCjBJ,WAQEtB,KAAAC,SAAWA,EAAAA,8BARZM,EAAAA,UAASC,KAAA,CAAC,CAETC,SAAU,oBACVC,SAAA,oyCAEAC,gBAAiBC,EAAAA,wBAAwBC,+1BCe3C,iCAbCC,EAAAA,SAAQN,KAAA,CAAC,CACRO,aAAc,CACZW,GAEFT,QAAS,CACPC,EAAAA,aACAC,EAAAA,oBACAC,EAAAA,kBACAK,EAAAA,oBACAJ,EAAAA,iBACAC,EAAAA,6BCjBJ,WAQEtB,KAAAC,SAAWA,EAAAA,8BARZM,EAAAA,UAASC,KAAA,CAAC,CAETC,SAAU,kBACVC,SAAA,2wBAEAC,gBAAiBC,EAAAA,wBAAwBC,uPCe3C,iCAbCC,EAAAA,SAAQN,KAAA,CAAC,CACRO,aAAc,CACZY,GAEFV,QAAS,CACPC,EAAAA,aAEAE,EAAAA,kBACAK,EAAAA,oBACAJ,EAAAA,iBACAC,EAAAA,2BClBSM,EAAmB,CAC9BZ,EACAQ,EACAE,EACAC","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","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","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","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","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"]}

package/bundles/daffodil-design-card-examples.umd.js

@@ -1,11 +1,12 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@daffodil/design'), require('@angular/forms'), require('@angular/router')) :
-    typeof define === 'function' && define.amd ? define('@daffodil/design/card/examples', ['exports', '@angular/core', '@angular/common', '@daffodil/design', '@angular/forms', '@angular/router'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.daffodil = global.daffodil || {}, global.daffodil.design = global.daffodil.design || {}, global.daffodil.design.card = global.daffodil.design.card || {}, global.daffodil.design.card.examples = {}), global.ng.core, global.ng.common, global.daffodil.design, global.ng.forms, global.ng.router));
-}(this, (function (exports, core, common, design, forms, router) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@fortawesome/free-solid-svg-icons'), require('@angular/common'), require('@fortawesome/angular-fontawesome'), require('@daffodil/design'), require('@angular/forms'), require('@angular/router')) :
+    typeof define === 'function' && define.amd ? define('@daffodil/design/card/examples', ['exports', '@angular/core', '@fortawesome/free-solid-svg-icons', '@angular/common', '@fortawesome/angular-fontawesome', '@daffodil/design', '@angular/forms', '@angular/router'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.daffodil = global.daffodil || {}, global.daffodil.design = global.daffodil.design || {}, global.daffodil.design.card = global.daffodil.design.card || {}, global.daffodil.design.card.examples = {}), global.ng.core, global.freeSolidSvgIcons, global.ng.common, global.angularFontawesome, global.daffodil.design, global.ng.forms, global.ng.router));
+}(this, (function (exports, core, freeSolidSvgIcons, common, angularFontawesome, design, forms, router) { 'use strict';
 
     var BasicCardComponent = /** @class */ (function () {
         function BasicCardComponent() {
+            this.faMapMarked = freeSolidSvgIcons.faMapMarked;
         }
         return BasicCardComponent;
     }());
@@ -13,8 +14,9 @@
         { type: core.Component, args: [{
                     // eslint-disable-next-line @angular-eslint/component-selector
                     selector: 'basic-card',
-                    template: "<daff-card>\n  <daff-image daffCardImage src=\"/assets/card/uber-logo-dark.svg\" alt=\"uber logo\" width=\"340\" height=\"135\"></daff-image>\n  <div daffCardTagline>Card Tagline</div>\n  <h4 daffCardTitle>Title</h4>\n  <p>This is a basic card.</p>\n  <div daffCardActions class=\"daff-basic-card__actions\">\n    <button daff-underline-button>Card Button</button>\n    <button daff-underline-button>Another Card Button</button>\n  </div>\n</daff-card>",
-                    styles: [":host{display:block;max-width:340px}.daff-basic-card__actions>*{margin-right:16px}.daff-basic-card__actions>:last-child{margin-right:0}"]
+                    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. 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",
+                    changeDetection: core.ChangeDetectionStrategy.OnPush,
+                    styles: ["daff-card{max-width:480px}"]
                 },] }
     ];
 
@@ -33,6 +35,7 @@
                         design.DaffCardModule,
                         design.DaffImageModule,
                         design.DaffButtonModule,
+                        angularFontawesome.FontAwesomeModule,
                     ],
                     exports: [
                         BasicCardComponent,
@@ -40,10 +43,65 @@
                 },] }
     ];
 
+    var CardOrientationComponent = /** @class */ (function () {
+        function CardOrientationComponent() {
+            this.faMapMarked = freeSolidSvgIcons.faMapMarked;
+            this.orientationControl = new forms.FormControl('');
+            this.options = [
+                { value: '', label: 'Default' },
+                { value: 'vertical', label: 'Vertical' },
+                { value: 'horizontal', label: 'Horizontal' },
+            ];
+        }
+        return CardOrientationComponent;
+    }());
+    CardOrientationComponent.decorators = [
+        { type: core.Component, args: [{
+                    // eslint-disable-next-line @angular-eslint/component-selector
+                    selector: 'card-orientation',
+                    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>",
+                    changeDetection: core.ChangeDetectionStrategy.OnPush,
+                    styles: [".daff-card--vertical{max-width:560px}"]
+                },] }
+    ];
+
+    var CardOrientationModule = /** @class */ (function () {
+        function CardOrientationModule() {
+        }
+        return CardOrientationModule;
+    }());
+    CardOrientationModule.decorators = [
+        { type: core.NgModule, args: [{
+                    declarations: [
+                        CardOrientationComponent,
+                    ],
+                    imports: [
+                        common.CommonModule,
+                        forms.ReactiveFormsModule,
+                        design.DaffCardModule,
+                        design.DaffImageModule,
+                        design.DaffButtonModule,
+                        angularFontawesome.FontAwesomeModule,
+                    ],
+                    exports: [
+                        CardOrientationComponent,
+                    ],
+                },] }
+    ];
+
     var CardThemingComponent = /** @class */ (function () {
         function CardThemingComponent() {
-            this.color = 'primary';
             this.colorControl = new forms.FormControl('');
+            this.options = [
+                { value: '', label: 'Default' },
+                { value: 'primary', label: 'Primary' },
+                { value: 'secondary', label: 'Secondary' },
+                { value: 'tertiary', label: 'Tertiary' },
+                { value: 'theme', label: 'Theme' },
+                { value: 'theme-contrast', label: 'Theme Contrast' },
+                { value: 'black', label: 'Black' },
+                { value: 'white', label: 'White' },
+            ];
         }
         return CardThemingComponent;
     }());
@@ -51,8 +109,9 @@
         { type: core.Component, args: [{
                     // eslint-disable-next-line @angular-eslint/component-selector
                     selector: 'card-theming',
-                    template: "<daff-card [color]=\"colorControl.value\">\n  <div daffCardTagline>Card Tagline</div>\n  <div daffCardTitle>Title</div>\n  <p>Cards are themable.</p>\n</daff-card>\n\n<select [formControl]=\"colorControl\">\n  <option value=\"\">Default</option>\n  <option value=\"primary\">Primary</option>\n  <option value=\"secondary\">Secondary</option>\n  <option value=\"tertiary\">Tertiary</option>\n  <option value=\"theme\">Theme</option>\n  <option value=\"theme-contrast\">Theme Contrast</option>\n  <option value=\"black\">Black</option>\n  <option value=\"white\">White</option>\n</select>",
-                    styles: ["\n    daff-card {\n      max-width: 400px;\n    }\n  "]
+                    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>",
+                    changeDetection: core.ChangeDetectionStrategy.OnPush,
+                    styles: ["\n    daff-card {\n      max-width: 480px;\n    }\n  "]
                 },] }
     ];
 
@@ -80,6 +139,19 @@
 
     var LinkableCardComponent = /** @class */ (function () {
         function LinkableCardComponent() {
+            this.basicColorControl = new forms.FormControl('');
+            this.raisedColorControl = new forms.FormControl('');
+            this.strokedColorControl = new forms.FormControl('');
+            this.options = [
+                { value: '', label: 'Default' },
+                { value: 'primary', label: 'Primary' },
+                { value: 'secondary', label: 'Secondary' },
+                { value: 'tertiary', label: 'Tertiary' },
+                { value: 'theme', label: 'Theme' },
+                { value: 'theme-contrast', label: 'Theme Contrast' },
+                { value: 'black', label: 'Black' },
+                { value: 'white', label: 'White' },
+            ];
         }
         return LinkableCardComponent;
     }());
@@ -87,8 +159,9 @@
         { type: core.Component, args: [{
                     // eslint-disable-next-line @angular-eslint/component-selector
                     selector: 'linkable-card',
-                    template: "<a routerLink=\"/\" daff-card>\n\t<daff-image daffCardImage\n\t\tsrc=\"/assets/card/uber-logo-dark.svg\"\n\t\talt=\"uber logo\"\n\t\twidth=\"340\"\n\t\theight=\"135\">\n\t</daff-image>\n\t<div daffCardTagline>Card Tagline</div>\n\t<h4 daffCardTitle>Title</h4>\n\t<p>This is a linkable card.</p>\n</a>\n",
-                    styles: [":host{display:block;max-width:340px}"]
+                    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>",
+                    changeDetection: core.ChangeDetectionStrategy.OnPush,
+                    styles: ["a daff-card,a daff-raised-card,a daff-stroked-card{max-width:480px}"]
                 },] }
     ];
 
@@ -105,6 +178,7 @@
                     imports: [
                         common.CommonModule,
                         router.RouterModule,
+                        forms.ReactiveFormsModule,
                         design.DaffCardModule,
                         design.DaffImageModule,
                         design.DaffButtonModule,
@@ -117,6 +191,17 @@
 
     var RaisedCardComponent = /** @class */ (function () {
         function RaisedCardComponent() {
+            this.colorControl = new forms.FormControl('');
+            this.options = [
+                { value: '', label: 'Default' },
+                { value: 'primary', label: 'Primary' },
+                { value: 'secondary', label: 'Secondary' },
+                { value: 'tertiary', label: 'Tertiary' },
+                { value: 'theme', label: 'Theme' },
+                { value: 'theme-contrast', label: 'Theme Contrast' },
+                { value: 'black', label: 'Black' },
+                { value: 'white', label: 'White' },
+            ];
         }
         return RaisedCardComponent;
     }());
@@ -124,8 +209,9 @@
         { type: core.Component, args: [{
                     // eslint-disable-next-line @angular-eslint/component-selector
                     selector: 'raised-card',
-                    template: "<daff-card [raised]=\"true\">\n\t<daff-image\n\t\tdaffCardImage\n\t\tsrc=\"/assets/card/uber-logo-dark.svg\"\n\t\talt=\"uber logo\"\n\t\twidth=\"340\"\n\t\theight=\"135\"\n\t></daff-image>\n\t<div daffCardTagline>Card Tagline</div>\n\t<h4 daffCardTitle>Title</h4>\n\t<p>This is a raised card.</p>\n</daff-card>\n",
-                    styles: [":host{display:block;max-width:340px}"]
+                    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>",
+                    changeDetection: core.ChangeDetectionStrategy.OnPush,
+                    styles: ["daff-raised-card{max-width:480px}"]
                 },] }
     ];
 
@@ -141,7 +227,7 @@
                     ],
                     imports: [
                         common.CommonModule,
-                        router.RouterModule,
+                        forms.ReactiveFormsModule,
                         design.DaffCardModule,
                         design.DaffImageModule,
                         design.DaffButtonModule,
@@ -152,11 +238,63 @@
                 },] }
     ];
 
+    var StrokedCardComponent = /** @class */ (function () {
+        function StrokedCardComponent() {
+            this.colorControl = new forms.FormControl('');
+            this.options = [
+                { value: '', label: 'Default' },
+                { value: 'primary', label: 'Primary' },
+                { value: 'secondary', label: 'Secondary' },
+                { value: 'tertiary', label: 'Tertiary' },
+                { value: 'theme', label: 'Theme' },
+                { value: 'theme-contrast', label: 'Theme Contrast' },
+                { value: 'black', label: 'Black' },
+                { value: 'white', label: 'White' },
+            ];
+        }
+        return StrokedCardComponent;
+    }());
+    StrokedCardComponent.decorators = [
+        { type: core.Component, args: [{
+                    // eslint-disable-next-line @angular-eslint/component-selector
+                    selector: 'stroked-card',
+                    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>",
+                    changeDetection: core.ChangeDetectionStrategy.OnPush,
+                    styles: [":host{display:block;max-width:340px}"]
+                },] }
+    ];
+
+    var StrokedCardModule = /** @class */ (function () {
+        function StrokedCardModule() {
+        }
+        return StrokedCardModule;
+    }());
+    StrokedCardModule.decorators = [
+        { type: core.NgModule, args: [{
+                    declarations: [
+                        StrokedCardComponent,
+                    ],
+                    imports: [
+                        common.CommonModule,
+                        router.RouterModule,
+                        forms.ReactiveFormsModule,
+                        design.DaffCardModule,
+                        design.DaffImageModule,
+                        design.DaffButtonModule,
+                    ],
+                    exports: [
+                        StrokedCardComponent,
+                    ],
+                },] }
+    ];
+
     var CARD_EXAMPLES = [
         BasicCardComponent,
         CardThemingComponent,
         LinkableCardComponent,
         RaisedCardComponent,
+        StrokedCardComponent,
+        CardOrientationComponent,
     ];
 
     /**
@@ -165,13 +303,17 @@
 
     exports.BasicCardModule = BasicCardModule;
     exports.CARD_EXAMPLES = CARD_EXAMPLES;
+    exports.CardOrientationModule = CardOrientationModule;
     exports.CardThemingModule = CardThemingModule;
     exports.LinkableCardModule = LinkableCardModule;
     exports.RaisedCardModule = RaisedCardModule;
+    exports.StrokedCardModule = StrokedCardModule;
     exports.ɵa = BasicCardComponent;
     exports.ɵb = CardThemingComponent;
     exports.ɵc = LinkableCardComponent;
     exports.ɵd = RaisedCardComponent;
+    exports.ɵe = StrokedCardComponent;
+    exports.ɵf = CardOrientationComponent;
 
     Object.defineProperty(exports, '__esModule', { value: true });
 

package/bundles/daffodil-design-card-examples.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"daffodil-design-card-examples.umd.js","sources":["../../../libs/design/card/examples/src/basic-card/basic-card.component.ts","../../../libs/design/card/examples/src/basic-card/basic-card.module.ts","../../../libs/design/card/examples/src/card-theming/card-theming.component.ts","../../../libs/design/card/examples/src/card-theming/card-theming.module.ts","../../../libs/design/card/examples/src/linkable-card/linkable-card.component.ts","../../../libs/design/card/examples/src/linkable-card/linkable-card.module.ts","../../../libs/design/card/examples/src/raised-card/raised-card.component.ts","../../../libs/design/card/examples/src/raised-card/raised-card.module.ts","../../../libs/design/card/examples/src/public_api.ts","../../../libs/design/card/examples/src/daffodil-design-card-examples.ts"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'basic-card',\n  templateUrl: './basic-card.component.html',\n  styleUrls: ['./basic-card.component.scss'],\n})\nexport class BasicCardComponent {}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport {\n  DaffCardModule,\n  DaffImageModule,\n  DaffButtonModule,\n} from '@daffodil/design';\n\nimport { BasicCardComponent } from './basic-card.component';\n\n@NgModule({\n  declarations: [\n    BasicCardComponent,\n  ],\n  imports: [\n    CommonModule,\n    DaffCardModule,\n    DaffImageModule,\n    DaffButtonModule,\n  ],\n  exports: [\n    BasicCardComponent,\n  ],\n})\nexport class BasicCardModule { }\n","import { Component } from '@angular/core';\nimport { FormControl } from '@angular/forms';\n\nimport { DaffPalette } from '@daffodil/design';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'card-theming',\n  templateUrl: './card-theming.component.html',\n  styles: [`\n    daff-card {\n      max-width: 400px;\n    }\n  `],\n})\nexport class CardThemingComponent {\n  color: DaffPalette = 'primary';\n\n  colorControl: FormControl = new FormControl('');\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport {\n  DaffCardModule,\n  DaffImageModule,\n} from '@daffodil/design';\n\nimport { CardThemingComponent } from './card-theming.component';\n\n@NgModule({\n  declarations: [\n    CardThemingComponent,\n  ],\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    DaffCardModule,\n    DaffImageModule,\n  ],\n  exports: [\n    CardThemingComponent,\n  ],\n})\nexport class CardThemingModule { }\n","import { Component } from '@angular/core';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'linkable-card',\n  templateUrl: './linkable-card.component.html',\n  styleUrls: ['./linkable-card.component.scss'],\n})\nexport class LinkableCardComponent {}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { RouterModule } from '@angular/router';\n\nimport {\n  DaffCardModule,\n  DaffImageModule,\n  DaffButtonModule,\n} from '@daffodil/design';\n\nimport { LinkableCardComponent } from './linkable-card.component';\n\n@NgModule({\n  declarations: [\n    LinkableCardComponent,\n  ],\n  imports: [\n    CommonModule,\n    RouterModule,\n    DaffCardModule,\n    DaffImageModule,\n    DaffButtonModule,\n  ],\n  exports: [\n    LinkableCardComponent,\n  ],\n})\nexport class LinkableCardModule { }\n","import { Component } from '@angular/core';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'raised-card',\n  templateUrl: './raised-card.component.html',\n  styleUrls: ['./raised-card.component.scss'],\n})\nexport class RaisedCardComponent {}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { RouterModule } from '@angular/router';\n\nimport {\n  DaffCardModule,\n  DaffImageModule,\n  DaffButtonModule,\n} from '@daffodil/design';\n\nimport { RaisedCardComponent } from './raised-card.component';\n\n@NgModule({\n  declarations: [\n    RaisedCardComponent,\n  ],\n  imports: [\n    CommonModule,\n    RouterModule,\n    DaffCardModule,\n    DaffImageModule,\n    DaffButtonModule,\n  ],\n  exports: [\n    RaisedCardComponent,\n  ],\n})\nexport class RaisedCardModule { }\n","import { BasicCardComponent } from './basic-card/basic-card.component';\nexport { BasicCardModule } from './basic-card/basic-card.module';\nimport { CardThemingComponent } from './card-theming/card-theming.component';\nexport { CardThemingModule } from './card-theming/card-theming.module';\nimport { LinkableCardComponent } from './linkable-card/linkable-card.component';\nexport { LinkableCardModule } from './linkable-card/linkable-card.module';\nimport { RaisedCardComponent } from './raised-card/raised-card.component';\nexport { RaisedCardModule } from './raised-card/raised-card.module';\n\nexport const CARD_EXAMPLES = [\n  BasicCardComponent,\n  CardThemingComponent,\n  LinkableCardComponent,\n  RaisedCardComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n\nexport {BasicCardComponent as ɵa} from './basic-card/basic-card.component';\nexport {CardThemingComponent as ɵb} from './card-theming/card-theming.component';\nexport {LinkableCardComponent as ɵc} from './linkable-card/linkable-card.component';\nexport {RaisedCardComponent as ɵd} from './raised-card/raised-card.component';"],"names":["Component","NgModule","CommonModule","DaffCardModule","DaffImageModule","DaffButtonModule","FormControl","ReactiveFormsModule","RouterModule"],"mappings":";;;;;;;QAQA;;;;;gBANCA,cAAS,SAAC;;oBAET,QAAQ,EAAE,YAAY;oBACtB,gdAA0C;;iBAE3C;;;;QCkBD;;;;;gBAdCC,aAAQ,SAAC;oBACR,YAAY,EAAE;wBACZ,kBAAkB;qBACnB;oBACD,OAAO,EAAE;wBACPC,mBAAY;wBACZC,qBAAc;wBACdC,sBAAe;wBACfC,uBAAgB;qBACjB;oBACD,OAAO,EAAE;wBACP,kBAAkB;qBACnB;iBACF;;;;QCnBD;YAWE,UAAK,GAAgB,SAAS,CAAC;YAE/B,iBAAY,GAAgB,IAAIC,iBAAW,CAAC,EAAE,CAAC,CAAC;SACjD;;;;gBAdAN,cAAS,SAAC;;oBAET,QAAQ,EAAE,cAAc;oBACxB,slBAA4C;6BACnC,uDAIR;iBACF;;;;QCWD;;;;;gBAdCC,aAAQ,SAAC;oBACR,YAAY,EAAE;wBACZ,oBAAoB;qBACrB;oBACD,OAAO,EAAE;wBACPC,mBAAY;wBACZK,yBAAmB;wBACnBJ,qBAAc;wBACdC,sBAAe;qBAChB;oBACD,OAAO,EAAE;wBACP,oBAAoB;qBACrB;iBACF;;;;QChBD;;;;;gBANCJ,cAAS,SAAC;;oBAET,QAAQ,EAAE,eAAe;oBACzB,0TAA6C;;iBAE9C;;;;QCoBD;;;;;gBAfCC,aAAQ,SAAC;oBACR,YAAY,EAAE;wBACZ,qBAAqB;qBACtB;oBACD,OAAO,EAAE;wBACPC,mBAAY;wBACZM,mBAAY;wBACZL,qBAAc;wBACdC,sBAAe;wBACfC,uBAAgB;qBACjB;oBACD,OAAO,EAAE;wBACP,qBAAqB;qBACtB;iBACF;;;;QClBD;;;;;gBANCL,cAAS,SAAC;;oBAET,QAAQ,EAAE,aAAa;oBACvB,oUAA2C;;iBAE5C;;;;QCoBD;;;;;gBAfCC,aAAQ,SAAC;oBACR,YAAY,EAAE;wBACZ,mBAAmB;qBACpB;oBACD,OAAO,EAAE;wBACPC,mBAAY;wBACZM,mBAAY;wBACZL,qBAAc;wBACdC,sBAAe;wBACfC,uBAAgB;qBACjB;oBACD,OAAO,EAAE;wBACP,mBAAmB;qBACpB;iBACF;;;QCjBY,aAAa,GAAG;QAC3B,kBAAkB;QAClB,oBAAoB;QACpB,qBAAqB;QACrB,mBAAmB;;;ICbrB;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"daffodil-design-card-examples.umd.js","sources":["../../../libs/design/card/examples/src/basic-card/basic-card.component.ts","../../../libs/design/card/examples/src/basic-card/basic-card.module.ts","../../../libs/design/card/examples/src/card-orientation/card-orientation.component.ts","../../../libs/design/card/examples/src/card-orientation/card-orientation.module.ts","../../../libs/design/card/examples/src/card-theming/card-theming.component.ts","../../../libs/design/card/examples/src/card-theming/card-theming.module.ts","../../../libs/design/card/examples/src/linkable-card/linkable-card.component.ts","../../../libs/design/card/examples/src/linkable-card/linkable-card.module.ts","../../../libs/design/card/examples/src/raised-card/raised-card.component.ts","../../../libs/design/card/examples/src/raised-card/raised-card.module.ts","../../../libs/design/card/examples/src/stroked-card/stroked-card.component.ts","../../../libs/design/card/examples/src/stroked-card/stroked-card.module.ts","../../../libs/design/card/examples/src/public_api.ts","../../../libs/design/card/examples/src/daffodil-design-card-examples.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { faMapMarked } from '@fortawesome/free-solid-svg-icons';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'basic-card',\n  templateUrl: './basic-card.component.html',\n  styleUrls: ['./basic-card.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class BasicCardComponent {\n  faMapMarked = faMapMarked;\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\n\nimport {\n  DaffCardModule,\n  DaffImageModule,\n  DaffButtonModule,\n} from '@daffodil/design';\n\nimport { BasicCardComponent } from './basic-card.component';\n\n@NgModule({\n  declarations: [\n    BasicCardComponent,\n  ],\n  imports: [\n    CommonModule,\n    DaffCardModule,\n    DaffImageModule,\n    DaffButtonModule,\n\n    FontAwesomeModule,\n  ],\n  exports: [\n    BasicCardComponent,\n  ],\n})\nexport class BasicCardModule { }\n","import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { FormControl } from '@angular/forms';\nimport { faMapMarked } from '@fortawesome/free-solid-svg-icons';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'card-orientation',\n  templateUrl: './card-orientation.component.html',\n  styleUrls: ['./card-orientation.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class CardOrientationComponent {\n  faMapMarked = faMapMarked;\n\n  orientationControl: FormControl = new FormControl('');\n\n  options = [\n    { value: '', label: 'Default' },\n    { value: 'vertical', label: 'Vertical' },\n    { value: 'horizontal', label: 'Horizontal' },\n  ];\n}\n","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  DaffCardModule,\n  DaffImageModule,\n} from '@daffodil/design';\n\nimport { CardOrientationComponent } from './card-orientation.component';\n\n@NgModule({\n  declarations: [\n    CardOrientationComponent,\n  ],\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    DaffCardModule,\n    DaffImageModule,\n    DaffButtonModule,\n    FontAwesomeModule,\n  ],\n  exports: [\n    CardOrientationComponent,\n  ],\n})\nexport class CardOrientationModule { }\n","import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { FormControl } from '@angular/forms';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'card-theming',\n  templateUrl: './card-theming.component.html',\n  styles: [`\n    daff-card {\n      max-width: 480px;\n    }\n  `],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class CardThemingComponent {\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: 'theme', label: 'Theme' },\n    { value: 'theme-contrast', label: 'Theme Contrast' },\n    { value: 'black', label: 'Black' },\n    { value: 'white', label: 'White' },\n  ];\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport {\n  DaffCardModule,\n  DaffImageModule,\n} from '@daffodil/design';\n\nimport { CardThemingComponent } from './card-theming.component';\n\n@NgModule({\n  declarations: [\n    CardThemingComponent,\n  ],\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    DaffCardModule,\n    DaffImageModule,\n  ],\n  exports: [\n    CardThemingComponent,\n  ],\n})\nexport class CardThemingModule { }\n","import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { FormControl } from '@angular/forms';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'linkable-card',\n  templateUrl: './linkable-card.component.html',\n  styleUrls: ['./linkable-card.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class LinkableCardComponent {\n  basicColorControl: FormControl = new FormControl('');\n  raisedColorControl: FormControl = new FormControl('');\n  strokedColorControl: 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: 'theme', label: 'Theme' },\n    { value: 'theme-contrast', label: 'Theme Contrast' },\n    { value: 'black', label: 'Black' },\n    { value: 'white', label: 'White' },\n  ];\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { RouterModule } from '@angular/router';\n\nimport {\n  DaffCardModule,\n  DaffImageModule,\n  DaffButtonModule,\n} from '@daffodil/design';\n\nimport { LinkableCardComponent } from './linkable-card.component';\n\n@NgModule({\n  declarations: [\n    LinkableCardComponent,\n  ],\n  imports: [\n    CommonModule,\n    RouterModule,\n    ReactiveFormsModule,\n    DaffCardModule,\n    DaffImageModule,\n    DaffButtonModule,\n  ],\n  exports: [\n    LinkableCardComponent,\n  ],\n})\nexport class LinkableCardModule { }\n","import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { FormControl } from '@angular/forms';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'raised-card',\n  templateUrl: './raised-card.component.html',\n  styleUrls: ['./raised-card.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class RaisedCardComponent {\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: 'theme', label: 'Theme' },\n    { value: 'theme-contrast', label: 'Theme Contrast' },\n    { value: 'black', label: 'Black' },\n    { value: 'white', label: 'White' },\n  ];\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport {\n  DaffCardModule,\n  DaffImageModule,\n  DaffButtonModule,\n} from '@daffodil/design';\n\nimport { RaisedCardComponent } from './raised-card.component';\n\n@NgModule({\n  declarations: [\n    RaisedCardComponent,\n  ],\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n\n    DaffCardModule,\n    DaffImageModule,\n    DaffButtonModule,\n  ],\n  exports: [\n    RaisedCardComponent,\n  ],\n})\nexport class RaisedCardModule { }\n","import {\n  ChangeDetectionStrategy,\n  Component,\n} from '@angular/core';\nimport { FormControl } from '@angular/forms';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'stroked-card',\n  templateUrl: './stroked-card.component.html',\n  styleUrls: ['./stroked-card.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class StrokedCardComponent {\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: 'theme', label: 'Theme' },\n    { value: 'theme-contrast', label: 'Theme Contrast' },\n    { value: 'black', label: 'Black' },\n    { value: 'white', label: 'White' },\n  ];\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { RouterModule } from '@angular/router';\n\nimport {\n  DaffCardModule,\n  DaffImageModule,\n  DaffButtonModule,\n} from '@daffodil/design';\n\nimport { StrokedCardComponent } from './stroked-card.component';\n\n@NgModule({\n  declarations: [\n    StrokedCardComponent,\n  ],\n  imports: [\n    CommonModule,\n    RouterModule,\n    ReactiveFormsModule,\n\n    DaffCardModule,\n    DaffImageModule,\n    DaffButtonModule,\n  ],\n  exports: [\n    StrokedCardComponent,\n  ],\n})\nexport class StrokedCardModule { }\n","import { BasicCardComponent } from './basic-card/basic-card.component';\nexport { BasicCardModule } from './basic-card/basic-card.module';\nimport { CardOrientationComponent } from './card-orientation/card-orientation.component';\nexport { CardOrientationModule } from './card-orientation/card-orientation.module';\nimport { CardThemingComponent } from './card-theming/card-theming.component';\nexport { CardThemingModule } from './card-theming/card-theming.module';\nimport { LinkableCardComponent } from './linkable-card/linkable-card.component';\nexport { LinkableCardModule } from './linkable-card/linkable-card.module';\nimport { RaisedCardComponent } from './raised-card/raised-card.component';\nexport { RaisedCardModule } from './raised-card/raised-card.module';\nimport { StrokedCardComponent } from './stroked-card/stroked-card.component';\nexport { StrokedCardModule } from './stroked-card/stroked-card.module';\n\nexport const CARD_EXAMPLES = [\n  BasicCardComponent,\n  CardThemingComponent,\n  LinkableCardComponent,\n  RaisedCardComponent,\n  StrokedCardComponent,\n  CardOrientationComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n\nexport {BasicCardComponent as ɵa} from './basic-card/basic-card.component';\nexport {CardOrientationComponent as ɵf} from './card-orientation/card-orientation.component';\nexport {CardThemingComponent as ɵb} from './card-theming/card-theming.component';\nexport {LinkableCardComponent as ɵc} from './linkable-card/linkable-card.component';\nexport {RaisedCardComponent as ɵd} from './raised-card/raised-card.component';\nexport {StrokedCardComponent as ɵe} from './stroked-card/stroked-card.component';"],"names":["faMapMarked","Component","ChangeDetectionStrategy","NgModule","CommonModule","DaffCardModule","DaffImageModule","DaffButtonModule","FontAwesomeModule","FormControl","ReactiveFormsModule","RouterModule"],"mappings":"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"}

package/bundles/daffodil-design-card-examples.umd.min.js

@@ -1,2 +1,2 @@
-!function(a,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/common"),require("@daffodil/design"),require("@angular/forms"),require("@angular/router")):"function"==typeof define&&define.amd?define("@daffodil/design/card/examples",["exports","@angular/core","@angular/common","@daffodil/design","@angular/forms","@angular/router"],e):e(((a="undefined"!=typeof globalThis?globalThis:a||self).daffodil=a.daffodil||{},a.daffodil.design=a.daffodil.design||{},a.daffodil.design.card=a.daffodil.design.card||{},a.daffodil.design.card.examples={}),a.ng.core,a.ng.common,a.daffodil.design,a.ng.forms,a.ng.router)}(this,(function(a,e,o,t,d,r){"use strict";var n=function(){};n.decorators=[{type:e.Component,args:[{selector:"basic-card",template:'<daff-card>\n  <daff-image daffCardImage src="/assets/card/uber-logo-dark.svg" alt="uber logo" width="340" height="135"></daff-image>\n  <div daffCardTagline>Card Tagline</div>\n  <h4 daffCardTitle>Title</h4>\n  <p>This is a basic card.</p>\n  <div daffCardActions class="daff-basic-card__actions">\n    <button daff-underline-button>Card Button</button>\n    <button daff-underline-button>Another Card Button</button>\n  </div>\n</daff-card>',styles:[":host{display:block;max-width:340px}.daff-basic-card__actions>*{margin-right:16px}.daff-basic-card__actions>:last-child{margin-right:0}"]}]}];var i=function(){};i.decorators=[{type:e.NgModule,args:[{declarations:[n],imports:[o.CommonModule,t.DaffCardModule,t.DaffImageModule,t.DaffButtonModule],exports:[n]}]}];var l=function(){this.color="primary",this.colorControl=new d.FormControl("")};l.decorators=[{type:e.Component,args:[{selector:"card-theming",template:'<daff-card [color]="colorControl.value">\n  <div daffCardTagline>Card Tagline</div>\n  <div daffCardTitle>Title</div>\n  <p>Cards are themable.</p>\n</daff-card>\n\n<select [formControl]="colorControl">\n  <option value="">Default</option>\n  <option value="primary">Primary</option>\n  <option value="secondary">Secondary</option>\n  <option value="tertiary">Tertiary</option>\n  <option value="theme">Theme</option>\n  <option value="theme-contrast">Theme Contrast</option>\n  <option value="black">Black</option>\n  <option value="white">White</option>\n</select>',styles:["\n    daff-card {\n      max-width: 400px;\n    }\n  "]}]}];var f=function(){};f.decorators=[{type:e.NgModule,args:[{declarations:[l],imports:[o.CommonModule,d.ReactiveFormsModule,t.DaffCardModule,t.DaffImageModule],exports:[l]}]}];var s=function(){};s.decorators=[{type:e.Component,args:[{selector:"linkable-card",template:'<a routerLink="/" daff-card>\n\t<daff-image daffCardImage\n\t\tsrc="/assets/card/uber-logo-dark.svg"\n\t\talt="uber logo"\n\t\twidth="340"\n\t\theight="135">\n\t</daff-image>\n\t<div daffCardTagline>Card Tagline</div>\n\t<h4 daffCardTitle>Title</h4>\n\t<p>This is a linkable card.</p>\n</a>\n',styles:[":host{display:block;max-width:340px}"]}]}];var c=function(){};c.decorators=[{type:e.NgModule,args:[{declarations:[s],imports:[o.CommonModule,r.RouterModule,t.DaffCardModule,t.DaffImageModule,t.DaffButtonModule],exports:[s]}]}];var u=function(){};u.decorators=[{type:e.Component,args:[{selector:"raised-card",template:'<daff-card [raised]="true">\n\t<daff-image\n\t\tdaffCardImage\n\t\tsrc="/assets/card/uber-logo-dark.svg"\n\t\talt="uber logo"\n\t\twidth="340"\n\t\theight="135"\n\t></daff-image>\n\t<div daffCardTagline>Card Tagline</div>\n\t<h4 daffCardTitle>Title</h4>\n\t<p>This is a raised card.</p>\n</daff-card>\n',styles:[":host{display:block;max-width:340px}"]}]}];var g=function(){};g.decorators=[{type:e.NgModule,args:[{declarations:[u],imports:[o.CommonModule,r.RouterModule,t.DaffCardModule,t.DaffImageModule,t.DaffButtonModule],exports:[u]}]}];var p=[n,l,s,u];a.BasicCardModule=i,a.CARD_EXAMPLES=p,a.CardThemingModule=f,a.LinkableCardModule=c,a.RaisedCardModule=g,a.ɵa=n,a.ɵb=l,a.ɵc=s,a.ɵd=u,Object.defineProperty(a,"__esModule",{value:!0})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@fortawesome/free-solid-svg-icons"),require("@angular/common"),require("@fortawesome/angular-fontawesome"),require("@daffodil/design"),require("@angular/forms"),require("@angular/router")):"function"==typeof define&&define.amd?define("@daffodil/design/card/examples",["exports","@angular/core","@fortawesome/free-solid-svg-icons","@angular/common","@fortawesome/angular-fontawesome","@daffodil/design","@angular/forms","@angular/router"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self).daffodil=e.daffodil||{},e.daffodil.design=e.daffodil.design||{},e.daffodil.design.card=e.daffodil.design.card||{},e.daffodil.design.card.examples={}),e.ng.core,e.freeSolidSvgIcons,e.ng.common,e.angularFontawesome,e.daffodil.design,e.ng.forms,e.ng.router)}(this,(function(e,t,o,a,n,i,l,r){"use strict";var d=function(){this.faMapMarked=o.faMapMarked};d.decorators=[{type:t.Component,args:[{selector:"basic-card",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. 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',changeDetection:t.ChangeDetectionStrategy.OnPush,styles:["daff-card{max-width:480px}"]}]}];var f=function(){};f.decorators=[{type:t.NgModule,args:[{declarations:[d],imports:[a.CommonModule,i.DaffCardModule,i.DaffImageModule,i.DaffButtonModule,n.FontAwesomeModule],exports:[d]}]}];var s=function(){this.faMapMarked=o.faMapMarked,this.orientationControl=new l.FormControl(""),this.options=[{value:"",label:"Default"},{value:"vertical",label:"Vertical"},{value:"horizontal",label:"Horizontal"}]};s.decorators=[{type:t.Component,args:[{selector:"card-orientation",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>',changeDetection:t.ChangeDetectionStrategy.OnPush,styles:[".daff-card--vertical{max-width:560px}"]}]}];var c=function(){};c.decorators=[{type:t.NgModule,args:[{declarations:[s],imports:[a.CommonModule,l.ReactiveFormsModule,i.DaffCardModule,i.DaffImageModule,i.DaffButtonModule,n.FontAwesomeModule],exports:[s]}]}];var h=function(){this.colorControl=new l.FormControl(""),this.options=[{value:"",label:"Default"},{value:"primary",label:"Primary"},{value:"secondary",label:"Secondary"},{value:"tertiary",label:"Tertiary"},{value:"theme",label:"Theme"},{value:"theme-contrast",label:"Theme Contrast"},{value:"black",label:"Black"},{value:"white",label:"White"}]};h.decorators=[{type:t.Component,args:[{selector:"card-theming",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>',changeDetection:t.ChangeDetectionStrategy.OnPush,styles:["\n    daff-card {\n      max-width: 480px;\n    }\n  "]}]}];var u=function(){};u.decorators=[{type:t.NgModule,args:[{declarations:[h],imports:[a.CommonModule,l.ReactiveFormsModule,i.DaffCardModule,i.DaffImageModule],exports:[h]}]}];var m=function(){this.basicColorControl=new l.FormControl(""),this.raisedColorControl=new l.FormControl(""),this.strokedColorControl=new l.FormControl(""),this.options=[{value:"",label:"Default"},{value:"primary",label:"Primary"},{value:"secondary",label:"Secondary"},{value:"tertiary",label:"Tertiary"},{value:"theme",label:"Theme"},{value:"theme-contrast",label:"Theme Contrast"},{value:"black",label:"Black"},{value:"white",label:"White"}]};m.decorators=[{type:t.Component,args:[{selector:"linkable-card",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>',changeDetection:t.ChangeDetectionStrategy.OnPush,styles:["a daff-card,a daff-raised-card,a daff-stroked-card{max-width:480px}"]}]}];var p=function(){};p.decorators=[{type:t.NgModule,args:[{declarations:[m],imports:[a.CommonModule,r.RouterModule,l.ReactiveFormsModule,i.DaffCardModule,i.DaffImageModule,i.DaffButtonModule],exports:[m]}]}];var v=function(){this.colorControl=new l.FormControl(""),this.options=[{value:"",label:"Default"},{value:"primary",label:"Primary"},{value:"secondary",label:"Secondary"},{value:"tertiary",label:"Tertiary"},{value:"theme",label:"Theme"},{value:"theme-contrast",label:"Theme Contrast"},{value:"black",label:"Black"},{value:"white",label:"White"}]};v.decorators=[{type:t.Component,args:[{selector:"raised-card",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>',changeDetection:t.ChangeDetectionStrategy.OnPush,styles:["daff-raised-card{max-width:480px}"]}]}];var g=function(){};g.decorators=[{type:t.NgModule,args:[{declarations:[v],imports:[a.CommonModule,l.ReactiveFormsModule,i.DaffCardModule,i.DaffImageModule,i.DaffButtonModule],exports:[v]}]}];var b=function(){this.colorControl=new l.FormControl(""),this.options=[{value:"",label:"Default"},{value:"primary",label:"Primary"},{value:"secondary",label:"Secondary"},{value:"tertiary",label:"Tertiary"},{value:"theme",label:"Theme"},{value:"theme-contrast",label:"Theme Contrast"},{value:"black",label:"Black"},{value:"white",label:"White"}]};b.decorators=[{type:t.Component,args:[{selector:"stroked-card",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>',changeDetection:t.ChangeDetectionStrategy.OnPush,styles:[":host{display:block;max-width:340px}"]}]}];var C=function(){};C.decorators=[{type:t.NgModule,args:[{declarations:[b],imports:[a.CommonModule,r.RouterModule,l.ReactiveFormsModule,i.DaffCardModule,i.DaffImageModule,i.DaffButtonModule],exports:[b]}]}];var w=[d,h,m,v,b,s];e.BasicCardModule=f,e.CARD_EXAMPLES=w,e.CardOrientationModule=c,e.CardThemingModule=u,e.LinkableCardModule=p,e.RaisedCardModule=g,e.StrokedCardModule=C,e.ɵa=d,e.ɵb=h,e.ɵc=m,e.ɵd=v,e.ɵe=b,e.ɵf=s,Object.defineProperty(e,"__esModule",{value:!0})}));
 //# sourceMappingURL=daffodil-design-card-examples.umd.min.js.map