fix(item-sliding): improve rending w/out flickers

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) {

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;
+  }
 }

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",