From 4bbee6e89f49f3f9c098d9320ce2328cee7f0720 Mon Sep 17 00:00:00 2001
From: Adam Bradley <adambradley25@gmail.com>
Date: Fri, 13 Nov 2015 22:12:02 -0600
Subject: [PATCH] fix(item-sliding): improve rending w/out flickers

---
 ionic/components/item/item-sliding-gesture.ts |  6 +++++-
 ionic/components/item/item-sliding.scss       |  6 ++++++
 tsconfig.json                                 | 10 +++-------
 3 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/ionic/components/item/item-sliding-gesture.ts b/ionic/components/item/item-sliding-gesture.ts
index ef0b379efa..66b706f4de 100644
--- a/ionic/components/item/item-sliding-gesture.ts
+++ b/ionic/components/item/item-sliding-gesture.ts
@@ -68,6 +68,9 @@ export class ItemSlidingGesture extends DragGesture {
       if (!itemData.optsWidth) return;
     }
 
+    itemContainerEle.classList.add('active-slide');
+    itemContainerEle.classList.add('active-options');
+
     let x = ev.center[this.direction];
     let delta = x - itemData.startX;
 
@@ -143,14 +146,15 @@ export class ItemSlidingGesture extends DragGesture {
       let timerId = setTimeout(() => {
         if (slidingEle.style[CSS.transform] === '') {
           itemContainerEle.classList.remove('active-slide');
+          itemContainerEle.classList.remove('active-options');
           this.openItems--;
         }
       }, 400);
       this.set(itemContainerEle, 'timerId', timerId);
     }
 
-    slidingEle.style[CSS.transform] = (openAmount === 0 ? '' : 'translate3d(' + -openAmount + 'px,0,0)');
     slidingEle.style[CSS.transition] = (animate ? '' : 'none');
+    slidingEle.style[CSS.transform] = (openAmount === 0 ? '' : 'translate3d(' + -openAmount + 'px,0,0)');
   }
 
   getOpenAmount(itemContainerEle) {
diff --git a/ionic/components/item/item-sliding.scss b/ionic/components/item/item-sliding.scss
index f27705b017..9180fe2557 100644
--- a/ionic/components/item/item-sliding.scss
+++ b/ionic/components/item/item-sliding.scss
@@ -21,6 +21,7 @@ ion-item-options {
   right: 0;
   z-index: $z-index-item-options;
   height: 100%;
+  opacity: 0;
 }
 
 ion-item-sliding.active-slide {
@@ -28,9 +29,14 @@ ion-item-sliding.active-slide {
   .item {
     position: relative;
     z-index: $z-index-item-options + 1;
+    transition: all 200ms;
   }
 
   ion-item-options {
     display: flex;
   }
+
+  &.active-options ion-item-options{
+    opacity: 1;
+  }
 }
diff --git a/tsconfig.json b/tsconfig.json
index 4686123523..a8863898df 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -3,13 +3,9 @@
     "compilerOptions": {
         "emitDecoratorMetadata": true,
         "experimentalDecorators": true,
-        "target": "es5",
-        "module": "commonjs",
-        "declaration": false,
-        "noImplicitAny": false,
-        "removeComments": true,
-        "noLib": false,
-        "outDir": "dist/js/cjs"
+        "target": "es6",
+        "module": "system",
+        "declaration": true
     },
     "fileGlobs": [
         "./ionic/**/*.ts",