@geajs/ui 0.2.3 → 0.2.9

package/dist/draggable2.mjs

@@ -0,0 +1,321 @@
+import { n as createDisposer } from "./disposer.mjs";
+import { c as GEA_ELEMENT, n as trackRead, o as GEA_CREATE_TEMPLATE, s as GEA_DOM_COMPONENT, u as GEA_PROXY_RAW } from "./bind.mjs";
+import { i as GEA_SET_PROPS, n as GEA_DISPOSER, r as GEA_OBSERVE_DIRECT } from "./internal-symbols.mjs";
+import { n as _DIRTY_PROPS, t as _DIRTY } from "./dirty-symbols.mjs";
+import { t as reactiveText } from "./reactive-text.mjs";
+import { t as reactiveAttr } from "./reactive-attr.mjs";
+import { t as reactiveClassName } from "./reactive-class-name.mjs";
+import { t as delegateEvent } from "./delegate-event.mjs";
+import { dndManager } from "./dnd-manager.mjs";
+//#region ../gea/src/runtime/compiled-lean-store.ts
+const _priv = /* @__PURE__ */ new WeakMap();
+const _nested = /* @__PURE__ */ new WeakMap();
+const _isArr = Array.isArray;
+function _plain(v) {
+	if (!v || typeof v !== "object") return false;
+	const p = Object.getPrototypeOf(v);
+	return p === Object.prototype || p === null || _isArr(v);
+}
+function _raw(v) {
+	return v && v[GEA_PROXY_RAW] || v;
+}
+function _flush(state) {
+	state.scheduled = false;
+	const pending = state.pending;
+	if (!pending || pending.size === 0) return;
+	state.pending = void 0;
+	let all = null;
+	for (const [prop, changes] of pending) {
+		if (state.derived) {
+			all ??= [];
+			for (let i = 0; i < changes.length; i++) all.push(changes[i]);
+		}
+		const bucket = state.observers?.get(prop);
+		if (bucket) for (const h of bucket) h(state.proxy[prop], changes);
+	}
+	if (all && state.derived) for (const [prop, bucket] of state.derived) {
+		let value;
+		try {
+			value = state.proxy[prop];
+		} catch {
+			continue;
+		}
+		for (const h of bucket) h(value, all);
+	}
+}
+function _queue(state, prop, change = {}) {
+	if (!state.ready) return;
+	if (!state.observers?.has(prop) && !state.derived) return;
+	const rec = {
+		prop,
+		pathParts: [prop],
+		type: "update",
+		target: state.proxy,
+		...change
+	};
+	const pending = state.pending ?? (state.pending = /* @__PURE__ */ new Map());
+	const arr = pending.get(prop);
+	if (arr) arr.push(rec);
+	else pending.set(prop, [rec]);
+	if (!state.scheduled) {
+		state.scheduled = true;
+		queueMicrotask(() => _flush(state));
+	}
+}
+function _wrap(state, target, rootProp) {
+	if (!_plain(target)) return target;
+	const cached = _nested.get(target);
+	if (cached) return cached;
+	const proxy = new Proxy(target, {
+		get(obj, prop) {
+			if (prop === GEA_PROXY_RAW) return obj;
+			if (typeof prop === "symbol") return obj[prop];
+			const value = obj[prop];
+			if (_isArr(obj) && typeof value === "function") {
+				if (prop === "push") return (...items) => {
+					const start = obj.length;
+					const result = Array.prototype.push.apply(obj, items.map(_raw));
+					if (obj.length > start) _queue(state, rootProp, {
+						type: "append",
+						start,
+						count: obj.length - start
+					});
+					return result;
+				};
+			}
+			return _plain(value) ? _wrap(state, value, rootProp) : value;
+		},
+		set(obj, prop, value) {
+			if (typeof prop === "symbol") {
+				obj[prop] = value;
+				return true;
+			}
+			value = _raw(value);
+			const old = obj[prop];
+			if (old === value) return true;
+			obj[prop] = value;
+			if (_isArr(obj)) {
+				if (value && typeof value === "object") value[_DIRTY] = true;
+				const idx = +prop;
+				if (Number.isInteger(idx)) {
+					_queue(state, rootProp, {
+						aipu: true,
+						arix: idx,
+						previousValue: old,
+						newValue: value
+					});
+					return true;
+				}
+			} else {
+				obj[_DIRTY] = true;
+				(obj[_DIRTY_PROPS] ??= /* @__PURE__ */ new Set()).add(prop);
+			}
+			_queue(state, rootProp, {
+				previousValue: old,
+				newValue: value
+			});
+			return true;
+		}
+	});
+	_nested.set(target, proxy);
+	return proxy;
+}
+function createLeanProxy(raw) {
+	const state = {};
+	_priv.set(raw, state);
+	const proxy = new Proxy(raw, {
+		get(target, prop, receiver) {
+			if (prop === GEA_PROXY_RAW) return target;
+			if (typeof prop === "symbol") return target[prop];
+			trackRead(receiver ?? target, prop);
+			const value = target[prop];
+			if (typeof value === "function") return value.bind(receiver);
+			return _plain(value) ? _wrap(state, value, prop) : value;
+		},
+		set(target, prop, value) {
+			if (typeof prop === "symbol") {
+				target[prop] = value;
+				return true;
+			}
+			value = _raw(value);
+			if (_isArr(value)) value = value.map(_raw);
+			const old = target[prop];
+			if (old === value && prop in target) return true;
+			if (old && typeof old === "object") _nested.delete(old);
+			target[prop] = value;
+			const direct = state.direct?.get(prop);
+			if (direct) for (const h of direct) h(value);
+			_queue(state, prop, {
+				previousValue: old,
+				newValue: value
+			});
+			return true;
+		}
+	});
+	state.proxy = proxy;
+	_priv.set(proxy, state);
+	return proxy;
+}
+function leanObserve(self, pathOrProp, handler) {
+	const state = _priv.get(self);
+	if (!state) return () => {};
+	state.ready = true;
+	const isArr = Array.isArray(pathOrProp);
+	const prop = isArr ? pathOrProp[0] : pathOrProp;
+	if (!prop) return () => {};
+	const tail = isArr && pathOrProp.length > 1 ? pathOrProp.slice(1) : null;
+	const finalHandler = tail ? (value, changes) => {
+		let next = value;
+		for (let i = 0; i < tail.length; i++) {
+			if (next == null) return;
+			next = next[tail[i]];
+		}
+		handler(next, changes);
+	} : handler;
+	const target = Object.prototype.hasOwnProperty.call(_raw(self), prop) ? state.observers ?? (state.observers = /* @__PURE__ */ new Map()) : state.derived ?? (state.derived = /* @__PURE__ */ new Map());
+	let bucket = target.get(prop);
+	if (!bucket) target.set(prop, bucket = /* @__PURE__ */ new Set());
+	bucket.add(finalHandler);
+	return () => bucket.delete(finalHandler);
+}
+function leanObserveDirect(self, prop, handler) {
+	const state = _priv.get(self);
+	if (!state) return () => {};
+	state.ready = true;
+	const direct = state.direct ?? (state.direct = /* @__PURE__ */ new Map());
+	let bucket = direct.get(prop);
+	if (!bucket) direct.set(prop, bucket = /* @__PURE__ */ new Set());
+	bucket.add(handler);
+	return () => bucket.delete(handler);
+}
+//#endregion
+//#region ../gea/src/runtime/compiled-tiny-reactive-component.ts
+const GEA_COMPONENT_ID = Symbol();
+let nextComponentId = 0;
+var CompiledTinyReactiveComponent = class {
+	constructor() {
+		this.rendered = false;
+		this.props = {};
+		this[GEA_ELEMENT] = null;
+		this[GEA_DISPOSER] = createDisposer();
+		return createLeanProxy(this);
+	}
+	get id() {
+		return this[GEA_COMPONENT_ID] ??= "_" + nextComponentId++;
+	}
+	set id(value) {
+		this[GEA_COMPONENT_ID] = value;
+	}
+	get el() {
+		return this[GEA_ELEMENT] ?? null;
+	}
+	[GEA_SET_PROPS](thunks) {
+		const out = {};
+		for (const k in thunks) Object.defineProperty(out, k, {
+			enumerable: true,
+			get: () => thunks[k]()
+		});
+		this.props = out;
+	}
+	render(parent, _index) {
+		const node = this[GEA_CREATE_TEMPLATE](this[GEA_DISPOSER]);
+		parent.appendChild(node);
+		if (node.nodeType === 11) this[GEA_ELEMENT] = parent.lastElementChild ?? null;
+		else if (node.nodeType === 1) this[GEA_ELEMENT] = node;
+		if (this[GEA_ELEMENT]) this[GEA_ELEMENT][GEA_DOM_COMPONENT] = this;
+		this.rendered = true;
+	}
+	observe(pathOrProp, handler) {
+		return leanObserve(this, pathOrProp, handler);
+	}
+	[GEA_OBSERVE_DIRECT](prop, handler) {
+		return leanObserveDirect(this, prop, handler);
+	}
+	dispose() {
+		this[GEA_DISPOSER].dispose();
+		this[GEA_ELEMENT]?.remove();
+		this[GEA_ELEMENT] = null;
+	}
+	$(sel) {
+		return this[GEA_ELEMENT]?.querySelector(sel) ?? null;
+	}
+	$$(sel) {
+		return Array.from(this[GEA_ELEMENT]?.querySelectorAll(sel) ?? []);
+	}
+	created(_props) {}
+	onAfterRender() {}
+};
+//#endregion
+//#region ../gea/src/runtime/delegate-click.ts
+function ensureClickDelegate(root) {
+	const rt = typeof document !== "undefined" ? document : root.ownerDocument;
+	if (!rt.__gdc) {
+		rt.__gdc = 1;
+		rt.addEventListener("click", (e) => {
+			for (let n = e.target; n && n !== rt; n = n.parentNode) {
+				const h = n.__gc;
+				if (h !== void 0) {
+					h(e);
+					return;
+				}
+			}
+		});
+	}
+}
+function delegateClick(root, pairs, _disposer) {
+	ensureClickDelegate(root);
+	for (let i = 0; i < pairs.length; i++) {
+		const el = pairs[i][0];
+		if (el) el.__gc = pairs[i][1];
+	}
+}
+//#endregion
+//#region src/components/draggable.tsx
+function _tpl0_create() {
+	const e = document.createElement("div");
+	e.textContent = "0";
+	return e;
+}
+var Draggable = class extends CompiledTinyReactiveComponent {
+	constructor(..._args) {
+		super(..._args);
+		this._didDrag = false;
+	}
+	_onPointerDown(e) {
+		const el = e.target.closest(".gea-draggable");
+		if (!el) return;
+		this._didDrag = false;
+		dndManager.startTracking(e, this.props.draggableId, el);
+	}
+	[GEA_CREATE_TEMPLATE](d) {
+		const root = _tpl0_create();
+		const el0 = root;
+		const el1 = el0;
+		const el2 = el0;
+		const evt3 = el0;
+		const evt4 = el0;
+		const marker5 = root.firstChild;
+		reactiveClassName(el0, d, this, () => `gea-draggable ${this.props.class || ""}`);
+		reactiveAttr(el1, d, this, "data-draggable-id", () => this.props.draggableId);
+		reactiveAttr(el2, d, this, "data-index", () => this.props.index);
+		const h3 = (e) => this._onPointerDown(e);
+		const h4 = (e) => {
+			if (dndManager.isDragging) {
+				e.preventDefault();
+				e.stopPropagation();
+			}
+		};
+		reactiveText(marker5, d, this, () => this.props.children);
+		delegateEvent(root, "pointerdown", [[evt3, h3]], d);
+		delegateClick(root, [[
+			evt4,
+			h4,
+			false
+		]]);
+		return root;
+	}
+};
+//#endregion
+export { Draggable as t };
+
+//# sourceMappingURL=draggable2.mjs.map

