@plumile/backoffice-react 0.1.104 → 0.1.105

package/lib/esm/LazyBackofficeEntityActionFormDialog-oRd_WHAK.js

@@ -0,0 +1,670 @@
+import { t as e } from "./useBackofficeReactTranslation-Btt58EIo.js";
+import { t } from "./BackofficeErrorBoundary-BwRVSDHU.js";
+import { i as n, n as r, r as i, t as a } from "./BackofficeListToolbar-loFfIPtP.js";
+import { i as o, t as s } from "./EntityIdPickerDialog-BSn0v3bv.js";
+import { s as c } from "./backofficeEntityActionFormDialog.css-DJgEKwaA.js";
+import { Suspense as l, lazy as u, startTransition as d, useCallback as f, useEffect as p, useMemo as m, useRef as h, useState as g } from "react";
+import { useTranslation as _ } from "react-i18next";
+import { BackofficeEmptyState as v, BackofficeFilterDrawer as y, BackofficeFilterField as ee, BackofficeInfiniteListStatus as te, BackofficePageHeader as ne, BackofficeTableSkeleton as re, Button as b, FilterChipRow as ie, InlineBanner as ae, Input as oe, ListPageTemplate as se, ResponsiveRecordList as ce, SidebarSearchSvg as x, SimpleSelect as S, Spinner as C, denseTableClass as le } from "@plumile/ui";
+import { Fragment as w, jsx as T, jsxs as E } from "react/jsx-runtime";
+import { readWhereValue as D, setWhereValue as O } from "@plumile/backoffice-core/filters/where.js";
+import { stableListVariablesKey as k } from "@plumile/backoffice-core/state/stableKey.js";
+//#region src/hooks/useBackofficeLoadMore.ts
+function ue({ hasNext: e, isLoadingNext: t, loadNext: n, count: r }) {
+	return f(() => {
+		!e || t || d(() => {
+			n(r);
+		});
+	}, [
+		r,
+		e,
+		t,
+		n
+	]);
+}
+//#endregion
+//#region src/hooks/useBackofficeListRefetch.ts
+function de({ refetch: e, variables: t, defaults: n, fetchPolicy: r, buildQueryVariables: i }) {
+	let [a, o] = g(!1), s = h(0), c = h(k({
+		where: n.where,
+		sort: n.sort,
+		count: n.count
+	})), l = f((e) => i(e), [i]), u = f((t) => {
+		let n = s.current + 1;
+		s.current = n, o(!0);
+		let i = l({
+			...t,
+			cursor: null
+		});
+		try {
+			d(() => {
+				e(i, {
+					fetchPolicy: r,
+					onComplete: () => {
+						s.current === n && o(!1);
+					}
+				});
+			});
+		} catch (e) {
+			throw s.current === n && o(!1), e;
+		}
+	}, [
+		r,
+		e,
+		l
+	]);
+	return p(() => {
+		let e = k({
+			where: t.where,
+			sort: t.sort,
+			count: t.count
+		});
+		c.current !== e && (c.current = e, u(t));
+	}, [u, t]), {
+		isRefreshing: a,
+		onRefresh: f(() => {
+			u(t);
+		}, [u, t])
+	};
+}
+//#endregion
+//#region src/components/backoffice/filters/deferredFilterSearchInput.css.ts
+var A = "ds2thc0 txvbqb9ip txvbqbcp txvbqbao7 txvbqbu7g", j = "ds2thc1 txvbqb9ip txvbqbcp txvbqbany", M = ({ value: t, placeholder: n, ariaLabel: r, className: i, inputMode: a = "search", type: o = "search", onApply: s }) => {
+	let { t: c } = e(), [l, u] = g(t);
+	p(() => {
+		u(t);
+	}, [t]);
+	let d = l.trim(), f = t.trim(), m = d !== "", h = d !== f, _ = m || f !== "", v = "secondary";
+	h && (v = "primary");
+	let y = () => {
+		h && s(d);
+	};
+	return /* @__PURE__ */ T("form", {
+		className: i,
+		onSubmit: (e) => {
+			e.preventDefault(), y();
+		},
+		children: /* @__PURE__ */ E("div", {
+			className: A,
+			children: [/* @__PURE__ */ T(oe, {
+				type: o,
+				inputMode: a,
+				value: l,
+				onChange: (e) => {
+					u(e.target.value);
+				},
+				onKeyDown: (e) => {
+					e.key === "Escape" && (e.preventDefault(), u(t));
+				},
+				placeholder: n,
+				"aria-label": r ?? n,
+				size: "small",
+				fullWidth: !0,
+				leftIcon: /* @__PURE__ */ T(x, {
+					width: 18,
+					height: 18,
+					"aria-hidden": "true"
+				})
+			}), /* @__PURE__ */ E("div", {
+				className: j,
+				children: [_ && /* @__PURE__ */ T(b, {
+					type: "button",
+					variant: "text",
+					size: "small",
+					onClick: () => {
+						u(""), f !== "" && s("");
+					},
+					children: c("common.actions.clear")
+				}), /* @__PURE__ */ T(b, {
+					type: "submit",
+					variant: v,
+					size: "small",
+					disabled: !h,
+					children: c("filters.actions.apply")
+				})]
+			})]
+		})
+	});
+};
+//#endregion
+//#region src/hooks/useBackofficeInfiniteScrollSentinel.ts
+function fe({ enabled: e, hasNextPage: t, isLoading: n, onIntersect: r, root: i = null, rootMargin: a = "360px 0px", threshold: o = 0 }) {
+	let [s, c] = g(null), l = h(r), u = h(0);
+	return p(() => {
+		l.current = r;
+	}, [r]), p(() => {
+		if (!e || !t || n || s == null) return () => {};
+		let r = () => {
+			let e = Date.now();
+			e - u.current < 250 || (u.current = e, l.current());
+		};
+		if (typeof IntersectionObserver > "u") return r(), () => {};
+		let c = new IntersectionObserver((e) => {
+			e[0]?.isIntersecting === !0 && r();
+		}, {
+			root: i,
+			rootMargin: a,
+			threshold: o
+		});
+		return c.observe(s), () => {
+			c.disconnect();
+		};
+	}, [
+		e,
+		t,
+		n,
+		s,
+		i,
+		a,
+		o
+	]), { sentinelRef: f((e) => {
+		c(e);
+	}, []) };
+}
+//#endregion
+//#region src/components/backoffice/scaffolds/backofficeEntityListScaffold.css.ts
+var pe = "txvbqb9ip txvbqbajy txvbqbcp txvbqbao7", N = "_8gc5760 txvbqbu4g txvbqbjep", me = "txvbqb9ip txvbqbai7 txvbqbaog", he = "txvbqb97 txvbqbamp txvbqbv9z", P = (e, t) => e(t), F = (e, t) => e.fromGraphQL != null && t != null ? e.fromGraphQL(t) : D(t, e.whereKey ?? e.id, e.path), ge = (e, t, n) => {
+	if (t == null) return null;
+	if (Array.isArray(t)) {
+		let e = t.map((e) => {
+			if (e == null || typeof e != "string" && typeof e != "number" && typeof e != "boolean") return null;
+			let t = String(e).trim();
+			return t === "" ? null : t;
+		}).filter((e) => e != null);
+		return e.length === 0 ? null : e.join(", ");
+	}
+	if (typeof t == "boolean") return e.kind === "boolean" ? n.booleanLabel(t) : t ? n.fallbackBooleanLabels.yes : n.fallbackBooleanLabels.no;
+	if (typeof t != "string" && typeof t != "number") return null;
+	let i = String(t).trim();
+	return i === "" ? null : e.kind === "entityId" ? /* @__PURE__ */ T(r, {
+		entityId: e.entity,
+		id: i
+	}) : e.kind === "enum" ? n.enumLabel(i) : i;
+}, _e = (e) => {
+	let t = new Date(e);
+	if (Number.isNaN(t.getTime())) return e;
+	let n = t.getTimezoneOffset() * 6e4;
+	return new Date(t.getTime() - n).toISOString().slice(0, 16);
+}, ve = (e) => {
+	let t = e.trim();
+	if (t === "") return "";
+	let n = new Date(t);
+	return Number.isNaN(n.getTime()) ? t : n.toISOString();
+}, I = (r) => {
+	let { t: c } = _(), { t: l } = e(), { config: u, state: d, pushState: p, rows: h, getRowId: oe, columns: x, gridTemplateColumns: C, hasNextPage: D, isLoadingMore: k, isRefreshing: ue = !1, onLoadMore: de, onRefresh: A, totalCount: j, emptyState: I, statusBanner: L, header: R, headerActions: z, isLoadingInitial: B = !1, variant: ye = "page", showFilters: be = !0 } = r, V = u.list, H = u.listDefaults ?? V.defaultState ?? {
+		where: null,
+		sort: null
+	}, U = m(() => x.some((e) => e.isPrimary === !0) || x.length === 0 ? x : x.map((e, t) => {
+		let { header: n } = e;
+		return t === 0 ? {
+			...e,
+			isPrimary: !0,
+			header: n
+		} : {
+			...e,
+			header: n
+		};
+	}), [x]), W = m(() => {
+		let e = [];
+		for (let t of V.filters) {
+			let n = F(t, d.where), r = ge(t, n, {
+				enumLabel: (e) => {
+					if (t.kind !== "enum") return e;
+					let n = t.options.find((t) => t.value === e);
+					return n == null ? e : P(n.label, c);
+				},
+				booleanLabel: (e) => {
+					if (t.kind === "boolean") {
+						if (e && t.trueLabel != null) return P(t.trueLabel, c);
+						if (!e && t.falseLabel != null) return P(t.falseLabel, c);
+					}
+					return l(e ? "filters.boolean.yes" : "filters.boolean.no");
+				},
+				fallbackBooleanLabels: {
+					yes: l("filters.boolean.yes"),
+					no: l("filters.boolean.no")
+				}
+			});
+			if (r != null) {
+				let i = String(n);
+				Array.isArray(n) && (i = n.join(","));
+				let a = /* @__PURE__ */ E("span", { children: [
+					P(t.label, c),
+					": ",
+					r
+				] });
+				e.push({
+					id: `${t.id}:${i}`,
+					label: a,
+					onRemove: () => {
+						let e = t.whereKey ?? t.id, n = O(d.where, e, null, t.path);
+						p({
+							...d,
+							where: n
+						});
+					}
+				});
+			}
+		}
+		return e;
+	}, [
+		V.filters,
+		p,
+		d,
+		l,
+		c
+	]), G = f(() => {
+		p({ ...H });
+	}, [H, p]), [xe, K] = g(!1), [q, Se] = g(""), [J, Ce] = g(null), Y = f((e) => {
+		let t = e.whereKey ?? e.id, n = F(e, d.where), r = "";
+		typeof n == "string" && (r = n), typeof n == "number" && Number.isFinite(n) && (r = String(n));
+		let a = P(e.label, c);
+		if (e.kind === "text") {
+			let n = l("filters.placeholders.search", { label: e.placeholderLabel == null ? a : P(e.placeholderLabel, c) });
+			return e.placeholderText != null && (n = P(e.placeholderText, c)), /* @__PURE__ */ T(M, {
+				value: _e(r),
+				onApply: (n) => {
+					let r = ve(n), i = O(d.where, t, r, e.path);
+					p({
+						...d,
+						where: i
+					});
+				},
+				placeholder: n,
+				ariaLabel: n,
+				className: N
+			});
+		}
+		if (e.kind === "datetime") {
+			let n = l("filters.placeholders.search", { label: e.placeholderLabel == null ? a : P(e.placeholderLabel, c) });
+			return e.placeholderText != null && (n = P(e.placeholderText, c)), /* @__PURE__ */ T(M, {
+				value: r,
+				onApply: (n) => {
+					let r = O(d.where, t, n, e.path);
+					p({
+						...d,
+						where: r
+					});
+				},
+				placeholder: n,
+				ariaLabel: n,
+				className: N,
+				type: "datetime-local"
+			});
+		}
+		if (e.kind === "number") {
+			let n = l("filters.placeholders.search", { label: e.placeholderLabel == null ? a : P(e.placeholderLabel, c) });
+			return e.placeholderText != null && (n = P(e.placeholderText, c)), /* @__PURE__ */ T(M, {
+				value: r,
+				onApply: (n) => {
+					let r = n.trim(), i = r === "" ? null : Number(r), a = O(d.where, t, Number.isFinite(i) ? i : null, e.path);
+					p({
+						...d,
+						where: a
+					});
+				},
+				placeholder: n,
+				ariaLabel: n,
+				className: N,
+				inputMode: e.inputMode ?? "numeric",
+				type: "number"
+			});
+		}
+		if (e.kind === "enum") return /* @__PURE__ */ T(S, {
+			options: [{
+				id: "any",
+				value: "",
+				label: l("filters.all", { label: a })
+			}, ...e.options.map((e) => ({
+				id: e.value,
+				value: e.value,
+				label: P(e.label, c)
+			}))],
+			value: r,
+			size: "small",
+			ariaLabel: a,
+			onChange: (n) => {
+				let r = O(d.where, t, n, e.path);
+				p({
+					...d,
+					where: r
+				});
+			}
+		});
+		if (e.kind === "boolean") {
+			let r = null;
+			typeof n == "boolean" && (r = n);
+			let i = "";
+			r === !0 && (i = "true"), r === !1 && (i = "false");
+			let o = e.trueLabel == null ? l("filters.boolean.yes") : P(e.trueLabel, c), s = e.falseLabel == null ? l("filters.boolean.no") : P(e.falseLabel, c);
+			return /* @__PURE__ */ T(S, {
+				options: [
+					{
+						id: "any",
+						value: "",
+						label: l("filters.all", { label: a })
+					},
+					{
+						id: "true",
+						value: "true",
+						label: o
+					},
+					{
+						id: "false",
+						value: "false",
+						label: s
+					}
+				],
+				value: i,
+				size: "small",
+				ariaLabel: a,
+				onChange: (n) => {
+					let r = null;
+					n === "true" && (r = !0), n === "false" && (r = !1);
+					let i = O(d.where, t, r, e.path);
+					p({
+						...d,
+						where: i
+					});
+				}
+			});
+		}
+		let s = (() => {
+			if (e.pickerScope != null) return typeof e.pickerScope == "function" ? e.pickerScope(d.where) : e.pickerScope;
+		})(), u = null;
+		typeof n == "string" && (u = n);
+		let f = (n = null) => {
+			let r = n?.trim() ?? "";
+			return /* @__PURE__ */ T(o, {
+				label: a,
+				value: u,
+				displayValue: r,
+				placeholder: l("filters.placeholders.anyEntity", { label: a }),
+				onPick: () => {
+					Ce({
+						entity: e.entity,
+						whereKey: t,
+						label: a,
+						path: e.path,
+						scope: s
+					});
+				},
+				onClear: () => {
+					let n = O(d.where, t, null, e.path);
+					p({
+						...d,
+						where: n
+					});
+				}
+			});
+		};
+		return u == null || u.trim() === "" ? f() : /* @__PURE__ */ T(i, {
+			entityId: e.entity,
+			id: u,
+			children: (e) => f(e)
+		});
+	}, [
+		p,
+		d,
+		l,
+		c
+	]), we = m(() => V.filters.some((e) => e.placement != null), [V.filters]), X = m(() => {
+		if (V.filters.length === 0) return [];
+		let e = V.ui?.toolbar?.maxPromotedFilters ?? 3;
+		return we ? V.filters.filter((e) => e.placement === "quick" || e.placement === "both") : V.filters.slice(0, e);
+	}, [
+		V.filters,
+		V.ui?.toolbar,
+		we
+	]), Z = m(() => V.filters.filter((e) => e.placement == null ? !0 : e.placement === "drawer" || e.placement === "both"), [V.filters]), Q = m(() => X.find((e) => e.kind === "text"), [X]), Te = m(() => {
+		let e = X.filter((e) => e !== Q);
+		return e.length === 0 ? null : /* @__PURE__ */ T("div", {
+			className: pe,
+			children: e.map((e) => /* @__PURE__ */ T("span", { children: Y(e) }, e.id))
+		});
+	}, [
+		X,
+		Y,
+		Q
+	]), Ee = m(() => Q == null ? null : Y(Q), [Y, Q]), De = m(() => {
+		if (V.sorts.length === 0) return null;
+		let e = V.sorts[0];
+		return e == null ? null : /* @__PURE__ */ T(S, {
+			options: V.sorts.map((e) => ({
+				id: e.id,
+				value: e.id,
+				label: P(e.label, c)
+			})),
+			value: d.sort ?? e.id,
+			size: "small",
+			ariaLabel: l("list.sort.label"),
+			onChange: (e) => {
+				p({
+					...d,
+					sort: e
+				});
+			}
+		});
+	}, [
+		V.sorts,
+		p,
+		d,
+		l,
+		c
+	]), Oe = m(() => W.length === 0 ? null : /* @__PURE__ */ T(ie, {
+		chips: W,
+		onClearAll: G
+	}), [W, G]), ke = m(() => {
+		if (Z.length === 0) return [];
+		let e = q.trim().toLowerCase(), t = [];
+		for (let n of Z) {
+			let r = P(n.label, c);
+			(e === "" || r.toLowerCase().includes(e)) && t.push({
+				id: n.id,
+				node: /* @__PURE__ */ T(ee, {
+					label: r,
+					children: Y(n)
+				})
+			});
+		}
+		return t.length === 0 ? [] : [{
+			id: "backoffice.filters.sections.default",
+			title: l("filters.sections.default"),
+			items: t
+		}];
+	}, [
+		Z,
+		q,
+		Y,
+		l,
+		c
+	]), Ae = m(() => {
+		if (Z.length === 0) return null;
+		let e = W.length, t = l("filters.trigger");
+		return e > 0 && (t = l("filters.triggerWithCount", { count: e })), /* @__PURE__ */ T(b, {
+			type: "button",
+			variant: "secondary",
+			size: "small",
+			onClick: () => {
+				K(!0);
+			},
+			children: t
+		});
+	}, [
+		W.length,
+		Z.length,
+		l
+	]), je = /* @__PURE__ */ T(y, {
+		isOpen: xe,
+		onClose: () => {
+			K(!1), Se("");
+		},
+		sections: ke,
+		searchValue: q,
+		onSearchChange: (e) => {
+			Se(e);
+		},
+		onReset: G,
+		emptyLabel: q.trim() === "" ? void 0 : l("filters.drawer.emptySearchResults")
+	}), Me = m(() => I ?? (B ? /* @__PURE__ */ T(re, {
+		variant: "embedded",
+		ariaLabel: l("common.loading")
+	}) : W.length > 0 ? /* @__PURE__ */ T(v, {
+		title: l("emptyState.listEmpty.title"),
+		description: l("emptyState.listEmptyFiltered.description"),
+		actions: /* @__PURE__ */ T(b, {
+			type: "button",
+			variant: "secondary",
+			size: "small",
+			onClick: G,
+			children: l("emptyState.listEmptyFiltered.actions.reset")
+		})
+	}) : /* @__PURE__ */ T(v, {
+		title: l("emptyState.listEmpty.title"),
+		description: l("emptyState.listEmpty.description")
+	})), [
+		W.length,
+		I,
+		G,
+		B,
+		l
+	]), Ne = m(() => typeof j == "number" ? /* @__PURE__ */ T("span", { children: l("list.showing", {
+		shown: h.length,
+		total: j
+	}) }) : h.length === 0 ? null : /* @__PURE__ */ T("span", { children: l("list.loaded", { count: h.length }) }), [
+		h.length,
+		l,
+		j
+	]), { sentinelRef: Pe } = fe({
+		enabled: !0,
+		hasNextPage: D,
+		isLoading: k,
+		onIntersect: de
+	}), Fe = R?.title ?? P(V.title, c), Ie = R?.subtitle, Le = U.find((e) => e.mobileRole === "action" || e.id === "actions"), Re = /* @__PURE__ */ T(t, {
+		fallback: (e) => {
+			let { reset: t } = e;
+			return /* @__PURE__ */ T(ae, {
+				tone: "danger",
+				title: l("list.errors.title"),
+				actions: /* @__PURE__ */ T(b, {
+					type: "button",
+					variant: "secondary",
+					size: "small",
+					onClick: () => {
+						t(), A?.();
+					},
+					children: l("list.actions.retry")
+				}),
+				children: l("list.errors.tableFailed")
+			});
+		},
+		children: /* @__PURE__ */ T(ce, {
+			columns: U,
+			rows: h,
+			getRowId: oe,
+			emptyState: Me,
+			className: le,
+			gridTemplateColumns: C,
+			mode: V.ui?.displayMode ?? V.responsive?.mode ?? "auto",
+			density: V.ui?.density ?? V.responsive?.density ?? "compact",
+			renderAction: (e) => Le?.cell(e) ?? null
+		})
+	}), ze = be ? /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T(a, {
+		primaryFilters: Ee != null || Te != null ? /* @__PURE__ */ E(w, { children: [Ee, Te] }) : null,
+		filterDrawerTrigger: Ae,
+		sortControl: De,
+		utilityActions: A == null ? null : /* @__PURE__ */ T(b, {
+			type: "button",
+			variant: "secondary",
+			size: "small",
+			isLoading: ue,
+			loadingLabel: l("list.actions.refreshing"),
+			onClick: () => {
+				A();
+			},
+			children: l("list.actions.refresh")
+		}),
+		activeFilters: Oe,
+		density: "compact"
+	}), je] }) : null, Be = /* @__PURE__ */ E("div", { children: [Re, /* @__PURE__ */ T(s, {
+		isOpen: J != null,
+		entity: J?.entity ?? u.id,
+		title: J?.label ?? l("picker.title"),
+		scope: J?.scope,
+		onClose: () => {
+			Ce(null);
+		},
+		onSelectId: (e) => {
+			if (J == null) return;
+			let t = O(d.where, J.whereKey, e, J.path);
+			p({
+				...d,
+				where: t
+			});
+		}
+	})] }), $ = h.length > 0 || k || D ? /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("div", {
+		ref: Pe,
+		"aria-hidden": "true"
+	}), /* @__PURE__ */ T(te, {
+		loadedCount: h.length,
+		totalCount: j,
+		hasNextPage: D,
+		isLoading: k,
+		loadedLabel: Ne,
+		loadingLabel: l("list.loadMore.loading"),
+		endLabel: l("list.loadMore.end")
+	})] }) : null;
+	return ye === "embedded" ? /* @__PURE__ */ T(n, {
+		config: u,
+		state: d,
+		pushState: p,
+		children: /* @__PURE__ */ E("div", {
+			className: me,
+			children: [
+				/* @__PURE__ */ T("div", {
+					className: he,
+					children: Fe
+				}),
+				ze,
+				L,
+				Be,
+				$
+			]
+		})
+	}) : /* @__PURE__ */ T(n, {
+		config: u,
+		state: d,
+		pushState: p,
+		children: /* @__PURE__ */ T(se, {
+			headerNode: /* @__PURE__ */ T(ne, {
+				title: Fe,
+				subtitle: Ie,
+				actions: z
+			}),
+			toolbarNode: ze,
+			statusNode: L,
+			tableNode: Be,
+			tableFooterNode: $,
+			presentation: "flat"
+		})
+	});
+}, L = u(async () => ({ default: (await import("./BackofficeEntityActionFormDialog-DrZxuytz.js")).BackofficeEntityActionFormDialog })), R = () => {
+	let { t } = e();
+	return /* @__PURE__ */ E("div", {
+		className: c,
+		role: "status",
+		"aria-live": "polite",
+		"aria-busy": "true",
+		children: [/* @__PURE__ */ T(C, {
+			ariaLabel: t("common.loading"),
+			size: 20
+		}), /* @__PURE__ */ T("span", { children: t("common.loading") })]
+	});
+}, z = (e) => /* @__PURE__ */ T(l, {
+	fallback: /* @__PURE__ */ T(R, {}),
+	children: /* @__PURE__ */ T(L, { ...e })
+});
+//#endregion
+export { ue as i, I as n, de as r, z as t };
+
+//# sourceMappingURL=LazyBackofficeEntityActionFormDialog-oRd_WHAK.js.map