fix(): update to Stencil One 🎉🎊

core/src/components/infinite-scroll-content/infinite-scroll-content.tsx

@@ -1,6 +1,7 @@
-import { Component, ComponentInterface, Prop } from '@stencil/core';
+import { Component, ComponentInterface, Prop, h } from '@stencil/core';
 
-import { Config, Mode, SpinnerTypes } from '../../interface';
+import { getIonMode } from '../../global/ionic-global';
+import { Config, SpinnerTypes } from '../../interface';
 import { sanitizeDOMString } from '../../utils/sanitization';
 
 @Component({
@@ -12,8 +13,6 @@ import { sanitizeDOMString } from '../../utils/sanitization';
 })
 export class InfiniteScrollContent implements ComponentInterface {
 
-  mode!: Mode;
-
   @Prop({ context: 'config' }) config!: Config;
 
   /**
@@ -34,20 +33,22 @@ export class InfiniteScrollContent implements ComponentInterface {
 
   componentDidLoad() {
     if (this.loadingSpinner === undefined) {
+      const mode = getIonMode(this);
       this.loadingSpinner = this.config.get(
         'infiniteLoadingSpinner',
-        this.config.get('spinner', this.mode === 'ios' ? 'lines' : 'crescent')
+        this.config.get('spinner', mode === 'ios' ? 'lines' : 'crescent')
       );
     }
   }
 
   hostData() {
+    const mode = getIonMode(this);
     return {
       class: {
-        [`${this.mode}`]: true,
+        [`${mode}`]: true,
 
         // Used internally for styling
-        [`infinite-scroll-content-${this.mode}`]: true
+        [`infinite-scroll-content-${mode}`]: true
       }
     };
   }

core/src/components/infinite-scroll-content/readme.md

@@ -2,6 +2,10 @@
 
 The `ion-infinite-scroll-content` component is the default child used by the `ion-infinite-scroll`. It displays an infinite scroll spinner that looks best based on the platform and changes the look depending on the infinite scroll's state. The default spinner can be changed and text can be added by setting the `loadingSpinner` and `loadingText` properties.
 
+## React
+
+The `ion-infinite-scroll-content` component is not supported in React.
+
 <!-- Auto Generated Below -->
 
 
@@ -35,28 +39,6 @@ The `ion-infinite-scroll-content` component is the default child used by the `io
 ```
 
 
-### React
-
-```tsx
-import React from 'react';
-
-import { IonContent, IonInfiniteScroll } from '@ionic/react';
-
-const Example: React.SFC<{}> = () => (
-
-  <IonContent>
-    <IonInfiniteScroll>
-      <IonInfiniteScrollContent
-        loadingSpinner="bubbles"
-        loadingText="Loading more data…">
-      </IonInfiniteScrollContent>
-    </IonInfiniteScroll>
-  </IonContent>
-);
-
-export default Example
-
-
 ### Vue
 
 ```html
@@ -82,6 +64,19 @@ export default Example
 | `loadingText`    | `loading-text`    | Optional text to display while loading. `loadingText` can accept either plaintext or HTML as a string. To display characters normally reserved for HTML, they must be escaped. For example `<Ionic>` would become `&lt;Ionic&gt;`  For more information: [Security Documentation](https://ionicframework.com/docs/faq/security) | `string \| undefined`                                                                             | `undefined` |
 
 
+## Dependencies
+
+### Depends on
+
+- [ion-spinner](../spinner)
+
+### Graph
+```mermaid
+graph TD;
+  ion-infinite-scroll-content --> ion-spinner
+  style ion-infinite-scroll-content fill:#f9f,stroke:#333,stroke-width:4px
+```
+
 ----------------------------------------------
 
 *Built with [StencilJS](https://stenciljs.com/)*

core/src/components/infinite-scroll-content/usage/react.md

@@ -1,18 +0,0 @@
-```tsx
-import React from 'react';
-
-import { IonContent, IonInfiniteScroll } from '@ionic/react';
-
-const Example: React.SFC<{}> = () => (
-
-  <IonContent>
-    <IonInfiniteScroll>
-      <IonInfiniteScrollContent
-        loadingSpinner="bubbles"
-        loadingText="Loading more data…">
-      </IonInfiniteScrollContent>
-    </IonInfiniteScroll>
-  </IonContent>
-);
-
-export default Example