playhtml 2.1.6 → 2.1.7

package/CHANGELOG.md

@@ -2,7 +2,7 @@
 
 The format is based on Keep a Changelog and this project adheres to Semantic Versioning.
 
-## 2.1.3 - 2024-04-17
+## 2.1.6 - 2024-04-17
 
 - fix bug with native image dragging conflicting with playhtml draggable elements.
 

package/dist/playhtml.es.js

@@ -6754,22 +6754,22 @@ class ia {
       (f = this.onClick) == null || f.call(this, u, this.getEventHandlerData());
     }), this.onClick = o, c && !this.onDrag && (t.addEventListener("touchstart", (u) => {
       var p;
-      u.preventDefault(), (p = this.onDragStart) == null || p.call(this, u, this.getEventHandlerData());
+      u.preventDefault(), t.classList.add("cursordown"), (p = this.onDragStart) == null || p.call(this, u, this.getEventHandlerData());
       const f = (_) => {
         var Y;
         _.preventDefault(), (Y = this.onDrag) == null || Y.call(this, _, this.getEventHandlerData());
       }, g = (_) => {
-        document.removeEventListener("touchmove", f), document.removeEventListener("touchend", g);
+        t.classList.remove("cursordown"), document.removeEventListener("touchmove", f), document.removeEventListener("touchend", g);
       };
       document.addEventListener("touchmove", f), document.addEventListener("touchend", g);
     }), t.addEventListener("mousedown", (u) => {
       var p;
-      u.preventDefault(), (p = this.onDragStart) == null || p.call(this, u, this.getEventHandlerData());
+      u.preventDefault(), (p = this.onDragStart) == null || p.call(this, u, this.getEventHandlerData()), t.classList.add("cursordown");
       const f = (_) => {
         var Y;
         _.preventDefault(), (Y = this.onDrag) == null || Y.call(this, _, this.getEventHandlerData());
       }, g = (_) => {
-        document.removeEventListener("mousemove", f), document.removeEventListener("mouseup", g);
+        t.classList.remove("cursordown"), document.removeEventListener("mousemove", f), document.removeEventListener("mouseup", g);
       };
       document.addEventListener("mousemove", f), document.addEventListener("mouseup", g);
     })), this.onDrag = c, this.onDragStart = l, a && !this.resetShortcut && (t.title || (t.title = `Hold down the ${Xl[a]} key while clicking to reset.`), t.reset = this.reset, t.addEventListener("click", (u) => {

package/dist/style.css

@@ -1 +1 @@
-@charset "UTF-8";.__playhtml-can-move{cursor:pointer;transition:transform .15s;will-change:transform}.__playhtml-can-spin,.__playhtml-can-grow{cursor:pointer;transition:transform .25s;will-change:transform}.__playhtml-can-toggle,.__playhtml-can-draw{cursor:pointer}.__playhtml-can-draw .__playhtml-draw-container{position:relative;width:100%;height:100%;cursor:none}.__playhtml-can-draw .__playhtml-draw-container canvas{position:absolute;top:0;left:0;cursor:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'  width='32' height='32' viewport='0 0 100 100' style='overflow: visible; fill:black;font-size:20px;'><text y='-30%' x='-50%' style='transform:rotate(180deg)'>🖍️</text></svg>") 16 0,auto}body .__playhtml-element.editing:nth-child(2n){animation-name:jiggle1;animation-iteration-count:infinite;transform-origin:50% 10%;animation-duration:.25s;animation-delay:var(--jiggle-delay)}body .__playhtml-element.editing:nth-child(2n-1){animation-name:jiggle2;animation-iteration-count:infinite;animation-direction:alternate;transform-origin:30% 5%;animation-duration:.45s;animation-delay:var(--jiggle-delay)}@keyframes jiggle1{0%{transform:rotate(-1deg);animation-timing-function:ease-in}50%{transform:rotate(1.5deg);animation-timing-function:ease-out}}@keyframes jiggle2{0%{transform:rotate(1deg);animation-timing-function:ease-in}50%{transform:rotate(-1.5deg);animation-timing-function:ease-out}}
+@charset "UTF-8";.__playhtml-can-move{cursor:grab;transition:transform .15s;will-change:transform}.__playhtml-can-move.cursordown{cursor:grabbing}.__playhtml-can-spin{cursor:grab;transition:transform .25s;will-change:transform}.__playhtml-can-spin.cursordown{cursor:grabbing}.__playhtml-can-grow{cursor:pointer;transition:transform .25s;will-change:transform}.__playhtml-can-toggle,.__playhtml-can-draw{cursor:pointer}.__playhtml-can-draw .__playhtml-draw-container{position:relative;width:100%;height:100%;cursor:none}.__playhtml-can-draw .__playhtml-draw-container canvas{position:absolute;top:0;left:0;cursor:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'  width='32' height='32' viewport='0 0 100 100' style='overflow: visible; fill:black;font-size:20px;'><text y='-30%' x='-50%' style='transform:rotate(180deg)'>🖍️</text></svg>") 16 0,auto}body .__playhtml-element.editing:nth-child(2n){animation-name:jiggle1;animation-iteration-count:infinite;transform-origin:50% 10%;animation-duration:.25s;animation-delay:var(--jiggle-delay)}body .__playhtml-element.editing:nth-child(2n-1){animation-name:jiggle2;animation-iteration-count:infinite;animation-direction:alternate;transform-origin:30% 5%;animation-duration:.45s;animation-delay:var(--jiggle-delay)}@keyframes jiggle1{0%{transform:rotate(-1deg);animation-timing-function:ease-in}50%{transform:rotate(1.5deg);animation-timing-function:ease-out}}@keyframes jiggle2{0%{transform:rotate(1deg);animation-timing-function:ease-in}50%{transform:rotate(-1.5deg);animation-timing-function:ease-out}}

package/package.json

@@ -2,7 +2,7 @@
   "name": "playhtml",
   "title": "playhtml",
   "description": "Create interactive, collaborative html elements with a single attribute",
-  "version": "2.1.6",
+  "version": "2.1.7",
   "license": "MIT",
   "type": "module",
   "keywords": [