@dreamworld/dw-ripple 2.6.0-ripple-rendring-not-cencel-on-pointer-move.2 → 3.0.1

package/demo/dw-ripple-demo.js

@@ -1,5 +1,4 @@
-import { html, css } from "lit-element";
-import { LitElement } from "@dreamworld/pwa-helpers/lit-element.js";
+import { LitElement, html, css } from '@dreamworld/pwa-helpers/lit.js';
 
 //These are the dw element needed by this element.
 import "../dw-ripple.js";

package/dw-ripple.js

@@ -1,4 +1,4 @@
-import { css } from "lit-element";
+import { css } from '@dreamworld/pwa-helpers/lit.js';
 
 // These are the mwc element needed by this element.
 import { Ripple } from "@material/mwc-ripple";
@@ -20,9 +20,8 @@ export class DwRipple extends Ripple {
         :host([secondary]) {
           --mdc-theme-on-surface: var(--mdc-theme-secondary);
         }
-
-        .mdc-ripple-surface::before,
-        .mdc-ripple-surface::after {
+        
+        .mdc-ripple-surface::before, .mdc-ripple-surface::after {
           background-color: var(--mdc-theme-on-surface, #000);
         }
       `,
@@ -79,51 +78,37 @@ export class DwRipple extends Ripple {
   }
 
   __onMouseDown(e) {
-    console.debug("__onMouseDown called", e);
     this._timeoutRippleOnMouseDown = setTimeout(() => {
-      console.log("timeoutRippleOnMouseDown");
       window.addEventListener("mouseup", this.__onMouseUp);
       this._rippleHander.startPress(e);
     }, 50);
   }
 
   __onTouchStart(e) {
-    console.debug("__onTouchStart called", e);
     this._timeoutRippleOnTouchStart = setTimeout(() => {
-      console.debug("timeoutRippleOnTouchStart");
       window.addEventListener("touchend", this.__onTouchEnd);
       this._rippleHander.startPress(e);
     }, 50);
   }
 
   __onPointerMove() {
-    console.debug("__onPointerMove called");
     if (this._timeoutRippleOnMouseDown) {
       clearTimeout(this._timeoutRippleOnMouseDown);
     }
-    if (this._timeoutRippleOnTouchStart) {
-      clearTimeout(this._timeoutRippleOnTouchStart);
-    }
   }
 
   __onTouchMove() {
-    console.debug("__onTouchMove called");
     if (this._timeoutRippleOnTouchStart) {
       clearTimeout(this._timeoutRippleOnTouchStart);
     }
-    if (this._timeoutRippleOnMouseDown) {
-      clearTimeout(this._timeoutRippleOnMouseDown);
-    }
   }
 
   __onMouseUp() {
-    console.debug("__onMouseUp called");
     window.removeEventListener("mouseup", this.__onMouseUp);
     this._rippleHander.endPress();
   }
 
   __onTouchEnd() {
-    console.debug("__onTouchEnd called");
     window.removeEventListener("touchend", this.__onTouchEnd);
     this._rippleHander.endPress();
   }

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@dreamworld/dw-ripple",
-  "version": "2.6.0-ripple-rendring-not-cencel-on-pointer-move.2",
+  "version": "3.0.1",
   "description": "Ripple element created as child-class of [`mwc-ripple`] (https://github.com/material-components/material-components-web-components/tree/master/packages/ripple)",
   "main": "dw-ripple.js",
   "scripts": {
-    "start": "polymer serve",
+    "start": "wds --node-resolve --app-index demo/index.html --open --watch",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "repository": {
@@ -18,14 +18,14 @@
   },
   "homepage": "https://github.com/DreamworldSolutions/dw-ripple#readme",
   "dependencies": {
-    "@material/mwc-ripple": "^0.26.1",
-    "lit-element": "^2.2.0"
+    "@material/mwc-ripple": "0.27.0"
   },
   "devDependencies": {
-    "@dreamworld/material-styles": "^1.1.0",
-    "@dreamworld/pwa-helpers": "^1.10.0",
-    "@material/mwc-formfield": "^0.26.1",
-    "@material/mwc-switch": "^0.26.1",
+    "@dreamworld/material-styles": "^3.0.0",
+    "@dreamworld/pwa-helpers": "^1.13.1",
+    "@material/mwc-formfield": "0.27.0",
+    "@material/mwc-switch": "0.27.0",
+    "@web/dev-server": "^0.1.34",
     "@webcomponents/webcomponentsjs": "^2.2.10",
     "semantic-release": "17.4.2"
   },