@declarion/react 0.65.0 → 0.66.0

package/dist-lib/components/file-widgets/host.js

@@ -0,0 +1,75 @@
+import { fieldDisplayName as e, getDisplayValue as t } from "../../types/schema.js";
+import { createRichTextValue as n, richTextMarkdown as r } from "../../lib/rich-text.js";
+import { getFileWidget as i } from "./registry.js";
+import { UnknownFileWidget as a } from "./UnknownFileWidget.js";
+import { registerBuiltinFileWidgets as o } from "./builtins.js";
+import { renderField as s } from "../fields/index.js";
+import { jsx as c } from "react/jsx-runtime";
+//#region src/components/file-widgets/host.tsx
+o();
+function l(e, t) {
+	return e.files?.get(t);
+}
+function u(e, t) {
+	return Object.prototype.hasOwnProperty.call(e, t) ? e[t] ?? null : e.$files?.[t] ?? null;
+}
+function d(e, t, r) {
+	if (l(e, r)) return u(t, r);
+	let i = e.fields.get(r);
+	return i?.type === "rich_text" && i.files?.mode === "rich_text_inline" ? n(t[r], u(t, r)) : t[r];
+}
+function f(e, t, n) {
+	let r = d(e, t, n);
+	return r == null || r === "" ? !1 : Array.isArray(r) ? r.length > 0 : typeof r != "object" || Object.keys(r).length > 0;
+}
+function p(e, t, n) {
+	let i = e.fields.get(t);
+	return i?.type === "rich_text" && i.files?.mode === "rich_text_inline" ? r(n) : n;
+}
+function m(t, n, r, i) {
+	let a = l(n, r);
+	if (a) return a.name || r;
+	let o = n.fields.get(r);
+	return o ? e(t, o, r, i) : r;
+}
+function h(e) {
+	let { entity: n, entityCode: r, fieldName: o, record: f, mode: p, onChange: m, refs: h, disabled: g, surface: _, entities: v, screens: y, t: b, fieldId: x, labelId: S, structure: C, detailScreen: w } = e, T = l(n, o);
+	if (T) {
+		let e = T.display?.widget ?? "", s = i(e);
+		return s ? /* @__PURE__ */ c(s, {
+			field: T,
+			fieldName: o,
+			entityCode: r,
+			value: u(f, o),
+			recordTitle: t(b, f, n),
+			mode: p,
+			onChange: m,
+			disabled: g,
+			fieldId: x
+		}) : /* @__PURE__ */ c(a, { widgetCode: e });
+	}
+	let E = n.fields.get(o), D = C && p === "display" && E ? {
+		...E,
+		structure: C
+	} : E;
+	return D ? s({
+		field: D,
+		entityCode: r,
+		fieldName: o,
+		value: d(n, f, o),
+		mode: p,
+		onChange: m,
+		record: f,
+		refs: h,
+		surface: _,
+		entity: r && v ? v[r] : void 0,
+		entities: v,
+		screens: y,
+		t: b,
+		fieldId: x,
+		labelId: S,
+		detailScreen: w
+	}) : null;
+}
+//#endregion
+export { l as getEntityFileField, u as getFileFieldValue, d as getSchemaFieldValue, h as renderSchemaField, m as resolveSchemaFieldLabel, f as schemaFieldHasValue, p as serializeSchemaFieldValue };

package/dist-lib/{payload-DioMoxMX.js → components/file-widgets/payload.js}

