\n
\n \n\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AbstractControl, FormControl, FormGroup, ValidatorFn, Validators } from '@angular/forms';\nimport { AlloyInputTextIcon, matchValidator } from '../../../cell/input/input.model';\n\n@Component({\n selector: 'alloy-input-icon-texts',\n templateUrl: './input-icon-texts.component.html',\n styleUrls: ['./input-icon-texts.component.css']\n})\nexport class InputIconTextsComponent {\n _inputIconTexts: AlloyInputTextIcon[];\n @Input() set inputIconTexts(inputIconTexts: AlloyInputTextIcon[]) {\n \tthis._inputIconTexts = inputIconTexts;\n this.inputForm = this.createData(this._inputIconTexts);\n }\n //reactive form for data input\n inputForm: FormGroup;\n errors: string[];\n match: boolean;\n\n @Output() output: EventEmitter\n \n
\n \n
\n \n
\n \n {{ error }}\n
\n \n
\n \n\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AlloyButtonIcon } from '../button.model';\n\n@Component({\n selector: 'alloy-button-icon',\n templateUrl: './button-icon.component.html',\n styleUrls: ['./button-icon.component.css']\n})\nexport class ButtonIconComponent {\n _buttonIcon: AlloyButtonIcon;\n @Input() set buttonIcon(buttonIcon: AlloyButtonIcon){\n this._buttonIcon = buttonIcon;\n }\n @Output() output: EventEmitter\n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n \n
\n \n
\n \n \n \n \n \n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n {{ error }}\n
\n \n
\n \n\n","import { AlloyButton, AlloyButtonIcon } from \"../../cell/button/button.model\";\nimport { AlloyLink, AlloyLinkIcon, AlloyLinkLogo } from \"../../cell/link/link.model\";\n\nexport class Bar{\n id: string;\n className: string;\n selected: string;\n static idGenerator: number = 0;\n constructor(res?: any){\n if(res){\n this.id = res.id ? res.id : \"buttonBar\" + ++AlloyButtonBar.idGenerator;\n this.className = res.className ? res.className : \"d-flex justify-content-center\";\n this.selected = res.selected ? res.selected : \"\";\n }else{\n this.id = \"buttonBar\" + ++AlloyButtonBar.idGenerator;\n this.className = \"d-flex justify-content-center\";\n this.selected = \"\";\n }\n }\n toString(){\n return {\n id: this.id ?? \"buttonBar1\",\n className: this.className ?? \"d-flex justify-content-center\",\n selected: this.selected ?? \"active\"\n }\n }\n}\n\nexport class AlloyButtonBar extends Bar{\n type: string;\n buttons: AlloyButton[];\n constructor(res?: any){\n if(res){\n super(res);\n this.type = res.type ? res.type : 'AlloyButton';\n switch(this.type){\n case \"AlloyButton\":\n this.buttons = res.buttons ? res.buttons.map(i=> new AlloyButton(i)) : [];\n break;\n case \"AlloyButtonIcon\":\n case \"AlloyIconButton\":\n this.buttons = res.buttons ? res.buttons.map(i=> new AlloyButtonIcon(i)) : [];\n break; \n default:\n this.buttons = res.buttons ? res.buttons.map(i=> new AlloyButton(i)) : [];\n break;\n }\n }else{\n super()\n this.type = 'AlloyButton';\n this.buttons = [];\n }\n }\n\n toString(){\n return {\n id: this.id ?? \"buttonBar1\",\n className: this.className ?? \"d-flex justify-content-center\",\n selected: this.selected ?? \"active\",\n type: this.type ?? \"AlloyButton\",\n buttons: this.buttons.map(s=>s.tostring()) ?? []\n }\n }\n}\n\nexport class AlloyLinkBar extends Bar{\n type: string;\n static idGenerator: number = 0;\n links: AlloyLink[];\n linkClass: string;\n constructor(res?: any){\n if(res){\n super(res);\n this.type = res.type ? res.type : 'AlloyLink';\n this.linkClass = res.linkClass ? res.linkClass : \"nav-item\";\n switch(this.type){\n case \"AlloyLink\":\n this.links = res.links ? res.links.map(i=> new AlloyLink(i)) : [];\n break;\n case \"AlloyLinkIcon\":\n case \"AlloyIconLink\":\n this.links = res.links ? res.links.map(i=> new AlloyLinkIcon(i)) : [];\n break; \n case \"AlloyLinkLogo\":\n this.links = res.links ? res.links.map(i=> new AlloyLinkLogo(i)) : [];\n break; \n default:\n this.links = res.links ? res.links.map(i=> new AlloyLink(i)) : [];\n break;\n }\n }else{\n super();\n this.type = 'AlloyLink';\n this.linkClass = \"nav-item\";\n this.links = [];\n }\n }\n\n toString(){\n return {\n id: this.id ?? \"linkBar1\",\n className: this.className ?? \"d-flex justify-content-center\",\n selected: this.selected ?? \"active\",\n type: this.type ?? \"AlloyButton\",\n links: this.links.map(s=>s.tostring()) ?? []\n }\n }\n}\n\nexport class AlloySideBar extends AlloyLinkBar{\n logo: AlloyLinkLogo;\n close: string;\n constructor(res?: any){\n if(res){\n super(res);\n this.logo = res.logo ? new AlloyLinkLogo(res.logo) : new AlloyLinkLogo();\n this.close = res.close ? res.close : \"\";\n }else{\n super();\n this.logo = new AlloyLinkLogo();\n this.close = \"\";\n }\n }\n}","import { AlloyIcon} from \"../../cell/icon/icon.model\";\nimport { AlloyButtonBar, AlloyLinkBar, Bar } from \"../bar/bar.model\";\n\nexport class CardItem {\n id: string;\n name: string;\n className: string;\n show: boolean;\n static idGenerator: number = 0;\n constructor(res?: any) {\n if (res) {\n this.id = res.id ? res.id : 'cardItem' + ++CardItem.idGenerator;\n this.className = res.className ? res.className : '';\n this.name = res.name ? res.name : 'Card Item';\n this.show = res.show ? res.show : true;\n } else {\n this.id = 'cardItem';\n this.className = '';\n this.name = 'Card Item';\n this.show = true;\n }\n }\n}\n\nexport class AlloyLogo{\n imageUrl: string;\n alt: string;\n width: string;\n height: string;\n constructor(res?: any){\n if(res){\n this.imageUrl = res.imageUrl ? res.imageUrl : \"https://alloymobile.blob.core.windows.net/alloymobile/alloymobile.png\";\n this.alt = res.alt ? res.alt : \"Alloymobile\";\n this.width = res.width ? res.width : \"auto\";\n this.height = res.height ? res.height : \"auto\";\n }else{\n this.imageUrl = \"https://alloymobile.blob.core.windows.net/alloymobile/alloymobile.png\";\n this.alt = \"Alloymobile\";\n this.width = \"72\";\n this.height = \"auto\";\n }\n }\n}\n\nexport class AlloyCard{\n id: string;\n className: string;\n body: CardItem;\n fields: any\n link: string;\n static idGenerator: number = 0;\n constructor(res?: any) {\n if (res) {\n this.id = res.id ? res.id : 'card' + ++AlloyCard.idGenerator;\n this.className = res.className ? res.className : 'card border m-2 shadow';\n this.link = res.link ? res.link : '';\n this.body = res.body ? new CardItem(res.body) : new CardItem();\n this.fields = res.fields ? res.fields : new CardItem();\n } else {\n this.id = 'card' + ++AlloyCard.idGenerator;\n this.className = 'card border m-2 shadow';\n this.link = '';\n this.body = new CardItem();\n this.fields = new CardItem();\n }\n }\n}\n\nexport class AlloyCardAction extends AlloyCard{\n action: Bar;\n type: string\n constructor(res?){\n if(res){\n super(res);\n this.type = res.type ? res.type : \"AlloyButtonBar\";\n switch(this.type){\n case \"AlloyButtonBar\":\n this.action = res.action ? new AlloyButtonBar(res.action) : new AlloyButtonBar();\n break;\n case \"AlloyLinkBar\":\n this.action = res.action ? new AlloyLinkBar(res.action) : new AlloyLinkBar();\n break; \n default:\n this.action = res.action ? new AlloyButtonBar(res.action) : new AlloyButtonBar();\n break;\n }\n }else{\n super();\n this.type = \"AlloyButtonBar\";\n this.action = new AlloyButtonBar();\n }\n }\n}\n\n\nexport class AlloyCardIcon extends AlloyCard {\n icon: AlloyIcon;\n iconClass: string;\n textClass: string;\n constructor(res?: any) {\n if (res) {\n super(res) \n this.icon = res.icon ? new AlloyIcon(res.icon) : new AlloyIcon();\n this.iconClass = res.iconClass ? res.iconClass : 'col-4 icon-lg rounded-circle bg-warning text-white mb-0';\n this.textClass = res.textClass ? res.textClass : 'col-8';\n } else {\n super() \n this.iconClass = 'icon-lg rounded-circle bg-warning text-white mb-0';\n this.icon = new AlloyIcon();\n this.textClass = 'col-8';\n }\n }\n}\n\nexport class AlloyCardIconAction extends AlloyCardAction{\n icon: AlloyIcon;\n iconClass: string;\n textClass: string;\n constructor(res?){\n if(res){\n super(res);\n this.icon = res.icon ? AlloyIcon.getAlloyIcon(res.icon) : new AlloyIcon();\n this.iconClass = res.iconClass ? res.iconClass : 'col-4 icon-lg rounded-circle bg-warning text-white mb-0';\n this.textClass = res.textClass ? res.textClass : 'col-8';\n }else{\n super();\n this.iconClass = 'icon-lg rounded-circle bg-warning text-white mb-0';\n this.icon = new AlloyIcon();\n this.textClass = 'col-8';\n }\n }\n}\n\nexport class AlloyCardImage extends AlloyCard {\n image: AlloyLogo;\n imageClass: string;\n textClass: string;\n constructor(res?: any) {\n if (res) {\n super(res) \n this.image = res.image ? new AlloyLogo(res.image) : new AlloyLogo();\n this.imageClass = res.imageClass ? res.imageClass : \"card-img-top rounded p-2\";\n this.textClass = res.textClass ? res.textClass : 'col-8';\n } else {\n super() \n this.image = new AlloyLogo();\n this.imageClass = 'card-img-top rounded p-2';\n this.textClass = 'col-8';\n }\n }\n}\n\nexport class AlloyCardImageAction extends AlloyCardAction{\n image: AlloyLogo;\n imageClass: string;\n textClass: string;\n constructor(res?: any) {\n if (res) {\n super(res) \n this.image = res.image ? new AlloyLogo(res.image) : new AlloyLogo();\n this.imageClass = res.imageClass ? res.imageClass : \"card-img-top rounded p-2\";\n this.textClass = res.textClass ? res.textClass : 'col-8';\n } else {\n super() \n this.image = new AlloyLogo();\n this.imageClass = 'card-img-top rounded p-2';\n this.textClass = 'col-8';\n }\n }\n}\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { Router } from '@angular/router';\nimport { AlloyLinkIcon } from '../../link/link.model';\n\n\n@Component({\n selector: 'alloy-icon-link',\n templateUrl: './icon-link.component.html',\n styleUrls: ['./icon-link.component.css']\n})\nexport class IconLinkComponent {\n _iconLink: AlloyLinkIcon;\n @Input() set iconLink(iconLink: AlloyLinkIcon){\n this._iconLink = iconLink;\n }\n\n @Output() output: EventEmitter\n \n
\n \n
\n \n \n
\n \n \n
\n \n \n
\n \n \n
\n \n \n
\n \n \n
\n \n \n
\n \n \n \n
\n \n \n \n \n \n {{ option }}\n \n \n
\n \n
\n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n {{ error }}\n
\n - \n
- \n
- \n
- \n
\n \n \n
- \n
- \n
\n \n \n
- \n
- \n
\n \n \n
- \n
- \n
\n \n \n
\n \n \n \n
\n \n \n \n
\n \n \n \n
\n \n \n \n \n {{ field.value.name }}\n
\n \n \n \n \n
\n \n \n
\n \n
\n \n \n \n {{ field.value.name }}\n
\n \n \n \n
\n \n \n
\n \n
\n \n \n \n {{ field.value.name }}\n
\n \n \n \n \n \n {{ field.value.name }}\n
\n \n \n\n","import { Component, Input } from '@angular/core';\nimport { AlloyCardImage } from '../card.model';\nimport { KeyValue } from '@angular/common';\n@Component({\n selector: 'alloy-card-image',\n templateUrl: './card-image.component.html',\n styleUrls: ['./card-image.component.css']\n})\nexport class CardImageComponent {\n _cardImage: AlloyCardImage\n @Input() set cardImage(_cardImage: AlloyCardImage){\n this._cardImage = _cardImage;\n }\n constructor(){\n this._cardImage = new AlloyCardImage();\n }\n\n // Preserve original property order\n originalOrder = (a: KeyValue\n \n
\n \n\n","import { Component, Input } from '@angular/core';\nimport { AlloyCardIcon } from '../card.model';\nimport { KeyValue } from '@angular/common';\n@Component({\n selector: 'alloy-card-icon',\n templateUrl: './card-icon.component.html',\n styleUrls: ['./card-icon.component.css']\n})\nexport class CardIconComponent {\n _cardIcon: AlloyCardIcon\n @Input() set cardIcon(_cardIcon: AlloyCardIcon){\n this._cardIcon = _cardIcon;\n }\n constructor(){\n this._cardIcon = new AlloyCardIcon();\n }\n\n // Preserve original property order\n originalOrder = (a: KeyValue\n
\n \n
\n \n \n \n {{ field.value.name }}\n
\n \n \n \n
\n \n\n","import { AlloyLinkLogo } from \"../../cell/link/link.model\";\nimport { AlloyButtonBar, AlloyLinkBar } from \"../bar/bar.model\";\n\nexport class AlloyNavBar {\n id: string;\n className: string;\n logo: AlloyLinkLogo;\n linkBar: AlloyLinkBar;\n static idGenerator: number = 0;\n constructor(response?: any) {\n if (response) {\n this.id = response.id ? response.id : \"navbar\" + ++AlloyNavBar.idGenerator;;\n this.className = response.className ? response.className : 'navbar-light';\n this.logo = response.logo ? new AlloyLinkLogo(response.logo) : new AlloyLinkLogo();\n this.linkBar = response.linkBar ? new AlloyLinkBar(response.linkBar) : new AlloyLinkBar(); \n } else {\n this.id = \"navbar\";\n this.className = 'navbar-light';\n this.logo = new AlloyLinkLogo();\n this.linkBar = new AlloyLinkBar();\n }\n }\n}\n\nexport class AlloyNavBarAction extends AlloyNavBar {\n buttonBar: AlloyButtonBar;\n static idGenerator: number = 0;\n constructor(response?: any) {\n if (response) {\n super(response)\n this.buttonBar = response.buttonBar ? new AlloyButtonBar(response.buttonBar) : new AlloyButtonBar(); \n } else {\n super();\n this.buttonBar = new AlloyButtonBar();\n }\n }\n}\n\n\n","import { Component, Input } from '@angular/core';\nimport { AlloyIcon } from '../../../cell/icon/icon.model';\nimport { AlloyNavBar } from '../navbar.model';\n\n@Component({\n selector: 'alloy-navbar',\n templateUrl: './navbar.component.html',\n styleUrls: ['./navbar.component.css']\n})\nexport class NavbarComponent {\n _navBar: AlloyNavBar;\n toggleBars: AlloyIcon;\n @Input() set navBar(navBar: AlloyNavBar) {\n \tthis._navBar = navBar;\n }\n constructor(){\n this._navBar = new AlloyNavBar();\n this.toggleBars = new AlloyIcon({\"id\":\"1\",\"icon\":\"faBars\",\"size\":\"lg\",\"spin\":false,\"className\":\"\"});\n }\n}\n","\n\n\n\n\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AbstractControl, FormControl, FormGroup } from '@angular/forms';\nimport { AlloyInputText, matchValidator } from '../../../cell/input/input.model';\n\n@Component({\n selector: 'alloy-input-texts',\n templateUrl: './input-texts.component.html',\n styleUrls: ['./input-texts.component.css']\n})\nexport class InputTextsComponent {\n _inputTexts: AlloyInputText[];\n @Input() set inputTexts(inputTexts: AlloyInputText[]) {\n \tthis._inputTexts = inputTexts;\n this.inputForm = this.createData(this._inputTexts);\n }\n //reactive form for data input\n inputForm: FormGroup;\n errors: string[];\n match: boolean;\n\n @Output() output: EventEmitter\n
\n \n
\n \n \n \n {{ field.value.name }}\n
\n \n \n
\n \n\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AlloyButtonSubmit } from '../button.model';\n\n@Component({\n selector: 'alloy-button-submit',\n templateUrl: './button-submit.component.html',\n styleUrls: ['./button-submit.component.css']\n})\nexport class ButtonSubmitComponent {\n _buttonSubmit: AlloyButtonSubmit;\n @Input() set buttonSubmit(buttonSubmit: AlloyButtonSubmit){\n this._buttonSubmit = buttonSubmit;\n }\n @Output() output: EventEmitter\n \n \n
\n \n
\n \n {{ error }}\n
\n | Type | \n|
|---|---|
| \n | \n \n {{ col.value }}\n | \n
\n
\n \n\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AbstractControl } from '@angular/forms';\nimport { AlloyButtonIcon } from '../../../cell/button/button.model';\nimport { AlloyInputTextIcon } from '../../../cell/input/input.model';\nimport { AlloySearchBar } from '../searchbar.model';\n\n@Component({\n selector: 'alloy-searchbar',\n templateUrl: './searchbar.component.html',\n styleUrls: ['./searchbar.component.css']\n})\nexport class SearchbarComponent {\n _searchBar: AlloySearchBar;\n _output: any;\n @Input() set searchBar(searchBar: AlloySearchBar) {\n \tthis._searchBar = searchBar;\n this._output = {};\n }\n\n @Output() output: EventEmitter\n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n \n
\n \n
\n \n \n \n \n \n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n {{ error }}\n
\n \n
","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { Page } from './page.model';\n\n@Component({\n selector: 'alloy-page',\n templateUrl: './page.component.html',\n styleUrls: ['./page.component.css']\n})\nexport class PageComponent{\n _page: Page;\n @Input() set page(page: Page){\n this._page = page;\n }\n @Output() output: EventEmitter\n
\n \n
\n| Type | \n\n {{ capitalize(h.key) }}\n | \nAction | \n
|---|---|---|
| \n | \n \n \n \n | \n
\n
","import { AlloyButton } from \"../../cell/button/button.model\";\nimport { AlloyInputType } from \"../../cell/input/input.model\";\n\nexport class Modal{\n id: string;\n title: string;\n className: string;\n submit: AlloyButton;\n action: string;\n constructor(res?: any){\n if(res){\n this.id = res.id ? res.id : \"\";\n this.title = res.title ? res.title : \"\";\n this.className = res.className ? res.className : \"modal fade\";\n this.submit = res.submit ? new AlloyButton(res.submit) : new AlloyButton();\n this.action = res.action ? res.action : \"\";\n }else{\n this.id = \"\";\n this.title = \"\";\n this.className = \"modal fade\";\n this.submit = new AlloyButton();\n this.action = \"\";\n }\n }\n}\n\nexport class AlloyModalToast extends Modal{\n message: string;\n constructor(res?: any){\n if(res){\n super(res);\n this.message = res.message ? res.message :'';\n\n }else{\n super();\n this.message = '';\n }\n }\n}\n\n\nexport class AlloyModal extends Modal{\n fields: AlloyInputType[];\n data: any;\n type: string;\n constructor(res?: any){\n if(res){\n super(res);\n this.type = res.type ? res.type : \"AlloyInputTextIcon\";\n this.fields = res.fields ? res.fields.map(f=>new AlloyInputType(f)) : [];\n this.data={};\n }else{\n super();\n this.type = \"AlloyInputTextIcon\";\n this.fields = [];\n this.data = {}\n }\n }\n}","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AbstractControl } from '@angular/forms';\nimport { AlloyModal } from '../modal.model';\n\n@Component({\n selector: 'alloy-modal',\n templateUrl: './modal.component.html',\n styleUrls: ['./modal.component.css']\n})\nexport class ModalComponent {\n _modal: AlloyModal;\n @Input() set modal(modal: AlloyModal){\n this._modal = modal;\n }\n @Output() output: EventEmitter\n
\n\n \n \n \n \n \n \n \n \n \n \n
\n {{_form.title}}
\n{{ _form.message }}
\n \n \n
\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AlloyModalToast } from '../modal.model';\n\n@Component({\n selector: 'alloy-modal-toast',\n templateUrl: './modal-toast.component.html',\n styleUrls: ['./modal-toast.component.css']\n})\nexport class ModalToastComponent {\n _modalToast: AlloyModalToast;\n @Input() set modalToast(modalToast: AlloyModalToast){\n this._modalToast = modalToast;\n }\n @Output() output: EventEmitter\n \n
\n\n","import { AlloyLink } from \"../../cell/link/link.model\";\nimport { AlloyForm } from \"../form/form.model\";\n\nexport class Reset{\n id: string; \n className: string;\n resetForm: AlloyForm;\n loginLink: AlloyLink;\n constructor(response?: any){\n if(response){\n this.id = response.id ? response.id : \"reset\";\n this.className = response.className ? response.className : \"d-flex justify-content-center flex-column text-center h-100 mt-3\";\n this.resetForm = response.resetForm ? new AlloyForm(response.resetForm) : new AlloyForm();\n this.loginLink = response.loginLink ? new AlloyLink(response.loginLink) : new AlloyLink();\n }else{\n this.id = \"reset\";\n this.className = \"d-flex justify-content-center flex-column text-center h-100 mt-3\";\n this.resetForm = new AlloyForm();\n this.loginLink = new AlloyLink();\n }\n }\n}","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AbstractControl} from '@angular/forms';\nimport { Reset } from '../reset.model';\n\n@Component({\n selector: 'alloy-reset',\n templateUrl: './reset.component.html',\n styleUrls: ['./reset.component.css']\n})\nexport class ResetComponent {\n _reset: Reset;\n\n @Input() set reset(reset: Reset){\n this._reset = reset;\n };\n\n @Output() output: EventEmitter\n
","import { AlloyLink } from \"../../cell/link/link.model\";\nimport { AlloyForm } from \"../form/form.model\";\n\nexport class Code{\n id: string; \n className: string;\n codeForm: AlloyForm;\n loginLink: AlloyLink;\n constructor(response?: any){\n if(response){\n this.id = response.id ? response.id : \"code\";\n this.className = response.className ? response.className : \"d-flex justify-content-center flex-column text-center h-100 mt-3\";\n this.codeForm = response.codeForm ? new AlloyForm(response.codeForm) : new AlloyForm();\n this.loginLink = response.loginLink ? new AlloyLink(response.loginLink) : new AlloyLink();\n }else{\n this.id = \"code\";\n this.className = \"d-flex justify-content-center flex-column text-center h-100 mt-3\";\n this.codeForm = new AlloyForm();\n this.loginLink = new AlloyLink();\n }\n }\n}\n ","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AbstractControl} from '@angular/forms';\nimport { Code } from '../code.model';\n\n@Component({\n selector: 'alloy-code',\n templateUrl: './code.component.html',\n styleUrls: ['./code.component.css']\n})\nexport class CodeComponent {\n _code: Code;\n @Input() set code(code: Code){\n this._code = code;\n };\n\n @Output() output: EventEmitter\n
\n\n
\n \n
","import { AlloyLink } from '../../cell/link/link.model';\nimport { AlloyForm } from '../form/form.model';\n\nexport class Login {\n id: string; \n className: string;\n loginForm: AlloyForm;\n rememberMe: boolean;\n forgetPassword: AlloyLink;\n constructor(response?: any) {\n if (response) {\n this.id = response.id ? response.id : \"login\";\n this.className = response.className ? response.className : \"d-flex justify-content-center flex-column text-center h-100 mt-3\";\n this.loginForm = response.loginForm ? new AlloyForm(response.loginForm) : new AlloyForm();\n this.rememberMe = response.rememberMe ? response.rememberMe : false;\n this.forgetPassword = response.forgetPassword ? new AlloyLink(response.forgetPassword) : new AlloyLink();\n } else {\n this.id = \"login\";\n this.className = \"d-flex justify-content-center flex-column text-center h-100 mt-3\";\n this.loginForm = new AlloyForm();\n this.rememberMe = false;\n this.forgetPassword = new AlloyLink();\n }\n }\n}\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AbstractControl} from '@angular/forms';\nimport { Login } from '../login.model';\n\n@Component({\n selector: 'alloy-login',\n templateUrl: './login.component.html',\n styleUrls: ['./login.component.css']\n})\nexport class LoginComponent {\n _login: Login;\n @Input() set login(login: Login){\n this._login = login;\n };\n\n @Output() output: EventEmitter\n
\n\n
\n \n \n Please enter the code received in your email or phone. Did not receive code\n resend again.\n \n
\n \n
\n","import { AlloyLink } from \"../../cell/link/link.model\";\nimport { AlloyForm } from \"../form/form.model\";\n\nexport class Register{\n id: string; \n className: string;\n registerForm: AlloyForm;\n privacyLink: AlloyLink;\n termsLink: AlloyLink;\n constructor(response?: any){\n if(response){\n this.id = response.id ? response.id : \"\";\n this.className = response.className ? response.className : \"\";\n this.registerForm = response.registerForm ? new AlloyForm(response.registerForm) : new AlloyForm();\n this.privacyLink = response.privacyLink ? new AlloyLink(response.privacyLink) : new AlloyLink();\n this.termsLink = response.termsLink ? new AlloyLink(response.termsLink) : new AlloyLink();\n }else{\n this.id = \"register\";\n this.className = \"d-flex justify-content-center flex-column text-center h-100 mt-3\";\n this.registerForm = new AlloyForm();\n this.privacyLink = new AlloyLink();\n this.termsLink = new AlloyLink();\n }\n }\n }\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AbstractControl} from '@angular/forms';\nimport { Register } from '../register.model';\n\n@Component({\n selector: 'alloy-register',\n templateUrl: './register.component.html',\n styleUrls: ['./register.component.css']\n})\nexport class RegisterComponent {\n _register: Register;\n\n @Input() set register(register: Register){\n this._register = register;\n };\n\n @Output() output: EventEmitter\n
\n\n
\n \n
\n \n \n
\n \n
","import { AlloyLink } from \"../../cell/link/link.model\";\nimport { AlloyForm } from \"../form/form.model\";\n\nexport class Forget{\n id: string; \n className: string;\n forgetForm: AlloyForm;\n loginLink: AlloyLink;\n constructor(response?: any) {\n if (response) {\n this.id = response.id ? response.id : \"forget\";\n this.className = response.className ? response.className : \"d-flex justify-content-center flex-column text-center h-100 mt-3\";\n this.forgetForm = response.forgetForm ? new AlloyForm(response.forgetForm) : new AlloyForm();\n this.loginLink = response.loginLink ? new AlloyLink(response.loginLink) : new AlloyLink();\n } else {\n this.id = \"forget\";\n this.className = \"d-flex justify-content-center flex-column text-center h-100 mt-3\";\n this.forgetForm = new AlloyForm();\n this.loginLink = new AlloyLink();\n }\n }\n}\n ","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AbstractControl} from '@angular/forms';\nimport { Forget } from '../forget.model';\n\n@Component({\n selector: 'alloy-forget',\n templateUrl: './forget.component.html',\n styleUrls: ['./forget.component.css']\n})\nexport class ForgetComponent {\n _forget: Forget;\n\n @Input() set forget(forget: Forget){\n this._forget = forget;\n };\n\n @Output() output: EventEmitter\n
\n\n
\n \n \n By clicking signup you agree to our\n
\n \n
","import { AlloyButtonIcon } from \"../../cell/button/button.model\";\nimport { AlloyInputTextIcon } from \"../../cell/input/input.model\";\nimport { AlloyCardAction, AlloyCardIconAction, AlloyCardImageAction} from \"../../tissue/card/card.model\";\nimport { TableAction } from \"../../tissue/table/table.model\";\nimport { AlloyModal} from \"../modal/modal.model\";\n\nexport class Crud{\n id: string;\n className: string;\n modal: AlloyModal;\n search: AlloyInputTextIcon\n add: AlloyButtonIcon\n constructor(res?: any){\n if(res){\n this.id = res.id ? res.id : \"\";\n this.className = res.className ? res.className : \"\";\n this.modal = res.modal ? new AlloyModal(res.modal) : new AlloyModal();\n this.search = res.search ? new AlloyInputTextIcon(res.search) : new AlloyInputTextIcon();\n this.add = res.add ? new AlloyButtonIcon(res.add) : new AlloyButtonIcon();\n }else{\n this.id = \"\";\n this.className = \"\";\n this.modal = new AlloyModal();\n this.search = new AlloyInputTextIcon();\n this.add = new AlloyButtonIcon();\n }\n }\n}\n\n export class AlloyCrudTable extends Crud{\n table: TableAction\n constructor(res?: any){\n if(res){\n super(res);\n this.table = res.table ? new TableAction(res.table) : new TableAction();\n }else{\n super();\n this.table = new TableAction();\n }\n }\n}\n\nexport class AlloyCrudCard extends Crud{\n type: string;\n cards: AlloyCardAction[]\n constructor(res?: any){\n if(res){\n super(res);\n this.type = res.type ? res.type : \"AlloyCardAction\";\n switch(this.type){\n case \"AlloyCardAction\":\n this.cards = res.cards ? res.cards.map(f=>new AlloyCardAction(f)) : [];\n break;\n case \"AlloyCardIconAction\":\n this.cards = res.cards ? res.cards.map(f=>new AlloyCardIconAction(f)) : [];\n break; \n case \"AlloyCardImageAction\":\n this.cards = res.cards ? res.cards.map(f=>new AlloyCardImageAction(f)) : [];\n break; \n default:\n this.cards = res.cards ? res.cards.map(f=>new AlloyCardAction(f)) : [];\n break; \n }\n }else{\n super();\n this.type = \"AlloyCardAction\";\n this.cards = [];\n }\n }\n}","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AlloyInputTextIcon } from '../../../cell/input/input.model';\nimport { AlloyIcon } from '../../../cell/icon/icon.model';\nimport { AbstractControl } from '@angular/forms';\nimport { AlloyCrudTable } from '../crud.model';\ndeclare var window: any;\n\n@Component({\n selector: 'alloy-crud-table',\n templateUrl: './crud-table.component.html',\n styleUrls: ['./crud-table.component.css']\n})\nexport class CrudTableComponent {\n\n _crudTable: AlloyCrudTable;\n @Input() set crudTable(crudTable: AlloyCrudTable){\n this._crudTable = crudTable;\n this.createRow = [...this._crudTable.modal.fields] as any;\n }\n modalForm: any;\n createRow: AlloyInputTextIcon[];\n selectedRow: any;\n @Output() output: EventEmitter\n
\n\n
\n \n \n Please enter your email to receive the reset password link.\n \n
\n \n \n
\n \n \n
\n \n
\n \n
\n \n
\n\n
\n \n \n \n \n \n \n \n \n \n \n \n
\n\n\n
\n \n
\n \n
\n \n
\n
\n ","import { AlloyButtonIcon } from \"../../cell/button/button.model\";\nimport { AlloyInputTextIcon } from \"../../cell/input/input.model\";\nimport { AlloyLinkIcon, AlloyLink } from \"../../cell/link/link.model\";\nimport { AlloyForm } from \"../../organ/form/form.model\";\n\nexport class Nav{\n id: string;\n className: string;\n selected: string;\n constructor(response?: any){\n if(response){\n this.id = response.id ? response.id : \"alloyNav\";\n this.className = response.className ? response.className : \"nav nav-pills nav-fill\";\n this.selected = response.selected ? response.selected : \"\";\n }else{\n this.id = \"alloyNav\";\n this.className = 'nav nav-pills nav-fill';\n this.selected = \"\";\n }\n }\n}\n\nexport class AlloyTabForm extends Nav{\n tabs: AlloyButtonIcon[];\n id: string;\n title: string;\n className: string;\n tabClass: string\n formClass: string;\n messageClass: string;\n message: string;\n type: string;\n action: string;\n actionClass: string;\n fields: AlloyInputTextIcon[];\n actions: AlloyButtonIcon[];\n data: any;\n constructor(res?: any){\n if(res){\n super(res);\n this.tabs = res.tabs ? res.tabs.map(n => new AlloyButtonIcon(n)) : [];\n if(this.tabs.length > 0){\n this.tabs[0].active = this.selected;\n }\n this.id = res.id ? res.id : \"form\";\n this.title = res.title ? res.title : \"AlloyMobile\";\n this.type = res.type ? res.type : \"AlloyInputTextIcon\";\n this.className = res.className ? res.className : \"col m-2\";\n this.tabClass = res.tabClass ? res.tabClass : \"col m-2\";\n this.formClass = res.formClass ? res.formClass : \"col m-2\";\n this.messageClass = res.messageClass ? res.messageClass : \"alert alert-text-danger m-0 p-0\";\n this.message = res.message ? res.message : \"\";\n this.action = res.action ? res.action : \"\";\n this.actionClass = res.actionClass ? res.actionClass : \"row\";\n this.fields = res.fields ? res.fields.map(f=>new AlloyInputTextIcon(f)) : [];\n this.actions = res.actions ? res.actions.map(f=>new AlloyInputTextIcon(f)) : [];\n this.data={};\n }else{\n super();\n this.tabs = [];\n this.id = \"form\";\n this.title = \"AlloyMobile\";\n this.title = \"AlloyInputTextIcon\";\n this.className = \"col m-2\";\n this.tabClass = \"m-2\";\n this.formClass = \"m-2\";\n this.messageClass = \"alert alert-text-danger m-0 p-0\";\n this.message = \"\";\n this.action = \"\";\n this.actionClass = \"row\";\n this.fields = [];\n this.actions = [];\n this.data = {}\n }\n } \n}\n\n\n\n\nexport class AlloyTabButton extends Nav {\n tabs: AlloyButtonIcon[];\n forms: AlloyForm[];\n constructor(response?: any){\n if(response){\n super(response);\n this.tabs = response.tabs ? response.tabs.map(n => new AlloyButtonIcon(n)) : [];\n if(this.tabs.length > 0){\n this.tabs[0].active = this.selected;\n }\n }else{\n super();\n this.tabs = [];\n }\n }\n}\n\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AlloyTabForm } from '../nav.model';\nimport { AlloyButtonIcon } from '../../../cell/button/button.model';\nimport { AbstractControl } from '@angular/forms';\n\n@Component({\n selector: 'alloy-tab-form',\n templateUrl: './tab-form.component.html',\n styleUrls: ['./tab-form.component.css']\n})\nexport class TabFormComponent {\n _tabForm: AlloyTabForm;\n @Input() set tabForm(_tabForm: AlloyTabForm){\n this._tabForm = _tabForm;\n }\n @Output() output: EventEmitter\n
\n \n
\n \n
\n \n
\n \n
\n \n {{name}}\n
\n \n {{email}}\n
\n \n
\n \n
Address:
\n\n
\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AlloyInputText } from '../input.model';\nimport { AbstractControl, FormControl, FormGroup } from '@angular/forms';\n\n@Component({\n selector: 'alloy-input-floating-text',\n templateUrl: './input-floating-text.component.html',\n styleUrls: ['./input-floating-text.component.css']\n})\nexport class InputFloatingTextComponent {\n _inputFloatingText: AlloyInputText;\n @Input() set inputFloatingText(inputFloatingText: AlloyInputText) {\n \tthis._inputFloatingText = inputFloatingText;\n this.inputForm = this.createData(this._inputFloatingText);\n }\n //reactive form for data input\n inputForm: FormGroup;\n errors: string[];\n\n @Output() output: EventEmitter\n
\n \n
\n \n
\n \n
\n\n
\n \n
\n {{_tabForm.title}}
\n{{ _tabForm.message }}
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n\n","import { Component, Input } from '@angular/core';\nimport { AlloyButtonDropDown } from '../button.model';\n\n@Component({\n selector: 'alloy-button-dropdown',\n templateUrl: './button-dropdown.component.html',\n styleUrls: ['./button-dropdown.component.css']\n})\nexport class ButtonDropdownComponent {\n _buttonDropDown: AlloyButtonDropDown;\n @Input() set buttonDropDown(buttonDropDown: AlloyButtonDropDown){\n this._buttonDropDown = buttonDropDown;\n }\n constructor() {\n this._buttonDropDown = new AlloyButtonDropDown();\n }\n}\n","\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n \n \n
\n \n
\n \n \n \n \n {{ option }}\n \n \n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n {{ error }}\n
\n \n \n {{_buttonDropDown.name}}\n \n
\n","import { AlloyButtonSubmit } from \"../../cell/button/button.model\";\nimport { AlloyIcon } from \"../../cell/icon/icon.model\";\n\nexport class AlloyPay{\n id: string;\n name: string;\n className: string;\n brandIcon: AlloyIcon;\n cardIcon: AlloyIcon;\n expiryIcon: AlloyIcon;\n cvcIcon: AlloyIcon;\n submit: AlloyButtonSubmit;\n disclaimer: string;\n constructor(res?: any){\n if(res){\n this.id = res.id ? res.id : \"alloyPay\";\n this.name = res.name ? res.name : \"Payment\";\n this.className = res.className ? res.className : \"\";\n this.brandIcon = res.brandIcon ? new AlloyIcon(res.brandIcon) : new AlloyIcon();\n this.cardIcon = res.cardIcon ? new AlloyIcon(res.cardIcon) : new AlloyIcon();\n this.expiryIcon = res.expiryIcon ? new AlloyIcon(res.expiryIcon) : new AlloyIcon();\n this.cvcIcon = res.cvcIcon ? new AlloyIcon(res.cvcIcon) : new AlloyIcon();\n this.submit = res.submit ? new AlloyButtonSubmit(res.submit) : new AlloyButtonSubmit();\n this.disclaimer = res.disclaimer ? res.disclaimer : \" *AlloyMobile do not store your credit card information.\";\n }else{\n this.id = \"alloyPay\";\n this.name = \"Payment\";\n this.className = \"\";\n this.brandIcon = new AlloyIcon();\n this.cardIcon = new AlloyIcon();\n this.expiryIcon = new AlloyIcon();\n this.cvcIcon = new AlloyIcon();\n this.submit = new AlloyButtonSubmit();\n this.disclaimer = \"*AlloyMobile do not store your credit card information.\";\n }\n }\n}","import { Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';\nimport { StripeCardElementOptions, StripeElementsOptions } from '@stripe/stripe-js';\nimport { StripeCardNumberComponent, StripeService } from 'ngx-stripe';\nimport { AlloyPay } from '../pay.model';\n\n@Component({\n selector: 'alloy-pay',\n templateUrl: './pay.component.html',\n styleUrls: ['./pay.component.css']\n})\nexport class PayComponent {\n _pay:AlloyPay;\n @ViewChild(StripeCardNumberComponent) card: StripeCardNumberComponent;\n cardOptions: StripeCardElementOptions = {\n style: {\n base: {\n iconColor: '#666EE8',\n color: '#31325F',\n fontWeight: '300',\n fontFamily: '\"Helvetica Neue\", Helvetica, sans-serif',\n fontSize: '18px',\n '::placeholder': {\n color: '#CFD7E0',\n },\n },\n },\n };\n elementsOptions: StripeElementsOptions = {\n locale: 'en',\n };\n\n @Input() set pay(_pay: AlloyPay){\n this._pay = _pay;\n }\n\n @Output() output: EventEmitter- \n
- \n
\n \n
\n
\n\n
\n \n \n
\n","import { AlloyInputType } from \"../../cell/input/input.model\";\nimport { AlloyPay } from \"../../tissue/pay/pay.model\";\n\n\nexport class AlloyCheckout{\n id: string;\n title: string;\n className: string;\n message: string;\n action: string;\n fields: AlloyInputType[];\n pay: AlloyPay;\n data: any;\n constructor(res?: any){\n if(res){\n this.id = res.id ? res.id : \"form\";\n this.title = res.title ? res.title : \"AlloyMobile\";\n this.className = res.className ? res.className : \"col m-2\";\n this.message = res.message ? res.message : \"\";\n this.action = res.action ? res.action : \"\";\n this.fields = res.fields ? res.fields.map(f=>new AlloyInputType(f)) : [];\n this.pay = res.pay ? new AlloyPay(res.pay) : new AlloyPay();\n this.data = {}\n }else{\n this.id = \"form\";\n this.title = \"AlloyMobile\";\n this.className = \"col m-2\";\n this.message = \"\";\n this.action = \"\";\n this.fields = [];\n this.pay = new AlloyPay();\n this.data = {}\n }\n }\n}\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AlloyCheckout } from '../checkout.model';\nimport { AbstractControl } from '@angular/forms';\n\n@Component({\n selector: 'alloy-checkout',\n templateUrl: './checkout.component.html',\n styleUrls: ['./checkout.component.css']\n})\nexport class CheckoutComponent {\n _checkout: AlloyCheckout;\n @Input() set checkout(_checkout: AlloyCheckout){\n this._checkout = _checkout;\n }\n @Output() output: EventEmitter\n
Payment
\n\n
\n \n
\n \n
\n \n
\n \n
\n \n \n
\n \n \n \n
\n \n
\n \n \n
\n \n \n \n
\n \n
\n \n \n
\n \n \n
\n \n {{ _pay.disclaimer }}\n
\n\n
\n
\n","import { AlloyInputType } from \"../../cell/input/input.model\";\nimport { AlloyButtonBar } from \"../../tissue/bar/bar.model\";\nimport { AlloyPay } from \"../../tissue/pay/pay.model\";\n\nexport class AlloyDonate{\n id: string;\n title: string;\n className: string;\n message: string;\n action: string;\n fields: AlloyInputType[];\n pay: AlloyPay;\n amountBar: AlloyButtonBar;\n data: any;\n constructor(res?: any){\n if(res){\n this.id = res.id ? res.id : \"form\";\n this.title = res.title ? res.title : \"AlloyMobile\";\n this.className = res.className ? res.className : \"col m-2\";\n this.message = res.message ? res.message : \"\";\n this.action = res.action ? res.action : \"\";\n this.fields = res.fields ? res.fields.map(f=>new AlloyInputType(f)) : [];\n this.pay = res.pay ? new AlloyPay(res.pay) : new AlloyPay();\n this.amountBar = res.amountBar ? new AlloyButtonBar(res.amountBar) : new AlloyButtonBar();\n this.data = {}\n }else{\n this.id = \"form\";\n this.title = \"AlloyMobile\";\n this.className = \"col m-2\";\n this.message = \"\";\n this.action = \"\";\n this.fields = [];\n this.pay = new AlloyPay();\n this.amountBar = new AlloyButtonBar();\n this.data = {}\n }\n }\n}\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AlloyDonate } from '../donate.model';\nimport { AbstractControl } from '@angular/forms';\n\n@Component({\n selector: 'alloy-donate',\n templateUrl: './donate.component.html',\n styleUrls: ['./donate.component.css']\n})\nexport class DonateComponent {\n _donate: AlloyDonate;\n @Input() set donate(donate: AlloyDonate){\n this._donate = donate;\n }\n @Output() output: EventEmitter{{ _checkout.title }}
\n\n {{ _checkout.message }}\n
\n \n
\n
\n\n \n
\n Billing address:
\n\n
\n \n Total bill:\n 5\n
\n- \n
- \n \n\n 25 CAD\n
electric bill
\n \n - \n Total (CAD)\n 25 CAD\n \n
\n
\n
\n ","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AlloyNavBarAction } from '../navbar.model';\nimport { AlloyButton } from '../../../cell/button/button.model';\n\n@Component({\n selector: 'alloy-navbar-action',\n templateUrl: './navbar-action.component.html',\n styleUrls: ['./navbar-action.component.css']\n})\nexport class NavbarActionComponent {\n _navBarAction: AlloyNavBarAction;\n @Input() set navBarAction(navBarAction: AlloyNavBarAction) {\n \tthis._navBarAction = navBarAction;\n }\n @Output() output: EventEmitter{{ _donate.title }}
\n\n {{ _donate.message }}\n
\n \n
\n
\n \n \n \n
\n Payment Details:
\n\n
\n\n","import { AlloyButtonIcon } from \"../../cell/button/button.model\";\nimport { AlloyInputTextIcon } from \"../../cell/input/input.model\";\nimport { TableAction } from \"../../tissue/table/table.model\";\nimport { AlloyModal } from \"../modal/modal.model\";\n\nexport class AlloyEmail{\n id: string;\n className: string;\n modal: AlloyModal;\n search: AlloyInputTextIcon;\n send: AlloyButtonIcon;\n table: TableAction;\n constructor(res?: any){\n if(res){\n this.id = res.id ? res.id : \"\";\n this.className = res.className ? res.className : \"\";\n this.modal = res.modal ? new AlloyModal(res.modal) : new AlloyModal();\n this.search = res.search ? new AlloyInputTextIcon(res.search) : new AlloyInputTextIcon();\n this.send = res.send ? new AlloyButtonIcon(res.send) : new AlloyButtonIcon();\n this.table = res.table ? new TableAction(res.table) : new TableAction();\n }else{\n this.id = \"\";\n this.className = \"\";\n this.modal = new AlloyModal();\n this.search = new AlloyInputTextIcon();\n this.send = new AlloyButtonIcon();\n this.table = new TableAction();\n }\n }\n}\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { AlloyEmail } from '../email.model';\nimport { AbstractControl } from '@angular/forms';\nimport { AlloyInputType } from '../../../cell/input/input.model';\ndeclare var window: any;\n\n@Component({\n selector: 'alloy-email',\n templateUrl: './email.component.html',\n styleUrls: ['./email.component.css']\n})\nexport class EmailComponent {\n\n _email: AlloyEmail;\n @Input() set email(email: AlloyEmail){\n this._email = email;\n this.createRow = [...this._email.modal.fields] as any;\n }\n modalForm: any;\n createRow: AlloyInputType[];\n selectedRow: any;\n @Output() output: EventEmitter{{_contact.title}}
\n\n
\n\n
\n \n
\n \n
\n\n
\n \n
\n \n
\n - \n
- \n
- \n
- \n
\n \n
- \n
- \n
\n \n
- \n
- \n