package/dist/draggable2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"draggable2.mjs","names":["GEA_DIRTY","GEA_DIRTY_PROPS","GEA_CREATE_TEMPLATE","reactiveClassName","reactiveAttr","reactiveText","delegateEvent","delegateClick","CompiledTinyReactiveComponent","Component","dndManager","_tpl0_create","e","document","createElement","textContent","Draggable","_didDrag","_onPointerDown","PointerEvent","el","target","HTMLElement","closest","startTracking","props","draggableId","d","root","el0","el1","el2","evt3","evt4","marker5","firstChild","class","index","h3","h4","MouseEvent","isDragging","preventDefault","stopPropagation","t5","children"],"sources":["../../gea/src/runtime/compiled-lean-store.ts","../../gea/src/runtime/compiled-tiny-reactive-component.ts","../../gea/src/runtime/delegate-click.ts","../src/components/draggable.tsx"],"sourcesContent":["import { GEA_PROXY_RAW } from './symbols'\nimport { GEA_OBSERVE_DIRECT } from './internal-symbols'\nimport { GEA_DIRTY, GEA_DIRTY_PROPS } from './dirty-symbols'\nimport { trackRead } from './with-tracking'\n\ntype Handler = (value: any, changes?: any[]) => void\n\ninterface LeanState {\n  observers?: Map<string, Set<Handler>>\n  derived?: Map<string, Set<Handler>>\n  direct?: Map<string, Set<(value: any) => void>>\n  pending?: Map<string, any[]>\n  scheduled?: boolean\n  ready?: boolean\n  proxy?: any\n}\n\nconst _priv = new WeakMap<any, LeanState>()\nconst _nested = new WeakMap<object, any>()\nconst _isArr = Array.isArray\n\nfunction _plain(v: any): boolean {\n  if (!v || typeof v !== 'object') return false\n  const p = Object.getPrototypeOf(v)\n  return p === Object.prototype || p === null || _isArr(v)\n}\n\nfunction _raw(v: any): any {\n  return (v && v[GEA_PROXY_RAW]) || v\n}\n\nfunction _flush(state: LeanState): void {\n  state.scheduled = false\n  const pending = state.pending\n  if (!pending || pending.size === 0) return\n  state.pending = undefined\n  let all: any[] | null = null\n  for (const [prop, changes] of pending) {\n    if (state.derived) {\n      all ??= []\n      for (let i = 0; i < changes.length; i++) all.push(changes[i])\n    }\n    const bucket = state.observers?.get(prop)\n    if (bucket) for (const h of bucket) h(state.proxy[prop], changes)\n  }\n  if (all && state.derived) {\n    for (const [prop, bucket] of state.derived) {\n      let value\n      try {\n        value = state.proxy[prop]\n      } catch {\n        continue\n      }\n      for (const h of bucket) h(value, all)\n    }\n  }\n}\n\nfunction _queue(state: LeanState, prop: string, change: any = {}): void {\n  if (!state.ready) return\n  if (!state.observers?.has(prop) && !state.derived) return\n  const rec = { prop, pathParts: [prop], type: 'update', target: state.proxy, ...change }\n  const pending = state.pending ?? (state.pending = new Map())\n  const arr = pending.get(prop)\n  if (arr) arr.push(rec)\n  else pending.set(prop, [rec])\n  if (!state.scheduled) {\n    state.scheduled = true\n    queueMicrotask(() => _flush(state))\n  }\n}\n\nfunction _wrap(state: LeanState, target: any, rootProp: string): any {\n  if (!_plain(target)) return target\n  const cached = _nested.get(target)\n  if (cached) return cached\n  const proxy = new Proxy(target, {\n    get(obj, prop) {\n      if (prop === GEA_PROXY_RAW) return obj\n      if (typeof prop === 'symbol') return obj[prop as any]\n      const value = obj[prop as any]\n      if (_isArr(obj) && typeof value === 'function') {\n        if (prop === 'push') {\n          return (...items: any[]) => {\n            const start = obj.length\n            const result = Array.prototype.push.apply(obj, items.map(_raw))\n            if (obj.length > start) _queue(state, rootProp, { type: 'append', start, count: obj.length - start })\n            return result\n          }\n        }\n      }\n      return _plain(value) ? _wrap(state, value, rootProp) : value\n    },\n    set(obj, prop, value) {\n      if (typeof prop === 'symbol') {\n        obj[prop as any] = value\n        return true\n      }\n      value = _raw(value)\n      const old = obj[prop as any]\n      if (old === value) return true\n      obj[prop as any] = value\n      if (_isArr(obj)) {\n        if (value && typeof value === 'object') value[GEA_DIRTY] = true\n        const idx = +prop\n        if (Number.isInteger(idx)) {\n          _queue(state, rootProp, { aipu: true, arix: idx, previousValue: old, newValue: value })\n          return true\n        }\n      } else {\n        obj[GEA_DIRTY] = true\n        ;(obj[GEA_DIRTY_PROPS] ??= new Set()).add(prop)\n      }\n      _queue(state, rootProp, { previousValue: old, newValue: value })\n      return true\n    },\n  })\n  _nested.set(target, proxy)\n  return proxy\n}\n\nexport function createLeanProxy<T extends object>(raw: T): T {\n  const state: LeanState = {}\n  _priv.set(raw, state)\n  const proxy = new Proxy(raw, {\n    get(target, prop, receiver) {\n      if (prop === GEA_PROXY_RAW) return target\n      if (typeof prop === 'symbol') return (target as any)[prop]\n      trackRead(receiver ?? target, prop)\n      const value = (target as any)[prop]\n      if (typeof value === 'function') return value.bind(receiver)\n      return _plain(value) ? _wrap(state, value, prop) : value\n    },\n    set(target, prop, value) {\n      if (typeof prop === 'symbol') {\n        ;(target as any)[prop] = value\n        return true\n      }\n      value = _raw(value)\n      if (_isArr(value)) value = value.map(_raw)\n      const old = (target as any)[prop]\n      if (old === value && prop in target) return true\n      if (old && typeof old === 'object') _nested.delete(old)\n      ;(target as any)[prop] = value\n      const direct = state.direct?.get(prop)\n      if (direct) for (const h of direct) h(value)\n      _queue(state, prop, { previousValue: old, newValue: value })\n      return true\n    },\n  })\n  state.proxy = proxy\n  _priv.set(proxy, state)\n  return proxy as T\n}\n\nexport function leanObserve(self: any, pathOrProp: string | readonly string[], handler: Handler): () => void {\n  const state = _priv.get(self)\n  if (!state) return () => {}\n  state.ready = true\n  const isArr = Array.isArray(pathOrProp)\n  const prop = isArr ? pathOrProp[0] : pathOrProp\n  if (!prop) return () => {}\n  const tail = isArr && pathOrProp.length > 1 ? pathOrProp.slice(1) : null\n  const finalHandler: Handler = tail\n    ? (value, changes) => {\n        let next = value\n        for (let i = 0; i < tail.length; i++) {\n          if (next == null) return\n          next = next[tail[i]]\n        }\n        handler(next, changes)\n      }\n    : handler\n  const target = Object.prototype.hasOwnProperty.call(_raw(self), prop)\n    ? (state.observers ?? (state.observers = new Map()))\n    : (state.derived ?? (state.derived = new Map()))\n  let bucket = target.get(prop)\n  if (!bucket) target.set(prop, (bucket = new Set()))\n  bucket.add(finalHandler)\n  return () => bucket!.delete(finalHandler)\n}\n\nexport function leanObserveDirect(self: any, prop: string, handler: (value: any) => void): () => void {\n  const state = _priv.get(self)\n  if (!state) return () => {}\n  state.ready = true\n  const direct = state.direct ?? (state.direct = new Map())\n  let bucket = direct.get(prop)\n  if (!bucket) direct.set(prop, (bucket = new Set()))\n  bucket.add(handler)\n  return () => bucket!.delete(handler)\n}\n\nexport class CompiledLeanStore {\n  constructor() {\n    return createLeanProxy(this)\n  }\n\n  observe(pathOrProp: string | readonly string[], handler: Handler): () => void {\n    return leanObserve(this, pathOrProp, handler)\n  }\n\n  [GEA_OBSERVE_DIRECT](prop: string, handler: (value: any) => void): () => void {\n    return leanObserveDirect(this, prop, handler)\n  }\n}\n\nexport default CompiledLeanStore\n","import { GEA_CREATE_TEMPLATE, GEA_DOM_COMPONENT, GEA_ELEMENT } from './symbols'\nimport { GEA_DISPOSER, GEA_OBSERVE_DIRECT, GEA_SET_PROPS } from './internal-symbols'\nimport { createDisposer, type Disposer } from './disposer'\nimport { createLeanProxy, leanObserve, leanObserveDirect } from './compiled-lean-store'\n\ntype Handler = (value: any, changes?: any[]) => void\ntype PropThunks = Record<string, () => any>\nconst GEA_COMPONENT_ID = Symbol()\nlet nextComponentId = 0\n\nexport class CompiledTinyReactiveComponent<P extends Record<string, any> = Record<string, any>> {\n  rendered = false\n  props: P = {} as P;\n  [GEA_ELEMENT] = null as HTMLElement | null;\n  [GEA_DISPOSER] = createDisposer() as Disposer\n\n  constructor() {\n    return createLeanProxy(this)\n  }\n\n  get id(): string {\n    return ((this as any)[GEA_COMPONENT_ID] ??= '_' + nextComponentId++)\n  }\n\n  set id(value: string) {\n    ;(this as any)[GEA_COMPONENT_ID] = value\n  }\n\n  get el(): HTMLElement | null {\n    return this[GEA_ELEMENT] ?? null\n  }\n\n  [GEA_SET_PROPS](thunks: PropThunks): void {\n    const out: Record<string, any> = {}\n    for (const k in thunks) {\n      Object.defineProperty(out, k, {\n        enumerable: true,\n        get: () => thunks[k](),\n      })\n    }\n    this.props = out as P\n  }\n\n  render(parent: Node, _index?: number): void {\n    const node = this[GEA_CREATE_TEMPLATE](this[GEA_DISPOSER])\n    parent.appendChild(node)\n    if (node.nodeType === 11) this[GEA_ELEMENT] = ((parent as Element).lastElementChild as HTMLElement | null) ?? null\n    else if (node.nodeType === 1) this[GEA_ELEMENT] = node as HTMLElement\n    if (this[GEA_ELEMENT]) (this[GEA_ELEMENT] as any)[GEA_DOM_COMPONENT] = this\n    this.rendered = true\n  }\n\n  observe(pathOrProp: string | readonly string[], handler: Handler): () => void {\n    return leanObserve(this, pathOrProp, handler)\n  }\n\n  [GEA_OBSERVE_DIRECT](prop: string, handler: (value: any) => void): () => void {\n    return leanObserveDirect(this, prop, handler)\n  }\n\n  dispose(): void {\n    this[GEA_DISPOSER].dispose()\n    this[GEA_ELEMENT]?.remove()\n    this[GEA_ELEMENT] = null\n  }\n\n  $(sel: string): Element | null {\n    return this[GEA_ELEMENT]?.querySelector(sel) ?? null\n  }\n\n  $$(sel: string): Element[] {\n    return Array.from(this[GEA_ELEMENT]?.querySelectorAll(sel) ?? [])\n  }\n\n  created(_props?: P): void {\n    /* no-op */\n  }\n\n  onAfterRender(): void {\n    /* no-op */\n  }\n}\n\nexport default CompiledTinyReactiveComponent\n","import type { Disposer } from './disposer'\n\ntype Handler = (e: Event) => void\ntype HandlerPair = [Element, Handler]\n\nexport function ensureClickDelegate(root: Element): void {\n  const rt: any = typeof document !== 'undefined' ? document : root.ownerDocument\n  if (!rt.__gdc) {\n    rt.__gdc = 1\n    rt.addEventListener('click', (e: Event) => {\n      for (let n: Node | null = e.target as Node | null; n && n !== rt; n = n.parentNode) {\n        const h = (n as any).__gc as Handler | undefined\n        if (h !== undefined) {\n          h(e)\n          return\n        }\n      }\n    })\n  }\n}\n\nexport function delegateClick(root: Element, pairs: HandlerPair[], _disposer?: Disposer): void {\n  ensureClickDelegate(root)\n  for (let i = 0; i < pairs.length; i++) {\n    const el = pairs[i][0]\n    if (el) (el as any).__gc = pairs[i][1]\n  }\n}\n","import { Component } from '@geajs/core'\nimport { dndManager } from './dnd-manager'\n\nexport default class Draggable extends Component {\n  _didDrag = false\n\n  _onPointerDown(e: PointerEvent) {\n    const el = (e.target as HTMLElement).closest('.gea-draggable') as HTMLElement\n    if (!el) return\n    this._didDrag = false\n    dndManager.startTracking(e, this.props.draggableId as string, el)\n  }\n\n  template(props: any) {\n    return (\n      <div\n        class={`gea-draggable ${props.class || ''}`}\n        data-draggable-id={props.draggableId}\n        data-index={props.index}\n        pointerdown={(e: PointerEvent) => this._onPointerDown(e)}\n        click={(e: MouseEvent) => {\n          if (dndManager.isDragging) {\n            e.preventDefault()\n            e.stopPropagation()\n          }\n        }}\n      >\n        {props.children}\n      </div>\n    )\n  }\n}\n"],"mappings":"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"}

