@toolbox-web/grid-react 2.0.0-rc.1 → 2.1.0

package/chunks/feature-registry-8K2rOVnC.js

@@ -0,0 +1,2 @@
+import { registerFeature as e } from "@toolbox-web/grid/features/registry";
+export { e as t };

package/chunks/grid-detail-panel-CLdX0T_A.js

@@ -0,0 +1,44 @@
+import { useCallback as e, useEffect as t, useRef as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+//#region libs/grid-react/src/lib/grid-detail-panel.tsx
+var i = /* @__PURE__ */ new WeakMap(), a = /* @__PURE__ */ new Map();
+function o(e) {
+	let t = e.querySelector("tbw-grid-detail");
+	if (t) {
+		let e = i.get(t);
+		if (e) return e;
+	}
+	let n = e.id || e.getAttribute("data-grid-id");
+	if (n) return a.get(n);
+}
+function s(o) {
+	let { children: s, showExpandColumn: c = !0, animation: l = "slide" } = o, u = n(null), d = e((e) => {
+		if (u.current = e, !e) return;
+		i.set(e, s);
+		let t = e.closest("tbw-grid, [data-tbw-grid]");
+		if (t) {
+			let e = t.id || t.getAttribute("data-grid-id");
+			e && a.set(e, s);
+		}
+	}, [s]);
+	return t(() => () => {
+		let e = u.current;
+		if (e) {
+			i.delete(e);
+			let t = e.closest("tbw-grid, [data-tbw-grid]");
+			if (t) {
+				let e = t.id || t.getAttribute("data-grid-id");
+				e && a.delete(e);
+			}
+			let n = e.parentNode;
+			n && n.contains(e);
+		}
+	}, []), /* @__PURE__ */ r("tbw-grid-detail", {
+		ref: d,
+		showExpandColumn: c ? void 0 : "false",
+		animation: l === !1 ? "false" : l
+	});
+}
+s.displayName = "GridDetailPanel";
+//#endregion
+export { o as n, s as t };

package/chunks/grid-element-context-DpuQsoie.js

@@ -0,0 +1,5 @@
+import { createContext as e } from "react";
+//#region libs/grid-react/src/lib/grid-element-context.ts
+var t = e(null);
+//#endregion
+export { t };

package/chunks/grid-responsive-card-Dx5U6Prm.js

@@ -0,0 +1,41 @@
+import { useCallback as e, useEffect as t, useRef as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+//#region libs/grid-react/src/lib/grid-responsive-card.tsx
+var i = /* @__PURE__ */ new WeakMap(), a = /* @__PURE__ */ new Map();
+function o(e) {
+	let t = e.querySelector("tbw-grid-responsive-card");
+	if (t) {
+		let e = i.get(t);
+		if (e) return e;
+	}
+	let n = e.id || e.getAttribute("data-grid-id");
+	if (n) return a.get(n);
+}
+function s(o) {
+	let { children: s, cardRowHeight: c = "auto" } = o, l = n(null), u = e((e) => {
+		if (l.current = e, !e) return;
+		i.set(e, s);
+		let t = e.closest("tbw-grid, [data-tbw-grid]");
+		if (t) {
+			let e = t.id || t.getAttribute("data-grid-id");
+			e && a.set(e, s);
+		}
+	}, [s]);
+	return t(() => () => {
+		let e = l.current;
+		if (e) {
+			i.delete(e);
+			let t = e.closest("tbw-grid, [data-tbw-grid]");
+			if (t) {
+				let e = t.id || t.getAttribute("data-grid-id");
+				e && a.delete(e);
+			}
+		}
+	}, []), /* @__PURE__ */ r("tbw-grid-responsive-card", {
+		ref: u,
+		cardRowHeight: c === "auto" ? "auto" : String(c)
+	});
+}
+s.displayName = "GridResponsiveCard";
+//#endregion
+export { o as n, s as t };

package/chunks/portal-bridge-zxgm_jwK.js

@@ -0,0 +1,60 @@
+import { flushSync as e } from "react-dom";
+import { createRoot as t } from "react-dom/client";
+//#region libs/grid-react/src/lib/portal-bridge.ts
+var n = /* @__PURE__ */ new Map(), r = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map(), a = 0;
+function o(e, t) {
+	t ? n.set(e, t) : n.delete(e);
+}
+function s(e, t) {
+	if (t) return t;
+	let r = e.closest("tbw-grid, [data-tbw-grid]");
+	if (r) return r;
+	if (n.size === 1) return n.keys().next().value;
+}
+function c(e) {
+	let t = i.get(e);
+	if (t) {
+		try {
+			t.unmount();
+		} catch {}
+		i.delete(e);
+	}
+}
+function l(o, l, u, d) {
+	let f = u ?? `p-${a++}`, p = s(o, d), m = p ? n.get(p) : void 0;
+	if (m) c(f), p && r.set(f, p), m.renderPortal(f, o, l);
+	else {
+		let n = i.get(f);
+		n || (n = t(o), i.set(f, n)), e(() => n.render(l));
+	}
+	return f;
+}
+function u(e, t) {
+	let i = r.get(e);
+	(i ? n.get(i) : void 0)?.removePortal(e, t?.sync), r.delete(e), c(e);
+}
+function d(e) {
+	if (e) {
+		n.get(e)?.beginBatch();
+		return;
+	}
+	for (let e of n.values()) e.beginBatch();
+}
+function f(e) {
+	if (e) {
+		n.get(e)?.endBatch();
+		return;
+	}
+	for (let e of n.values()) e.endBatch();
+}
+function p(e) {
+	return (t) => {
+		let n = e(t);
+		if (n == null || n === !1) return null;
+		if (n instanceof HTMLElement) return n;
+		let r = document.createElement("div");
+		return r.style.display = "contents", l(r, n), r;
+	};
+}
+//#endregion
+export { l as a, u as i, p as n, o, f as r, d as t };

package/chunks/post-mount-refresh-hooks-D7BDK4Kl.js

@@ -0,0 +1,10 @@
+//#region libs/grid-react/src/lib/post-mount-refresh-hooks.ts
+var e = /* @__PURE__ */ new Map();
+function t(t, n) {
+	e.set(t, n);
+}
+function n(t) {
+	for (let n of e.values()) n({ gridEl: t });
+}
+//#endregion
+export { t as n, n as t };

package/chunks/react-column-config-Cto2WHGC.js

@@ -0,0 +1,126 @@
+import { a as e, i as t } from "./portal-bridge-zxgm_jwK.js";
+//#region libs/grid-react/src/lib/editor-mount-hooks.ts
+var n = [];
+function r(e) {
+	n.push(e);
+}
+function i(e, t) {
+	let r = [];
+	for (let i of n) {
+		let n = i({
+			container: e,
+			gridEl: t
+		});
+		n && r.push(n);
+	}
+	return () => {
+		for (let e of r) e();
+	};
+}
+//#endregion
+//#region libs/grid-react/src/lib/react-column-config.ts
+var a = Symbol("reactProcessed"), o = /* @__PURE__ */ new Map();
+function s(e) {
+	let n = e.querySelectorAll(".react-cell-editor, .react-cell-renderer");
+	for (let e of n) {
+		let n = o.get(e);
+		n && (n.unsub?.(), t(n.key, { sync: !0 }), o.delete(e));
+	}
+}
+function c(e) {
+	let t = document.createElement("div");
+	return t.className = e, t.style.display = "contents", t;
+}
+function l(e) {
+	return () => {
+		let t = e.ownerDocument.activeElement;
+		t && e.contains(t) && (t instanceof HTMLInputElement || t instanceof HTMLTextAreaElement || t instanceof HTMLSelectElement) && t.blur();
+	};
+}
+function u(n) {
+	let r = /* @__PURE__ */ new WeakMap();
+	return (i) => {
+		let a = i.cellEl;
+		if (a) {
+			let o = r.get(a);
+			if (o) {
+				if (a.contains(o.container)) return e(o.container, n(i), o.portalKey), o.container;
+				t(o.portalKey, { sync: !0 }), r.delete(a);
+			}
+		}
+		let s = c("react-cell-renderer"), l = e(s, n(i));
+		return a && r.set(a, {
+			portalKey: l,
+			container: s
+		}), o.set(s, { key: l }), s;
+	};
+}
+function d(t) {
+	return (n) => {
+		let r = c("react-cell-editor"), a = { key: e(r, t(n)) };
+		return o.set(r, a), queueMicrotask(() => {
+			let e = r.closest("tbw-grid, [data-tbw-grid]");
+			e && (a.unsub = i(r, e));
+		}), r;
+	};
+}
+function f(t) {
+	return (n) => {
+		let r = c("react-header-renderer"), i = e(r, t(n));
+		return o.set(r, { key: i }), r;
+	};
+}
+function p(t) {
+	return (n) => {
+		let r = c("react-header-label-renderer"), i = e(r, t(n));
+		return o.set(r, { key: i }), r;
+	};
+}
+function m(t) {
+	return (n) => {
+		let r = t(n);
+		if (r instanceof HTMLElement || typeof r == "string") return r;
+		let i = c("react-loading-renderer"), a = e(i, r);
+		return o.set(i, { key: a }), i;
+	};
+}
+function h(t) {
+	return (n) => {
+		let r = t(n);
+		if (r instanceof HTMLElement || typeof r == "string") return r;
+		let i = c("react-empty-renderer"), a = e(i, r);
+		return o.set(i, { key: a }), i;
+	};
+}
+function g(e) {
+	if (!e) return;
+	if (e[a]) return e;
+	if (e.loadingRenderer && typeof e.loadingRenderer == "function") {
+		let t = e.loadingRenderer;
+		e = {
+			...e,
+			loadingRenderer: m(t)
+		};
+	}
+	if (e.emptyRenderer && typeof e.emptyRenderer == "function") {
+		let t = e.emptyRenderer;
+		e = {
+			...e,
+			emptyRenderer: h(t)
+		};
+	}
+	if (!e.columns) {
+		let t = e;
+		return t[a] = !0, t;
+	}
+	let t = e.columns.map((e) => {
+		let { renderer: t, editor: n, headerRenderer: r, headerLabelRenderer: i, ...a } = e, o = { ...a };
+		return t && (o.renderer = u(t)), n && (o.editor = d(n)), r && (o.headerRenderer = f(r)), i && (o.headerLabelRenderer = p(i)), o;
+	}), n = {
+		...e,
+		columns: t
+	};
+	return n[a] = !0, n;
+}
+//#endregion
+export { r as a, i, l as n, g as r, s as t };

package/chunks/react-grid-adapter-CZfpPJvo.js

@@ -0,0 +1,308 @@
+import { a as e, i as t, r as n, t as r } from "./portal-bridge-zxgm_jwK.js";
+import { i, r as a, t as o } from "./react-column-config-Cto2WHGC.js";
+import { Children as s, isValidElement as c, useCallback as l, useEffect as u, useRef as d } from "react";
+import { jsx as f } from "react/jsx-runtime";
+//#region libs/grid-react/src/lib/child-feature-detector.ts
+var p = /* @__PURE__ */ new Map();
+function m(e, t) {
+	p.set(e, t);
+}
+function h(e) {
+	let t = {};
+	return p.size === 0 || s.forEach(e, (e) => {
+		if (!c(e)) return;
+		let n = e.type, r = typeof n == "string" ? void 0 : n?.displayName;
+		if (typeof r != "string") return;
+		let i = p.get(r);
+		if (!i) return;
+		let a = i(e);
+		a && Object.assign(t, a);
+	}), t;
+}
+//#endregion
+//#region libs/grid-react/src/lib/feature-prop-keys.ts
+var g = /* @__PURE__ */ new Set(), _ = null;
+function v(e) {
+	g.has(e) || (g.add(e), _ = null);
+}
+function y() {
+	return _ === null && (_ = Object.freeze(Array.from(g))), _;
+}
+for (let e of [
+	"selection",
+	"editing",
+	"filtering",
+	"multiSort",
+	"clipboard",
+	"contextMenu",
+	"reorderColumns",
+	"rowDragDrop",
+	"visibility",
+	"undoRedo",
+	"tree",
+	"groupingRows",
+	"groupingColumns",
+	"pinnedColumns",
+	"pinnedRows",
+	"masterDetail",
+	"responsive",
+	"columnVirtualization",
+	"export",
+	"print",
+	"pivot",
+	"serverSide",
+	"tooltip"
+]) v(e);
+//#endregion
+//#region libs/grid-react/src/lib/grid-tool-panel.tsx
+var b = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new Map();
+function S(e) {
+	let t = b.get(e);
+	if (t) return t;
+	let n = e.id;
+	if (n) return x.get(n);
+}
+function C(e) {
+	let { id: t, title: n, icon: r, tooltip: i, order: a = 100, children: o } = e, s = d(null), c = l((e) => {
+		s.current = e, e && (b.set(e, o), t && x.set(t, o));
+	}, [o, t]);
+	return u(() => () => {
+		let e = s.current;
+		e && (b.delete(e), t && x.delete(t));
+	}, [t]), /* @__PURE__ */ f("tbw-grid-tool-panel", {
+		ref: c,
+		id: t,
+		title: n,
+		icon: r,
+		tooltip: i,
+		order: a?.toString()
+	});
+}
+//#endregion
+//#region libs/grid-react/src/lib/react-grid-adapter.ts
+var w = null, T = null, E = null;
+function D(e) {
+	w = e;
+}
+function O(e) {
+	T = e;
+}
+function k(e) {
+	E = e;
+}
+var A = /* @__PURE__ */ new WeakMap(), j = /* @__PURE__ */ new Map(), M = /* @__PURE__ */ new WeakMap(), N = /* @__PURE__ */ new Map(), P = /* @__PURE__ */ new Set();
+function F(e) {
+	return e.closest("tbw-grid, [data-tbw-grid]") ?? void 0;
+}
+function I(e, t) {
+	let n = F(e);
+	if (!n) return N;
+	let r = M.get(n);
+	if (r || !t) return r;
+	let i = /* @__PURE__ */ new Map();
+	return M.set(n, i), i;
+}
+function L(e) {
+	return e.tagName.toLowerCase() === "tbw-grid-type" ? e.getAttribute("name") : e.closest("tbw-grid-type")?.getAttribute("name") ?? null;
+}
+function R(e, t) {
+	let n = e.getAttribute("field"), r = A.get(e) ?? {};
+	if (r.renderer = t, A.set(e, r), n) {
+		let e = j.get(n) ?? {};
+		e.renderer = t, j.set(n, e);
+	}
+}
+function z(e, t) {
+	let n = e.getAttribute("field"), r = A.get(e) ?? {};
+	if (r.editor = t, A.set(e, r), n) {
+		let e = j.get(n) ?? {};
+		e.editor = t, j.set(n, e);
+	}
+}
+function B(e) {
+	let t = A.get(e)?.renderer;
+	if (!t) {
+		let n = e.getAttribute("field");
+		n && (t = j.get(n)?.renderer);
+	}
+	return t;
+}
+function V(e) {
+	let t = A.get(e)?.editor;
+	if (!t) {
+		let n = e.getAttribute("field");
+		n && (t = j.get(n)?.editor);
+	}
+	return t;
+}
+function H(e, t) {
+	let n = L(e);
+	if (!n) return;
+	let r = I(e, !0);
+	if (!r) return;
+	let i = r.get(n) ?? {};
+	i.renderer = t, r.set(n, i), P.add(n);
+}
+function U(e) {
+	let t = L(e);
+	if (t) return I(e, !1)?.get(t)?.renderer;
+}
+function W(e, t) {
+	let n = L(e);
+	if (!n) return;
+	let r = I(e, !0);
+	if (!r) return;
+	let i = r.get(n) ?? {};
+	i.editor = t, r.set(n, i), P.add(n);
+}
+function G(e) {
+	let t = L(e);
+	if (t) return I(e, !1)?.get(t)?.editor;
+}
+var K = class {
+	allPortalKeys = /* @__PURE__ */ new Set();
+	editorPortalKeys = /* @__PURE__ */ new Set();
+	keyToContainer = /* @__PURE__ */ new Map();
+	containerToKey = /* @__PURE__ */ new WeakMap();
+	editorBeforeCloseUnsubs = /* @__PURE__ */ new Map();
+	typeDefaults = null;
+	setTypeDefaults(e) {
+		this.typeDefaults = e;
+	}
+	processConfig(e) {
+		return a(e) ?? e;
+	}
+	canHandle(e) {
+		let t = e.getAttribute("field"), n = A.get(e);
+		if (!n && t) {
+			let r = j.get(t);
+			r && (r.renderer || r.editor) && (n = r, A.set(e, n));
+		}
+		let r = n?.renderer !== void 0, i = n?.editor !== void 0;
+		if (n !== void 0 && (r || i)) return !0;
+		let a = L(e), o = a ? I(e, !1)?.get(a) : void 0;
+		return !!o && (o.renderer !== void 0 || o.editor !== void 0);
+	}
+	createRenderer(n) {
+		let r = B(n) ?? U(n);
+		if (!r) return;
+		let i = n.closest("tbw-grid, [data-tbw-grid]"), a = /* @__PURE__ */ new WeakMap();
+		return (n) => {
+			let o = n.cellEl;
+			if (o) {
+				let s = a.get(o);
+				if (s) {
+					if (o.contains(s.container)) return e(s.container, r(n), s.portalKey), s.container;
+					t(s.portalKey, { sync: !0 }), this.untrackPortal(s.portalKey), a.delete(o);
+				}
+				let c = document.createElement("div");
+				c.className = "react-cell-renderer", c.style.display = "contents";
+				let l = e(c, r(n), void 0, i ?? void 0);
+				return a.set(o, {
+					portalKey: l,
+					container: c
+				}), this.trackPortal(l, c, !1), c;
+			}
+			let s = document.createElement("div");
+			s.className = "react-cell-renderer", s.style.display = "contents";
+			let c = e(s, r(n), void 0, i ?? void 0);
+			return this.trackPortal(c, s, !1), s;
+		};
+	}
+	createEditor(t) {
+		let n = V(t) ?? G(t);
+		if (!n) return () => document.createElement("div");
+		let r = t.closest("tbw-grid, [data-tbw-grid]") ?? void 0;
+		return (t) => {
+			let a = document.createElement("div");
+			a.className = "react-cell-editor", a.style.display = "contents";
+			let o = e(a, n(t), void 0, r);
+			return this.trackPortal(o, a, !0), r && this.editorBeforeCloseUnsubs.set(o, i(a, r)), a;
+		};
+	}
+	createDetailRenderer(e) {
+		return w?.(e, this.bridgeContext);
+	}
+	parseDetailElement(e) {
+		let t = e.closest("tbw-grid, [data-tbw-grid]");
+		if (t) return this.createDetailRenderer(t);
+	}
+	createResponsiveCardRenderer(e) {
+		return T?.(e, this.bridgeContext);
+	}
+	parseResponsiveCardElement(e) {
+		let t = e.closest("tbw-grid, [data-tbw-grid]");
+		if (t) return this.createResponsiveCardRenderer(t);
+	}
+	createToolPanelRenderer(n) {
+		let r = S(n);
+		if (!r) return;
+		let i = n.closest("tbw-grid, [data-tbw-grid]");
+		return (n) => {
+			let a = e(n, r({ grid: i ?? n }), void 0, i ?? void 0);
+			return this.trackPortal(a, n, !1), () => {
+				t(a, { sync: !0 }), this.untrackPortal(a);
+			};
+		};
+	}
+	getTypeDefault(e, t) {
+		if (!this.typeDefaults) return;
+		let n = this.typeDefaults[e];
+		if (!n) return;
+		let r = { editorParams: n.editorParams };
+		return n.renderer && (r.renderer = this.createTypeRenderer(n.renderer, t)), n.editor && (r.editor = this.createTypeEditor(n.editor, t)), n.filterPanelRenderer && E && (r.filterPanelRenderer = E(n.filterPanelRenderer, t, this.bridgeContext)), r;
+	}
+	createTypeRenderer(t, n) {
+		return (r) => {
+			let i = document.createElement("span");
+			i.style.display = "contents";
+			let a = r.cellEl?.closest("tbw-grid, [data-tbw-grid]") ?? n, o = e(i, t(r), void 0, a);
+			return this.trackPortal(o, i, !1), i;
+		};
+	}
+	createTypeEditor(t, n) {
+		return (r) => {
+			let i = document.createElement("span");
+			i.style.display = "contents";
+			let a = e(i, t(r), void 0, n);
+			return this.trackPortal(a, i, !0), i;
+		};
+	}
+	bridgeContext = { trackPortal: (e, t, n) => this.trackPortal(e, t, n) };
+	trackPortal(e, t, n) {
+		this.allPortalKeys.add(e), this.keyToContainer.set(e, t), this.containerToKey.set(t, e), n && this.editorPortalKeys.add(e);
+	}
+	untrackPortal(e) {
+		this.allPortalKeys.delete(e), this.editorPortalKeys.delete(e);
+		let t = this.keyToContainer.get(e);
+		this.keyToContainer.delete(e), t && this.containerToKey.delete(t);
+		let n = this.editorBeforeCloseUnsubs.get(e);
+		n && (n(), this.editorBeforeCloseUnsubs.delete(e));
+	}
+	destroy() {
+		for (let e of this.allPortalKeys) t(e);
+		this.allPortalKeys.clear(), this.editorPortalKeys.clear(), this.keyToContainer.clear();
+		for (let e of this.editorBeforeCloseUnsubs.values()) e();
+		this.editorBeforeCloseUnsubs.clear(), j.clear();
+	}
+	releaseCell(e) {
+		let n = e.querySelectorAll(".react-cell-renderer, .react-cell-editor");
+		for (let e of n) {
+			let n = this.containerToKey.get(e);
+			n && (t(n, { sync: !0 }), this.untrackPortal(n));
+		}
+		o(e);
+	}
+	unmount(e) {
+		let n = this.containerToKey.get(e);
+		n && (t(n), this.untrackPortal(n));
+	}
+	beginBatch(e) {
+		r(e);
+	}
+	endBatch(e) {
+		n(e);
+	}
+};
+//#endregion
+export { k as a, H as c, v as d, h as f, D as i, C as l, z as n, O as o, m as p, R as r, W as s, K as t, y as u };

package/features/editing.js

@@ -1,6 +1,8 @@
+import { a as e, n as t } from "../chunks/react-column-config-Cto2WHGC.js";
 import "@toolbox-web/grid/features/editing";
-import { r, m as s } from "../chunks/react-column-config-BOe_PgL1.js";
-r(({ container: t, gridEl: e }) => {
-  const o = s(t);
-  return e.addEventListener("before-edit-close", o), () => e.removeEventListener("before-edit-close", o);
+//#region libs/grid-react/src/features/editing.ts
+e(({ container: e, gridEl: n }) => {
+	let r = t(e);
+	return n.addEventListener("before-edit-close", r), () => n.removeEventListener("before-edit-close", r);
 });
+//#endregion