@declarion/react 0.61.1 → 0.63.0

package/dist-lib/{DraggableChildrenTable-DruYOxKm.js → DraggableChildrenTable-Cy8uevS_.js}

@@ -1,6 +1,7 @@
-import { s as e } from "./DynamicIcon-DW5krHuX.js";
-import { Dn as t, Jn as n, Vn as r, qn as i, rt as a } from "./useCurrentScreen-0WBj7wT6.js";
-import { t as o } from "./useText-BsedsJ-J.js";
+import { on as e, wn as t, wt as n } from "./useCurrentScreen--UovgvRj.js";
+import { t as r } from "./Icons-lt-7lhYR.js";
+import { n as i, r as a } from "./CopyButton-C0iEvaT1.js";
+import { f as o } from "./PropertyGridEditor-BTjscqfz.js";
 import { n as s, r as c, t as l } from "./dataTableStyles-vwD1mVOP.js";
 import { useCallback as u, useMemo as d, useRef as f } from "react";
 import { jsx as p, jsxs as m } from "react/jsx-runtime";
@@ -8,8 +9,8 @@ import { DndContext as h, PointerSensor as g, closestCenter as _, useSensor as v
 import { SortableContext as b, useSortable as x, verticalListSortingStrategy as S } from "@dnd-kit/sortable";
 import { CSS as C } from "@dnd-kit/utilities";
 //#region src/components/detail-layout/DraggableChildrenTable.tsx
-function w({ config: r, childEntity: i, schema: a, rows: l, onChange: x, validationErrors: C, refs: w }) {
-	let E = o(), D = f(null), O = r.position_field, k = r.columns, A = y(v(g, { activationConstraint: { distance: 5 } })), j = new Set(Array.isArray(r.foreign_key) ? r.foreign_key : [r.foreign_key]), M = k.filter((e) => {
+function w({ config: t, childEntity: i, schema: o, rows: l, onChange: x, validationErrors: C, refs: w }) {
+	let E = n(), D = f(null), O = t.position_field, k = t.columns, A = y(v(g, { activationConstraint: { distance: 5 } })), j = new Set(Array.isArray(t.foreign_key) ? t.foreign_key : [t.foreign_key]), M = k.filter((e) => {
 		if (j.has(e) || e === O) return !1;
 		let t = i.fields.get(e);
 		return !(!t || t.auto || t.primary || t.source);
@@ -27,22 +28,22 @@ function w({ config: r, childEntity: i, schema: a, rows: l, onChange: x, validat
 		let e = l.filter((e) => !e._deleted).reduce((e, t) => {
 			let n = typeof t[O] == "number" ? t[O] : -1;
 			return Math.max(e, n);
-		}, -1), t = {
+		}, -1), n = {
 			_key: crypto.randomUUID(),
 			_dirty: !0,
 			[O]: e + 1
-		}, n = r.quick_add?.defaults ?? {};
+		}, r = t.quick_add?.defaults ?? {};
 		for (let e of M) {
-			let r = i.fields.get(e);
-			r && (n[e] === void 0 ? r.default === void 0 ? r.type === "bool" && (t[e] = !1) : t[e] = r.default : t[e] = n[e]);
+			let t = i.fields.get(e);
+			t && (r[e] === void 0 ? t.default === void 0 ? t.type === "bool" && (n[e] = !1) : n[e] = t.default : n[e] = r[e]);
 		}
-		x([...l, t]);
+		x([...l, n]);
 	}, [
 		l,
 		x,
 		M,
 		i,
-		r.quick_add?.defaults,
+		t.quick_add?.defaults,
 		O
 	]), R = u((e) => {
 		x(l.map((t) => t._key === e ? {
@@ -118,12 +119,12 @@ function w({ config: r, childEntity: i, schema: a, rows: l, onChange: x, validat
 						width: 32,
 						padding: "0 4px"
 					} }),
-					P.map((e) => {
-						let n = i.fields.get(e);
+					P.map((t) => {
+						let n = i.fields.get(t);
 						return /* @__PURE__ */ p("th", {
 							style: H,
-							children: n ? t(E, n, e, a.entities) : e
-						}, e);
+							children: n ? e(E, n, t, o.entities) : t
+						}, t);
 					}),
 					/* @__PURE__ */ p("th", { style: {
 						...H,
@@ -149,18 +150,18 @@ function w({ config: r, childEntity: i, schema: a, rows: l, onChange: x, validat
 		})
 	}), /* @__PURE__ */ p("div", {
 		style: { marginTop: 8 },
-		children: /* @__PURE__ */ p(n, {
+		children: /* @__PURE__ */ p(a, {
 			kind: "ghost",
 			size: "xs",
-			icon: /* @__PURE__ */ p(e.plus, { size: 12 }),
+			icon: /* @__PURE__ */ p(r.plus, { size: 12 }),
 			onClick: L,
 			children: E("record.row.add", "Add row")
 		})
 	})] });
 }
-function T({ row: t, columns: n, editableColumns: s, displayOnlyColumns: c, childEntity: u, validationErrors: d, refs: f, onCellChange: h, onDelete: g, onUndoDelete: _ }) {
-	let v = o(), y = !!t._deleted, b = d?.[t._key], { attributes: S, listeners: w, setNodeRef: T, transform: E, transition: D, isDragging: O } = x({
-		id: t._key,
+function T({ row: e, columns: a, editableColumns: s, displayOnlyColumns: c, childEntity: u, validationErrors: d, refs: f, onCellChange: h, onDelete: g, onUndoDelete: _ }) {
+	let v = n(), y = !!e._deleted, b = d?.[e._key], { attributes: S, listeners: w, setNodeRef: T, transform: E, transition: D, isDragging: O } = x({
+		id: e._key,
 		disabled: y
 	}), k = {
 		transform: C.Translate.toString(E),
@@ -198,44 +199,44 @@ function T({ row: t, columns: n, editableColumns: s, displayOnlyColumns: c, chil
 					},
 					...S,
 					...w,
-					children: /* @__PURE__ */ p(e.grid, { size: 14 })
+					children: /* @__PURE__ */ p(r.grid, { size: 14 })
 				})
 			}),
-			n.map((e) => {
-				let n = u.fields.get(e), i = b?.includes(e), o = c.has(e), l = s.includes(e);
-				return y || o || !l ? /* @__PURE__ */ p("td", {
+			a.map((n) => {
+				let r = u.fields.get(n), i = b?.includes(n), a = c.has(n), l = s.includes(n);
+				return y || a || !l ? /* @__PURE__ */ p("td", {
 					style: {
 						...A,
 						textDecoration: y ? "line-through" : "none"
 					},
-					children: n ? a({
-						field: n,
-						fieldName: e,
-						value: t[e],
+					children: r ? o({
+						field: r,
+						fieldName: n,
+						value: e[n],
 						mode: "display",
-						record: t,
+						record: e,
 						refs: f,
 						t: v
-					}) : r(t[e])
-				}, e) : /* @__PURE__ */ p("td", {
+					}) : t(e[n])
+				}, n) : /* @__PURE__ */ p("td", {
 					style: {
 						...j,
 						outline: i ? "1px solid var(--danger)" : "none",
 						outlineOffset: -1,
 						borderRadius: i ? 4 : 0
 					},
-					title: i ? v("record.row.field_required", "{field} is required", { field: e }) : void 0,
-					children: n ? a({
-						field: n,
-						fieldName: e,
-						value: t[e],
+					title: i ? v("record.row.field_required", "{field} is required", { field: n }) : void 0,
+					children: r ? o({
+						field: r,
+						fieldName: n,
+						value: e[n],
 						mode: "edit",
-						onChange: (n) => h(t._key, e, n),
-						record: t,
+						onChange: (t) => h(e._key, n, t),
+						record: e,
 						refs: f,
 						t: v
-					}) : r(t[e])
-				}, e);
+					}) : t(e[n])
+				}, n);
 			}),
 			/* @__PURE__ */ p("td", {
 				style: {
@@ -245,13 +246,13 @@ function T({ row: t, columns: n, editableColumns: s, displayOnlyColumns: c, chil
 				},
 				children: y ? /* @__PURE__ */ p(i, {
 					size: 24,
-					icon: /* @__PURE__ */ p(e.refresh, { size: 12 }),
-					onClick: () => _(t._key),
+					icon: /* @__PURE__ */ p(r.refresh, { size: 12 }),
+					onClick: () => _(e._key),
 					title: v("record.row.undo_delete", "Undo delete")
 				}) : /* @__PURE__ */ p(i, {
 					size: 24,
-					icon: /* @__PURE__ */ p(e.trash, { size: 12 }),
-					onClick: () => g(t._key),
+					icon: /* @__PURE__ */ p(r.trash, { size: 12 }),
+					onClick: () => g(e._key),
 					title: v("record.row.delete", "Delete row")
 				})
 			})

package/dist-lib/DynamicIcon-DuBSz6TZ.js

@@ -0,0 +1,133 @@
+import { t as e } from "./Icons-lt-7lhYR.js";
+import { useEffect as t, useState as n, useSyncExternalStore as r } from "react";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/stores/icon-registry.ts
+var a = /* @__PURE__ */ new Map(), o = /* @__PURE__ */ new Set(), s = 0;
+function c() {
+	s += 1;
+	for (let e of o) e();
+}
+function l(e) {
+	a.clear();
+	for (let [t, n] of Object.entries(e)) a.set(t, n);
+	c();
+}
+function u(e) {
+	return a.get(e);
+}
+function d(e) {
+	return o.add(e), () => {
+		o.delete(e);
+	};
+}
+function f() {
+	return s;
+}
+//#endregion
+//#region src/components/shared/LucideIcon.tsx
+var p = /* @__PURE__ */ new Map(), m = null;
+function h() {
+	return m ||= import("lucide-react/dynamic.js").then((e) => e.dynamicIconImports), m;
+}
+function g({ name: r, size: a = 14, className: o, style: s }) {
+	let [c, l] = n(() => p.get(r)), [u, d] = n(!1);
+	if (t(() => {
+		let e = p.get(r);
+		if (e) {
+			l(() => e), d(!1);
+			return;
+		}
+		l(void 0), d(!1);
+		let t = !0;
+		return h().then((e) => {
+			let n = e[r];
+			if (!n) t && d(!0);
+			else return n().then((e) => {
+				p.set(r, e.default), t && (l(() => e.default), d(!1));
+			});
+		}), () => {
+			t = !1;
+		};
+	}, [r]), u) {
+		let t = e.folder;
+		return /* @__PURE__ */ i(t, {
+			size: a,
+			cls: o,
+			style: s
+		});
+	}
+	return c ? /* @__PURE__ */ i(c, {
+		size: a,
+		className: o,
+		style: s
+	}) : null;
+}
+//#endregion
+//#region src/components/shared/DynamicIcon.tsx
+var _ = "lucide:";
+function v({ name: t, size: n, className: a, style: o }) {
+	r(d, f, f);
+	let s = typeof n == "number" ? n : typeof n == "string" ? parseFloat(n) : 14, c = u(t);
+	if (c) return /* @__PURE__ */ i(y, {
+		def: c,
+		size: s,
+		className: a,
+		style: o
+	});
+	let l = e[t];
+	if (l) return /* @__PURE__ */ i(l, {
+		size: s,
+		cls: a,
+		style: o
+	});
+	let p = t.startsWith(_) ? t.slice(7) : t;
+	return /* @__PURE__ */ i(g, {
+		name: p,
+		size: s,
+		className: a,
+		style: o
+	});
+}
+function y({ def: e, size: t, className: n, style: r }) {
+	switch (e.kind) {
+		case "svg": return /* @__PURE__ */ i(b, {
+			paths: e.paths,
+			size: t,
+			className: n,
+			style: r
+		});
+		case "url": return /* @__PURE__ */ i("img", {
+			src: e.src,
+			alt: "",
+			"aria-hidden": "true",
+			width: t,
+			height: t,
+			className: n,
+			style: r
+		});
+		case "lucide": return /* @__PURE__ */ i(g, {
+			name: e.name,
+			size: t,
+			className: n,
+			style: r
+		});
+	}
+}
+function b({ paths: e, size: t, className: n, style: r }) {
+	return /* @__PURE__ */ i("svg", {
+		width: t,
+		height: t,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 1.5,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		className: n,
+		style: r,
+		"aria-hidden": "true",
+		children: e.map((e, t) => /* @__PURE__ */ i("path", { d: e }, t))
+	});
+}
+//#endregion
+export { l as a, f as i, g as n, d as o, u as r, v as t };

package/dist-lib/FieldRow-BXBBFOZh.js

@@ -0,0 +1,157 @@
+import { wn as e, wt as t } from "./useCurrentScreen--UovgvRj.js";
+import { t as n } from "./Icons-lt-7lhYR.js";
+import { t as r } from "./CopyButton-C0iEvaT1.js";
+import { createContext as i, useContext as a, useLayoutEffect as o, useRef as s, useState as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/detail-layout/FieldRow.tsx
+var d = 150, f = 560, p = 374, m = "20px", h = 4;
+function g(t, n) {
+	if ((t?.copyable || t?.type === "uuid") && n != null && n !== "") return e(n);
+}
+var _ = /* @__PURE__ */ new Set([
+	"text",
+	"rich_text",
+	"json",
+	"structure",
+	"multilang_text",
+	"multilang_array"
+]), v = i({
+	columns: 2,
+	stackPairs: !1
+});
+function y({ columns: e = 2, children: t }) {
+	let n = s(null), [r, i] = c(null);
+	o(() => {
+		let e = n.current;
+		if (!e) return;
+		let t = (e) => i(e > 0 ? e : null);
+		if (t(e.getBoundingClientRect().width), typeof ResizeObserver > "u") return;
+		let r = new ResizeObserver(([e]) => {
+			t(e.contentRect.width);
+		});
+		return r.observe(e), () => r.disconnect();
+	}, []);
+	let a = e === 1 || r !== null && r < f ? 1 : e, u = r === null ? null : (r - (a - 1) * 24) / a, d = u !== null && u < p;
+	return /* @__PURE__ */ l(v.Provider, {
+		value: {
+			columns: a,
+			stackPairs: d
+		},
+		children: /* @__PURE__ */ l("div", {
+			ref: n,
+			style: {
+				display: "grid",
+				gridTemplateColumns: `repeat(${a}, minmax(0, 1fr))`,
+				columnGap: 24,
+				rowGap: 2
+			},
+			children: t
+		})
+	});
+}
+function b({ label: e, children: i, span: o = !1, required: s, error: c, hint: f, actions: p, copyValue: g, mode: _ = "display", htmlFor: y, labelId: b, labelTitle: x, "data-testid": S }) {
+	let C = t(), w = a(v), T = o || w.stackPairs, E = !!c;
+	return /* @__PURE__ */ u("div", {
+		className: "detail-row",
+		"data-error": E || void 0,
+		"data-testid": S,
+		style: {
+			display: "flex",
+			flexDirection: T ? "column" : "row",
+			gap: T ? 4 : 16,
+			alignItems: T ? "stretch" : "flex-start",
+			padding: "6px 0",
+			...o ? { gridColumn: "1 / -1" } : null
+		},
+		children: [/* @__PURE__ */ u("div", {
+			style: {
+				width: T ? "auto" : d,
+				flexShrink: 0,
+				paddingTop: T ? 0 : h,
+				fontSize: 12,
+				lineHeight: m,
+				fontWeight: 500,
+				color: "var(--text-3)",
+				display: "flex",
+				alignItems: "flex-start",
+				gap: 2
+			},
+			children: [y ? /* @__PURE__ */ l("label", {
+				id: b,
+				htmlFor: y,
+				title: x || void 0,
+				children: e
+			}) : /* @__PURE__ */ l("span", {
+				id: b,
+				title: x || void 0,
+				children: e
+			}), s && _ === "edit" && /* @__PURE__ */ l("span", {
+				"aria-hidden": "true",
+				style: {
+					color: "var(--danger)",
+					marginLeft: 2
+				},
+				children: "*"
+			})]
+		}), /* @__PURE__ */ u("div", {
+			style: {
+				flex: 1,
+				minWidth: 0,
+				display: "flex",
+				flexDirection: "column",
+				gap: 3
+			},
+			children: [/* @__PURE__ */ u("div", {
+				style: {
+					display: "flex",
+					alignItems: "flex-start",
+					gap: 6,
+					minHeight: 24
+				},
+				children: [/* @__PURE__ */ l("div", {
+					style: {
+						flex: 1,
+						minWidth: 0,
+						fontSize: 13,
+						lineHeight: m,
+						color: "var(--text)",
+						overflowWrap: "anywhere",
+						paddingTop: _ === "display" && !T ? h : 0
+					},
+					children: E && _ === "edit" ? /* @__PURE__ */ l("div", {
+						style: {
+							borderRadius: 6,
+							boxShadow: "0 0 0 1.5px var(--danger)"
+						},
+						children: i
+					}) : i
+				}), (g || p) && /* @__PURE__ */ u("div", {
+					className: "detail-row-action",
+					style: {
+						display: "flex",
+						gap: 2,
+						flexShrink: 0,
+						marginTop: -2
+					},
+					children: [g && /* @__PURE__ */ l(r, {
+						value: g,
+						size: "sm",
+						title: C("record.field.copy_value", "Copy value")
+					}), p]
+				})]
+			}), (E || f != null) && /* @__PURE__ */ u("div", {
+				style: {
+					fontSize: 11.5,
+					lineHeight: 1.4,
+					color: E ? "var(--danger)" : "var(--text-3)",
+					display: "flex",
+					alignItems: "center",
+					gap: 4
+				},
+				children: [E && /* @__PURE__ */ l(n.warning, { size: 11 }), /* @__PURE__ */ l("span", { children: E ? c : f })]
+			})]
+		})]
+	});
+}
+//#endregion
+export { g as i, y as n, _ as r, b as t };