feat(all): custom icons

Author: manucorporat

core/src/components/action-sheet/action-sheet.tsx

@@ -242,7 +242,7 @@ export class ActionSheet implements OverlayInterface {
               <button class={buttonClass(b)} onClick={() => this.buttonClick(b)}>
                 <span class="action-sheet-button-inner">
                   {b.icon
-                    ? <ion-icon name={b.icon} class="action-sheet-icon" />
+                    ? <ion-icon icon={b.icon} class="action-sheet-icon" />
                     : null}
                   {b.text}
                 </span>
@@ -258,7 +258,7 @@ export class ActionSheet implements OverlayInterface {
                   <span class="action-sheet-button-inner">
                     {cancelButton.icon
                       ? <ion-icon
-                          name={cancelButton.icon}
+                          icon={cancelButton.icon}
                           class="action-sheet-icon"
                         />
                       : null}

core/src/components/back-button/back-button.tsx

@@ -82,7 +82,7 @@ export class BackButton {
         class={backButtonClasses}
         onClick={(ev) => this.onClick(ev)}>
         <span class="back-button-inner">
-          { backButtonIcon && <ion-icon name={backButtonIcon}/> }
+          { backButtonIcon && <ion-icon icon={backButtonIcon}/> }
           { this.mode === 'ios' && backButtonText && <span class="button-text">{backButtonText}</span> }
           { this.mode === 'md' && <ion-ripple-effect tapClick={true}/> }
         </span>

core/src/components/menu-button/menu-button.tsx

@@ -31,7 +31,7 @@ export class MenuButton {
       <ion-menu-toggle menu={this.menu} autoHide={this.autoHide}>
         <ion-button>
           <slot>
-            <ion-icon slot="icon-only" name={menuIcon}/>
+            <ion-icon icon={menuIcon} slot="icon-only" />
           </slot>
         </ion-button>
       </ion-menu-toggle>

core/src/components/refresher-content/refresher-content.tsx

@@ -43,7 +43,7 @@ export class RefresherContent {
       <div class="refresher-pulling">
         {this.pullingIcon &&
           <div class="refresher-pulling-icon">
-            <ion-icon name={this.pullingIcon}></ion-icon>
+            <ion-icon icon={this.pullingIcon}></ion-icon>
           </div>
         }
         {this.pullingText &&

core/src/components/tab-button/tab-button.tsx

@@ -85,7 +85,7 @@ export class TabButton {
         class="tab-cover"
         onKeyUp={this.onKeyUp.bind(this)}
         onBlur={this.onBlur.bind(this)}>
-        { tab.icon && <ion-icon class="tab-button-icon" name={tab.icon}></ion-icon> }
+        { tab.icon && <ion-icon class="tab-button-icon" icon={tab.icon}></ion-icon> }
         { tab.label && <span class="tab-button-text">{tab.label}</span> }
         { tab.badge && <ion-badge class="tab-badge" color={tab.badgeColor}>{tab.badge}</ion-badge> }
         { this.mode === 'md' && <ion-ripple-effect tapClick={true}/> }