feat(ion-input-shims): 📱

packages/core/src/components.d.ts

@@ -20,10 +20,6 @@ import {
   AlertButton,
   AlertInput,
 } from './components/alert/alert';
-import {
-  App,
-  FrameworkDelegate as FrameworkDelegate2,
-} from '.';
 import {
   ElementRef,
   Side,
@@ -32,6 +28,10 @@ import {
   GestureCallback,
   GestureDetail,
 } from './components/gesture/gesture';
+import {
+  App,
+  FrameworkDelegate as FrameworkDelegate2,
+} from '.';
 import {
   PickerButton,
   PickerColumn as PickerColumn2,
@@ -848,36 +848,6 @@ declare global {
 }
 
 
-import {
-  DeviceHacks as IonDeviceHacks
-} from './components/device-hacks/device-hacks';
-
-declare global {
-  interface HTMLIonDeviceHacksElement extends IonDeviceHacks, HTMLStencilElement {
-  }
-  var HTMLIonDeviceHacksElement: {
-    prototype: HTMLIonDeviceHacksElement;
-    new (): HTMLIonDeviceHacksElement;
-  };
-  interface HTMLElementTagNameMap {
-    "ion-device-hacks": HTMLIonDeviceHacksElement;
-  }
-  interface ElementTagNameMap {
-    "ion-device-hacks": HTMLIonDeviceHacksElement;
-  }
-  namespace JSX {
-    interface IntrinsicElements {
-      "ion-device-hacks": JSXElements.IonDeviceHacksAttributes;
-    }
-  }
-  namespace JSXElements {
-    export interface IonDeviceHacksAttributes extends HTMLAttributes {
-      app?: App;
-    }
-  }
-}
-
-
 import {
   Events as IonEvents
 } from './components/events/events';
@@ -1271,6 +1241,36 @@ declare global {
 }
 
 
+import {
+  InputShims as IonInputShims
+} from './components/input-shims/input-shims';
+
+declare global {
+  interface HTMLIonInputShimsElement extends IonInputShims, HTMLStencilElement {
+  }
+  var HTMLIonInputShimsElement: {
+    prototype: HTMLIonInputShimsElement;
+    new (): HTMLIonInputShimsElement;
+  };
+  interface HTMLElementTagNameMap {
+    "ion-input-shims": HTMLIonInputShimsElement;
+  }
+  interface ElementTagNameMap {
+    "ion-input-shims": HTMLIonInputShimsElement;
+  }
+  namespace JSX {
+    interface IntrinsicElements {
+      "ion-input-shims": JSXElements.IonInputShimsAttributes;
+    }
+  }
+  namespace JSXElements {
+    export interface IonInputShimsAttributes extends HTMLAttributes {
+      app?: App;
+    }
+  }
+}
+
+
 import {
   Input as IonInput
 } from './components/input/input';

packages/core/src/components/input-shims/input-shims.tsx

@@ -5,9 +5,9 @@ import enableHideCaretOnScroll from "./hacks/hide-caret";
 import enableInputBlurring from "./hacks/input-blurring";
 
 @Component({
-  tag: 'ion-device-hacks',
+  tag: 'ion-input-shims',
 })
-export class DeviceHacks {
+export class InputShims {
 
   private didLoad = false;
   private hideCaret = false;
@@ -38,6 +38,7 @@ export class DeviceHacks {
 
   @Listen('body:ionInputDidLoad')
   protected onInputDidLoad(event: CustomEvent<HTMLElement>) {
+    // TODO: remove if fixed: https://github.com/ionic-team/stencil/issues/576
     if (this.didLoad) {
       this.registerInput(event.detail);
     }
@@ -45,6 +46,7 @@ export class DeviceHacks {
 
   @Listen('body:ionInputDidUnload')
   protected onInputDidUnload(event: CustomEvent<HTMLElement>) {
+    // TODO: remove if fixed: https://github.com/ionic-team/stencil/issues/576
     if (this.didLoad) {
       this.unregisterInput(event.detail);
     }

packages/core/stencil.config.js

@@ -26,6 +26,7 @@ exports.config = {
     { components: ['ion-item-sliding', 'ion-item-options', 'ion-item-option'] },
     { components: ['ion-infinite-scroll', 'ion-infinite-scroll-content'] },
     { components: ['ion-input', 'ion-textarea'] },
+    { components: ['ion-input-shims'] },
     { components: ['ion-loading', 'ion-loading-controller'] },
     { components: ['ion-menu', 'ion-menu-controller', 'ion-menu-toggle', 'ion-menu-button'] },
     { components: ['ion-modal', 'ion-modal-controller'] },
@@ -46,7 +47,6 @@ exports.config = {
     { components: ['ion-toggle'] },
     { components: ['ion-toast', 'ion-toast-controller'] },
     { components: ['ion-tap-click', 'ion-status-tap'] },
-    { components: ['ion-device-hacks'] },
     { components: ['ion-platform', 'ion-cordova-platform'] },
     { components: ['ion-nav-pop'] },
     { components: ['ion-hide-when', 'ion-show-when'] },