@meursyphus/flitter 0.0.6 → 0.0.8

package/index.js

@@ -351,7 +351,7 @@ var lerp_default = lerp;
 // src/utils/getTextSize.ts
 var OFFSET = 20;
 var SCALE = 100;
-var defaultWidthMapStr = `007LLmW'55;N0500LLLLLLLLLL00NNNLzWW\\\\WQb\\0FWLg\\bWb\\WQ\\WrWWQ000CL5LLFLL0LL**F*gLLLL5F0LF\\FFF5.5N`;
+var defaultWidthMapStr = "007LLmW'55;N0500LLLLLLLLLL00NNNLzWW\\\\WQb\\0FWLg\\bWb\\WQ\\WrWWQ000CL5LLFLL0LL**F*gLLLL5F0LF\\FFF5.5N";
 var DEFAULT_FONT_SIZE = 12;
 var DEFAULT_FONT_FAMILY = "sans-serif";
 var DEFAULT_FONT = `${DEFAULT_FONT_SIZE}px ${DEFAULT_FONT_FAMILY}`;
@@ -414,18 +414,6 @@ function createUniqueId() {
   return (id++).toString();
 }
 
-// src/utils/TypedObject.ts
-function entries(obj) {
-  return Object.entries(obj);
-}
-function keys(obj) {
-  return Object.keys(obj);
-}
-var TypedObject_default = {
-  entries,
-  keys
-};
-
 // src/utils/index.ts
 var _Utils = class _Utils {
   static sum(values) {
@@ -11960,6 +11948,14 @@ var ToolTipPosition = /* @__PURE__ */ ((ToolTipPosition2) => {
   return ToolTipPosition2;
 })(ToolTipPosition || {});
 
+// src/exception/index.ts
+var NotImplementedError = class extends Error {
+  constructor(method) {
+    super(`${method} is not implemented`);
+    this.name = "NotImplementedError";
+  }
+};
+
 // src/renderobject/RenderObject.ts
 var _domNode, _domOrder, _domOrderChanged;
 var RenderObject = class {
@@ -11996,8 +11992,11 @@ var RenderObject = class {
   set domOrder(newOrder) {
     if (newOrder === __privateGet(this, _domOrder))
       return;
-    __privateSet(this, _domOrderChanged, true);
     __privateSet(this, _domOrder, newOrder);
+    this.didDomOrderChange();
+  }
+  didDomOrderChange() {
+    __privateSet(this, _domOrderChanged, true);
   }
   get domNode() {
     assert(__privateGet(this, _domNode) != null, "domNode is not initialized");
@@ -12091,7 +12090,7 @@ var RenderObject = class {
     this.ownerElement = ownerElement;
     this.depth = ownerElement.depth;
     if (this.isPainter) {
-      this.mountSvgEl(this.renderOwner.paintContext);
+      this.mountSvgEl(this.renderOwner.renderContext.paintContext);
       this.renderOwner.didDomOrderChange();
     }
   }
@@ -12125,8 +12124,8 @@ var RenderObject = class {
   resolveSvgEl() {
     const container = this.domNode;
     const svgEls = {};
-    for (let i = 0; i < container.children.length; i++) {
-      const child = container.children[i];
+    for (const element of container.children) {
+      const child = element;
       const name = child.getAttribute("data-render-name");
       svgEls[name] = child;
     }
@@ -12135,7 +12134,10 @@ var RenderObject = class {
   rearrangeDomOrder() {
     if (!__privateGet(this, _domOrderChanged))
       return;
-    this.isPainter && this.renderOwner.paintContext.insertSvgEl(this.domNode, this.domOrder);
+    this.isPainter && this.renderOwner.renderContext.paintContext.insertSvgEl(
+      this.domNode,
+      this.domOrder
+    );
     __privateSet(this, _domOrderChanged, false);
   }
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -12147,7 +12149,7 @@ var RenderObject = class {
    */
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   preformLayout() {
-    throw { message: "not implemented performLayout" };
+    throw new NotImplementedError("performLayout");
   }
   /*
    * Do not call this method directly. instead call paint
@@ -12196,12 +12198,22 @@ var RenderObject = class {
     });
   }
   /**
-   *
    * It is currently only used on ZIndexRenderObject
    */
   accept(visitor) {
     visitor.visitGeneral(this);
   }
+  hitTest({ globalPoint }) {
+    const viewPort = this.renderOwner.renderContext.viewPort;
+    const { translation, scale } = viewPort;
+    const bounds = {
+      left: (this.matrix.storage[12] + translation.x) * scale,
+      top: (this.matrix.storage[13] + translation.y) * scale,
+      right: (this.matrix.storage[12] + translation.x + this.size.width) * scale,
+      bottom: (this.matrix.storage[13] + translation.y + this.size.height) * scale
+    };
+    return globalPoint.x >= bounds.left && globalPoint.x <= bounds.right && globalPoint.y >= bounds.top && globalPoint.y <= bounds.bottom;
+  }
 };
 _domNode = new WeakMap();
 _domOrder = new WeakMap();
@@ -12226,9 +12238,7 @@ var RenderView = class extends RenderObject_default {
       width: constraint.maxWidth,
       height: constraint.maxHeight
     });
-    this.children.forEach(
-      (child) => child.layout(constraints_default.loose(this.size))
-    );
+    this.children.forEach((child) => child.layout(constraints_default.loose(this.size)));
   }
   paint(context, clipId, matrix4, opacity) {
     if (this.size.width === 0 || this.size.height === 0)
@@ -12429,7 +12439,7 @@ var RenderObjectElement = class extends Element_default {
   }
   findAncestorRenderObjectElement() {
     let ancestor = this.parent;
-    while (ancestor != null && !(ancestor.type === "render")) {
+    while (ancestor != null && ancestor.type !== "render") {
       ancestor = ancestor.parent;
     }
     return ancestor;
@@ -12463,7 +12473,6 @@ var RenderObjectToWidgetAdapter = class extends RenderObjectWidget_default {
     app,
     renderOwner,
     buildOwner,
-    renderContext,
     scheduler
   }) {
     super({ children: [app] });
@@ -12473,7 +12482,7 @@ var RenderObjectToWidgetAdapter = class extends RenderObjectWidget_default {
     __publicField(this, "scheduler");
     this.renderOwner = renderOwner;
     this.buildOwner = buildOwner;
-    this.renderContext = renderContext;
+    this.renderContext = renderOwner.renderContext;
     this.scheduler = scheduler;
   }
   createElement() {
@@ -12486,8 +12495,8 @@ var RenderObjectToWidgetAdapter = class extends RenderObjectWidget_default {
   createRenderObject() {
     return new RenderView_default({ renderOwner: this.renderOwner });
   }
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   updateRenderObject(renderObject) {
+    renderObject.renderOwner = this.renderOwner;
   }
 };
 var RenderObjectToWidgetAdapter_default = RenderObjectToWidgetAdapter;
@@ -12531,9 +12540,11 @@ var BuildOwner_default = BuildOwner;
 var RenderOwner = class {
   constructor({
     onNeedVisualUpdate,
-    paintContext
+    renderContext,
+    hitTestDispatcher
   }) {
-    __publicField(this, "paintContext");
+    __publicField(this, "hitTestDispatcher");
+    __publicField(this, "renderContext");
     __publicField(this, "onNeedVisualUpdate");
     __publicField(this, "needsPaintRenderObjects", []);
     __publicField(this, "needsLayoutRenderObjects", []);
@@ -12543,7 +12554,9 @@ var RenderOwner = class {
     __publicField(this, "renderView");
     __publicField(this, "domOrderChanged", true);
     this.onNeedVisualUpdate = onNeedVisualUpdate;
-    this.paintContext = paintContext;
+    this.renderContext = renderContext;
+    this.hitTestDispatcher = hitTestDispatcher;
+    this.hitTestDispatcher.init({ renderContext: this.renderContext });
   }
   requestVisualUpdate() {
     this.onNeedVisualUpdate();
@@ -12584,7 +12597,7 @@ var RenderOwner = class {
     dirties.sort((a, b) => a.depth - b.depth).forEach((renderObject) => {
       if (!renderObject.needsPaint)
         return;
-      renderObject.paintWithoutLayout(this.paintContext);
+      renderObject.paintWithoutLayout(this.renderContext.paintContext);
     });
   }
 };
@@ -12670,6 +12683,12 @@ var Scheduler = class {
     this.persistenceCallbacks = [];
     this.postFrameCallbacks = [];
   }
+  consumePostCallbacks() {
+    this.postFrameCallbacks.forEach((callback) => {
+      callback();
+    });
+    this.postFrameCallbacks = [];
+  }
   schedule() {
     switch (this.phase) {
       case 0 /* idle */:
@@ -12686,9 +12705,7 @@ var Scheduler = class {
       callback();
     });
     this.phase = 2 /* postFrameCallbacks */;
-    this.postFrameCallbacks.forEach((callback) => {
-      callback();
-    });
+    this.consumePostCallbacks();
     this.postFrameCallbacks = [];
     this.phase = 0 /* idle */;
   }
@@ -12705,25 +12722,25 @@ var Scheduler_default = Scheduler;
 var RenderFrameDispatcher = class {
   constructor({ onFrame } = {}) {
     __publicField(this, "onFrame");
+    // Actually we don't need to invoke browser to render because browser automatically render its own state periodically
+    // so Here we just call onFrame callback.
+    __publicField(this, "idle", true);
     this.onFrame = onFrame;
   }
   setOnFrame(callback) {
     this.onFrame = () => callback();
   }
-  // Actually we dont need to invoke browser to render because browser automatically render its own state periodically
-  // so Here we just call onFrame callback.
   dispatch() {
-    if (typeof window === "undefined") {
-      setTimeout(() => {
-        var _a;
-        (_a = this.onFrame) == null ? void 0 : _a.call(this);
-      }, 0);
-    } else {
-      window.requestAnimationFrame(() => {
-        var _a;
-        (_a = this.onFrame) == null ? void 0 : _a.call(this);
-      });
-    }
+    if (typeof window === "undefined")
+      return;
+    if (!this.idle)
+      return;
+    this.idle = false;
+    window.requestAnimationFrame(() => {
+      var _a;
+      (_a = this.onFrame) == null ? void 0 : _a.call(this);
+      this.idle = true;
+    });
   }
 };
 var RenderFrameDispatcher_default = RenderFrameDispatcher;
@@ -12744,6 +12761,154 @@ var GlobalKey = class {
 };
 var Globalkey_default = GlobalKey;
 
+// src/hit-test/HitTestDispatcher.ts
+var _activated, _detectors, _rootPosition, _renderContext, _hitPosition, _handleMouseDown, _handleClick, _hitHistory, _handleMouseMove, _handleMouseUp, _handleMouseWheel, _handleMouseEnter, _handleMouseLeave, _wrapEvent, _didDomOrderChangeState;
+var HitTestDispatcher = class {
+  constructor() {
+    __privateAdd(this, _activated, typeof window !== "undefined");
+    __privateAdd(this, _detectors, []);
+    __privateAdd(this, _rootPosition, null);
+    __privateAdd(this, _renderContext, void 0);
+    __privateAdd(this, _hitPosition, new offset_default({ x: 0, y: 0 }));
+    __privateAdd(this, _handleMouseDown, (e) => {
+      this.hitTest(e, "onMouseDown");
+    });
+    __privateAdd(this, _handleClick, (e) => {
+      this.hitTest(e, "onClick");
+    });
+    __privateAdd(this, _hitHistory, []);
+    __privateAdd(this, _handleMouseMove, (e) => {
+      this.traceHitPosition(e);
+      this.hitTest(e, "onMouseMove");
+      e.isPropagationStopped = false;
+      for (const i in __privateGet(this, _detectors)) {
+        const detector = __privateGet(this, _detectors)[i];
+        if (e.isPropagationStopped)
+          return;
+        if (!__privateGet(this, _hitHistory)[i] && detector.hitTest({ globalPoint: __privateGet(this, _hitPosition) })) {
+          detector.onMouseEnter(e);
+        }
+      }
+      e.isPropagationStopped = false;
+      for (const i in __privateGet(this, _detectors)) {
+        const detector = __privateGet(this, _detectors)[i];
+        if (e.isPropagationStopped)
+          return;
+        if (__privateGet(this, _hitHistory)[i] && !detector.hitTest({ globalPoint: __privateGet(this, _hitPosition) })) {
+          detector.onMouseLeave(e);
+        }
+      }
+      __privateGet(this, _detectors).forEach((detector, i) => {
+        __privateGet(this, _hitHistory)[i] = detector.hitTest({
+          globalPoint: __privateGet(this, _hitPosition)
+        });
+      });
+    });
+    __privateAdd(this, _handleMouseUp, (e) => {
+      this.hitTest(e, "onMouseUp");
+    });
+    __privateAdd(this, _handleMouseWheel, (e) => {
+      this.hitTest(e, "onMouseWheel");
+      e.isPropagationStopped = false;
+      for (const detector of __privateGet(this, _detectors)) {
+        if (e.isPropagationStopped)
+          return;
+        if (!detector.hitTest({ globalPoint: __privateGet(this, _hitPosition) }))
+          continue;
+        detector.onMouseEnter(e);
+      }
+      e.isPropagationStopped = false;
+    });
+    __privateAdd(this, _handleMouseEnter, () => {
+      const rect = __privateGet(this, _renderContext).view.getBoundingClientRect();
+      __privateSet(this, _rootPosition, new offset_default({
+        x: rect.left,
+        y: rect.top
+      }));
+    });
+    __privateAdd(this, _handleMouseLeave, () => {
+      __privateSet(this, _rootPosition, null);
+    });
+    __publicField(this, "hitTest", (e, type) => {
+      for (const detector of __privateGet(this, _detectors)) {
+        if (e.isPropagationStopped)
+          return;
+        if (!detector.hitTest({ globalPoint: __privateGet(this, _hitPosition) }))
+          continue;
+        detector[type](e);
+      }
+    });
+    __privateAdd(this, _wrapEvent, (callback) => (e) => {
+      const stopPropagation = e.stopPropagation;
+      e.stopPropagation = function() {
+        e.isPropagationStopped = true;
+        stopPropagation.call(e);
+      };
+      return callback(e);
+    });
+    /**
+     * This code is for batch processing. The intention is not to perform the sorting operation every time this method is called,
+     * but rather to ensure that the sorting happens only once in a batch manner. This is achieved by wrapping the sorting logic
+     * inside a setTimeout, which defers the execution until the current call stack is clear, effectively coalescing multiple calls
+     * into a single operation.
+     */
+    __privateAdd(this, _didDomOrderChangeState, "idle");
+  }
+  init({ renderContext }) {
+    if (!__privateGet(this, _activated))
+      return;
+    __privateSet(this, _renderContext, renderContext);
+    const { view } = __privateGet(this, _renderContext);
+    view.addEventListener("mousedown", __privateGet(this, _wrapEvent).call(this, __privateGet(this, _handleMouseDown)));
+    view.addEventListener("click", __privateGet(this, _wrapEvent).call(this, __privateGet(this, _handleClick)));
+    view.addEventListener("mousemove", __privateGet(this, _wrapEvent).call(this, __privateGet(this, _handleMouseMove)));
+    view.addEventListener("mouseup", __privateGet(this, _wrapEvent).call(this, __privateGet(this, _handleMouseUp)));
+    view.addEventListener("wheel", __privateGet(this, _wrapEvent).call(this, __privateGet(this, _handleMouseWheel)));
+    view.addEventListener("mouseenter", __privateGet(this, _handleMouseEnter));
+    view.addEventListener("mouseleave", __privateGet(this, _handleMouseLeave));
+  }
+  traceHitPosition(e) {
+    if (__privateGet(this, _rootPosition) == null)
+      return;
+    __privateGet(this, _hitPosition).x = e.clientX - __privateGet(this, _rootPosition).x;
+    __privateGet(this, _hitPosition).y = e.clientY - __privateGet(this, _rootPosition).y;
+  }
+  didChangeDomOrder() {
+    if (__privateGet(this, _didDomOrderChangeState) === "processing")
+      return;
+    __privateSet(this, _didDomOrderChangeState, "processing");
+    setTimeout(() => {
+      __privateSet(this, _detectors, __privateGet(this, _detectors).sort((a, b) => b.domOrder - a.domOrder));
+      __privateSet(this, _didDomOrderChangeState, "idle");
+    }, 0);
+  }
+  addDetector(detector) {
+    if (!__privateGet(this, _activated))
+      return;
+    __privateGet(this, _detectors).push(detector);
+  }
+  removeDetector(detector) {
+    if (!__privateGet(this, _activated))
+      return;
+    __privateSet(this, _detectors, __privateGet(this, _detectors).filter((d) => d !== detector));
+  }
+};
+_activated = new WeakMap();
+_detectors = new WeakMap();
+_rootPosition = new WeakMap();
+_renderContext = new WeakMap();
+_hitPosition = new WeakMap();
+_handleMouseDown = new WeakMap();
+_handleClick = new WeakMap();
+_hitHistory = new WeakMap();
+_handleMouseMove = new WeakMap();
+_handleMouseUp = new WeakMap();
+_handleMouseWheel = new WeakMap();
+_handleMouseEnter = new WeakMap();
+_handleMouseLeave = new WeakMap();
+_wrapEvent = new WeakMap();
+_didDomOrderChangeState = new WeakMap();
+
 // src/runApp.ts
 var AppRunner = class {
   constructor({
@@ -12758,14 +12923,22 @@ var AppRunner = class {
     __publicField(this, "buildOwner");
     __publicField(this, "renderOwner");
     __publicField(this, "scheduler");
-    __publicField(this, "renderDispatcher");
     __publicField(this, "didRun", false);
     __publicField(this, "widget");
+    __publicField(this, "handleViewResize", (size) => {
+      this.viewSize = size;
+      if (this.didRun) {
+        this.draw();
+      } else {
+        this.runApp(this.widget);
+      }
+    });
     this.viewSize = ssrSize;
     const renderContext = new RenderContext({
       view,
       document: _document,
-      window: _window
+      window: _window,
+      onResize: this.handleViewResize
     });
     const renderDispatcher = new RenderFrameDispatcher_default();
     const buildOwner = new BuildOwner_default({
@@ -12773,7 +12946,8 @@ var AppRunner = class {
     });
     const renderOwner = new RenderOwner_default({
       onNeedVisualUpdate: () => renderDispatcher.dispatch(),
-      paintContext: renderContext.paintContext
+      renderContext,
+      hitTestDispatcher: new HitTestDispatcher()
     });
     const scheduler = new Scheduler_default();
     scheduler.addPersistenceCallbacks(() => buildOwner.flushBuild());
@@ -12782,18 +12956,16 @@ var AppRunner = class {
     this.buildOwner = buildOwner;
     this.renderOwner = renderOwner;
     this.scheduler = scheduler;
-    this.renderDispatcher = renderDispatcher;
     this.renderContext = renderContext;
   }
   runApp(widget) {
     this.widget = widget;
     if (this.viewSize == null)
-      return ``;
+      return "";
     this.root = new RenderObjectToWidgetAdapter_default({
       app: widget,
       buildOwner: this.buildOwner,
       renderOwner: this.renderOwner,
-      renderContext: this.renderContext,
       scheduler: this.scheduler
     }).createElement();
     this.root.mount(void 0);
@@ -12813,7 +12985,7 @@ var AppRunner = class {
       this.renderContext.window = window2;
     if (view)
       this.renderContext.view = view;
-    this.renderOwner.paintContext = this.renderContext.paintContext;
+    this.renderOwner.renderContext = this.renderContext;
   }
   onMount({
     view,
@@ -12824,28 +12996,13 @@ var AppRunner = class {
       window,
       document
     });
-    resizeTarget && this.observeCanvasSize(resizeTarget);
-  }
-  observeCanvasSize(target) {
-    const resize = (child) => {
-      const { width, height } = child.target.getBoundingClientRect();
-      this.viewSize = new size_default({ width, height });
-    };
-    const resizeObserver = new ResizeObserver((entries2) => {
-      const child = entries2[0];
-      resize(child);
-      if (this.didRun) {
-        this.draw();
-      } else {
-        this.runApp(this.widget);
-      }
-    });
-    resizeObserver.observe(target);
+    resizeTarget && this.renderContext.observeSize(resizeTarget);
   }
   draw() {
     this.layout();
     this.renderOwner.rearrangeDomOrder();
     this.paint();
+    this.scheduler.consumePostCallbacks();
   }
   rebuild() {
     this.root.children[0].rebuild();
@@ -12858,19 +13015,42 @@ var AppRunner = class {
     const rootRenderObject = this.root.renderObject;
     rootRenderObject.paint(this.renderContext.paintContext);
   }
+  dispose() {
+    this.root.unmount();
+    this.renderContext.dispose();
+  }
 };
 var RenderContext = class {
   constructor({
     document: document2,
     window: window2,
-    view
+    view,
+    onResize
   }) {
     __publicField(this, "document");
     __publicField(this, "window");
     __publicField(this, "view");
+    __publicField(this, "viewPort", {
+      translation: { x: 0, y: 0 },
+      scale: 1
+    });
+    __publicField(this, "viewSize", new size_default({ width: 0, height: 0 }));
+    __publicField(this, "resizeObserver");
+    __publicField(this, "onResize");
     this.document = document2;
     this.window = window2;
     this.view = view;
+    this.onResize = onResize;
+  }
+  setViewport({
+    translation,
+    scale
+  }) {
+    this.viewPort = { translation, scale };
+    this.view.setAttribute(
+      "viewBox",
+      `${-this.viewPort.translation.x} ${-this.viewPort.translation.y} ${this.viewSize.width / this.viewPort.scale} ${this.viewSize.height / this.viewPort.scale}`
+    );
   }
   setConfig({
     document: document2,
@@ -12905,6 +13085,17 @@ var RenderContext = class {
       }
     };
   }
+  dispose() {
+    this.resizeObserver.disconnect();
+  }
+  observeSize(target) {
+    this.resizeObserver = new ResizeObserver(([child]) => {
+      const { width, height } = child.target.getBoundingClientRect();
+      this.viewSize = new size_default({ width, height });
+      this.onResize(this.viewSize);
+    });
+    this.resizeObserver.observe(target);
+  }
 };
 
 // src/element/ComponentElement.ts
@@ -17256,7 +17447,6 @@ var BaseGestureDetector = class extends SingleChildRenderObjectWidget_default {
     onDragEnd,
     onDragMove,
     onDragStart,
-    bubble = {},
     onWheel
   }) {
     super({ child, key });
@@ -17272,7 +17462,6 @@ var BaseGestureDetector = class extends SingleChildRenderObjectWidget_default {
     __publicField(this, "onDragEnd");
     __publicField(this, "onWheel");
     __publicField(this, "cursor");
-    __publicField(this, "bubble");
     this.onClick = onClick != null ? onClick : emptyCallback;
     this.onMouseDown = onMouseDown != null ? onMouseDown : emptyCallback;
     this.onMouseMove = onMouseMove != null ? onMouseMove : emptyCallback;
@@ -17285,19 +17474,6 @@ var BaseGestureDetector = class extends SingleChildRenderObjectWidget_default {
     this.onDragEnd = onDragEnd != null ? onDragEnd : emptyCallback;
     this.onWheel = onWheel != null ? onWheel : emptyCallback;
     this.cursor = cursor != null ? cursor : "pointer";
-    this.bubble = __spreadValues({
-      mousedown: false,
-      mouseenter: false,
-      mouseleave: false,
-      mousemove: false,
-      mouseover: false,
-      mouseup: false,
-      click: false,
-      wheel: false,
-      dragstart: false,
-      dragend: false,
-      drag: false
-    }, bubble);
   }
   createRenderObject() {
     return new RenderGestureDetector({
@@ -17312,8 +17488,7 @@ var BaseGestureDetector = class extends SingleChildRenderObjectWidget_default {
       onDragMove: this.onDragMove,
       onDragEnd: this.onDragEnd,
       onWheel: this.onWheel,
-      cursor: this.cursor,
-      bubble: this.bubble
+      cursor: this.cursor
     });
   }
   updateRenderObject(renderObject) {
@@ -17325,7 +17500,6 @@ var BaseGestureDetector = class extends SingleChildRenderObjectWidget_default {
     renderObject.onDragStart = this.onDragStart;
     renderObject.onDragMove = this.onDragMove;
     renderObject.onDragEnd = this.onDragEnd;
-    renderObject.bubble = this.bubble;
     renderObject.onWheel = this.onWheel;
   }
 };
@@ -17342,13 +17516,11 @@ var RenderGestureDetector = class extends SingleChildRenderObject_default {
     onDragMove,
     onDragStart,
     cursor,
-    bubble,
     onWheel
   }) {
     super({ isPainter: true });
     __publicField(this, "isRenderGestureDetector", true);
     __publicField(this, "id", createUniqueId());
-    __publicField(this, "_bubble");
     __publicField(this, "_cursor");
     __publicField(this, "_onClick");
     __publicField(this, "_onMouseDown");
@@ -17373,13 +17545,6 @@ var RenderGestureDetector = class extends SingleChildRenderObject_default {
     this._onDragStart = onDragStart;
     this._onWheel = onWheel;
     this._cursor = cursor;
-    this._bubble = bubble;
-  }
-  get bubble() {
-    return this._bubble;
-  }
-  set bubble(prop) {
-    this._bubble = prop;
   }
   get cursor() {
     return this._cursor;
@@ -17478,34 +17643,10 @@ var RenderGestureDetector = class extends SingleChildRenderObject_default {
       return;
     this._onWheel = prop;
   }
-  get listeners() {
-    const listeners = {
-      click: this.onClick,
-      mousedown: this.onMouseDown,
-      mousemove: this.onMouseMove,
-      mouseup: this.onMouseUp,
-      mouseover: this.onMouseOver,
-      mouseenter: this.onMouseEnter,
-      mouseleave: this.onMouseLeave,
-      wheel: this.onWheel,
-      dragstart: this.onDragStart,
-      drag: this.onDragMove,
-      dragend: this.onDragEnd
-    };
-    return TypedObject_default.keys(listeners).reduce((acc, key) => {
-      acc[key] = (e) => {
-        var _a;
-        if (this.bubble[key]) {
-          this.dispatchParent(e);
-        }
-        (_a = listeners[key]) == null ? void 0 : _a.call(listeners, e);
-      };
-      return acc;
-    }, {});
-  }
   attach(ownerElement) {
     super.attach(ownerElement);
     this.addEventListeners();
+    this.renderOwner.hitTestDispatcher.addDetector(this);
   }
   dispose(context) {
     this.removeEventListeners();
@@ -17515,6 +17656,7 @@ var RenderGestureDetector = class extends SingleChildRenderObject_default {
       globalDragBackend = null;
     }
     super.dispose(context);
+    this.renderOwner.hitTestDispatcher.removeDetector(this);
   }
   removeEventListeners() {
     getSingletonDragBackend().disconnectDragSource(this.id);
@@ -17523,22 +17665,13 @@ var RenderGestureDetector = class extends SingleChildRenderObject_default {
     const isBrowser = typeof window !== "undefined";
     if (!isBrowser)
       return;
-    const {
-      svgEls: { rect }
-    } = this.resolveSvgEl();
     const dragBackend = getSingletonDragBackend();
     dragBackend.isSetup || dragBackend.setup();
     backendRefCount++;
-    const _a = this.listeners, { drag, dragend, dragstart } = _a, restListeners = __objRest(_a, ["drag", "dragend", "dragstart"]);
-    dragBackend.connectDragSource(this.id, rect, {
-      onDragStart: dragstart,
-      onDragMove: drag,
-      onDragEnd: dragend
-    });
-    TypedObject_default.entries(restListeners).forEach(([type, listener]) => {
-      rect.addEventListener(type, (e) => {
-        listener(e);
-      });
+    dragBackend.connectDragSource(this, {
+      onDragStart: this.onDragStart,
+      onDragMove: this.onDragMove,
+      onDragEnd: this.onDragEnd
     });
   }
   performPaint({ rect }) {
@@ -17554,19 +17687,9 @@ var RenderGestureDetector = class extends SingleChildRenderObject_default {
       rect
     };
   }
-  dispatch(e) {
-    var _a, _b;
-    (_b = (_a = this.listeners)[e.type]) == null ? void 0 : _b.call(_a, e);
-  }
-  dispatchParent(e) {
-    let parent = this.parent;
-    while (parent != null) {
-      if (parent == null ? void 0 : parent.isRenderGestureDetector) {
-        parent.dispatch(e);
-        break;
-      }
-      parent = parent.parent;
-    }
+  didChangeDomOrder() {
+    super.didChangeDomOrder();
+    this.renderOwner.hitTestDispatcher.didChangeDomOrder();
   }
 };
 function emptyCallback(_arg) {
@@ -17575,7 +17698,6 @@ var DragBackend = class {
   constructor() {
     __publicField(this, "isSetup", false);
     __publicField(this, "activeDragSourceId", null);
-    __publicField(this, "dragStartListener", {});
     __publicField(this, "dragMoveListener", {});
     __publicField(this, "dragEndListener", {});
     __publicField(this, "handleMouseMoveTop", (e) => {
@@ -17615,19 +17737,21 @@ var DragBackend = class {
     this.root.removeEventListener("mouseup", this.handleMouseUpTop);
     this.isSetup = false;
   }
-  connectDragSource(sourceId, node, {
+  setActiveDragSourceId(sourceId) {
+    this.activeDragSourceId = sourceId;
+  }
+  connectDragSource(detector, {
     onDragStart = emptyCallback,
     onDragMove = emptyCallback,
     onDragEnd = emptyCallback
   } = {}) {
-    this.dragStartListener[sourceId] = (e) => {
-      this.activeDragSourceId = sourceId;
+    const sourceId = detector.id;
+    const onMouseDown = detector.onMouseDown;
+    detector.onMouseDown = (e) => {
+      onMouseDown(e);
+      this.setActiveDragSourceId(sourceId);
       onDragStart(e);
     };
-    node.addEventListener(
-      "mousedown",
-      this.dragStartListener[sourceId].bind(this)
-    );
     this.dragMoveListener[sourceId] = (e) => {
       onDragMove(e);
     };
@@ -18368,19 +18492,6 @@ var ToolTipState = class extends State {
       clipped: false,
       children: [
         GestureDetector_default({
-          bubble: {
-            mousedown: true,
-            mouseenter: true,
-            mouseleave: true,
-            mousemove: true,
-            mouseover: true,
-            mouseup: true,
-            click: true,
-            drag: true,
-            dragend: true,
-            dragstart: true,
-            wheel: true
-          },
           cursor: "default",
           child: this.widget.child,
           onMouseEnter: () => {