@declarion/react 0.60.0 → 0.63.0

package/dist-lib/ActionDialog-uiuse5W8.js

@@ -0,0 +1,374 @@
+import { E as e, Ft as t, un as n, wn as r, wt as i } from "./useCurrentScreen--UovgvRj.js";
+import { t as a } from "./Icons-lt-7lhYR.js";
+import { n as o, r as s } from "./CopyButton-C0iEvaT1.js";
+import { Q as c, V as l, c as u, f as d, n as f, o as p, q as m } from "./PropertyGridEditor-BTjscqfz.js";
+import { useCallback as h, useEffect as g, useMemo as _, useRef as v, useState as y } from "react";
+import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
+//#region src/components/actions/ActionDialog.tsx
+var C = /^\$row\.([a-zA-Z_][a-zA-Z0-9_]*(?:\.[a-zA-Z_][a-zA-Z0-9_]*)*)$/;
+function w(e, t) {
+	if (typeof e != "string") return e ?? "";
+	let n = e.match(C);
+	if (n) {
+		let r = n[1].split("."), i = t;
+		for (let e of r) {
+			if (typeof i != "object" || !i || !(e in i)) {
+				i = void 0;
+				break;
+			}
+			i = i[e];
+		}
+		return i === void 0 ? ((t == null || !(r[0] in t)) && typeof console < "u" && console.warn && console.warn(`ActionDialog: prefill template ${e} could not be resolved; row is missing field '${r[0]}'`), "") : i ?? "";
+	}
+	return u(e, { row: t });
+}
+function T(e) {
+	return {
+		type: e.type ?? "string",
+		required: e.required,
+		display: e.display ? {
+			name: e.display.name ?? {},
+			widget: e.display.widget
+		} : void 0,
+		enum: e.enum,
+		values: e.values,
+		structure: e.structure,
+		ref: n(e.ref)
+	};
+}
+function E(e, t) {
+	if (!e.includes("${")) return e;
+	let n = u(e, { params: t });
+	return n == null ? "" : r(n);
+}
+var D = /\$\{\s*([^}]+?)\s*\}/g;
+function O(e, t) {
+	let n = `params.${t}`;
+	for (let t of e.matchAll(D)) if (t[1] === n) return !0;
+	return !1;
+}
+function k({ param: e, value: t, onChange: n, statusGroups: r }) {
+	let a = i(), o = _(() => {
+		let t = r ? Object.entries(r) : [];
+		return [{
+			value: "",
+			label: e.required ? a("action.dialog.select_status_group", "Select status group…") : "—"
+		}, ...t.map(([e, t]) => ({
+			value: e,
+			label: a(t.name) || e
+		}))];
+	}, [
+		a,
+		r,
+		e.required
+	]);
+	return /* @__PURE__ */ x(m, {
+		value: typeof t == "string" ? t : "",
+		options: o,
+		onChange: (e) => n(e),
+		placeholder: a("action.dialog.select_status_group", "Select status group…")
+	});
+}
+function A({ param: e, value: t, onChange: n, statusGroups: r, formData: a }) {
+	let o = i(), s = _(() => {
+		if (!r) return [];
+		let t = e.filter?.status_group;
+		if (t) {
+			let e = E(t, a);
+			return e && r[e] ? r[e].statuses : [];
+		}
+		return Object.values(r).flatMap((e) => e.statuses);
+	}, [
+		r,
+		e.filter,
+		a
+	]), c = _(() => [{
+		value: "",
+		label: s.length === 0 ? o("action.dialog.select_status_group_first", "Select status group first") : o("action.dialog.select_status", "Select status…")
+	}, ...s.map((e) => ({
+		value: e.code,
+		label: o(e.name) || e.code
+	}))], [o, s]);
+	return /* @__PURE__ */ x(m, {
+		value: typeof t == "string" ? t : "",
+		options: c,
+		onChange: (e) => n(e),
+		placeholder: o("action.dialog.select_status", "Select status…")
+	});
+}
+function j({ open: n, onOpenChange: r, action: u, actionName: m, onSubmit: C, isPending: E, row: D, bulkSelection: j }) {
+	let M = i(), { data: N } = t(), P = u.resolved_params, F = u.resolved_hidden_defaults ?? {}, I = !!u.destructive, L = e(M, u), R = h(() => {
+		E || r(!1);
+	}, [E, r]), z = v(null);
+	g(() => {
+		n && z.current?.focus();
+	}, [n]);
+	let B = _(() => P ? Array.from(P) : [], [P]), V = _(() => {
+		if (u.entity && N) return N.entities[u.entity]?.status_groups;
+	}, [u.entity, N]), H = _(() => {
+		if (u.entity && N) return N.entities[u.entity];
+	}, [u.entity, N]), U = _(() => {
+		if (H) {
+			for (let [e, t] of H.fields) if (t.primary) return e;
+			return H.primary_key?.[0];
+		}
+	}, [H]), W = h(() => {
+		let e = { ...F };
+		for (let [t, n] of B) if (n.type === "id_array") e[t] = j && U ? j.map((e) => e[U]).filter((e) => e != null) : [];
+		else if (n.type === "entity_patch") e[t] = {};
+		else if (n.type === "bool") {
+			let r = w(n.default, D);
+			e[t] = r === !0 || r === "true";
+		} else e[t] = w(n.default, D);
+		return e;
+	}, [
+		B,
+		D,
+		j,
+		U
+	]), [G] = y(W), [K, q] = y(G);
+	p(n && JSON.stringify(K) !== JSON.stringify(G));
+	let J = h((e, t) => {
+		q((n) => {
+			let r = {
+				...n,
+				[e]: t
+			};
+			if (!P) return r;
+			for (let [t, n] of P) {
+				if (n.type !== "status") continue;
+				let i = n.filter?.status_group;
+				i && O(i, e) && (r[t] = "");
+			}
+			return r;
+		});
+	}, [P]), Y = h(() => {
+		let e = { ...K };
+		for (let [t, n] of B) {
+			let r = K[t], i = r == null || r === "";
+			if (n.required && i) return;
+			i && delete e[t];
+		}
+		C(e);
+	}, [
+		K,
+		B,
+		C
+	]);
+	return n ? /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x("div", {
+		onClick: R,
+		style: {
+			position: "fixed",
+			inset: 0,
+			background: "var(--scrim)",
+			zIndex: 60,
+			backdropFilter: "blur(2px)"
+		}
+	}), /* @__PURE__ */ S("div", {
+		"data-testid": "action-dialog",
+		ref: z,
+		role: "dialog",
+		"aria-modal": "true",
+		"aria-busy": E,
+		"aria-label": m,
+		tabIndex: -1,
+		onKeyDown: (e) => {
+			e.key === "Escape" && R();
+		},
+		style: {
+			position: "fixed",
+			top: "50%",
+			left: "50%",
+			transform: "translate(-50%, -50%)",
+			zIndex: 61,
+			width: "min(480px, calc(100vw - var(--safe-area-left) - var(--safe-area-right) - 16px))",
+			maxHeight: "calc(var(--app-height) - var(--safe-area-top) - var(--safe-area-bottom) - 16px)",
+			background: "var(--surface)",
+			borderRadius: 12,
+			boxShadow: "var(--shadow-lg)",
+			border: "1px solid var(--border)",
+			overflow: "hidden",
+			display: "flex",
+			flexDirection: "column",
+			boxSizing: "border-box",
+			minWidth: 0,
+			outline: "none"
+		},
+		children: [
+			/* @__PURE__ */ S("div", {
+				style: {
+					padding: "14px 18px",
+					display: "flex",
+					alignItems: "center",
+					gap: 10
+				},
+				children: [
+					/* @__PURE__ */ x("span", {
+						style: {
+							width: 28,
+							height: 28,
+							borderRadius: 7,
+							background: I ? "var(--danger-soft)" : "var(--accent-soft)",
+							color: I ? "var(--danger)" : "var(--accent)",
+							display: "inline-flex",
+							alignItems: "center",
+							justifyContent: "center",
+							flexShrink: 0
+						},
+						children: x(I ? a.trash : a.bolt, { size: 15 })
+					}),
+					/* @__PURE__ */ S("div", {
+						style: {
+							flex: 1,
+							minWidth: 0
+						},
+						children: [/* @__PURE__ */ x("div", {
+							style: {
+								fontSize: 14,
+								fontWeight: 600,
+								color: "var(--text)"
+							},
+							children: m
+						}), /* @__PURE__ */ x("div", {
+							style: {
+								fontSize: 11.5,
+								color: "var(--text-3)",
+								marginTop: 2
+							},
+							children: M(u.display?.description) || (B.length > 0 ? M("action.dialog.params_hint", "Fill in the parameters below to execute this action.") : "")
+						})]
+					}),
+					/* @__PURE__ */ x(o, {
+						icon: /* @__PURE__ */ x(a.x, { size: 14 }),
+						onClick: R
+					})
+				]
+			}),
+			/* @__PURE__ */ S("div", {
+				style: {
+					padding: "12px 18px 16px",
+					display: "flex",
+					flexDirection: "column",
+					gap: 12,
+					overflowY: "auto",
+					minWidth: 0,
+					minHeight: 0
+				},
+				children: [L && /* @__PURE__ */ x("div", {
+					style: {
+						fontSize: 12.5,
+						lineHeight: 1.5,
+						color: "var(--text-2)",
+						background: I ? "var(--danger-soft)" : "var(--surface-2)",
+						border: "1px solid var(--divider)",
+						borderRadius: 8,
+						padding: "10px 12px"
+					},
+					children: L
+				}), /* @__PURE__ */ x("fieldset", {
+					disabled: E,
+					style: {
+						border: 0,
+						margin: 0,
+						padding: 0,
+						minInlineSize: 0,
+						display: "flex",
+						flexDirection: "column",
+						gap: 12,
+						pointerEvents: E ? "none" : void 0,
+						opacity: E ? .6 : 1
+					},
+					children: B.map(([e, t]) => {
+						let n = M(t.display?.name) || e;
+						if (t.type === "id_array") return null;
+						let r;
+						if (t.type === "entity_patch") {
+							let n = typeof t.filter?.targets == "string" ? t.filter.targets : void 0;
+							r = /* @__PURE__ */ x(f, {
+								entity: H,
+								filterTargets: n,
+								selectedRows: j,
+								value: K[e] ?? {},
+								onChange: (t) => J(e, t)
+							});
+						} else if (t.type === "status_group") r = /* @__PURE__ */ x(k, {
+							param: t,
+							value: K[e],
+							onChange: (t) => J(e, t),
+							statusGroups: V,
+							formData: K
+						});
+						else if (t.type === "status") r = /* @__PURE__ */ x(A, {
+							param: t,
+							value: K[e],
+							onChange: (t) => J(e, t),
+							statusGroups: V,
+							formData: K
+						});
+						else {
+							let n = T(t);
+							r = d({
+								field: n,
+								fieldName: e,
+								value: K[e],
+								mode: "edit",
+								onChange: (t) => J(e, t),
+								t: M
+							});
+						}
+						return /* @__PURE__ */ S("div", {
+							style: { minWidth: 0 },
+							children: [
+								/* @__PURE__ */ x(l, {
+									required: t.required,
+									children: n
+								}),
+								r,
+								t.display?.description && /* @__PURE__ */ x("p", {
+									style: {
+										fontSize: 11,
+										color: "var(--text-3)",
+										marginTop: 4,
+										marginBottom: 0
+									},
+									children: M(t.display.description)
+								})
+							]
+						}, e);
+					})
+				})]
+			}),
+			/* @__PURE__ */ S("div", {
+				style: {
+					padding: "10px 16px",
+					borderTop: "1px solid var(--divider)",
+					display: "flex",
+					alignItems: "center",
+					justifyContent: "flex-end",
+					gap: 8,
+					background: "var(--surface-2)",
+					flexWrap: "wrap",
+					minWidth: 0
+				},
+				children: [
+					/* @__PURE__ */ x("div", { style: { flex: 1 } }),
+					/* @__PURE__ */ x(s, {
+						onClick: R,
+						disabled: E,
+						children: M("dialog.cancel", "Cancel")
+					}),
+					/* @__PURE__ */ x(s, {
+						kind: "primary",
+						danger: I,
+						icon: x(E ? c : I ? a.trash : a.bolt, { size: 13 }),
+						onClick: Y,
+						disabled: E,
+						children: E ? M("action.dialog.working", "Working…") : m || M("dialog.confirm", "Confirm")
+					})
+				]
+			})
+		]
+	})] }) : null;
+}
+//#endregion
+export { j as ActionDialog };

