tutuca 0.9.58 → 0.9.60

package/dist/tutuca-cli.js

@@ -3928,6 +3928,7 @@ class Path {
   }
   static fromNodeAndEventName(node, eventName, rootNode, maxDepth, comps, stopOnNoEvent = true) {
     const pathSteps = [];
+    const bubbles = BUBBLING_EVENTS.has(eventName);
     let depth = 0;
     let eventIds = [];
     let handlers = null;
@@ -3941,15 +3942,23 @@ class Path {
           eventIds.push(eid);
         if (cid !== undefined) {
           const comp = comps.getComponentForId(+cid);
-          if (isLeafComponent) {
+          let pushStep = true;
+          if (handlers === null && (isLeafComponent || bubbles)) {
             handlers = findHandlers(comp, eventIds, vid, eventName);
-            if (handlers === null && stopOnNoEvent)
-              return NO_EVENT_INFO;
-            isLeafComponent = false;
+            if (handlers === null) {
+              if (isLeafComponent && stopOnNoEvent && !bubbles)
+                return NO_EVENT_INFO;
+            } else if (!isLeafComponent) {
+              pathSteps.length = 0;
+              pushStep = false;
+            }
+          }
+          isLeafComponent = false;
+          if (pushStep) {
+            const step = resolvePathStep(comp, nodeIds, vid);
+            if (step)
+              pathSteps.push(step);
           }
-          const step = resolvePathStep(comp, nodeIds, vid);
-          if (step)
-            pathSteps.push(step);
           eventIds = [];
           nodeIds = [];
         }
@@ -4051,7 +4060,7 @@ class PathBuilder {
     return this.add(new SeqStep(name, key));
   }
 }
-var NONE, BindStep, FieldStep, SeqStep, SeqAccessStep, EachBindStep, EachRenderItStep, EMPTY_META, NO_EVENT_INFO;
+var NONE, BindStep, FieldStep, SeqStep, SeqAccessStep, EachBindStep, EachRenderItStep, EMPTY_META, NO_EVENT_INFO, BUBBLING_EVENTS;
 var init_path = __esm(() => {
   NONE = Symbol("NONE");
   BindStep = class BindStep extends Step {
@@ -4161,6 +4170,7 @@ var init_path = __esm(() => {
   };
   EMPTY_META = {};
   NO_EVENT_INFO = [null, null];
+  BUBBLING_EVENTS = new Set(["drop"]);
 });
 
 // src/value.js
@@ -9176,7 +9186,7 @@ class App {
   }
   _dispatchEvent(e) {
     const { type: type3 } = e;
-    const isDrag = type3 === "dragover" || type3 === "dragstart" || type3 === "dragend";
+    const isDrag = type3 === "dragover" || type3 === "dragstart" || type3 === "dragend" || type3 === "drop";
     const { rootNode: root, maxEventNodeDepth: maxDepth, comps, transactor } = this;
     const [path, handlers] = Path.fromEvent(e, root, maxDepth, comps, !isDrag);
     if (isDrag)
@@ -9234,7 +9244,7 @@ class App {
   }
   _handleDragEvent(e, type3, path) {
     if (type3 === "dragover") {
-      const dropTarget = getClosestDropTarget(e.target, this.rootNode, 50);
+      const dropTarget = getClosestDropTarget(e.target, this.rootNode, Infinity);
       if (dropTarget !== null) {
         e.preventDefault();
         this._cleanDragOverAttrs();
@@ -9248,6 +9258,9 @@ class App {
       const dragType = e.target.dataset.dragtype ?? "?";
       const stack = path.buildStack(this.makeStack(rootValue));
       this.dragInfo = new DragInfo(path, stack, e, value, dragType, e.target);
+    } else if (type3 === "drop") {
+      e.preventDefault();
+      this._cleanDragOverAttrs();
     } else {
       if (this.dragInfo !== null) {
         delete this.dragInfo.node.dataset.dragging;
@@ -9285,16 +9298,22 @@ class App {
     }
     this._compiled = true;
   }
+  subscribeToEvents(eventNames) {
+    for (const name of eventNames)
+      this.rootNode.addEventListener(name, this, listenerOpts(name));
+  }
+  recompileStyles(opts) {
+    injectCss("tutuca-app", this.comps.compileStyles(), opts?.head ?? document.head);
+  }
   start(opts) {
     if (!this._compiled)
       this.compile();
-    for (const name of this._eventNames)
-      this.rootNode.addEventListener(name, this, listenerOpts(name));
+    this.subscribeToEvents(this._eventNames);
     this.onChange((info) => {
       if (info.val !== info.old)
         this.render();
     });
-    injectCss("tutuca-app", this.comps.compileStyles(), opts?.head ?? document.head);
+    this.recompileStyles(opts);
     if (opts?.noCache)
       this.renderer.setNullCache();
     else

package/dist/tutuca-dev.js

@@ -3481,6 +3481,7 @@ class Path {
   }
   static fromNodeAndEventName(node, eventName, rootNode, maxDepth, comps, stopOnNoEvent = true) {
     const pathSteps = [];
+    const bubbles = BUBBLING_EVENTS.has(eventName);
     let depth = 0;
     let eventIds = [];
     let handlers = null;
@@ -3494,15 +3495,23 @@ class Path {
           eventIds.push(eid);
         if (cid !== undefined) {
           const comp = comps.getComponentForId(+cid);
-          if (isLeafComponent) {
+          let pushStep = true;
+          if (handlers === null && (isLeafComponent || bubbles)) {
             handlers = findHandlers(comp, eventIds, vid, eventName);
-            if (handlers === null && stopOnNoEvent)
-              return NO_EVENT_INFO;
-            isLeafComponent = false;
+            if (handlers === null) {
+              if (isLeafComponent && stopOnNoEvent && !bubbles)
+                return NO_EVENT_INFO;
+            } else if (!isLeafComponent) {
+              pathSteps.length = 0;
+              pushStep = false;
+            }
+          }
+          isLeafComponent = false;
+          if (pushStep) {
+            const step = resolvePathStep(comp, nodeIds, vid);
+            if (step)
+              pathSteps.push(step);
           }
-          const step = resolvePathStep(comp, nodeIds, vid);
-          if (step)
-            pathSteps.push(step);
           eventIds = [];
           nodeIds = [];
         }
@@ -3587,6 +3596,7 @@ function resolvePathStep(comp, nodeIds, vid) {
   return null;
 }
 var NO_EVENT_INFO = [null, null];
+var BUBBLING_EVENTS = new Set(["drop"]);
 
 class PathBuilder {
   constructor() {
@@ -8664,7 +8674,7 @@ class Component {
     }
   }
   make(args, opts) {
-    return this.Class.make(args, opts);
+    return this.Class.make(args, opts ?? { scope: this.scope });
   }
   getView(name) {
     return this.views[name] ?? this.views.main;
@@ -9521,7 +9531,7 @@ class App {
   }
   _dispatchEvent(e) {
     const { type: type3 } = e;
-    const isDrag = type3 === "dragover" || type3 === "dragstart" || type3 === "dragend";
+    const isDrag = type3 === "dragover" || type3 === "dragstart" || type3 === "dragend" || type3 === "drop";
     const { rootNode: root, maxEventNodeDepth: maxDepth, comps, transactor } = this;
     const [path, handlers] = Path.fromEvent(e, root, maxDepth, comps, !isDrag);
     if (isDrag)
@@ -9579,7 +9589,7 @@ class App {
   }
   _handleDragEvent(e, type3, path) {
     if (type3 === "dragover") {
-      const dropTarget = getClosestDropTarget(e.target, this.rootNode, 50);
+      const dropTarget = getClosestDropTarget(e.target, this.rootNode, Infinity);
       if (dropTarget !== null) {
         e.preventDefault();
         this._cleanDragOverAttrs();
@@ -9593,6 +9603,9 @@ class App {
       const dragType = e.target.dataset.dragtype ?? "?";
       const stack = path.buildStack(this.makeStack(rootValue));
       this.dragInfo = new DragInfo(path, stack, e, value, dragType, e.target);
+    } else if (type3 === "drop") {
+      e.preventDefault();
+      this._cleanDragOverAttrs();
     } else {
       if (this.dragInfo !== null) {
         delete this.dragInfo.node.dataset.dragging;
@@ -9630,16 +9643,22 @@ class App {
     }
     this._compiled = true;
   }
+  subscribeToEvents(eventNames) {
+    for (const name of eventNames)
+      this.rootNode.addEventListener(name, this, listenerOpts(name));
+  }
+  recompileStyles(opts) {
+    injectCss("tutuca-app", this.comps.compileStyles(), opts?.head ?? document.head);
+  }
   start(opts) {
     if (!this._compiled)
       this.compile();
-    for (const name of this._eventNames)
-      this.rootNode.addEventListener(name, this, listenerOpts(name));
+    this.subscribeToEvents(this._eventNames);
     this.onChange((info) => {
       if (info.val !== info.old)
         this.render();
     });
-    injectCss("tutuca-app", this.comps.compileStyles(), opts?.head ?? document.head);
+    this.recompileStyles(opts);
     if (opts?.noCache)
       this.renderer.setNullCache();
     else