@geajs/ui 0.2.3 → 0.2.9

package/dist/dnd-manager.mjs

@@ -1,4 +1,4 @@
-import { GEA_DOM_COMPONENT, GEA_PARENT_COMPONENT, GEA_PROXY_GET_RAW_TARGET, stashComponentForTransfer } from "@geajs/core";
+import { GEA_DOM_COMPONENT, GEA_PARENT_COMPONENT, GEA_PROXY_GET_RAW_TARGET } from "@geajs/core";
 //#region src/components/dnd-manager.ts
 const DRAG_THRESHOLD_SQ = 25;
 const DRAGGABLE_SEL = "[data-draggable-id]";
@@ -6,6 +6,25 @@ const DROPPABLE_SEL = "[data-droppable-id]";
 function _rawComp(comp) {
 	return comp?.[GEA_PROXY_GET_RAW_TARGET] ?? comp;
 }
+/**
+* Walk up from `el` until its parent is `container`. Used to find the
+* right position within a droppable's direct children when draggable
+* elements are wrapped in one or more intermediate elements (e.g. the
+* `<span style="display:contents">` component-boundary wrapper that Gea
+* emits around child-Component roots inside a keyed-list).
+*
+* Returns the direct-child-of-`container` ancestor of `el`, or `el`
+* itself if `el` is already a direct child. Returns `null` if `el`
+* isn't inside `container` at all.
+*/
+function _directChildOf(container, el) {
+	let n = el;
+	while (n && n.parentElement !== container) {
+		n = n.parentElement;
+		if (!n) return null;
+	}
+	return n;
+}
 var DndManager = class {
 	constructor() {
 		this.droppables = /* @__PURE__ */ new Map();
@@ -16,6 +35,7 @@ var DndManager = class {
 		this._sourceDroppableId = "";
 		this._sourceIndex = 0;
 		this._sourceEl = null;
+		this._sourceWrapper = null;
 		this._sourceHeight = 0;
 		this._sourceRect = null;
 		this._savedCssText = "";
@@ -67,7 +87,7 @@ var DndManager = class {
 		const droppableEl = el.closest(DROPPABLE_SEL);
 		if (!droppableEl) return;
 		const droppableId = droppableEl.dataset.droppableId;
-		const sourceIndex = Array.from(droppableEl.querySelectorAll(`:scope > ${DRAGGABLE_SEL}`)).indexOf(el);
+		const sourceIndex = Array.from(droppableEl.querySelectorAll(DRAGGABLE_SEL)).indexOf(el);
 		if (sourceIndex === -1) return;
 		this._dragging = true;
 		this._started = false;
@@ -118,8 +138,12 @@ var DndManager = class {
 		placeholder.style.height = rect.height + "px";
 		placeholder.style.marginBottom = elMargin;
 		placeholder.style.transition = "none";
-		el.parentElement.insertBefore(placeholder, el);
+		const sourceContainer = this.droppables.get(this._sourceDroppableId) || el.closest(DROPPABLE_SEL);
+		this._sourceWrapper = sourceContainer ? _directChildOf(sourceContainer, el) : el;
+		const wrapper = this._sourceWrapper || el;
+		wrapper.parentElement.insertBefore(placeholder, wrapper);
 		document.body.appendChild(el);
+		el.classList.add("gea-dnd-clone", "gea-dragging");
 		Object.assign(el.style, {
 			position: "fixed",
 			top: "0px",
@@ -154,7 +178,7 @@ var DndManager = class {
 			this._currentDroppableId = null;
 			return;
 		}
-		const items = Array.from(foundEl.querySelectorAll(`:scope > ${DRAGGABLE_SEL}`));
+		const items = Array.from(foundEl.querySelectorAll(DRAGGABLE_SEL));
 		const threshold = clientY >= this._lastClientY ? 0 : 1;
 		let insertIndex = items.length;
 		for (let i = 0; i < items.length; i++) {
@@ -167,7 +191,8 @@ var DndManager = class {
 		this._currentDroppableId = foundId;
 		this._currentIndex = insertIndex;
 		if (!this._placeholder) return;
-		const refNode = items[insertIndex] || null;
+		const refItem = items[insertIndex] || null;
+		const refNode = refItem ? _directChildOf(foundEl, refItem) : null;
 		if (this._placeholder.parentElement !== foundEl || this._placeholder.nextElementSibling !== refNode) {
 			if (this._placeholder.parentElement) {
 				const ghost = document.createElement("div");
@@ -199,8 +224,17 @@ var DndManager = class {
 			this._dragging = false;
 			return;
 		}
+		const result = {
+			draggableId: this._draggedId,
+			source: {
+				droppableId: this._sourceDroppableId,
+				index: this._sourceIndex
+			},
+			destination: null
+		};
 		this._animateReturn().then(() => {
 			this._returnToSource();
+			this._onDragEnd?.(result);
 			this._cleanup();
 		});
 	}
@@ -215,27 +249,27 @@ var DndManager = class {
 			index: this._currentIndex
 		} : null;
 		const samePosition = destination && destination.droppableId === this._sourceDroppableId && destination.index === this._sourceIndex;
-		if (destination && this._placeholder && !samePosition) {
-			const result = {
-				draggableId: this._draggedId,
-				source: {
-					droppableId: this._sourceDroppableId,
-					index: this._sourceIndex
-				},
-				destination
-			};
-			this._animateDrop().then(() => {
-				this._restoreElStyles();
-				const draggedComp = this._getComponentFromElement(this._sourceEl);
-				if (draggedComp) stashComponentForTransfer(draggedComp);
-				if (this._placeholder?.parentElement) this._placeholder.remove();
-				this._placeholder = null;
-				if (this._sourceEl?.parentElement === document.body) this._sourceEl.remove();
-				this._onDragEnd?.(result);
-				this._cleanup();
-			});
-		} else this._animateReturn().then(() => {
+		const result = {
+			draggableId: this._draggedId,
+			source: {
+				droppableId: this._sourceDroppableId,
+				index: this._sourceIndex
+			},
+			destination: destination && !samePosition ? destination : null
+		};
+		if (destination && this._placeholder && !samePosition) this._animateDrop().then(() => {
+			this._restoreElStyles();
+			const wrapper = this._sourceWrapper;
+			if (this._sourceEl?.parentElement === document.body) this._sourceEl.remove();
+			if (wrapper && wrapper !== this._sourceEl && this._sourceEl && !wrapper.contains(this._sourceEl)) wrapper.appendChild(this._sourceEl);
+			if (this._placeholder?.parentElement) this._placeholder.remove();
+			this._placeholder = null;
+			this._onDragEnd?.(result);
+			this._cleanup();
+		});
+		else this._animateReturn().then(() => {
 			this._returnToSource();
+			this._onDragEnd?.(result);
 			this._cleanup();
 		});
 	}
@@ -251,16 +285,20 @@ var DndManager = class {
 	_restoreElStyles() {
 		if (!this._sourceEl) return;
 		this._sourceEl.style.cssText = this._savedCssText;
+		this._sourceEl.classList.remove("gea-dnd-clone", "gea-dragging");
 	}
 	_returnToSource() {
 		if (!this._sourceEl) return;
 		this._restoreElStyles();
-		if (this._placeholder?.parentElement) this._placeholder.parentElement.insertBefore(this._sourceEl, this._placeholder);
+		const wrapper = this._sourceWrapper || this._sourceEl;
+		if (wrapper !== this._sourceEl && !wrapper.contains(this._sourceEl)) wrapper.appendChild(this._sourceEl);
+		if (this._placeholder?.parentElement) this._placeholder.parentElement.insertBefore(wrapper, this._placeholder);
 		else {
 			const container = this.droppables.get(this._sourceDroppableId);
 			if (container) {
-				const items = Array.from(container.querySelectorAll(`:scope > ${DRAGGABLE_SEL}`));
-				container.insertBefore(this._sourceEl, items[this._sourceIndex] || null);
+				const items = Array.from(container.querySelectorAll(DRAGGABLE_SEL));
+				const ref = items[this._sourceIndex] ? _directChildOf(container, items[this._sourceIndex]) : null;
+				container.insertBefore(wrapper, ref);
 			}
 		}
 	}
@@ -269,7 +307,7 @@ var DndManager = class {
 		if (!sourceEl) return;
 		const destContainer = this.droppables.get(destination.droppableId);
 		if (!destContainer) return;
-		const refNode = Array.from(destContainer.querySelectorAll(`:scope > ${DRAGGABLE_SEL}`))[destination.index] || null;
+		const refNode = Array.from(destContainer.querySelectorAll(DRAGGABLE_SEL))[destination.index] || null;
 		destContainer.insertBefore(sourceEl, refNode);
 		const draggedComp = this._getComponentFromElement(sourceEl);
 		if (!draggedComp) return;

package/dist/dnd-manager.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dnd-manager.mjs","names":[],"sources":["../src/components/dnd-manager.ts"],"sourcesContent":["import {\n  GEA_DOM_COMPONENT,\n  GEA_PARENT_COMPONENT,\n  GEA_PROXY_GET_RAW_TARGET,\n  stashComponentForTransfer,\n} from '@geajs/core'\n\nexport interface DragResult {\n  draggableId: string\n  source: { droppableId: string; index: number }\n  destination: { droppableId: string; index: number }\n}\n\nconst DRAG_THRESHOLD_SQ = 25\nconst DRAGGABLE_SEL = '[data-draggable-id]'\nconst DROPPABLE_SEL = '[data-droppable-id]'\n\nfunction _rawComp(comp: any): any {\n  return comp?.[GEA_PROXY_GET_RAW_TARGET] ?? comp\n}\n\nclass DndManager {\n  droppables = new Map<string, HTMLElement>()\n\n  private _onDragEnd: ((result: DragResult) => void) | null = null\n  get onDragEnd() {\n    return this._onDragEnd\n  }\n  set onDragEnd(fn: ((result: DragResult) => void) | null) {\n    this._onDragEnd = fn\n    if (fn) this._ensureDocListener()\n  }\n\n  private _dragging = false\n  private _started = false\n  private _draggedId = ''\n  private _sourceDroppableId = ''\n  private _sourceIndex = 0\n  private _sourceEl: HTMLElement | null = null\n  private _sourceHeight = 0\n  private _sourceRect: DOMRect | null = null\n  private _savedCssText = ''\n  private _placeholder: HTMLElement | null = null\n  private _startX = 0\n  private _startY = 0\n  private _offsetX = 0\n  private _offsetY = 0\n  private _currentDroppableId: string | null = null\n  private _currentIndex = 0\n  private _lastClientY = 0\n  private _cleanedUp = false\n\n  private _boundMove = this._onPointerMove.bind(this)\n  private _boundUp = this._onPointerUp.bind(this)\n  private _boundKeyDown = this._onKeyDown.bind(this)\n  private _boundDocDown = this._onDocumentPointerDown.bind(this)\n  private _docListenerAttached = false\n\n  get isDragging() {\n    return this._started\n  }\n\n  private _ensureDocListener() {\n    if (this._docListenerAttached || typeof document === 'undefined') return\n    document.addEventListener('pointerdown', this._boundDocDown, true)\n    this._docListenerAttached = true\n  }\n\n  private _onDocumentPointerDown(e: PointerEvent) {\n    const el = (e.target as HTMLElement).closest?.(DRAGGABLE_SEL) as HTMLElement\n    if (!el) return\n    this.startTracking(e, el.dataset.draggableId!, el)\n  }\n\n  registerDroppable(id: string, el: HTMLElement) {\n    this.droppables.set(id, el)\n    this._ensureDocListener()\n  }\n\n  unregisterDroppable(id: string) {\n    this.droppables.delete(id)\n  }\n\n  startTracking(e: PointerEvent, draggableId: string, el: HTMLElement) {\n    if (this._dragging || e.button !== 0) return\n    this._ensureDocListener()\n\n    const droppableEl = el.closest(DROPPABLE_SEL) as HTMLElement\n    if (!droppableEl) return\n\n    const droppableId = droppableEl.dataset.droppableId!\n    const siblings = Array.from(droppableEl.querySelectorAll(`:scope > ${DRAGGABLE_SEL}`))\n    const sourceIndex = siblings.indexOf(el)\n    if (sourceIndex === -1) return\n\n    this._dragging = true\n    this._started = false\n    this._cleanedUp = false\n    this._draggedId = draggableId\n    this._sourceDroppableId = droppableId\n    this._sourceIndex = sourceIndex\n    this._sourceEl = el\n\n    const rect = el.getBoundingClientRect()\n    this._sourceHeight = rect.height\n    this._sourceRect = rect\n    this._startX = e.clientX\n    this._startY = e.clientY\n    this._lastClientY = e.clientY\n    this._offsetX = e.clientX - rect.left\n    this._offsetY = e.clientY - rect.top\n\n    document.addEventListener('pointermove', this._boundMove)\n    document.addEventListener('pointerup', this._boundUp)\n    document.addEventListener('keydown', this._boundKeyDown)\n    e.preventDefault()\n  }\n\n  private _onPointerMove(e: PointerEvent) {\n    if (!this._dragging) return\n\n    if (!this._started) {\n      const dx = e.clientX - this._startX\n      const dy = e.clientY - this._startY\n      if (dx * dx + dy * dy < DRAG_THRESHOLD_SQ) return\n      this._initDrag()\n      this._updateTarget(e.clientX, e.clientY)\n      return\n    }\n\n    this._sourceEl!.style.transform = `translate(${e.clientX - this._offsetX}px, ${e.clientY - this._offsetY}px)`\n    this._updateTarget(e.clientX, e.clientY)\n    this._lastClientY = e.clientY\n  }\n\n  private _initDrag() {\n    this._started = true\n    const el = this._sourceEl!\n    const rect = this._sourceRect!\n\n    document.querySelectorAll(DROPPABLE_SEL).forEach((dropEl) => {\n      const id = (dropEl as HTMLElement).dataset.droppableId!\n      if (!this.droppables.has(id)) {\n        this.droppables.set(id, dropEl as HTMLElement)\n      }\n    })\n\n    const elMargin = getComputedStyle(el).marginBottom\n    this._savedCssText = el.style.cssText\n\n    const placeholder = document.createElement('div')\n    placeholder.className = 'gea-dnd-placeholder'\n    placeholder.style.height = rect.height + 'px'\n    placeholder.style.marginBottom = elMargin\n    placeholder.style.transition = 'none'\n    el.parentElement!.insertBefore(placeholder, el)\n\n    document.body.appendChild(el)\n    Object.assign(el.style, {\n      position: 'fixed',\n      top: '0px',\n      left: '0',\n      width: rect.width + 'px',\n      height: rect.height + 'px',\n      transform: `translate(${rect.left}px, ${rect.top}px)`,\n      // rotate: '0deg',\n      // transition: 'rotate 0.15s ease, box-shadow 0.15s ease',\n      pointerEvents: 'none',\n      zIndex: '99999',\n      margin: '0',\n      willChange: 'transform',\n      boxShadow: 'none',\n    })\n    el.offsetHeight\n    // el.style.rotate = '3deg'\n    el.style.boxShadow = '5px 10px 30px 0px rgba(9, 30, 66, 0.15)'\n\n    this._placeholder = placeholder\n\n    this._currentDroppableId = this._sourceDroppableId\n    this._currentIndex = this._sourceIndex\n  }\n\n  private _updateTarget(clientX: number, clientY: number) {\n    let foundId: string | null = null\n    let foundEl: HTMLElement | null = null\n\n    for (const [id, el] of this.droppables) {\n      const r = el.getBoundingClientRect()\n      if (clientX >= r.left && clientX <= r.right && clientY >= r.top && clientY <= r.bottom) {\n        foundId = id\n        foundEl = el\n        break\n      }\n    }\n\n    if (!foundEl || foundId === null) {\n      this._currentDroppableId = null\n      return\n    }\n\n    const items = Array.from(foundEl.querySelectorAll(`:scope > ${DRAGGABLE_SEL}`))\n    const movingDown = clientY >= this._lastClientY\n    const threshold = movingDown ? 0 : 1\n    let insertIndex = items.length\n    for (let i = 0; i < items.length; i++) {\n      const r = items[i].getBoundingClientRect()\n      if (clientY < r.top + r.height * threshold) {\n        insertIndex = i\n        break\n      }\n    }\n\n    this._currentDroppableId = foundId\n    this._currentIndex = insertIndex\n\n    if (!this._placeholder) return\n\n    const refNode = (items[insertIndex] as HTMLElement) || null\n    if (this._placeholder.parentElement !== foundEl || this._placeholder.nextElementSibling !== refNode) {\n      if (this._placeholder.parentElement) {\n        const ghost = document.createElement('div')\n        ghost.style.height = this._sourceHeight + 'px'\n        ghost.style.marginBottom = this._placeholder.style.marginBottom\n        ghost.style.transition = 'height 0.2s cubic-bezier(0.2, 0, 0, 1)'\n        ghost.style.overflow = 'hidden'\n        this._placeholder.parentElement.insertBefore(ghost, this._placeholder)\n        ghost.offsetHeight\n        ghost.style.height = '0px'\n        ghost.style.marginBottom = '0px'\n        ghost.addEventListener('transitionend', () => ghost.remove(), { once: true })\n        setTimeout(() => ghost.remove(), 250)\n      }\n\n      this._placeholder.style.transition = 'none'\n      this._placeholder.style.height = '0px'\n      foundEl.insertBefore(this._placeholder, refNode)\n      this._placeholder.offsetHeight\n      this._placeholder.style.transition = 'height 0.2s cubic-bezier(0.2, 0, 0, 1)'\n      this._placeholder.style.height = this._sourceHeight + 'px'\n    }\n  }\n\n  private _onKeyDown(e: KeyboardEvent) {\n    if (e.key === 'Escape' && this._dragging) {\n      this._cancelDrag()\n    }\n  }\n\n  private _cancelDrag() {\n    this._removeGlobalListeners()\n    if (!this._started) {\n      this._dragging = false\n      return\n    }\n\n    this._animateReturn().then(() => {\n      this._returnToSource()\n      this._cleanup()\n    })\n  }\n\n  private _onPointerUp(_e: PointerEvent) {\n    this._removeGlobalListeners()\n\n    if (!this._started) {\n      this._dragging = false\n      return\n    }\n\n    const destination =\n      this._currentDroppableId !== null ? { droppableId: this._currentDroppableId, index: this._currentIndex } : null\n\n    const samePosition =\n      destination && destination.droppableId === this._sourceDroppableId && destination.index === this._sourceIndex\n\n    if (destination && this._placeholder && !samePosition) {\n      const result: DragResult = {\n        draggableId: this._draggedId,\n        source: { droppableId: this._sourceDroppableId, index: this._sourceIndex },\n        destination,\n      }\n      this._animateDrop().then(() => {\n        this._restoreElStyles()\n        // Stash the component for cross-list transfer so the destination's\n        // reconciliation can adopt it (DOM subtree intact) instead of\n        // disposing + recreating it from scratch.\n        const draggedComp = this._getComponentFromElement(this._sourceEl)\n        if (draggedComp) {\n          stashComponentForTransfer(draggedComp)\n        }\n        if (this._placeholder?.parentElement) {\n          this._placeholder.remove()\n        }\n        this._placeholder = null\n        if (this._sourceEl?.parentElement === document.body) {\n          this._sourceEl.remove()\n        }\n        this._onDragEnd?.(result)\n        this._cleanup()\n      })\n    } else {\n      this._animateReturn().then(() => {\n        this._returnToSource()\n        this._cleanup()\n      })\n    }\n  }\n\n  private _getComponentFromElement(el: HTMLElement | null): any {\n    let current: HTMLElement | null = el\n    while (current) {\n      const comp = (current as any)[GEA_DOM_COMPONENT]\n      if (comp) return comp\n      current = current.parentElement\n    }\n    return null\n  }\n\n  private _restoreElStyles() {\n    if (!this._sourceEl) return\n    this._sourceEl.style.cssText = this._savedCssText\n  }\n\n  private _returnToSource() {\n    if (!this._sourceEl) return\n    this._restoreElStyles()\n    if (this._placeholder?.parentElement) {\n      this._placeholder.parentElement.insertBefore(this._sourceEl, this._placeholder)\n    } else {\n      const container = this.droppables.get(this._sourceDroppableId)\n      if (container) {\n        const items = Array.from(container.querySelectorAll(`:scope > ${DRAGGABLE_SEL}`))\n        container.insertBefore(this._sourceEl, items[this._sourceIndex] || null)\n      }\n    }\n  }\n\n  private _performTransfer(destination: { droppableId: string; index: number }) {\n    const sourceEl = this._sourceEl\n    if (!sourceEl) return\n\n    const destContainer = this.droppables.get(destination.droppableId)\n    if (!destContainer) return\n\n    const destItems = Array.from(destContainer.querySelectorAll(`:scope > ${DRAGGABLE_SEL}`))\n    const refNode = (destItems[destination.index] as HTMLElement) || null\n    destContainer.insertBefore(sourceEl, refNode)\n\n    const draggedComp = this._getComponentFromElement(sourceEl)\n    if (!draggedComp) return\n\n    const rawDragged = _rawComp(draggedComp)\n    const sourceParent = rawDragged[GEA_PARENT_COMPONENT]\n    if (!sourceParent) return\n\n    const srcArr = this._findCompiledArray(sourceParent, draggedComp)\n    if (!srcArr) return\n\n    const destParent = this._getComponentFromElement(destContainer)\n    if (!destParent) return\n\n    srcArr.arr.splice(srcArr.index, 1)\n    const destArr = destParent[srcArr.key]\n    if (Array.isArray(destArr)) {\n      destArr.splice(destination.index, 0, draggedComp)\n    }\n\n    // Update the parent component pointer on the raw instance (symbol-keyed, not string prop).\n    rawDragged[GEA_PARENT_COMPONENT] = destParent\n  }\n\n  private _findCompiledArray(parent: any, child: any): { key: symbol; arr: any[]; index: number } | null {\n    // Component array lists are stored under geaListItemsSymbol(arrayPropName) symbol keys.\n    // Walk the symbol keys of the parent to find which list contains the child.\n    for (const sym of Object.getOwnPropertySymbols(parent)) {\n      const desc = sym.description ?? ''\n      if (!desc.startsWith('gea.listItems.')) continue\n      const arr = parent[sym]\n      if (!Array.isArray(arr)) continue\n      const idx = arr.indexOf(child)\n      if (idx !== -1) return { key: sym, arr, index: idx }\n    }\n    return null\n  }\n\n  private _animateDrop(): Promise<void> {\n    return new Promise((resolve) => {\n      if (!this._sourceEl || !this._placeholder) return resolve()\n      const phRect = this._placeholder.getBoundingClientRect()\n      this._sourceEl.style.transition =\n        'transform 0.2s cubic-bezier(0.2, 0, 0, 1), rotate 0.2s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.2s cubic-bezier(0.2, 0, 0, 1)'\n      this._sourceEl.style.transform = `translate(${phRect.left}px, ${phRect.top}px)`\n      this._sourceEl.style.rotate = '0deg'\n      this._sourceEl.style.boxShadow = 'none'\n      let done = false\n      const finish = () => {\n        if (done) return\n        done = true\n        resolve()\n      }\n      this._sourceEl.addEventListener('transitionend', finish, { once: true })\n      setTimeout(finish, 250)\n    })\n  }\n\n  private _animateReturn(): Promise<void> {\n    return new Promise((resolve) => {\n      if (!this._sourceEl || !this._sourceRect) return resolve()\n      let targetX = this._sourceRect.left\n      let targetY = this._sourceRect.top\n      if (this._placeholder?.parentElement) {\n        const phRect = this._placeholder.getBoundingClientRect()\n        targetX = phRect.left\n        targetY = phRect.top\n      }\n      this._sourceEl.style.transition =\n        'transform 0.2s cubic-bezier(0.2, 0, 0, 1), rotate 0.2s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.2s cubic-bezier(0.2, 0, 0, 1)'\n      this._sourceEl.style.transform = `translate(${targetX}px, ${targetY}px)`\n      this._sourceEl.style.rotate = '0deg'\n      this._sourceEl.style.boxShadow = 'none'\n      let done = false\n      const finish = () => {\n        if (done) return\n        done = true\n        resolve()\n      }\n      this._sourceEl.addEventListener('transitionend', finish, { once: true })\n      setTimeout(finish, 250)\n    })\n  }\n\n  private _removeGlobalListeners() {\n    document.removeEventListener('pointermove', this._boundMove)\n    document.removeEventListener('pointerup', this._boundUp)\n    document.removeEventListener('keydown', this._boundKeyDown)\n  }\n\n  private _cleanup() {\n    if (this._cleanedUp) return\n    this._cleanedUp = true\n\n    this._placeholder?.remove()\n    this._placeholder = null\n    this._sourceEl = null\n    this._sourceRect = null\n\n    this._dragging = false\n    this._started = false\n    this._draggedId = ''\n    this._currentDroppableId = null\n  }\n\n  destroy() {\n    this._removeGlobalListeners()\n    if (this._dragging) {\n      if (this._sourceEl) this._returnToSource()\n      this._cleanup()\n    }\n    if (this._docListenerAttached && typeof document !== 'undefined') {\n      document.removeEventListener('pointerdown', this._boundDocDown, true)\n      this._docListenerAttached = false\n    }\n    this.droppables.clear()\n    this.onDragEnd = null\n  }\n}\n\nexport const dndManager = new DndManager()\n"],"mappings":"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"}
+{"version":3,"file":"dnd-manager.mjs","names":[],"sources":["../src/components/dnd-manager.ts"],"sourcesContent":["import { GEA_DOM_COMPONENT, GEA_PARENT_COMPONENT, GEA_PROXY_GET_RAW_TARGET } from '@geajs/core'\n\nexport interface DragResult {\n  draggableId: string\n  source: { droppableId: string; index: number }\n  /** `null` when dropped outside any droppable or returned to same position. */\n  destination: { droppableId: string; index: number } | null\n}\n\nconst DRAG_THRESHOLD_SQ = 25\nconst DRAGGABLE_SEL = '[data-draggable-id]'\nconst DROPPABLE_SEL = '[data-droppable-id]'\n\nfunction _rawComp(comp: any): any {\n  return comp?.[GEA_PROXY_GET_RAW_TARGET] ?? comp\n}\n\n/**\n * Walk up from `el` until its parent is `container`. Used to find the\n * right position within a droppable's direct children when draggable\n * elements are wrapped in one or more intermediate elements (e.g. the\n * `<span style=\"display:contents\">` component-boundary wrapper that Gea\n * emits around child-Component roots inside a keyed-list).\n *\n * Returns the direct-child-of-`container` ancestor of `el`, or `el`\n * itself if `el` is already a direct child. Returns `null` if `el`\n * isn't inside `container` at all.\n */\nfunction _directChildOf(container: HTMLElement, el: HTMLElement | null): HTMLElement | null {\n  let n: HTMLElement | null = el\n  while (n && n.parentElement !== container) {\n    n = n.parentElement\n    if (!n) return null\n  }\n  return n\n}\n\nclass DndManager {\n  droppables = new Map<string, HTMLElement>()\n\n  private _onDragEnd: ((result: DragResult) => void) | null = null\n  get onDragEnd() {\n    return this._onDragEnd\n  }\n  set onDragEnd(fn: ((result: DragResult) => void) | null) {\n    this._onDragEnd = fn\n    if (fn) this._ensureDocListener()\n  }\n\n  private _dragging = false\n  private _started = false\n  private _draggedId = ''\n  private _sourceDroppableId = ''\n  private _sourceIndex = 0\n  private _sourceEl: HTMLElement | null = null\n  /**\n   * If the source draggable is nested inside a component-boundary wrapper\n   * (e.g. a `<span style=\"display:contents\">` inside the droppable), this\n   * holds that wrapper — the actual direct child of the droppable that we\n   * move/return. When there is no wrapper, this equals `_sourceEl`.\n   */\n  private _sourceWrapper: HTMLElement | null = null\n  private _sourceHeight = 0\n  private _sourceRect: DOMRect | null = null\n  private _savedCssText = ''\n  private _placeholder: HTMLElement | null = null\n  private _startX = 0\n  private _startY = 0\n  private _offsetX = 0\n  private _offsetY = 0\n  private _currentDroppableId: string | null = null\n  private _currentIndex = 0\n  private _lastClientY = 0\n  private _cleanedUp = false\n\n  private _boundMove = this._onPointerMove.bind(this)\n  private _boundUp = this._onPointerUp.bind(this)\n  private _boundKeyDown = this._onKeyDown.bind(this)\n  private _boundDocDown = this._onDocumentPointerDown.bind(this)\n  private _docListenerAttached = false\n\n  get isDragging() {\n    return this._started\n  }\n\n  private _ensureDocListener() {\n    if (this._docListenerAttached || typeof document === 'undefined') return\n    document.addEventListener('pointerdown', this._boundDocDown, true)\n    this._docListenerAttached = true\n  }\n\n  private _onDocumentPointerDown(e: PointerEvent) {\n    const el = (e.target as HTMLElement).closest?.(DRAGGABLE_SEL) as HTMLElement\n    if (!el) return\n    this.startTracking(e, el.dataset.draggableId!, el)\n  }\n\n  registerDroppable(id: string, el: HTMLElement) {\n    this.droppables.set(id, el)\n    this._ensureDocListener()\n  }\n\n  unregisterDroppable(id: string) {\n    this.droppables.delete(id)\n  }\n\n  startTracking(e: PointerEvent, draggableId: string, el: HTMLElement) {\n    if (this._dragging || e.button !== 0) return\n    this._ensureDocListener()\n\n    const droppableEl = el.closest(DROPPABLE_SEL) as HTMLElement\n    if (!droppableEl) return\n\n    const droppableId = droppableEl.dataset.droppableId!\n    // Descendant lookup (not `:scope > ...`) because keyedList wraps each\n    // item in a `display:contents` span; direct-child lookup misses them.\n    const siblings = Array.from(droppableEl.querySelectorAll(DRAGGABLE_SEL))\n    const sourceIndex = siblings.indexOf(el)\n    if (sourceIndex === -1) return\n\n    this._dragging = true\n    this._started = false\n    this._cleanedUp = false\n    this._draggedId = draggableId\n    this._sourceDroppableId = droppableId\n    this._sourceIndex = sourceIndex\n    this._sourceEl = el\n\n    const rect = el.getBoundingClientRect()\n    this._sourceHeight = rect.height\n    this._sourceRect = rect\n    this._startX = e.clientX\n    this._startY = e.clientY\n    this._lastClientY = e.clientY\n    this._offsetX = e.clientX - rect.left\n    this._offsetY = e.clientY - rect.top\n\n    document.addEventListener('pointermove', this._boundMove)\n    document.addEventListener('pointerup', this._boundUp)\n    document.addEventListener('keydown', this._boundKeyDown)\n    e.preventDefault()\n  }\n\n  private _onPointerMove(e: PointerEvent) {\n    if (!this._dragging) return\n\n    if (!this._started) {\n      const dx = e.clientX - this._startX\n      const dy = e.clientY - this._startY\n      if (dx * dx + dy * dy < DRAG_THRESHOLD_SQ) return\n      this._initDrag()\n      this._updateTarget(e.clientX, e.clientY)\n      return\n    }\n\n    this._sourceEl!.style.transform = `translate(${e.clientX - this._offsetX}px, ${e.clientY - this._offsetY}px)`\n    this._updateTarget(e.clientX, e.clientY)\n    this._lastClientY = e.clientY\n  }\n\n  private _initDrag() {\n    this._started = true\n    const el = this._sourceEl!\n    const rect = this._sourceRect!\n\n    document.querySelectorAll(DROPPABLE_SEL).forEach((dropEl) => {\n      const id = (dropEl as HTMLElement).dataset.droppableId!\n      if (!this.droppables.has(id)) {\n        this.droppables.set(id, dropEl as HTMLElement)\n      }\n    })\n\n    const elMargin = getComputedStyle(el).marginBottom\n    this._savedCssText = el.style.cssText\n\n    const placeholder = document.createElement('div')\n    placeholder.className = 'gea-dnd-placeholder'\n    placeholder.style.height = rect.height + 'px'\n    placeholder.style.marginBottom = elMargin\n    placeholder.style.transition = 'none'\n    // Resolve the wrapper: if the draggable is nested inside a component-\n    // boundary span (display:contents) between the droppable container and\n    // the card, track that wrapper as the DOM unit we actually move/return.\n    // All `insertBefore` calls in `_updateTarget` / `_returnToSource` run at\n    // container-level and need direct-child nodes, not grandchildren.\n    const sourceContainer = this.droppables.get(this._sourceDroppableId) || (el.closest(DROPPABLE_SEL) as HTMLElement)\n    this._sourceWrapper = sourceContainer ? _directChildOf(sourceContainer, el) : el\n    const wrapper = this._sourceWrapper || el\n    wrapper.parentElement!.insertBefore(placeholder, wrapper)\n\n    document.body.appendChild(el)\n    el.classList.add('gea-dnd-clone', 'gea-dragging')\n    Object.assign(el.style, {\n      position: 'fixed',\n      top: '0px',\n      left: '0',\n      width: rect.width + 'px',\n      height: rect.height + 'px',\n      transform: `translate(${rect.left}px, ${rect.top}px)`,\n      // rotate: '0deg',\n      // transition: 'rotate 0.15s ease, box-shadow 0.15s ease',\n      pointerEvents: 'none',\n      zIndex: '99999',\n      margin: '0',\n      willChange: 'transform',\n      boxShadow: 'none',\n    })\n    el.offsetHeight\n    // el.style.rotate = '3deg'\n    el.style.boxShadow = '5px 10px 30px 0px rgba(9, 30, 66, 0.15)'\n\n    this._placeholder = placeholder\n\n    this._currentDroppableId = this._sourceDroppableId\n    this._currentIndex = this._sourceIndex\n  }\n\n  private _updateTarget(clientX: number, clientY: number) {\n    let foundId: string | null = null\n    let foundEl: HTMLElement | null = null\n\n    for (const [id, el] of this.droppables) {\n      const r = el.getBoundingClientRect()\n      if (clientX >= r.left && clientX <= r.right && clientY >= r.top && clientY <= r.bottom) {\n        foundId = id\n        foundEl = el\n        break\n      }\n    }\n\n    if (!foundEl || foundId === null) {\n      this._currentDroppableId = null\n      return\n    }\n\n    const items = Array.from(foundEl.querySelectorAll(DRAGGABLE_SEL))\n    const movingDown = clientY >= this._lastClientY\n    const threshold = movingDown ? 0 : 1\n    let insertIndex = items.length\n    for (let i = 0; i < items.length; i++) {\n      const r = items[i].getBoundingClientRect()\n      if (clientY < r.top + r.height * threshold) {\n        insertIndex = i\n        break\n      }\n    }\n\n    this._currentDroppableId = foundId\n    this._currentIndex = insertIndex\n\n    if (!this._placeholder) return\n\n    // Resolve to direct-child of foundEl. When draggable cards are wrapped\n    // in component-boundary spans (display:contents), `items[i]` is the card\n    // element (grandchild of container); `insertBefore(ph, card)` with ph's\n    // new parent = container would throw NotFoundError. Walk up to find the\n    // direct child of foundEl — that's the wrapper span — and use it as the\n    // reference node for placeholder insertion.\n    const refItem = (items[insertIndex] as HTMLElement) || null\n    const refNode = refItem ? _directChildOf(foundEl, refItem) : null\n    if (this._placeholder.parentElement !== foundEl || this._placeholder.nextElementSibling !== refNode) {\n      if (this._placeholder.parentElement) {\n        const ghost = document.createElement('div')\n        ghost.style.height = this._sourceHeight + 'px'\n        ghost.style.marginBottom = this._placeholder.style.marginBottom\n        ghost.style.transition = 'height 0.2s cubic-bezier(0.2, 0, 0, 1)'\n        ghost.style.overflow = 'hidden'\n        this._placeholder.parentElement.insertBefore(ghost, this._placeholder)\n        ghost.offsetHeight\n        ghost.style.height = '0px'\n        ghost.style.marginBottom = '0px'\n        ghost.addEventListener('transitionend', () => ghost.remove(), { once: true })\n        setTimeout(() => ghost.remove(), 250)\n      }\n\n      this._placeholder.style.transition = 'none'\n      this._placeholder.style.height = '0px'\n      foundEl.insertBefore(this._placeholder, refNode)\n      this._placeholder.offsetHeight\n      this._placeholder.style.transition = 'height 0.2s cubic-bezier(0.2, 0, 0, 1)'\n      this._placeholder.style.height = this._sourceHeight + 'px'\n    }\n  }\n\n  private _onKeyDown(e: KeyboardEvent) {\n    if (e.key === 'Escape' && this._dragging) {\n      this._cancelDrag()\n    }\n  }\n\n  private _cancelDrag() {\n    this._removeGlobalListeners()\n    if (!this._started) {\n      this._dragging = false\n      return\n    }\n\n    const result: DragResult = {\n      draggableId: this._draggedId,\n      source: { droppableId: this._sourceDroppableId, index: this._sourceIndex },\n      destination: null,\n    }\n    this._animateReturn().then(() => {\n      this._returnToSource()\n      this._onDragEnd?.(result)\n      this._cleanup()\n    })\n  }\n\n  private _onPointerUp(_e: PointerEvent) {\n    this._removeGlobalListeners()\n\n    if (!this._started) {\n      this._dragging = false\n      return\n    }\n\n    const destination =\n      this._currentDroppableId !== null ? { droppableId: this._currentDroppableId, index: this._currentIndex } : null\n\n    const samePosition =\n      destination && destination.droppableId === this._sourceDroppableId && destination.index === this._sourceIndex\n\n    const result: DragResult = {\n      draggableId: this._draggedId,\n      source: { droppableId: this._sourceDroppableId, index: this._sourceIndex },\n      destination: destination && !samePosition ? destination : null,\n    }\n    if (destination && this._placeholder && !samePosition) {\n      this._animateDrop().then(() => {\n        this._restoreElStyles()\n        // Put the source card back inside its component-boundary wrapper so\n        // the wrapper isn't orphaned after the drop. The keyed-list runtime\n        // handles the cross-list DOM preservation automatically via the\n        // deferred-dispose / rescue-by-key mechanism in `removeEntry` /\n        // `createEntry` — no explicit transfer API needed here.\n        const wrapper = this._sourceWrapper\n        if (this._sourceEl?.parentElement === document.body) {\n          this._sourceEl.remove()\n        }\n        if (wrapper && wrapper !== this._sourceEl && this._sourceEl && !wrapper.contains(this._sourceEl)) {\n          wrapper.appendChild(this._sourceEl)\n        }\n        if (this._placeholder?.parentElement) {\n          this._placeholder.remove()\n        }\n        this._placeholder = null\n        this._onDragEnd?.(result)\n        this._cleanup()\n      })\n    } else {\n      this._animateReturn().then(() => {\n        this._returnToSource()\n        this._onDragEnd?.(result)\n        this._cleanup()\n      })\n    }\n  }\n\n  private _getComponentFromElement(el: HTMLElement | null): any {\n    let current: HTMLElement | null = el\n    while (current) {\n      const comp = (current as any)[GEA_DOM_COMPONENT]\n      if (comp) return comp\n      current = current.parentElement\n    }\n    return null\n  }\n\n  private _restoreElStyles() {\n    if (!this._sourceEl) return\n    this._sourceEl.style.cssText = this._savedCssText\n    this._sourceEl.classList.remove('gea-dnd-clone', 'gea-dragging')\n  }\n\n  private _returnToSource() {\n    if (!this._sourceEl) return\n    this._restoreElStyles()\n    // Return the component-boundary WRAPPER (if any) to the placeholder's\n    // position, then put the source card back inside the wrapper. Without\n    // this step the wrapper span stays empty in the DOM and the card becomes\n    // a direct child of the droppable — breaking the keyed-list's internal\n    // DOM model (entries[i].element's parent would change).\n    const wrapper = this._sourceWrapper || this._sourceEl\n    if (wrapper !== this._sourceEl && !wrapper.contains(this._sourceEl)) {\n      wrapper.appendChild(this._sourceEl)\n    }\n    if (this._placeholder?.parentElement) {\n      this._placeholder.parentElement.insertBefore(wrapper, this._placeholder)\n    } else {\n      const container = this.droppables.get(this._sourceDroppableId)\n      if (container) {\n        const items = Array.from(container.querySelectorAll(DRAGGABLE_SEL))\n        const ref = items[this._sourceIndex] ? _directChildOf(container, items[this._sourceIndex] as HTMLElement) : null\n        container.insertBefore(wrapper, ref)\n      }\n    }\n  }\n\n  private _performTransfer(destination: { droppableId: string; index: number }) {\n    const sourceEl = this._sourceEl\n    if (!sourceEl) return\n\n    const destContainer = this.droppables.get(destination.droppableId)\n    if (!destContainer) return\n\n    const destItems = Array.from(destContainer.querySelectorAll(DRAGGABLE_SEL))\n    const refNode = (destItems[destination.index] as HTMLElement) || null\n    destContainer.insertBefore(sourceEl, refNode)\n\n    const draggedComp = this._getComponentFromElement(sourceEl)\n    if (!draggedComp) return\n\n    const rawDragged = _rawComp(draggedComp)\n    const sourceParent = rawDragged[GEA_PARENT_COMPONENT]\n    if (!sourceParent) return\n\n    const srcArr = this._findCompiledArray(sourceParent, draggedComp)\n    if (!srcArr) return\n\n    const destParent = this._getComponentFromElement(destContainer)\n    if (!destParent) return\n\n    srcArr.arr.splice(srcArr.index, 1)\n    const destArr = destParent[srcArr.key]\n    if (Array.isArray(destArr)) {\n      destArr.splice(destination.index, 0, draggedComp)\n    }\n\n    // Update the parent component pointer on the raw instance (symbol-keyed, not string prop).\n    rawDragged[GEA_PARENT_COMPONENT] = destParent\n  }\n\n  private _findCompiledArray(parent: any, child: any): { key: symbol; arr: any[]; index: number } | null {\n    // Component array lists are stored under geaListItemsSymbol(arrayPropName) symbol keys.\n    // Walk the symbol keys of the parent to find which list contains the child.\n    for (const sym of Object.getOwnPropertySymbols(parent)) {\n      const desc = sym.description ?? ''\n      if (!desc.startsWith('gea.listItems.')) continue\n      const arr = parent[sym]\n      if (!Array.isArray(arr)) continue\n      const idx = arr.indexOf(child)\n      if (idx !== -1) return { key: sym, arr, index: idx }\n    }\n    return null\n  }\n\n  private _animateDrop(): Promise<void> {\n    return new Promise((resolve) => {\n      if (!this._sourceEl || !this._placeholder) return resolve()\n      const phRect = this._placeholder.getBoundingClientRect()\n      this._sourceEl.style.transition =\n        'transform 0.2s cubic-bezier(0.2, 0, 0, 1), rotate 0.2s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.2s cubic-bezier(0.2, 0, 0, 1)'\n      this._sourceEl.style.transform = `translate(${phRect.left}px, ${phRect.top}px)`\n      this._sourceEl.style.rotate = '0deg'\n      this._sourceEl.style.boxShadow = 'none'\n      let done = false\n      const finish = () => {\n        if (done) return\n        done = true\n        resolve()\n      }\n      this._sourceEl.addEventListener('transitionend', finish, { once: true })\n      setTimeout(finish, 250)\n    })\n  }\n\n  private _animateReturn(): Promise<void> {\n    return new Promise((resolve) => {\n      if (!this._sourceEl || !this._sourceRect) return resolve()\n      let targetX = this._sourceRect.left\n      let targetY = this._sourceRect.top\n      if (this._placeholder?.parentElement) {\n        const phRect = this._placeholder.getBoundingClientRect()\n        targetX = phRect.left\n        targetY = phRect.top\n      }\n      this._sourceEl.style.transition =\n        'transform 0.2s cubic-bezier(0.2, 0, 0, 1), rotate 0.2s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.2s cubic-bezier(0.2, 0, 0, 1)'\n      this._sourceEl.style.transform = `translate(${targetX}px, ${targetY}px)`\n      this._sourceEl.style.rotate = '0deg'\n      this._sourceEl.style.boxShadow = 'none'\n      let done = false\n      const finish = () => {\n        if (done) return\n        done = true\n        resolve()\n      }\n      this._sourceEl.addEventListener('transitionend', finish, { once: true })\n      setTimeout(finish, 250)\n    })\n  }\n\n  private _removeGlobalListeners() {\n    document.removeEventListener('pointermove', this._boundMove)\n    document.removeEventListener('pointerup', this._boundUp)\n    document.removeEventListener('keydown', this._boundKeyDown)\n  }\n\n  private _cleanup() {\n    if (this._cleanedUp) return\n    this._cleanedUp = true\n\n    this._placeholder?.remove()\n    this._placeholder = null\n    this._sourceEl = null\n    this._sourceRect = null\n\n    this._dragging = false\n    this._started = false\n    this._draggedId = ''\n    this._currentDroppableId = null\n  }\n\n  destroy() {\n    this._removeGlobalListeners()\n    if (this._dragging) {\n      if (this._sourceEl) this._returnToSource()\n      this._cleanup()\n    }\n    if (this._docListenerAttached && typeof document !== 'undefined') {\n      document.removeEventListener('pointerdown', this._boundDocDown, true)\n      this._docListenerAttached = false\n    }\n    this.droppables.clear()\n    this.onDragEnd = null\n  }\n}\n\nexport const dndManager = new DndManager()\n"],"mappings":"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"}

package/dist/drag-drop-context.d.mts

@@ -4,7 +4,7 @@ import { Component } from "@geajs/core";
 declare class DragDropContext extends Component {
   created(): void;
   dispose(): void;
-  template(props: any): string;
+  template(props: any): any;
 }
 //#endregion
 export { DragDropContext as default };

package/dist/drag-drop-context.mjs

@@ -1,10 +1,15 @@
+import { o as GEA_CREATE_TEMPLATE } from "./bind.mjs";
+import { t as CompiledReactiveComponent } from "./compiled-reactive-component.mjs";
+import { t as reactiveText } from "./reactive-text.mjs";
+import { t as reactiveClassName } from "./reactive-class-name.mjs";
 import { dndManager } from "./dnd-manager.mjs";
-import { Component, GEA_ELEMENT, GEA_INSTANTIATE_CHILD_COMPONENTS, GEA_MOUNT_COMPILED_CHILD_COMPONENTS, GEA_ON_PROP_CHANGE, GEA_PATCH_NODE } from "@geajs/core";
 //#region src/components/drag-drop-context.tsx
-var DragDropContext = class extends Component {
-	static {
-		this.__geaTagName = "drag-drop-context";
-	}
+function _tpl0_create() {
+	const e = document.createElement("div");
+	e.textContent = "0";
+	return e;
+}
+var DragDropContext = class extends CompiledReactiveComponent {
 	created() {
 		dndManager.onDragEnd = (result) => {
 			this.props.onDragEnd?.(result);
@@ -14,34 +19,13 @@ var DragDropContext = class extends Component {
 		dndManager.destroy();
 		super.dispose();
 	}
-	template(props) {
-		return `<div id="${this.id}" class="${`gea-dnd-context ${props.class || ""}`.trim()}">${props.children}</div>`;
-	}
-	[GEA_ON_PROP_CHANGE](key, value) {
-		if (key === "class") {
-			const __el = this[GEA_ELEMENT];
-			this.props;
-			const __boundValue = `gea-dnd-context ${value || ""}`;
-			if (__el) {
-				const __newClass = String(__boundValue ?? "").trim().replace(/\s+/g, " ");
-				if (__el.className !== __newClass) __el.className = __newClass;
-			}
-		}
-		if (key === "children") {
-			const __el = this[GEA_ELEMENT];
-			if (__el) {
-				const __tw = document.createElement("template");
-				__tw.innerHTML = value;
-				const __newEl = __tw.content.firstElementChild;
-				const __existEl = __el.firstElementChild;
-				if (__newEl && __existEl && __tw.content.childNodes.length === 1) this.constructor[GEA_PATCH_NODE](__existEl, __newEl, true);
-				else if (__el.innerHTML !== value) {
-					__el.innerHTML = value;
-					this[GEA_INSTANTIATE_CHILD_COMPONENTS]();
-					if (this.parentComponent) this.parentComponent[GEA_MOUNT_COMPILED_CHILD_COMPONENTS]();
-				}
-			}
-		}
+	[GEA_CREATE_TEMPLATE](d) {
+		const root = _tpl0_create();
+		const el0 = root;
+		const marker1 = root.firstChild;
+		reactiveClassName(el0, d, this, () => `gea-dnd-context ${this.props.class || ""}`);
+		reactiveText(marker1, d, this, () => this.props.children);
+		return root;
 	}
 };
 //#endregion

package/dist/drag-drop-context.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"drag-drop-context.mjs","names":["Component","GEA_ON_PROP_CHANGE","GEA_ELEMENT","GEA_PATCH_NODE","GEA_INSTANTIATE_CHILD_COMPONENTS","GEA_MOUNT_COMPILED_CHILD_COMPONENTS","dndManager","DragResult","DragDropContext","__geaTagName","created","onDragEnd","result","props","dispose","destroy","template","__id","id","class","trim","children","key","value","__el","__boundValue","__newClass","String","replace","className","__tw","document","createElement","innerHTML","__newEl","content","firstElementChild","__existEl","childNodes","length","constructor","parentComponent"],"sources":["../src/components/drag-drop-context.tsx"],"sourcesContent":["import { Component } from '@geajs/core'\nimport { dndManager } from './dnd-manager'\nimport type { DragResult } from './dnd-manager'\n\nexport default class DragDropContext extends Component {\n  created() {\n    dndManager.onDragEnd = (result: DragResult) => {\n      ;(this.props as any).onDragEnd?.(result)\n    }\n  }\n\n  dispose() {\n    dndManager.destroy()\n    super.dispose()\n  }\n\n  template(props: any) {\n    return <div class={`gea-dnd-context ${props.class || ''}`}>{props.children}</div>\n  }\n}\n"],"mappings":";;;AAIA,IAAqBQ,kBAArB,cAA6CR,UAAU;;sBAAA;;CACrDU,UAAU;AACRJ,aAAWK,aAAaC,WAAuB;AAC3C,QAAKC,MAAcF,YAAYC,OAAO;;;CAI5CE,UAAU;AACRR,aAAWS,SAAS;AACpB,QAAMD,SAAS;;CAGjBE,SAASH,OAAY;AACnB,SAAA,YADmB,KAAAK,GACnB,WAAmB,mBAAmBL,MAAMM,SAAS,KAAIC,MAAA,CAAA,IAAGP,MAAMQ,SAAQ;;CAhB9E,CAAApB,oBAAwBqB,KAAKC,OAAK;AAAA,MAAAD,QAAA,SAAA;GAAA,MAAAE,OAAA,KAAAtB;AAeb,QAAAW;GAAA,MAAAY,eACE,mBAAmBF,SAAe;AAAI,OAAAC,MAhB7D;IACM,MAAME,aADXC,OAAOF,gBAAyB,GAAG,CAAEL,MAAM,CAACQ,QAAQ,QAAQ,IACf;AACxC,QAAIJ,KAAsBK,cAAcH,WAAYF,MAAsBK,YAAYH;;;AACvF,MAAAJ,QAAA,YAAA;GAAA,MAAAE,OAAA,KAAAtB;AAAA,OAAAsB,MAHL;IACI,MAAMM,OAAOC,SAASC,cAAc,WAAW;AAC/CF,SAAKG,YAASV;IACd,MAAMW,UAAUJ,KAAKK,QAAQC;IAC7B,MAAMC,YAAYb,KAAsBY;AACxC,QAAIF,WAAWG,aAAaP,KAAKK,QAAQG,WAAWC,WAAW,EAC7D,MAAKC,YAAWrC,gBAAwBkC,WAAWH,SAAS,KAAK;aACxDV,KAAsBS,cAASV,OAA4B;AACpEC,UAAsBS,YAASV;AAC/B,UAAInB,mCAAyB;AAC7B,SAAI,KAAKqC,gBAAiB,MAAKA,gBAAepC,sCAAyB"}
+{"version":3,"file":"drag-drop-context.mjs","names":["GEA_CREATE_TEMPLATE","reactiveClassName","reactiveText","CompiledReactiveComponent","Component","dndManager","DragResult","_tpl0_create","e","document","createElement","textContent","DragDropContext","created","onDragEnd","result","props","dispose","destroy","d","root","el0","marker1","firstChild","class","t1","children"],"sources":["../src/components/drag-drop-context.tsx"],"sourcesContent":["import { Component } from '@geajs/core'\nimport { dndManager } from './dnd-manager'\nimport type { DragResult } from './dnd-manager'\n\nexport default class DragDropContext extends Component {\n  created() {\n    dndManager.onDragEnd = (result: DragResult) => {\n      ;(this.props as any).onDragEnd?.(result)\n    }\n  }\n\n  dispose() {\n    dndManager.destroy()\n    super.dispose()\n  }\n\n  template(props: any) {\n    return <div class={`gea-dnd-context ${props.class || ''}`}>{props.children}</div>\n  }\n}\n"],"mappings":";;;;;;AAIA,SAASO,eAAe;CACtB,MAAMC,IAAIC,SAASC,cAAc,MAAM;AACvCF,GAAEG,cAAc;AAChB,QAAOH;;AAET,IAAqBI,kBAArB,cAA6CT,0BAA0B;CACrEU,UAAU;AACRR,aAAWS,aAAaC,WAAuB;AAE5C,QAAKC,MAAcF,YAAYC,OAAO;;;CAG3CE,UAAU;AACRZ,aAAWa,SAAS;AACpB,QAAMD,SAAS;;CAEjB,CAACjB,qBAAqBmB,GAAG;EACvB,MAAMC,OAAOb,cAAc;EAC3B,MAAMc,MAAMD;EACZ,MAAME,UAAUF,KAAKG;AACrBtB,oBAAkBoB,KAAKF,GAAG,YAAY,mBAAmB,KAAKH,MAAMQ,SAAS,KAAK;AAElFtB,eAAauB,SAAIN,GAAG,YAAY,KAAKH,MAAMU,SAAS;AACpD,SAAON"}

package/dist/draggable.d.mts

@@ -4,7 +4,7 @@ import { Component } from "@geajs/core";
 declare class Draggable extends Component {
   _didDrag: boolean;
   _onPointerDown(e: PointerEvent): void;
-  template(props: any): string;
+  template(props: any): any;
 }
 //#endregion
 export { Draggable as default };

package/dist/draggable.mjs

@@ -1,92 +1,3 @@
-import { dndManager } from "./dnd-manager.mjs";
-import { Component, GEA_ELEMENT, GEA_INSTANTIATE_CHILD_COMPONENTS, GEA_MOUNT_COMPILED_CHILD_COMPONENTS, GEA_ON_PROP_CHANGE, GEA_PATCH_NODE } from "@geajs/core";
-//#region src/components/draggable.tsx
-var Draggable = class extends Component {
-	constructor(..._args) {
-		super(..._args);
-		this._didDrag = false;
-	}
-	static {
-		this.__geaTagName = "gea-draggable";
-	}
-	_onPointerDown(e) {
-		const el = e.currentTarget.closest(".gea-draggable");
-		if (!el) return;
-		this._didDrag = false;
-		dndManager.startTracking(e, this.props.draggableId, el);
-	}
-	template(props) {
-		return `<div id="${this.id}" class="${`gea-draggable ${props.class || ""}`.trim()}"${props.draggableId == null || props.draggableId === false ? "" : ` data-draggable-id="${props.draggableId}"`}${props.index == null || props.index === false ? "" : ` data-index="${props.index}"`}>${props.children}</div>`;
-	}
-	get events() {
-		if (this.__evts && this[GEA_ELEMENT]) return this.__evts;
-		const __id = this.id;
-		const __geaEvtsResult = {
-			pointerdown: { [`#${__id}`]: this.__event_pointerdown_0 },
-			click: { [`#${__id}`]: this.__event_click_1 }
-		};
-		if (this[GEA_ELEMENT]) this.__evts = __geaEvtsResult;
-		return __geaEvtsResult;
-	}
-	__event_pointerdown_0(e, targetComponent) {
-		this._onPointerDown(e);
-	}
-	__event_click_1(e, targetComponent) {
-		if (dndManager.isDragging) {
-			e.preventDefault();
-			e.stopPropagation();
-		}
-	}
-	[GEA_ON_PROP_CHANGE](key, value) {
-		if (key === "class") {
-			const __el = this[GEA_ELEMENT];
-			this.props;
-			const __boundValue = `gea-draggable ${value || ""}`;
-			if (__el) {
-				const __newClass = String(__boundValue ?? "").trim().replace(/\s+/g, " ");
-				if (__el.className !== __newClass) __el.className = __newClass;
-			}
-		}
-		if (key === "draggableId") {
-			const __el = this[GEA_ELEMENT];
-			if (__el) {
-				var __av = value;
-				if (__av == null || __av === false) __el.removeAttribute("data-draggable-id");
-				else {
-					const __newAttr = String(__av);
-					if (__el.getAttribute("data-draggable-id") !== __newAttr) __el.setAttribute("data-draggable-id", __newAttr);
-				}
-			}
-		}
-		if (key === "index") {
-			const __el = this[GEA_ELEMENT];
-			if (__el) {
-				var __av = value;
-				if (__av == null || __av === false) __el.removeAttribute("data-index");
-				else {
-					const __newAttr = String(__av);
-					if (__el.getAttribute("data-index") !== __newAttr) __el.setAttribute("data-index", __newAttr);
-				}
-			}
-		}
-		if (key === "children") {
-			const __el = this[GEA_ELEMENT];
-			if (__el) {
-				const __tw = document.createElement("template");
-				__tw.innerHTML = value;
-				const __newEl = __tw.content.firstElementChild;
-				const __existEl = __el.firstElementChild;
-				if (__newEl && __existEl && __tw.content.childNodes.length === 1) this.constructor[GEA_PATCH_NODE](__existEl, __newEl, true);
-				else if (__el.innerHTML !== value) {
-					__el.innerHTML = value;
-					this[GEA_INSTANTIATE_CHILD_COMPONENTS]();
-					if (this.parentComponent) this.parentComponent[GEA_MOUNT_COMPILED_CHILD_COMPONENTS]();
-				}
-			}
-		}
-	}
-};
-//#endregion
+import { t as Draggable } from "./draggable2.mjs";
+import "./dnd-manager.mjs";
 export { Draggable as default };
-
-//# sourceMappingURL=draggable.mjs.map