intable 0.0.47 → 0.0.49

package/dist/index.js

@@ -302,15 +302,20 @@ function BasePlugin() {
 				} }));
 			},
 			Td: ({ Td: _ = $ }, { store: K }) => (K) => {
-				let { props: J } = useContext(Ctx), Y = combineProps(K, {
+				let { props: J } = useContext(Ctx), Y = mergeProps$1(K, {
 					get class() {
-						return [unFn(J.cellClass, K), K.col.class].filter(Boolean).join(" ");
+						return [
+							unFn(J.cellClass, K),
+							K.col.class,
+							K.class
+						].filter(Boolean).join(" ");
 					},
 					get style() {
 						return [
 							unFn(J.cellStyle, K),
 							K.col.style,
-							K.col.width && `width: ${K.col.width}px; max-width: ${K.col.width}px`
+							K.col.width && `width: ${K.col.width}px; max-width: ${K.col.width}px`,
+							K.style
 						].filter(Boolean).join(";");
 					}
 				});
@@ -404,7 +409,7 @@ const defaultsPlugins = [
 		return createEffect(on(() => [K.width, _.props.columns.map((_) => _.width)], async () => {
 			if (!K.width || J) return;
 			q.length = 0, J = !0, await Promise.resolve();
-			let Y = (K.width - _.table.getBoundingClientRect().width) / _.props.columns.filter((_) => !_.width).length, X = _.props.columns.map((K, q) => K.width ? null : { width: Math.max((_.ths[q]?.getBoundingClientRect().width || 0) + Y, 80) });
+			let Y = Math.max((K.width - _.table.getBoundingClientRect().width) / _.props.columns.filter((_) => !_.width).length, 0), X = _.props.columns.map((K, q) => K.width ? null : { width: Math.max((_.ths[q]?.getBoundingClientRect().width || 0) + Y, 80) });
 			q.push(...X), J = !1;
 		})), {
 			name: "fit-col-width",

package/dist/plugins/CellMergePlugin.js

@@ -1,6 +1,7 @@
 import { mergeProps as mergeProps$2 } from "../mergeProps2.js";
 import { createComponent } from "solid-js/web";
 import { Show, createMemo } from "solid-js";
+import { createLazyMemo } from "@solid-primitives/memo";
 function buildMergeMap(e, t, n) {
 	let r = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Set();
 	for (let a = 0; a < e.length; a++) for (let o = 0; o < t.length; o++) {
@@ -26,15 +27,16 @@ function buildMergeMap(e, t, n) {
 }
 const CellMergePlugin = {
 	name: "cell-merge",
+	store: (e) => ({ hasMergeCell: createLazyMemo(() => e.props.merge || e.props.columns.some((e) => e.mergeRow)) }),
 	rewriteProps: {
-		Table: ({ Table: e }, { store: n }) => (a) => (n._mergeMap ??= createMemo(() => {
+		Table: ({ Table: e }, { store: n }) => (i) => (n._mergeMap ??= createMemo(() => {
 			let { merge: e, data: t, columns: r } = n.props;
 			return !e && !r?.some((e) => e.mergeRow) || !t?.length || !r?.length ? {
 				spans: /* @__PURE__ */ new Map(),
 				covered: /* @__PURE__ */ new Set()
 			} : buildMergeMap(t, r, e);
-		}), createComponent(e, a)),
-		Td: ({ Td: r }, { store: i }) => (a) => {
+		}), createComponent(e, i)),
+		Td: ({ Td: r }, { store: i }) => i.hasMergeCell() ? (a) => {
 			let o = () => `${a.y},${a.x}`, s = () => i._mergeMap?.().covered.has(o()) ?? !1, c = () => i._mergeMap?.().spans.get(o());
 			return createComponent(Show, {
 				get when() {
@@ -51,7 +53,7 @@ const CellMergePlugin = {
 					}));
 				}
 			});
-		},
+		} : r,
 		newRow: ({ newRow: e }, { store: t }) => function(n) {
 			let r = e(n), { data: i, columns: a, merge: o } = t.props;
 			return !i?.length || !a?.length || a.forEach((e, a) => {

package/dist/plugins/EditablePlugin.js

@@ -6,7 +6,6 @@ import { Ctx } from "../index.js";
 import { addEventListener, createComponent, delegateEvents, effect, insert, memo, spread, template, use } from "solid-js/web";
 import { createEffect, createMemo, createRoot, createSignal, on, onCleanup, useContext } from "solid-js";
 import { createMutable } from "solid-js/store";
-import { combineProps } from "@solid-primitives/props";
 import { createAsyncMemo } from "@solid-primitives/memo";
 import { delay } from "es-toolkit";
 var _tmpl$ = /* @__PURE__ */ template("<div class=in-cell-edit-wrapper tabindex=-1>"), _tmpl$2 = /* @__PURE__ */ template("<span class=cell-validating>"), _tmpl$3 = /* @__PURE__ */ template("<input style=position:absolute;margin-top:1em;width:0;height:0;pointer-events:none;opacity:0>"), _tmpl$4 = /* @__PURE__ */ template("<input>"), _tmpl$5 = /* @__PURE__ */ template("<label class=\"h-full flex items-center\">"), _tmpl$6 = /* @__PURE__ */ template("<select><option value>-"), _tmpl$7 = /* @__PURE__ */ template("<option>");
@@ -14,106 +13,106 @@ const EditablePlugin = {
 	name: "editable",
 	store: () => ({ editors: { ...editors } }),
 	rewriteProps: {
-		editable: ({ editable: e }, { store: g }) => (v) => {
-			let y = [v.col.editable, e].filter((e) => e != null);
-			return !!y.length && y.every((e) => unFn(e, v)) && !v.data[g.internal] && !v.col[g.internal];
+		editable: ({ editable: e }, { store: m }) => (g) => {
+			let _ = [g.col.editable, e].filter((e) => e != null);
+			return !!_.length && _.every((e) => unFn(e, g)) && !g.data[m.internal] && !g.col[m.internal];
 		},
-		Td: ({ Td: e }, { store: g }) => (y) => {
-			let b, { props: x } = useContext(Ctx), [T, E] = createSignal(!1), O = "", k = () => unFn(x.editable, y), j = () => (([e, g]) => y.x == e && y.y == g)(g.selected.start || []), M = () => j() && k() && !T(), [N, P] = createSignal(!1), F = createAsyncMemo(() => {
-				if (T()) {
-					let e = createMemo(() => JSON.stringify(g.selected ?? "{}"));
-					createEffect(on(e, () => E(!1), { defer: !0 })), R.w = b.getBoundingClientRect().width, R.h = b.getBoundingClientRect().height;
-					let _ = !1, v = y.data[y.col.id], S = ((e) => typeof e == "string" ? g.editors[e] : e)(y.col.editor ?? y.col.type ?? (y.col.enum ? "select" : "text")), C = {
-						props: y.col.editorProps,
-						col: y.col,
-						eventKey: O,
-						data: y.data,
-						value: v,
+		Td: ({ Td: e }, { store: m }) => (_) => {
+			let v, { props: y } = useContext(Ctx), [C, w] = createSignal(!1), E = "", D = () => unFn(y.editable, _), k = () => (([e, m]) => _.x == e && _.y == m)(m.selected.start || []), A = () => k() && D() && !C(), [j, M] = createSignal(!1), N = createAsyncMemo(() => {
+				if (C()) {
+					let e = createMemo(() => JSON.stringify(m.selected ?? "{}"));
+					createEffect(on(e, () => w(!1), { defer: !0 })), I.w = v.getBoundingClientRect().width, I.h = v.getBoundingClientRect().height;
+					let h = !1, g = _.data[_.col.id], b = ((e) => typeof e == "string" ? m.editors[e] : e)(_.col.editor ?? _.col.type ?? (_.col.enum ? "select" : "text")), x = {
+						props: _.col.editorProps,
+						col: _.col,
+						eventKey: E,
+						data: _.data,
+						value: g,
 						ok: async () => {
-							await I(w.getValue()), E(!1);
+							await P(S.getValue()), w(!1);
 						},
-						cancel: () => (_ = !0, E(!1)),
-						onChange: (e) => T() && I(e).catch(() => {})
-					}, w = S(C);
-					return queueMicrotask(() => w.focus?.()), onCleanup(() => {
-						!_ && w.getValue() !== v && g.commands.rowChange({
-							...x.data[y.y],
-							[y.col.id]: w.getValue()
-						}), _ || I(w.getValue()).catch(() => {}), O = "", w.destroy();
-					}), [C, w];
+						cancel: () => (h = !0, w(!1)),
+						onChange: (e) => C() && P(e).catch(() => {})
+					}, S = b(x);
+					return queueMicrotask(() => S.focus?.()), onCleanup(() => {
+						!h && S.getValue() !== g && m.commands.rowChange({
+							...y.data[_.y],
+							[_.col.id]: S.getValue()
+						}), h || P(S.getValue()).catch(() => {}), E = "", S.destroy();
+					}), [x, S];
 				}
 			});
-			async function I(e) {
+			async function P(e) {
 				try {
-					P(!0), await g.validateCell(e, y.data, y.col);
+					M(!0), await m.validateCell(e, _.data, _.col);
 				} finally {
-					P(!1);
+					M(!1);
 				}
 			}
-			let L, R = createMutable({
+			let F, I = createMutable({
 				w: 0,
 				h: 0
-			});
-			return y = combineProps(y, {
-				ref: (e) => b = e,
+			}), L = mergeProps$2(_, {
+				ref: (e) => (v = e, _.ref?.(e)),
 				get class() {
-					return T() ? "is-editing" : "";
+					return [C() ? "is-editing" : "", _.class].filter(Boolean).join(" ");
 				},
 				get style() {
-					return T() ? `width: ${R.w}px; height: ${R.h}px; padding: 0; ` : "";
+					return [C() ? `width: ${I.w}px; height: ${I.h}px; padding: 0; ` : "", _.style].filter(Boolean).join(" ");
 				},
-				onClick: () => L?.focus?.(),
-				onDblClick: () => E(k()),
-				onKeyDown: (e) => e.key == "Escape" && F()?.[0].cancel()
-			}), createComponent(e, mergeProps$2(y, { get children() {
-				return [memo(() => memo(() => !!F()?.[1]?.el)() ? (() => {
+				onClick: (e) => (F?.focus?.(), _.onClick?.(e)),
+				onDblClick: (e) => (w(D()), _.onDblClick?.(e)),
+				onKeyDown: (e) => (e.key == "Escape" && N()?.[0].cancel(), _.onKeyDown?.(e))
+			});
+			return createComponent(e, mergeProps$2(L, { get children() {
+				return [memo(() => memo(() => !!N()?.[1]?.el)() ? (() => {
 					var e = _tmpl$();
 					return addEventListener(e, "keydown", (e) => {
-						e.stopPropagation(), e.key == "Enter" && !e.shiftKey && (F()?.[0].ok(), e.preventDefault()), e.key == "Escape" && F()?.[0].cancel();
-					}), addEventListener(e, "pointerdown", (e) => e.stopPropagation()), insert(e, () => F()?.[1]?.el, null), insert(e, (() => {
-						var e = memo(() => !!N());
+						e.stopPropagation(), e.key == "Enter" && !e.shiftKey && (N()?.[0].ok(), e.preventDefault()), e.key == "Escape" && N()?.[0].cancel();
+					}), addEventListener(e, "pointerdown", (e) => e.stopPropagation()), insert(e, () => N()?.[1]?.el, null), insert(e, (() => {
+						var e = memo(() => !!j());
 						return () => e() && _tmpl$2();
 					})(), null), e;
-				})() : y.children), memo(() => memo(() => !!M())() && (() => {
+				})() : _.children), memo(() => memo(() => !!A())() && (() => {
 					var e = _tmpl$3();
 					return e.addEventListener("compositionend", () => {
-						E(!0);
+						w(!0);
 					}), e.$$input = (e) => {
-						O = e.target.value, E(!e.isComposing);
+						E = e.target.value, w(!e.isComposing);
 					}, e.$$keydown = (e) => {
 						e.key == " " && e.preventDefault();
 					}, use((e) => {
-						L = e, delay(0).then(() => e.focus({ preventScroll: !0 }));
+						F = e, delay(0).then(() => e.focus({ preventScroll: !0 }));
 					}, e), e;
 				})())];
 			} }));
 		}
 	}
 };
-var createEditor = (e, _, y) => ({ eventKey: b, value: x, col: S, ok: C, cancel: T, props: E, onChange: D }) => createRoot((T) => {
-	let [O, k] = createSignal(b || x), A;
+var createEditor = (e, h, _) => ({ eventKey: v, value: y, col: b, ok: x, cancel: C, props: w, onChange: T }) => createRoot((C) => {
+	let [E, D] = createSignal(v || y), O;
 	return createComponent(e, mergeProps$2({
-		ref: (e) => A = e,
+		ref: (e) => O = e,
 		class: "relative block px-2 size-full z-9 box-border resize-none outline-0",
 		get value() {
-			return O();
+			return E();
 		},
-		onInput: (e) => (k(e instanceof Event ? e.target.value : e), D?.(O())),
-		onChange: (e) => (k(e instanceof Event ? e.target.value : e), D?.(O()), y && C()),
+		onInput: (e) => (D(e instanceof Event ? e.target.value : e), T?.(E())),
+		onChange: (e) => (D(e instanceof Event ? e.target.value : e), T?.(E()), _ && x()),
 		get options() {
-			return memo(() => !!S.enum)() ? resolveOptions(S.enum ?? []) : void 0;
+			return memo(() => !!b.enum)() ? resolveOptions(b.enum ?? []) : void 0;
 		}
-	}, _, E)), setTimeout(() => {
-		y && A?.showPicker?.();
+	}, h, w)), setTimeout(() => {
+		_ && O?.showPicker?.();
 	}, 0), {
-		el: A,
-		getValue: O,
-		focus: () => A.focus(),
-		destroy: T
+		el: O,
+		getValue: E,
+		focus: () => O.focus(),
+		destroy: C
 	};
 }), Input = (e) => (() => {
-	var g = _tmpl$4();
-	return spread(g, e, !1, !1), g;
+	var m = _tmpl$4();
+	return spread(m, e, !1, !1), m;
 })();
 const editors = {
 	text: createEditor(Input),
@@ -131,27 +130,27 @@ const editors = {
 	color: createEditor(Input, { type: "color" }),
 	tel: createEditor(Input, { type: "tel" }),
 	password: createEditor(Input, { type: "password" }),
-	file: createEditor((g) => createComponent(Files, mergeProps$2(g, {
+	file: createEditor((m) => createComponent(Files, mergeProps$2(m, {
 		class: "relative z-9 outline-2 outline-blue min-h-a! h-a! p-1 bg-#fff",
-		onAdd: () => chooseFile({ multiple: !0 }).then((e) => g.onChange([...g.value || [], ...e.map((e) => ({
+		onAdd: () => chooseFile({ multiple: !0 }).then((e) => m.onChange([...m.value || [], ...e.map((e) => ({
 			name: e.name,
 			size: e.size
 		}))]))
 	}))),
 	checkbox: createEditor((e) => (() => {
-		var g = _tmpl$5(), _ = e.ref;
-		return typeof _ == "function" ? use(_, g) : e.ref = g, insert(g, createComponent(Checkbox, mergeProps$2(e, {
+		var m = _tmpl$5(), h = e.ref;
+		return typeof h == "function" ? use(h, m) : e.ref = m, insert(m, createComponent(Checkbox, mergeProps$2(e, {
 			ref: () => {},
 			onInput: () => {},
 			class: "mx-3!"
-		}))), g;
+		}))), m;
 	})()),
 	select: createEditor((e) => (() => {
-		var g = _tmpl$6();
-		return g.firstChild, spread(g, e, !1, !0), insert(g, () => e.options?.map((g) => (() => {
-			var _ = _tmpl$7();
-			return insert(_, () => g.label), effect(() => _.selected = g.value === e.value), effect(() => _.value = g.value), _;
-		})()), null), g;
+		var m = _tmpl$6();
+		return m.firstChild, spread(m, e, !1, !0), insert(m, () => e.options?.map((m) => (() => {
+			var h = _tmpl$7();
+			return insert(h, () => m.label), effect(() => h.selected = m.value === e.value), effect(() => h.value = m.value), h;
+		})()), null), m;
 	})(), {}, !0)
 };
 delegateEvents(["keydown", "input"]);

package/dist/plugins/RenderPlugin/index.js

@@ -1,26 +1,29 @@
 import { renderComponent, solidComponent } from "../../components/utils.js";
 import { resolveOptions, toArr } from "../../utils.js";
-import { mergeProps as mergeProps$1 } from "../../mergeProps2.js";
+import { mergeProps as mergeProps$2 } from "../../mergeProps2.js";
 import { Checkbox, Files } from "./components.js";
 import { createComponent, insert, template } from "solid-js/web";
+import { createMemo } from "solid-js";
 var _tmpl$ = /* @__PURE__ */ template("<div class=\"flex items-center h-full\">");
 const RenderPlugin = {
 	name: "render",
 	priority: -Infinity,
 	store: () => ({ renders: { ...renders } }),
-	rewriteProps: { Td: ({ Td: d }, { store: f }) => (p) => (f.props.cpu && (p = mergeProps$1(() => ({}), p)), createComponent(d, mergeProps$1(p, { children: () => {
-		let d = ((e) => typeof e == "string" ? f.renders[e] : e)(p.col.render ?? p.col.type ?? text);
-		return d == text ? text(p) : renderComponent(d, p, f);
+	rewriteProps: { Td: ({ Td: f }, { store: p }) => (m) => (p.props.cpu && (m = mergeProps$2(() => ({}), m)), createComponent(f, mergeProps$2(m, { get children() {
+		return createMemo(() => {
+			let f = ((e) => typeof e == "string" ? p.renders[e] : e)(m.col.render ?? m.col.type ?? text);
+			return f == text ? text(m) : renderComponent(f, m, p);
+		});
 	} }))) }
 };
-var text = (e) => e.col.enum ? toArr(e.value).map((d) => resolveOptions(e.col.enum).find((e) => e.value == d)?.label ?? d).join(", ") : e.value;
+var text = (e) => e.col.enum ? toArr(e.value).map((f) => resolveOptions(e.col.enum).find((e) => e.value == f)?.label ?? f).join(", ") : e.value;
 const renders = {
 	text,
 	number: text,
 	date: text,
 	checkbox: (e) => (() => {
-		var d = _tmpl$();
-		return insert(d, createComponent(Checkbox, {
+		var f = _tmpl$();
+		return insert(f, createComponent(Checkbox, {
 			class: "",
 			get value() {
 				return e.value;
@@ -28,7 +31,7 @@ const renders = {
 			get onChange() {
 				return e.onChange;
 			}
-		})), d;
+		})), f;
 	})(),
 	file: (e) => createComponent(Files, {
 		get value() {

package/dist/plugins/TooltipPlugin.js

@@ -3,22 +3,23 @@ import { mergeProps as mergeProps$2 } from "../mergeProps2.js";
 import { Tooltip } from "../components/Tooltip.js";
 import { createComponent } from "solid-js/web";
 import { Show, createSignal } from "solid-js";
-import { combineProps } from "@solid-primitives/props";
+import { createLazyMemo } from "@solid-primitives/memo";
 import { offset } from "floating-ui-solid";
 const TooltipPlugin = {
 	name: "tooltip",
-	rewriteProps: { Td: ({ Td: c }, { store: l }) => (u) => {
-		let d = () => {
-			let s = u.col.tooltip;
-			if (s != null) return typeof s == "boolean" && (s = s && u.value != null ? String(u.value) : void 0), typeof s == "function" && (s = s(u)), renderComponent(s, u, l);
-		}, [f, p] = createSignal();
-		return u = combineProps({ ref: p }, u), createComponent(c, mergeProps$2(u, { get children() {
+	store: (e) => ({ hasTooltip: createLazyMemo(() => e.props.columns.some((e) => e.tooltip)) }),
+	rewriteProps: { Td: ({ Td: s }, { store: c }) => c.hasTooltip() ? (l) => {
+		let u = () => {
+			let o = l.col.tooltip;
+			if (o != null) return typeof o == "boolean" && (o = o && l.value != null ? String(l.value) : void 0), typeof o == "function" && (o = o(l)), renderComponent(o, l, c);
+		}, [d, f] = createSignal(), p = mergeProps$2(l, { ref: (e) => (f(e), l.ref?.(e)) });
+		return createComponent(s, mergeProps$2(p, { get children() {
 			return createComponent(Show, {
 				get when() {
-					return d();
+					return u();
 				},
 				get fallback() {
-					return u.children;
+					return l.children;
 				},
 				children: (e) => createComponent(Tooltip, {
 					get content() {
@@ -26,17 +27,17 @@ const TooltipPlugin = {
 					},
 					strategy: "fixed",
 					get target() {
-						return f();
+						return d();
 					},
 					get middleware() {
 						return [offset({ mainAxis: 4 })];
 					},
 					get children() {
-						return u.children;
+						return l.children;
 					}
 				})
 			});
 		} }));
-	} }
+	} : s }
 };
 export { TooltipPlugin };

package/dist/test.d.ts

@@ -1,4 +1 @@
-import { type JSX } from 'solid-js';
-import 'virtual:uno.css';
-import './style.scss';
-export declare const TestTable: (props: any) => JSX.Element;
+export declare const TestTable: (props: any) => import("solid-js").JSX.Element;

package/dist/test.js

@@ -1,5 +1,3 @@
-import './style.css';import './__uno.css';/* empty css      */
-/* empty css      */
 import { createComponent, effect, insert, setAttribute, template } from "solid-js/web";
 import { For } from "solid-js";
 var _tmpl$ = /* @__PURE__ */ template("<table><thead><tr></tr></thead><thead>"), _tmpl$2 = /* @__PURE__ */ template("<th>"), _tmpl$3 = /* @__PURE__ */ template("<tr>"), _tmpl$4 = /* @__PURE__ */ template("<td>");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "intable",
-  "version": "0.0.47",
+  "version": "0.0.49",
   "license": "MIT",
   "type": "module",
   "files": [