chore(packages): move the packages to root

core/src/components/refresher-content/readme.md

@@ -0,0 +1,85 @@
+# ion-refresher-content
+
+The refresher content contains the text, icon and spinner to display during a pull-to-refresh. Ionic provides the pulling icon and refreshing spinner based on the platform. However, the default icon, spinner, and text can be customized based on the state of the refresher.
+
+```html
+<ion-content>
+  <ion-refresher slot="fixed">
+    <ion-refresher-content
+      pulling-icon="arrow-dropdown"
+      pulling-text="Pull to refresh"
+      refreshing-spinner="circles"
+      refreshing-text="Refreshing...">
+    </ion-refresher-content>
+  </ion-refresher>
+</ion-content>
+```
+
+
+<!-- Auto Generated Below -->
+
+
+## Properties
+
+#### pullingIcon
+
+string
+
+A static icon to display when you begin to pull down
+
+
+#### pullingText
+
+string
+
+The text you want to display when you begin to pull down
+
+
+#### refreshingSpinner
+
+string
+
+An animated SVG spinner that shows when refreshing begins
+
+
+#### refreshingText
+
+string
+
+The text you want to display when performing a refresh
+
+
+## Attributes
+
+#### pulling-icon
+
+string
+
+A static icon to display when you begin to pull down
+
+
+#### pulling-text
+
+string
+
+The text you want to display when you begin to pull down
+
+
+#### refreshing-spinner
+
+string
+
+An animated SVG spinner that shows when refreshing begins
+
+
+#### refreshing-text
+
+string
+
+The text you want to display when performing a refresh
+
+
+
+----------------------------------------------
+
+*Built with [StencilJS](https://stenciljs.com/)*

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

@@ -0,0 +1,65 @@
+import { Component, Prop } from '@stencil/core';
+import { Config } from '../../index';
+
+@Component({
+  tag: 'ion-refresher-content'
+})
+export class RefresherContent {
+
+  @Prop({ context: 'config' }) config: Config;
+
+  /**
+   * A static icon to display when you begin to pull down
+   */
+  @Prop({ mutable: true }) pullingIcon: string;
+
+  /**
+   * The text you want to display when you begin to pull down
+   */
+  @Prop() pullingText: string;
+
+  /**
+   * An animated SVG spinner that shows when refreshing begins
+   */
+  @Prop({ mutable: true }) refreshingSpinner: string;
+
+  /**
+   * The text you want to display when performing a refresh
+   */
+  @Prop() refreshingText: string;
+
+
+  protected componentDidLoad() {
+    if (!this.pullingIcon) {
+      this.pullingIcon = this.config.get('ionPullIcon', 'arrow-down');
+    }
+    if (!this.refreshingSpinner) {
+      this.refreshingSpinner = this.config.get('ionRefreshingSpinner', this.config.get('spinner', 'lines'));
+    }
+  }
+
+  protected render() {
+    return [
+      <div class='refresher-pulling'>
+        {this.pullingIcon &&
+          <div class='refresher-pulling-icon'>
+            <ion-icon name={this.pullingIcon}></ion-icon>
+          </div>
+        }
+        {this.pullingText &&
+          <div class='refresher-pulling-text' innerHTML={this.pullingText}></div>
+        }
+      </div>,
+      <div class='refresher-refreshing'>
+        {this.refreshingSpinner &&
+          <div class='refresher-refreshing-icon'>
+            <ion-spinner name={this.refreshingSpinner}></ion-spinner>
+          </div>
+        }
+        {this.refreshingText &&
+          <div class='refresher-refreshing-text' innerHTML={this.refreshingText}></div>
+        }
+      </div>
+    ];
+  }
+}