@@ -1,5 +1,5 @@
-import { D as e, O as t } from "./PropertyGridEditor-XrP6TZ5s.js";
-import { d as n, f as r, u as i } from "./variants-vUtfBbE6.js";
+import { extractDeclarionFileIds as e, richTextMarkdown as t } from "../../lib/rich-text.js";
+import { getEntityFileField as n, getFileFieldValue as r, getSchemaFieldValue as i } from "./host.js";
 //#region src/components/file-widgets/payload.ts
 function a(e) {
 	return !e || Array.isArray(e) ? null : e;
@@ -39,15 +39,15 @@ function f(e) {
 	let { entity: t, formData: l, record: f, isNew: p } = e, h = {};
 	for (let e of t.files?.names() ?? []) {
 		if (!Object.prototype.hasOwnProperty.call(l, e)) continue;
-		let r = i(t, e);
-		if (!r) continue;
-		let m = c(r, l[e]);
+		let i = n(t, e);
+		if (!i) continue;
+		let m = c(i, l[e]);
 		if (p) {
-			if (r.mode === "array" ? o(m).length === 0 : r.mode === "named_map" ? Object.values(s(m)).every((e) => e == null) : a(m) == null) continue;
-			h[e] = u(r, m);
+			if (i.mode === "array" ? o(m).length === 0 : i.mode === "named_map" ? Object.values(s(m)).every((e) => e == null) : a(m) == null) continue;
+			h[e] = u(i, m);
 			continue;
 		}
-		let g = c(r, f ? n(f, e) : null), _ = u(r, m), v = u(r, g);
+		let g = c(i, f ? r(f, e) : null), _ = u(i, m), v = u(i, g);
 		d(_) !== d(v) && (h[e] = _);
 	}
 	let g = t.fields;
@@ -55,17 +55,17 @@ function f(e) {
 	for (let e of g.names()) {
 		let n = g.get(e)?.files;
 		if (!n || n.mode !== "rich_text_inline" || !Object.prototype.hasOwnProperty.call(l, e)) continue;
-		let i = m(n, l[e]);
+		let r = m(n, l[e]);
 		if (p) {
-			if (i.clear) continue;
-			h[e] = i;
+			if (r.clear) continue;
+			h[e] = r;
 			continue;
 		}
-		let a = m(n, f ? r({
+		let a = m(n, f ? i({
 			...t,
 			fields: g
 		}, f, e) : null);
-		d(i) !== d(a) && (h[e] = i);
+		d(r) !== d(a) && (h[e] = r);
 	}
 	return h;
 }
@@ -83,4 +83,4 @@ function m(n, r) {
 	})) };
 }
 //#endregion
-export { p as n, f as t };
+export { u as buildFileFieldPatch, f as buildFilesPayload, p as collectCommittedFileIds };

package/dist-lib/components/file-widgets/registry.js

@@ -0,0 +1,13 @@
+//#region src/components/file-widgets/registry.ts
+var e = /* @__PURE__ */ new Map();
+function t(t, n) {
+	e.set(t, n);
+}
+function n(t) {
+	return e.get(t);
+}
+function r(t) {
+	return e.has(t);
+}
+//#endregion
+export { n as getFileWidget, r as hasFileWidget, t as registerFileWidget };

package/dist-lib/components/file-widgets/upload.js

@@ -0,0 +1,180 @@
+import { errorCodeOf as e, isApiErrorBody as t } from "../../types/api.js";
+import { awaitEmbedToken as n, clearEmbedToken as r, isEmbedTokenMode as i } from "../../embed/token.js";
+import { callHandler as a, ensureRefresh as o, getPersistentAuthFailureHandler as s, isTransientFailure as c } from "../../api/client.js";
+import { failureTitle as l } from "../../lib/failure.js";
+//#region src/components/file-widgets/upload.ts
+var u = class extends Error {
+	code;
+	status;
+	raw;
+	constructor(e, t, n, r) {
+		super(n), this.code = t, this.status = e, this.raw = r;
+	}
+	ext(e) {
+		return this.raw?.[e];
+	}
+};
+function d(e, n, r) {
+	if (!(r instanceof u)) return {
+		code: "UNKNOWN",
+		message: l(n, r)
+	};
+	if (t(r.raw)) return {
+		code: r.code,
+		message: r.message
+	};
+	let i = {
+		code: r.code,
+		message: n(r.code, r.message) || n("file.upload_failed", "The file could not be uploaded.")
+	};
+	return r.code === "file.upload_failed" && (i.detail = e("file.upload.status", "HTTP status {status}", { status: r.status })), i;
+}
+async function f(e) {
+	let t = i();
+	try {
+		return await p(e, t ? await n() : null);
+	} catch (i) {
+		if (!(i instanceof u && i.status === 401 && (i.code === "auth.token_refresh_needed" || i.code === "auth.unauthorized"))) throw i;
+		let a = null;
+		try {
+			t ? (r(), a = await n()) : await o();
+		} catch (e) {
+			throw !t && c(e) ? e : (s()(), i);
+		}
+		try {
+			return await p(e, a);
+		} catch (e) {
+			throw e instanceof u && e.status === 401 && s()(), e;
+		}
+	}
+}
+function p(n, r) {
+	let { file: i, entityCode: a, fieldCode: o, slotCode: s, onProgress: c, signal: l } = n;
+	return new Promise((n, d) => {
+		let f = new XMLHttpRequest();
+		if (f.open("POST", m(a, o, s)), f.withCredentials = r === null, r && f.setRequestHeader("Authorization", `Bearer ${r}`), f.upload.onprogress = (e) => {
+			if (!c) return;
+			let t = e.lengthComputable ? e.total : i.size, n = t > 0 ? Math.min(100, Math.round(e.loaded / t * 100)) : 0;
+			c({
+				loaded: e.loaded,
+				total: t,
+				pct: n
+			});
+		}, f.onload = () => {
+			let r = f.responseText || "", i = null;
+			try {
+				i = r ? JSON.parse(r) : null;
+			} catch {}
+			if (f.status >= 200 && f.status < 300) {
+				let e = h(i);
+				if (!e || !e.id) {
+					d(new u(f.status, "file.upload_no_id", "The upload finished but returned no file identifier."));
+					return;
+				}
+				n(e);
+				return;
+			}
+			let a = t(i) ? e(i.type) : "", o = t(i) ? i.title : "";
+			d(new u(f.status, a || "file.upload_failed", o, i));
+		}, f.onerror = () => {
+			d(new u(0, "file.upload_network", "The upload stopped because the network connection failed."));
+		}, f.onabort = () => {
+			d(new u(0, "ABORTED", "Upload aborted"));
+		}, l) {
+			if (l.aborted) {
+				f.abort(), d(new u(0, "ABORTED", "Upload aborted"));
+				return;
+			}
+			l.addEventListener("abort", () => f.abort(), { once: !0 });
+		}
+		let p = new FormData();
+		p.append("file", i, i.name), f.send(p);
+	});
+}
+function m(e, t, n) {
+	let r = new URLSearchParams();
+	e && t && (r.set("entity_code", e), r.set("field_code", t), n && r.set("slot_code", n));
+	let i = r.toString();
+	return i ? `/api/files/upload?${i}` : "/api/files/upload";
+}
+function h(e) {
+	return _(e) ? _(e.result) ? h(e.result) : _(e.file) ? g(e.file) : typeof e.id == "string" ? e : null : null;
+}
+function g(e) {
+	let t = v(e.file_id);
+	return t ? {
+		id: t,
+		filename: v(e.filename_original) ?? v(e.filename_normalized) ?? t,
+		content_type: v(e.content_type) ?? "application/octet-stream",
+		size_bytes: y(e.size_bytes) ?? 0,
+		sha256: v(e.sha256) ?? "",
+		dedup: b(e.dedup)
+	} : null;
+}
+function _(e) {
+	return typeof e == "object" && !!e;
+}
+function v(e) {
+	return typeof e == "string" ? e : void 0;
+}
+function y(e) {
+	return typeof e == "number" ? e : void 0;
+}
+function b(e) {
+	return typeof e == "boolean" ? e : void 0;
+}
+async function x(e) {
+	await a("files.discard", { file_id: e });
+}
+var S = "This file is larger than the deployment allows.", C = "This file does not satisfy the field it was attached to.";
+function w(e, t, n) {
+	if (n && e.size > n) return {
+		code: "file.too_large",
+		message: S,
+		size: e.size,
+		max: n
+	};
+	if (t && t.length > 0) {
+		let n = e.type || "application/octet-stream";
+		if (!t.some((e) => E(e, n))) return {
+			code: "file.field_violation",
+			message: C,
+			type: n
+		};
+	}
+	return null;
+}
+function T(e, t, n) {
+	return n.code === "file.too_large" ? {
+		code: n.code,
+		message: t(n.code, S),
+		detail: e("file.upload.size_limit", "{size} of {max} allowed", {
+			size: D(n.size),
+			max: D(n.max)
+		})
+	} : {
+		code: n.code,
+		message: t(n.code, C),
+		detail: e("file.upload.type", "Type: {type}", { type: n.type })
+	};
+}
+function E(e, t) {
+	if (e === "*/*" || e === "*") return !0;
+	if (e.endsWith("/*")) {
+		let n = e.slice(0, e.length - 1);
+		return t.startsWith(n);
+	}
+	return e === t;
+}
+function D(e) {
+	if (e < 1024) return `${e} B`;
+	let t = [
+		"KB",
+		"MB",
+		"GB"
+	], n = e / 1024, r = 0;
+	for (; n >= 1024 && r < t.length - 1;) n /= 1024, r++;
+	return `${n.toFixed(n >= 10 ? 0 : 1)} ${t[r]}`;
+}
+//#endregion
+export { u as UploadError, x as discardFile, D as formatBytes, T as uploadCheckFailure, d as uploadFailure, f as uploadFile, w as validateClientSide };

package/dist-lib/components/file-widgets/useEmbedFileSrc.js

@@ -0,0 +1,45 @@
+import { isEmbedTokenMode as e } from "../../embed/token.js";
+import { DerivationPendingError as t, resolveEmbedFileSrc as n } from "../../embed/file-src.js";
+import { useCallback as r, useEffect as i, useRef as a, useState as o } from "react";
+//#region src/components/file-widgets/useEmbedFileSrc.ts
+function s(e) {
+	return typeof e == "object" ? `derivation:${e.derivation}` : e;
+}
+function c(e) {
+	return e.startsWith("derivation:") ? { derivation: e.slice(11) } : e === "download" ? "download" : "preview";
+}
+function l(r, a, l) {
+	let u = s(a), [d, f] = o(() => e() ? void 0 : l);
+	return i(() => {
+		e() || f(l);
+	}, [l]), i(() => {
+		if (!e()) return;
+		if (!r) {
+			f(void 0);
+			return;
+		}
+		let i = null, a = !1, o = new AbortController();
+		return f(void 0), n(r, c(u), o.signal).then((e) => {
+			a ? e.kind === "blob" && URL.revokeObjectURL(e.url) : (e.kind === "blob" && (i = e.url), f(e.url));
+		}).catch((e) => {
+			a || (e instanceof t ? f(void 0) : e instanceof DOMException && e.name === "AbortError" || (console.error("[declarion-embed] file src resolution failed:", e), f(void 0)));
+		}), () => {
+			a = !0, o.abort(), i && URL.revokeObjectURL(i);
+		};
+	}, [r, u]), d;
+}
+function u() {
+	let o = a([]);
+	return i(() => () => {
+		for (let e of o.current) URL.revokeObjectURL(e);
+		o.current = [];
+	}, []), { open: r((r, i, a) => {
+		e() ? r && n(r, i).then((e) => {
+			e.kind === "blob" && o.current.push(e.url), window.open(e.url, "_blank", "noopener");
+		}).catch((e) => {
+			e instanceof t || console.error("[declarion-embed] file open failed:", e);
+		}) : a && window.open(a, "_blank", "noopener");
+	}, []) };
+}
+//#endregion
+export { u as useEmbedFileOpener, l as useEmbedFileSrc };

package/dist-lib/components/file-widgets/value.js

@@ -0,0 +1,12 @@
+//#region src/components/file-widgets/value.ts
+function e(e) {
+	return typeof e == "object" && !!e && typeof e.id == "string";
+}
+function t(t) {
+	return t ? Array.isArray(t) ? t.find(e) ?? null : e(t) ? t : null : null;
+}
+function n(t) {
+	return t ? Array.isArray(t) ? t.filter(e) : e(t) ? [t] : [] : [];
+}
+//#endregion
+export { n as fileArrayFromValue, e as isHydratedFile, t as singleFileFromValue };

package/dist-lib/components/filters/FilterChips.js

@@ -0,0 +1,123 @@
+import { Icon as e } from "../primitives/Icons.js";
+import { Btn as t } from "../primitives/Btn.js";
+import { Chip as n } from "../primitives/Chip.js";
+import { useText as r } from "../../hooks/useText.js";
+import { FilterConditionValue as i } from "./FilterConditionValue.js";
+import { Fragment as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/filters/FilterChips.tsx
+function c({ filters: n, onRemove: i, onRemoveAtPath: c, onClearAll: d, onChipClick: f, fieldLabel: p = (e) => e, resolveValue: m }) {
+	let h = r();
+	return n.length === 0 ? null : /* @__PURE__ */ s("div", {
+		style: {
+			display: "flex",
+			alignItems: "center",
+			gap: 8,
+			flexWrap: "wrap",
+			paddingBottom: 12
+		},
+		children: [n.map((e, t) => /* @__PURE__ */ s(a, { children: [t > 0 && /* @__PURE__ */ o(u, { join: "and" }), /* @__PURE__ */ o(l, {
+			node: e,
+			path: [t],
+			fieldLabel: p,
+			resolveValue: m,
+			onRemove: c || i ? (e, t) => {
+				c ? c(e) : i?.(t);
+			} : void 0,
+			onClick: f
+		})] }, t)), /* @__PURE__ */ o(t, {
+			kind: "ghost",
+			size: "xs",
+			icon: /* @__PURE__ */ o(e.x, { size: 11 }),
+			onClick: d,
+			children: h("filter.chips.clear_all", "Clear all")
+		})]
+	});
+}
+function l({ node: e, path: t, fieldLabel: n, resolveValue: r, onRemove: i, onClick: c }) {
+	if (e.field && e.op) return /* @__PURE__ */ o(d, {
+		node: e,
+		fieldLabel: n,
+		resolveValue: r,
+		onRemove: i ? () => i(t, e.field) : void 0,
+		onClick: c
+	});
+	let f = e.or ?? e.and ?? [], p = e.or ? "or" : "and";
+	return /* @__PURE__ */ s("span", {
+		"data-testid": `filter-${e.or ? "or" : "and"}-group`,
+		style: {
+			display: "inline-flex",
+			alignItems: "center",
+			gap: 4,
+			flexWrap: "wrap",
+			border: "1px solid var(--divider)",
+			borderRadius: "var(--radius-md)",
+			padding: "2px 5px"
+		},
+		children: [
+			/* @__PURE__ */ o("span", {
+				"aria-hidden": "true",
+				style: {
+					color: "var(--text-3)",
+					fontWeight: 600
+				},
+				children: "("
+			}),
+			f.map((e, d) => /* @__PURE__ */ s(a, { children: [d > 0 && /* @__PURE__ */ o(u, { join: p }), /* @__PURE__ */ o(l, {
+				node: e,
+				path: [...t, d],
+				fieldLabel: n,
+				resolveValue: r,
+				onRemove: i,
+				onClick: c
+			})] }, d)),
+			/* @__PURE__ */ o("span", {
+				"aria-hidden": "true",
+				style: {
+					color: "var(--text-3)",
+					fontWeight: 600
+				},
+				children: ")"
+			})
+		]
+	});
+}
+function u({ join: e }) {
+	let t = r(), n = e === "or" ? t("filter.join.or", "OR") : t("filter.join.and", "AND");
+	return /* @__PURE__ */ o("span", {
+		"aria-label": n,
+		style: {
+			fontSize: 11,
+			color: "var(--text-3)",
+			fontWeight: 600,
+			padding: "0 2px"
+		},
+		children: n
+	});
+}
+function d({ node: t, fieldLabel: a, resolveValue: c, onRemove: l, onClick: u }) {
+	let d = r(), f = /* @__PURE__ */ o(e.filter, { size: 11 });
+	return /* @__PURE__ */ o(n, {
+		tone: "slate",
+		icon: f,
+		onClick: u,
+		onRemove: l,
+		removeLabel: d("filter.drawer.remove_condition", "Remove {field} condition", { field: a(t.field) }),
+		children: /* @__PURE__ */ s("span", { children: [
+			/* @__PURE__ */ o("span", {
+				style: { color: "var(--text-3)" },
+				children: a(t.field)
+			}),
+			" ",
+			/* @__PURE__ */ o("span", {
+				style: { fontWeight: 600 },
+				children: /* @__PURE__ */ o(i, {
+					node: t,
+					resolveValue: c
+				})
+			})
+		] })
+	});
+}
+//#endregion
+export { c as FilterChips };

package/dist-lib/components/filters/FilterConditionValue.js

@@ -0,0 +1,40 @@
+import { coerceDisplayString as e } from "../../lib/display-value.js";
+import { useText as t } from "../../hooks/useText.js";
+import { NO_VALUE_OPS as n } from "../../lib/filters.js";
+import { filterOpLabel as r } from "./filter-op-label.js";
+import { SHIMMER_KEYFRAMES as i } from "../shared/LoadingSkeleton.js";
+import { Fragment as a } from "react";
+import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/components/filters/FilterConditionValue.tsx
+function l({ node: i, resolveValue: l }) {
+	let d = t(), f = i.op, p = r(d, f);
+	if (n.has(f)) return /* @__PURE__ */ s(o, { children: p });
+	if (i.value === "" || Array.isArray(i.value) && i.value.length === 0) return /* @__PURE__ */ s(o, { children: `${p} ${JSON.stringify(i.value)}` });
+	let m = Array.isArray(i.value) ? i.value : [i.value];
+	return l ? /* @__PURE__ */ c(o, { children: [
+		p,
+		" ",
+		m.map((e, t) => {
+			let n = l(i.field, e);
+			return /* @__PURE__ */ c(a, { children: [t > 0 ? ", " : "", /* @__PURE__ */ s("span", { children: n.status === "loading" ? /* @__PURE__ */ s(u, {}) : n.label ?? n.raw })] }, t);
+		})
+	] }) : /* @__PURE__ */ s(o, { children: `${p} ${m.map(e).join(", ")}` });
+}
+function u() {
+	let e = t();
+	return /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ s("style", { children: i }), /* @__PURE__ */ s("span", {
+		"aria-label": e("filter.chips.loading", "loading"),
+		style: {
+			display: "inline-block",
+			width: 52,
+			height: "0.72em",
+			verticalAlign: "middle",
+			borderRadius: "var(--radius-sm)",
+			background: "linear-gradient(90deg, var(--surface-3) 0%, var(--surface-2) 40%, var(--surface-3) 80%)",
+			backgroundSize: "200% 100%",
+			animation: "declarion-shimmer 1.2s ease-in-out infinite"
+		}
+	})] });
+}
+//#endregion
+export { l as FilterConditionValue };