import { inject , useView , PLATFORM , customElement } from 'aurelia-framework' ; import { bindable } from 'aurelia-typed-observable-plugin' ; selector selector selector @ inject ( Element ) @ useView ( PLATFORM . moduleName ( './mdc-button.html' ) ) @ customElement ( 'mdc-button' ) export class MdcButton { constructor ( public root ) { } /**
     * Set the component touch target to 48 x 48 px
     */ @ bindable . booleanAttr touch : boolean ; /**
     * A contained button that is elevated upon the surface
     */ @ bindable . booleanAttr raised : boolean ; /**
     * A contained button that is flush with the surface
     */ @ bindable . booleanAttr unelevated : boolean ; /**
     * A contained button that is flush with the surface and has a visible border
     */ @ bindable . booleanAttr outlined : boolean ; /**
     * Set the button label
     */ @ bindable label : string ; @ bindable href : string ; hrefChanged ( ) { if ( this . href ) { this . root . setAttribute ( 'href' , this . href ) ; } else { this . root . removeAttribute ( 'href' ) ; } } attached ( ) { const icons = this . root . querySelectorAll ( 'mdc-icon' ) ; Array . from ( icons ) . forEach ( x => x . classList . add ( 'mdc-button__icon' ) ) ; } }