package/dist-lib/ActionResultDialog.impl-BUBm9Ck3.js

@@ -0,0 +1,273 @@
+import { $ as e, Q as t, nt as n, rt as r, wt as i } from "./useCurrentScreen--UovgvRj.js";
+import { t as a } from "./Icons-lt-7lhYR.js";
+import { n as o, r as s, t as c } from "./CopyButton-C0iEvaT1.js";
+import { useEffect as l, useRef as u, useState as d } from "react";
+import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
+//#region src/components/actions/ActionResultDialog.impl.tsx
+function h({ open: e, onClose: t, display: n }) {
+	let r = i(), c = u(null);
+	return l(() => {
+		e && c.current?.focus();
+	}, [e]), e ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("div", { style: {
+		position: "fixed",
+		inset: 0,
+		background: "var(--scrim)",
+		zIndex: 60,
+		backdropFilter: "blur(2px)"
+	} }), /* @__PURE__ */ m("div", {
+		ref: c,
+		role: "dialog",
+		"aria-modal": "true",
+		"aria-label": n.title ?? r("action.result.title", "Action Result"),
+		tabIndex: -1,
+		onKeyDown: (e) => {
+			e.key === "Escape" && t();
+		},
+		style: {
+			position: "fixed",
+			top: "50%",
+			left: "50%",
+			transform: "translate(-50%, -50%)",
+			zIndex: 61,
+			width: "calc(100vw - 24px)",
+			maxWidth: 480,
+			maxHeight: "calc(var(--app-height) - var(--safe-area-top) - var(--safe-area-bottom) - 16px)",
+			background: "var(--surface)",
+			borderRadius: 12,
+			boxShadow: "var(--shadow-lg)",
+			border: "1px solid var(--border)",
+			overflow: "hidden",
+			display: "flex",
+			flexDirection: "column",
+			outline: "none"
+		},
+		children: [
+			/* @__PURE__ */ m("div", {
+				style: {
+					padding: "14px 18px",
+					display: "flex",
+					alignItems: "center",
+					gap: 10
+				},
+				children: [
+					/* @__PURE__ */ p("span", {
+						style: {
+							width: 28,
+							height: 28,
+							borderRadius: 7,
+							background: "var(--success-soft)",
+							color: "var(--success)",
+							display: "inline-flex",
+							alignItems: "center",
+							justifyContent: "center",
+							flexShrink: 0
+						},
+						children: /* @__PURE__ */ p(a.check, { size: 15 })
+					}),
+					/* @__PURE__ */ m("div", {
+						style: {
+							flex: 1,
+							minWidth: 0
+						},
+						children: [/* @__PURE__ */ p("div", {
+							style: {
+								fontSize: 14,
+								fontWeight: 600,
+								color: "var(--text)"
+							},
+							children: n.title ?? r("action.result.title", "Action Result")
+						}), n.message && /* @__PURE__ */ p("div", {
+							style: {
+								fontSize: 11.5,
+								color: "var(--text-3)",
+								marginTop: 2
+							},
+							children: n.message
+						})]
+					}),
+					/* @__PURE__ */ p(o, {
+						icon: /* @__PURE__ */ p(a.x, { size: 14 }),
+						onClick: t
+					})
+				]
+			}),
+			n.fields && n.fields.length > 0 && /* @__PURE__ */ p("div", {
+				style: {
+					padding: "12px 18px 16px",
+					display: "flex",
+					flexDirection: "column",
+					gap: 12,
+					overflowY: "auto"
+				},
+				children: n.fields.map((e, n) => /* @__PURE__ */ p(g, {
+					field: e,
+					onNavigate: t
+				}, n))
+			}),
+			/* @__PURE__ */ m("div", {
+				style: {
+					padding: "10px 16px",
+					borderTop: "1px solid var(--divider)",
+					display: "flex",
+					alignItems: "center",
+					justifyContent: "flex-end",
+					flexWrap: "wrap",
+					gap: 8,
+					background: "var(--surface-2)",
+					flexShrink: 0
+				},
+				children: [/* @__PURE__ */ p("div", { style: { flex: 1 } }), /* @__PURE__ */ p(s, {
+					kind: "primary",
+					onClick: t,
+					children: r("dialog.close", "Close")
+				})]
+			})
+		]
+	})] }) : null;
+}
+function g({ field: o, onNavigate: s }) {
+	let l = i(), u = i("errors"), f = o.href ?? o.download_url ?? o.value, h = o.type === "download", g = h || o.type === "link", _ = f ? r(f) : void 0, [v, y] = d(!1), [b, x] = d(null);
+	async function S() {
+		if (_) {
+			y(!0), x(null);
+			try {
+				await e(u, _, o.filename);
+			} catch (e) {
+				x(t(u, e));
+			} finally {
+				y(!1);
+			}
+		}
+	}
+	let C = {
+		display: "inline-flex",
+		alignItems: "center",
+		justifyContent: "center",
+		gap: 6,
+		height: 32,
+		width: "fit-content",
+		maxWidth: "100%",
+		padding: "0 12px",
+		borderRadius: 6,
+		border: "1px solid var(--border)",
+		background: h ? "var(--accent)" : "var(--surface)",
+		color: h ? "var(--accent-foreground)" : "var(--text)",
+		fontSize: 12.5,
+		fontWeight: 500,
+		textDecoration: "none",
+		whiteSpace: "nowrap"
+	}, w = g && !h, T = n(_), E = {
+		flex: 1,
+		minWidth: 0,
+		display: "inline-flex",
+		alignItems: "center",
+		gap: 6,
+		color: "var(--accent)",
+		textDecoration: "underline",
+		fontSize: 12.5,
+		lineHeight: 1.4
+	};
+	return /* @__PURE__ */ m("div", {
+		style: {
+			display: "flex",
+			flexDirection: "column",
+			gap: 4
+		},
+		children: [
+			/* @__PURE__ */ p("div", {
+				style: {
+					fontSize: 11.5,
+					fontWeight: 500,
+					color: "var(--text-3)"
+				},
+				children: o.label
+			}),
+			h && _ && /* @__PURE__ */ m("button", {
+				type: "button",
+				onClick: S,
+				disabled: v,
+				style: {
+					...C,
+					cursor: v ? "default" : "pointer"
+				},
+				children: [p(v ? a.loader : a.download, { size: 14 }), /* @__PURE__ */ p("span", { children: v ? l("action.result.downloading", "Downloading…") : l("action.result.download", "Download") })]
+			}),
+			b && /* @__PURE__ */ p("div", {
+				style: {
+					fontSize: 11.5,
+					color: "var(--danger)"
+				},
+				children: b
+			}),
+			w && _ ? /* @__PURE__ */ m("div", {
+				style: {
+					display: "flex",
+					alignItems: "center",
+					gap: 8,
+					minWidth: 0
+				},
+				children: [T ? /* @__PURE__ */ m("a", {
+					href: _,
+					target: "_blank",
+					rel: "noopener noreferrer",
+					style: E,
+					title: o.value,
+					children: [/* @__PURE__ */ p(a.link, {
+						size: 14,
+						style: { flexShrink: 0 }
+					}), /* @__PURE__ */ p("span", {
+						style: {
+							overflow: "hidden",
+							textOverflow: "ellipsis",
+							whiteSpace: "nowrap"
+						},
+						children: o.value
+					})]
+				}) : /* @__PURE__ */ m("a", {
+					href: _,
+					onClick: s,
+					style: E,
+					title: o.value,
+					children: [/* @__PURE__ */ p(a.link, {
+						size: 14,
+						style: { flexShrink: 0 }
+					}), /* @__PURE__ */ p("span", {
+						style: {
+							overflow: "hidden",
+							textOverflow: "ellipsis",
+							whiteSpace: "nowrap"
+						},
+						children: o.value
+					})]
+				}), o.copyable && /* @__PURE__ */ p(c, { value: o.value })]
+			}) : /* @__PURE__ */ m("div", {
+				style: {
+					position: "relative",
+					width: "100%"
+				},
+				children: [/* @__PURE__ */ p("div", {
+					className: o.monospace ? "mono" : void 0,
+					style: {
+						borderRadius: 6,
+						border: "1px solid var(--border)",
+						background: "var(--surface-2)",
+						padding: o.copyable ? "8px 40px 8px 10px" : "8px 10px",
+						fontSize: 12.5,
+						wordBreak: "break-all",
+						color: "var(--text)"
+					},
+					children: o.value
+				}), o.copyable && /* @__PURE__ */ p("div", {
+					style: {
+						position: "absolute",
+						top: 4,
+						right: 4
+					},
+					children: /* @__PURE__ */ p(c, { value: o.value })
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { h as ActionResultDialog };