chore(build): rename ionic directory to src and update all references in the build process.

src/components/scroll/scroll.scss

@@ -0,0 +1,37 @@
+@import "../../globals.core";
+
+ion-scroll {
+  position: relative;
+  display: block;
+
+  &.scroll-x scroll-content {
+    overflow-x: auto;
+  }
+
+  &.scroll-y scroll-content {
+    overflow-y: auto;
+  }
+
+  &[center] {
+    scroll-content {
+      display: flex;
+
+      align-items: center;
+      justify-content: center;
+    }
+  }
+
+  scroll-content {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+
+    overflow-y: hidden;
+    overflow-x: hidden;
+    -webkit-overflow-scrolling: touch;
+    will-change: scroll-position;
+  }
+
+}

src/components/scroll/scroll.ts

@@ -0,0 +1,91 @@
+import {Component, ElementRef, ChangeDetectionStrategy, ViewEncapsulation} from '@angular/core';
+
+import {Ion} from '../ion';
+import {Gesture} from '../../gestures/gesture';
+import {CSS} from '../../util/dom';
+import {Animation} from '../../animations/animation';
+
+import * as util from '../../util';
+
+/**
+ * @name Scroll
+ * @description
+ * Scroll is a non-flexboxed scroll area that can scroll horizontally or vertically. `ion-Scroll` Can be used in places were you may not need a full page scroller, but a highly customized one, such as image scubber or comment scroller.
+ * @usage
+ * ```html
+ * <ion-scroll scrollX="true">
+ * </ion-scroll>
+ *
+ * <ion-scroll scrollY="true">
+ * </ion-scroll>
+ *
+ * <ion-scroll scrollX="true" scrollY="true">
+ * </ion-scroll>
+ * ```
+ *@property {boolean} [scrollX] - whether to enable scrolling along the X axis
+ *@property {boolean} [scrollY] - whether to enable scrolling along the Y axis
+ *@property {boolean} [zoom] - whether to enable zooming
+ *@property {number} [maxZoom] - set the max zoom amount for ion-scroll
+ * @demo /docs/v2/demos/scroll/
+ */
+@Component({
+  selector: 'ion-scroll',
+  inputs: [
+    'scrollX', 'scrollY', 'zoom', 'maxZoom'
+  ],
+  host: {
+    '[class.scroll-x]': 'scrollX',
+    '[class.scroll-y]': 'scrollY'
+  },
+  template:
+    '<scroll-content>' +
+      '<div class="scroll-zoom-wrapper">' +
+        '<ng-content></ng-content>' +
+      '</div>' +
+    '</scroll-content>',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  encapsulation: ViewEncapsulation.None,
+})
+export class Scroll extends Ion {
+  /**
+   * @private
+   */
+  private maxScale: number = 3;
+  /**
+   * @private
+   */
+  private zoomDuration: number = 250;
+  /**
+   * @private
+   */
+  private scrollElement: HTMLElement;
+
+  constructor(elementRef: ElementRef) {
+    super(elementRef);
+  }
+
+  /**
+   * @private
+   */
+  ngOnInit() {
+    this.scrollElement = this.getNativeElement().children[0];
+  }
+
+  /**
+   * @private
+   * Add a scroll event handler to the scroll element if it exists.
+   * @param {Function} handler  The scroll handler to add to the scroll element.
+   * @returns {?Function} a function to remove the specified handler, otherwise
+   * undefined if the scroll element doesn't exist.
+   */
+  addScrollEventListener(handler) {
+    if (!this.scrollElement) { return; }
+
+    this.scrollElement.addEventListener('scroll', handler);
+
+    return () => {
+      this.scrollElement.removeEventListener('scroll', handler);
+    };
+  }
+
+}

src/components/scroll/test/basic/index.ts

@@ -0,0 +1,11 @@
+import {App} from '../../../../../ionic';
+
+
+@App({
+  templateUrl: 'main.html'
+})
+class MyApp {
+  doRefresh() {
+    console.log('DOREFRESH')
+  }
+}

src/components/scroll/test/basic/main.html

@@ -0,0 +1,35 @@
+<!-- <ion-view nav-title="Pull to refresh"> -->
+  <ion-toolbar><ion-title>Scroll</ion-title></ion-toolbar>
+
+  <ion-content>
+
+    <h2>Horizontal</h2>
+    <ion-scroll scroll-x="true" style="height: 200px">
+      <div style="height: 200px; width: 2500px; background: url('eight_horns.png') repeat"></div>
+    </ion-scroll>
+
+    <h2>Vertical</h2>
+    <ion-scroll scroll-y="true" style="width: 200px; height: 500px">
+      <div style="height: 2500px; width: 200px; background: url('eight_horns.png') repeat"></div>
+    </ion-scroll>
+
+    <h2>Both</h2>
+    <ion-scroll scroll-x="true" scroll-y="true" style="width: 100%; height: 500px">
+      <div style="height: 2500px; width: 2500px; background: url('eight_horns.png') repeat"></div>
+    </ion-scroll>
+
+  </ion-content>
+
+<!-- </ion-view> -->
+<style>
+  f { display: block; height: 400px; width: 100%; background-color: #387ef5; margin-bottom: 15px; }
+  #counter {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    padding: 20px;
+    background-color: rgba(0,0,0,0.4);
+    z-index: 5;
+  }
+</style>