package/dist/droppable.d.mts

@@ -7,7 +7,7 @@ declare class Droppable extends Component {
   created(): void;
   onAfterRender(): void;
   dispose(): void;
-  template(props: any): string;
+  template(props: any): any;
 }
 //#endregion
 export { Droppable as default };

package/dist/droppable.mjs

@@ -1,14 +1,20 @@
+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 reactiveAttr } from "./reactive-attr.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/droppable.tsx
-var Droppable = class extends Component {
+function _tpl0_create() {
+	const e = document.createElement("div");
+	e.textContent = "0";
+	return e;
+}
+var Droppable = class extends CompiledReactiveComponent {
 	constructor(..._args) {
 		super(..._args);
 		this._registered = false;
 	}
-	static {
-		this.__geaTagName = "gea-droppable";
-	}
 	_registerWithManager() {
 		const el = this.el?.querySelector("[data-droppable-id]");
 		if (el && !this._registered) {
@@ -29,45 +35,15 @@ var Droppable = class extends Component {
 		}
 		super.dispose();
 	}
-	template(props) {
-		return `<div id="${this.id}" class="${`gea-droppable ${props.class || ""}`.trim()}"${props.droppableId == null || props.droppableId === false ? "" : ` data-droppable-id="${props.droppableId}"`}>${props.children}</div>`;
-	}
-	[GEA_ON_PROP_CHANGE](key, value) {
-		if (key === "class") {
-			const __el = this[GEA_ELEMENT];
-			this.props;
-			const __boundValue = `gea-droppable ${value || ""}`;
-			if (__el) {
-				const __newClass = String(__boundValue ?? "").trim().replace(/\s+/g, " ");
-				if (__el.className !== __newClass) __el.className = __newClass;
-			}
-		}
-		if (key === "droppableId") {
-			const __el = this[GEA_ELEMENT];
-			if (__el) {
-				var __av = value;
-				if (__av == null || __av === false) __el.removeAttribute("data-droppable-id");
-				else {
-					const __newAttr = String(__av);
-					if (__el.getAttribute("data-droppable-id") !== __newAttr) __el.setAttribute("data-droppable-id", __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]();
-				}
-			}
-		}
+	[GEA_CREATE_TEMPLATE](d) {
+		const root = _tpl0_create();
+		const el0 = root;
+		const el1 = el0;
+		const marker2 = root.firstChild;
+		reactiveClassName(el0, d, this, () => `gea-droppable ${this.props.class || ""}`);
+		reactiveAttr(el1, d, this, "data-droppable-id", () => this.props.droppableId);
+		reactiveText(marker2, d, this, () => this.props.children);
+		return root;
 	}
 };
 //#endregion

package/dist/droppable.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"droppable.mjs","names":["Component","GEA_ON_PROP_CHANGE","GEA_ELEMENT","GEA_PATCH_NODE","GEA_INSTANTIATE_CHILD_COMPONENTS","GEA_MOUNT_COMPILED_CHILD_COMPONENTS","dndManager","Droppable","__geaTagName","_registered","_registerWithManager","el","querySelector","HTMLElement","registerDroppable","props","droppableId","created","queueMicrotask","onAfterRender","dispose","unregisterDroppable","template","__id","id","class","trim","children","key","value","__el","__boundValue","__newClass","String","replace","className","__av","removeAttribute","__newAttr","getAttribute","setAttribute","__tw","document","createElement","innerHTML","__newEl","content","firstElementChild","__existEl","childNodes","length","constructor","parentComponent"],"sources":["../src/components/droppable.tsx"],"sourcesContent":["import { Component } from '@geajs/core'\nimport { dndManager } from './dnd-manager'\n\nexport default class Droppable extends Component {\n  private _registered = false\n\n  _registerWithManager() {\n    const el = this.el?.querySelector('[data-droppable-id]') as HTMLElement\n    if (el && !this._registered) {\n      dndManager.registerDroppable(this.props.droppableId as string, el)\n      this._registered = true\n    }\n  }\n\n  created() {\n    queueMicrotask(() => this._registerWithManager())\n  }\n\n  onAfterRender() {\n    this._registerWithManager()\n  }\n\n  dispose() {\n    if (this._registered) {\n      dndManager.unregisterDroppable(this.props.droppableId as string)\n      this._registered = false\n    }\n    super.dispose()\n  }\n\n  template(props: any) {\n    return (\n      <div class={`gea-droppable ${props.class || ''}`} data-droppable-id={props.droppableId}>\n        {props.children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;AAGA,IAAqBO,YAArB,cAAuCP,UAAU;;;qBACzB;;;sBADyB;;CAG/CU,uBAAuB;EACrB,MAAMC,KAAK,KAAKA,IAAIC,cAAc,sBAAsB;AACxD,MAAID,MAAM,CAAC,KAAKF,aAAa;AAC3BH,cAAWQ,kBAAkB,KAAKC,MAAMC,aAAuBL,GAAG;AAClE,QAAKF,cAAc;;;CAIvBQ,UAAU;AACRC,uBAAqB,KAAKR,sBAAsB,CAAC;;CAGnDS,gBAAgB;AACd,OAAKT,sBAAsB;;CAG7BU,UAAU;AACR,MAAI,KAAKX,aAAa;AACpBH,cAAWe,oBAAoB,KAAKN,MAAMC,YAAsB;AAChE,QAAKP,cAAc;;AAErB,QAAMW,SAAS;;CAGjBE,SAASP,OAAY;AACnB,SAAA,YADmB,KAAAS,GACnB,WACc,iBAAiBT,MAAMU,SAAS,KAAIC,MAAA,CAAA,GAAqBX,MAAMC,eAAW,QAAjBD,MAAMC,gBAAW,QAAA,KAAA,uBAAjBD,MAAMC,YAAW,GAAA,GACnFD,MAAMY,SAAQ;;CAhCvB,CAAA1B,oBAAwB2B,KAAKC,OAAK;AAAA,MAAAD,QAAA,SAAA;GAAA,MAAAE,OAAA,KAAA5B;AA6Bb,QAAAa;GAAA,MAAAgB,eAEH,iBAAiBF,SAAe;AAAI,OAAAC,MA/BtD;IACM,MAAME,aADXC,OAAOF,gBAAyB,GAAG,CAAEL,MAAM,CAACQ,QAAQ,QAAQ,IACf;AACxC,QAAIJ,KAAsBK,cAAcH,WAAYF,MAAsBK,YAAYH;;;AACvF,MAAAJ,QAAA,eAAA;GAAA,MAAAE,OAAA,KAAA5B;AAAA,OAAA4B,MAAA;IAFC,IAAIM,OAAIP;AACR,QAAIO,QAAQ,QAAQA,SAAS,MAC3BN,MAAsBO,gBAAgB,oBAAoB;SACrD;KACL,MAAMC,YAAYL,OAAOG,KAAK;AAC9B,SAAIN,KAAsBS,aAAa,oBAAoB,KAAKD,UAC9DR,MAAsBU,aAAa,qBAAqBF,UAAU;;;;AACrE,MAAAV,QAAA,YAAA;GAAA,MAAAE,OAAA,KAAA5B;AAAA,OAAA4B,MARP;IACI,MAAMW,OAAOC,SAASC,cAAc,WAAW;AAC/CF,SAAKG,YAASf;IACd,MAAMgB,UAAUJ,KAAKK,QAAQC;IAC7B,MAAMC,YAAYlB,KAAsBiB;AACxC,QAAIF,WAAWG,aAAaP,KAAKK,QAAQG,WAAWC,WAAW,EAC7D,MAAKC,YAAWhD,gBAAwB6C,WAAWH,SAAS,KAAK;aACxDf,KAAsBc,cAASf,OAA4B;AACpEC,UAAsBc,YAASf;AAC/B,UAAIzB,mCAAyB;AAC7B,SAAI,KAAKgD,gBAAiB,MAAKA,gBAAe/C,sCAAyB"}
+{"version":3,"file":"droppable.mjs","names":["GEA_CREATE_TEMPLATE","reactiveClassName","reactiveAttr","reactiveText","CompiledReactiveComponent","Component","dndManager","_tpl0_create","e","document","createElement","textContent","Droppable","_registered","_registerWithManager","el","querySelector","HTMLElement","registerDroppable","props","droppableId","created","queueMicrotask","onAfterRender","dispose","unregisterDroppable","d","root","el0","el1","marker2","firstChild","class","t2","children"],"sources":["../src/components/droppable.tsx"],"sourcesContent":["import { Component } from '@geajs/core'\nimport { dndManager } from './dnd-manager'\n\nexport default class Droppable extends Component {\n  private _registered = false\n\n  _registerWithManager() {\n    const el = this.el?.querySelector('[data-droppable-id]') as HTMLElement\n    if (el && !this._registered) {\n      dndManager.registerDroppable(this.props.droppableId as string, el)\n      this._registered = true\n    }\n  }\n\n  created() {\n    queueMicrotask(() => this._registerWithManager())\n  }\n\n  onAfterRender() {\n    this._registerWithManager()\n  }\n\n  dispose() {\n    if (this._registered) {\n      dndManager.unregisterDroppable(this.props.droppableId as string)\n      this._registered = false\n    }\n    super.dispose()\n  }\n\n  template(props: any) {\n    return (\n      <div class={`gea-droppable ${props.class || ''}`} data-droppable-id={props.droppableId}>\n        {props.children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;;;AAGA,SAASO,eAAe;CACtB,MAAMC,IAAIC,SAASC,cAAc,MAAM;AACvCF,GAAEG,cAAc;AAChB,QAAOH;;AAET,IAAqBI,YAArB,cAAuCR,0BAA0B;;;qBACzC;;CACtBU,uBAAuB;EACrB,MAAMC,KAAK,KAAKA,IAAIC,cAAc,sBAAsB;AACxD,MAAID,MAAM,CAAC,KAAKF,aAAa;AAC3BP,cAAWY,kBAAkB,KAAKC,MAAMC,aAAuBL,GAAG;AAClE,QAAKF,cAAc;;;CAGvBQ,UAAU;AACRC,uBAAqB,KAAKR,sBAAsB,CAAC;;CAEnDS,gBAAgB;AACd,OAAKT,sBAAsB;;CAE7BU,UAAU;AACR,MAAI,KAAKX,aAAa;AACpBP,cAAWmB,oBAAoB,KAAKN,MAAMC,YAAsB;AAChE,QAAKP,cAAc;;AAErB,QAAMW,SAAS;;CAEjB,CAACxB,qBAAqB0B,GAAG;EACvB,MAAMC,OAAOpB,cAAc;EAC3B,MAAMqB,MAAMD;EACZ,MAAME,MAAMD;EACZ,MAAME,UAAUH,KAAKI;AACrB9B,oBAAkB2B,KAAKF,GAAG,YAAY,iBAAiB,KAAKP,MAAMa,SAAS,KAAK;AAChF9B,eAAa2B,KAAKH,GAAG,MAAM,2BAA2B,KAAKP,MAAMC,YAAY;AAE7EjB,eAAa8B,SAAIP,GAAG,YAAY,KAAKP,MAAMe,SAAS;AACpD,SAAOP"}

package/dist/file-upload.d.mts

@@ -8,7 +8,7 @@ declare class FileUpload extends ZagComponent {
   rejectedFiles: any[];
   createMachine(_props: any): any;
   getMachineProps(props: any): {
-    id: any;
+    id: string;
     accept: any;
     maxFiles: any;
     maxFileSize: any;
@@ -31,7 +31,7 @@ declare class FileUpload extends ZagComponent {
     '[data-part="clear-trigger"]': string;
   };
   syncState(api: any): void;
-  template(props: any): string;
+  template(props: any): any;
 }
 //#endregion
 export { FileUpload as default };