@plumile/backoffice-react 0.1.72 → 0.1.73

package/lib/esm/{auth/pages/AcceptInvitationScreen.js → AcceptInvitationScreen-CNLlSbdx.js}

@@ -1,16 +1,12 @@
-import { formSurface as e, helper as t, stack as n } from "../login/loginPage.css.js";
-import { AuthPanel as r } from "../login/AuthPanel.js";
-import { useSharedTranslation as i } from "../../i18n/useSharedTranslation.js";
-import { MfaChallengeForm as a } from "../login/MfaChallengeForm.js";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import { Button as c } from "@plumile/ui";
-import { FormField as l } from "@plumile/ui/atomic/molecules/form_field/FormField.js";
-import { FormError as u } from "@plumile/ui/atomic/molecules/form_error/FormError.js";
-import { useCallback as d, useMemo as f, useState as p } from "react";
-import { AuthLayout as m } from "@plumile/ui/atomic/templates/auth_layout/AuthLayout.js";
+import { a as e, d as t, f as n, s as r } from "./loginPage.css-BDQJNcSr.js";
+import { o as i } from "./useAuth-AczFS-oL.js";
+import { t as a } from "./AuthPanel-ttoH9YxE.js";
+import { useCallback as o, useMemo as s, useState as c } from "react";
+import { AuthLayout as l, Button as u, FormError as d, FormField as f } from "@plumile/ui";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
 //#region src/auth/pages/AcceptInvitationScreen.tsx
 var h = ({ auth: h, onSuccessRedirect: g, onBackToLogin: _, token: v }) => {
-	let { t: y } = i(), { acceptInvitation: b } = h, [x, S] = p("idle"), [C, w] = p(""), [T, E] = p(""), [D, O] = p(!1), [k, A] = p(null), j = f(() => v ?? (typeof window > "u" ? "" : new URLSearchParams(window.location.search).get("token") ?? ""), [v]), M = d((e) => {
+	let { t: y } = n(), { acceptInvitation: b } = h, [x, S] = c("idle"), [C, w] = c(""), [T, E] = c(""), [D, O] = c(!1), [k, A] = c(null), j = s(() => v ?? (typeof window > "u" ? "" : new URLSearchParams(window.location.search).get("token") ?? ""), [v]), M = o((e) => {
 		if (e.preventDefault(), j === "") {
 			A(y("auth.acceptInvitation.errors.missingToken")), S("error");
 			return;
@@ -41,15 +37,15 @@ var h = ({ auth: h, onSuccessRedirect: g, onBackToLogin: _, token: v }) => {
 		T,
 		j,
 		y
-	]), N = d(() => {
+	]), N = o(() => {
 		S("completed"), g();
-	}, [g]), P = d(() => {
+	}, [g]), P = o(() => {
 		S("idle"), A(null), O(!1);
 	}, []);
-	if (x === "mfa") return /* @__PURE__ */ o(m, {
+	if (x === "mfa") return /* @__PURE__ */ p(l, {
 		title: y("auth.acceptInvitation.mfaTitle"),
 		subtitle: y("auth.acceptInvitation.mfaSubtitle"),
-		children: /* @__PURE__ */ o(a, {
+		children: /* @__PURE__ */ p(i, {
 			auth: h,
 			onSuccess: N,
 			onBack: () => {
@@ -58,21 +54,21 @@ var h = ({ auth: h, onSuccessRedirect: g, onBackToLogin: _, token: v }) => {
 		})
 	});
 	let F;
-	return F = x === "completed" ? /* @__PURE__ */ o("div", {
-		className: n,
-		children: /* @__PURE__ */ o("p", {
-			className: t,
+	return F = x === "completed" ? /* @__PURE__ */ p("div", {
+		className: t,
+		children: /* @__PURE__ */ p("p", {
+			className: r,
 			children: y("auth.acceptInvitation.status.success")
 		})
-	}) : /* @__PURE__ */ o(r, {
+	}) : /* @__PURE__ */ p(a, {
 		description: y("auth.acceptInvitation.subtitle"),
-		children: /* @__PURE__ */ s("form", {
+		children: /* @__PURE__ */ m("form", {
 			className: e,
 			onSubmit: M,
 			noValidate: !0,
 			children: [
-				k == null ? null : /* @__PURE__ */ o(u, { children: k }),
-				/* @__PURE__ */ o(l, {
+				k == null ? null : /* @__PURE__ */ p(d, { children: k }),
+				/* @__PURE__ */ p(f, {
 					label: y("auth.acceptInvitation.form.passwordLabel"),
 					name: "password",
 					type: "password",
@@ -84,7 +80,7 @@ var h = ({ auth: h, onSuccessRedirect: g, onBackToLogin: _, token: v }) => {
 					autoComplete: "new-password",
 					required: !0
 				}),
-				/* @__PURE__ */ o(l, {
+				/* @__PURE__ */ p(f, {
 					label: y("auth.acceptInvitation.form.confirmLabel"),
 					name: "password-confirmation",
 					type: "password",
@@ -96,12 +92,12 @@ var h = ({ auth: h, onSuccessRedirect: g, onBackToLogin: _, token: v }) => {
 					autoComplete: "new-password",
 					required: !0
 				}),
-				/* @__PURE__ */ o(c, {
+				/* @__PURE__ */ p(u, {
 					type: "submit",
 					isLoading: D,
 					children: y(x === "pending" ? "auth.acceptInvitation.status.workingButton" : "auth.acceptInvitation.form.submit")
 				}),
-				/* @__PURE__ */ o(c, {
+				/* @__PURE__ */ p(u, {
 					type: "button",
 					variant: "secondary",
 					onClick: _,
@@ -109,12 +105,12 @@ var h = ({ auth: h, onSuccessRedirect: g, onBackToLogin: _, token: v }) => {
 				})
 			]
 		})
-	}), /* @__PURE__ */ o(m, {
+	}), /* @__PURE__ */ p(l, {
 		title: y("auth.acceptInvitation.title"),
 		children: F
 	});
 };
 //#endregion
-export { h as AcceptInvitationScreen };
+export { h as t };
 
-//# sourceMappingURL=AcceptInvitationScreen.js.map
+//# sourceMappingURL=AcceptInvitationScreen-CNLlSbdx.js.map

package/lib/esm/AcceptInvitationScreen-CNLlSbdx.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AcceptInvitationScreen-CNLlSbdx.js","names":[],"sources":["../../src/auth/pages/AcceptInvitationScreen.tsx"],"sourcesContent":["/* eslint-disable no-ternary */\nimport {\n  useCallback,\n  useMemo,\n  useState,\n  type FormEvent,\n  type JSX,\n} from 'react';\nimport { useSharedTranslation } from '../../i18n/useSharedTranslation.js';\n\nimport { AuthLayout, Button, FormError, FormField } from '@plumile/ui';\n\nimport type { UseAuthReturn } from '../../hooks/useAuth.js';\nimport { MfaChallengeForm } from '../login/MfaChallengeForm.js';\nimport AuthPanel from '../login/AuthPanel.js';\nimport * as styles from '../login/loginPage.css.js';\n\ntype AcceptanceState = 'pending' | 'mfa' | 'completed' | 'error' | 'idle';\n\ntype Props = {\n  auth: UseAuthReturn;\n  onSuccessRedirect: () => void;\n  onBackToLogin: () => void;\n  token?: string;\n};\n\nexport const AcceptInvitationScreen = ({\n  auth,\n  onSuccessRedirect,\n  onBackToLogin,\n  token,\n}: Props): JSX.Element => {\n  const { t } = useSharedTranslation();\n  const { acceptInvitation } = auth;\n  const [status, setStatus] = useState<AcceptanceState>('idle');\n  const [password, setPassword] = useState('');\n  const [passwordConfirmation, setPasswordConfirmation] = useState('');\n  const [isSubmitting, setIsSubmitting] = useState(false);\n  const [errorMessage, setErrorMessage] = useState<string | null>(null);\n\n  const resolvedToken = useMemo(() => {\n    if (token != null) {\n      return token;\n    }\n    if (typeof window === 'undefined') {\n      return '';\n    }\n    const params = new URLSearchParams(window.location.search);\n    return params.get('token') ?? '';\n  }, [token]);\n\n  const handleSubmit = useCallback(\n    (event: FormEvent<HTMLFormElement>) => {\n      event.preventDefault();\n      if (resolvedToken === '') {\n        setErrorMessage(t('auth.acceptInvitation.errors.missingToken'));\n        setStatus('error');\n        return;\n      }\n\n      if (password !== passwordConfirmation) {\n        setErrorMessage(t('auth.acceptInvitation.errors.passwordMismatch'));\n        setStatus('error');\n        return;\n      }\n\n      setStatus('pending');\n      setErrorMessage(null);\n      setIsSubmitting(true);\n\n      // eslint-disable-next-line no-void\n      void acceptInvitation({\n        token: resolvedToken,\n        password,\n        passwordConfirmation,\n      })\n        .then((result) => {\n          if (result === 'mfa-required') {\n            setStatus('mfa');\n            return;\n          }\n          setStatus('completed');\n          onSuccessRedirect();\n        })\n        .catch((error) => {\n          setStatus('error');\n          if (error instanceof Error) {\n            setErrorMessage(error.message);\n          } else if (typeof error === 'string') {\n            setErrorMessage(error);\n          } else {\n            setErrorMessage(t('auth.acceptInvitation.errors.default'));\n          }\n        })\n        .finally(() => {\n          setIsSubmitting(false);\n        });\n    },\n    [\n      acceptInvitation,\n      onSuccessRedirect,\n      password,\n      passwordConfirmation,\n      resolvedToken,\n      t,\n    ],\n  );\n\n  const handleMfaSuccess = useCallback(() => {\n    setStatus('completed');\n    onSuccessRedirect();\n  }, [onSuccessRedirect]);\n\n  const handleRetry = useCallback(() => {\n    setStatus('idle');\n    setErrorMessage(null);\n    setIsSubmitting(false);\n  }, []);\n\n  if (status === 'mfa') {\n    return (\n      <AuthLayout\n        title={t('auth.acceptInvitation.mfaTitle')}\n        subtitle={t('auth.acceptInvitation.mfaSubtitle')}\n      >\n        <MfaChallengeForm\n          auth={auth}\n          onSuccess={handleMfaSuccess}\n          onBack={() => {\n            auth.reset();\n            handleRetry();\n          }}\n        />\n      </AuthLayout>\n    );\n  }\n\n  let content: JSX.Element;\n  if (status === 'completed') {\n    content = (\n      <div className={styles.stack}>\n        <p className={styles.helper}>\n          {t('auth.acceptInvitation.status.success')}\n        </p>\n      </div>\n    );\n  } else {\n    content = (\n      <AuthPanel description={t('auth.acceptInvitation.subtitle')}>\n        <form className={styles.formSurface} onSubmit={handleSubmit} noValidate>\n          {errorMessage != null ? <FormError>{errorMessage}</FormError> : null}\n          <FormField\n            label={t('auth.acceptInvitation.form.passwordLabel')}\n            name=\"password\"\n            type=\"password\"\n            value={password}\n            onChange={(event) => {\n              setPassword(event.target.value);\n              setErrorMessage(null);\n              if (status === 'error') {\n                setStatus('idle');\n              }\n            }}\n            placeholder={t('auth.acceptInvitation.form.passwordPlaceholder')}\n            autoComplete=\"new-password\"\n            required\n          />\n          <FormField\n            label={t('auth.acceptInvitation.form.confirmLabel')}\n            name=\"password-confirmation\"\n            type=\"password\"\n            value={passwordConfirmation}\n            onChange={(event) => {\n              setPasswordConfirmation(event.target.value);\n              setErrorMessage(null);\n              if (status === 'error') {\n                setStatus('idle');\n              }\n            }}\n            placeholder={t('auth.acceptInvitation.form.confirmPlaceholder')}\n            autoComplete=\"new-password\"\n            required\n          />\n          <Button type=\"submit\" isLoading={isSubmitting}>\n            {status === 'pending'\n              ? t('auth.acceptInvitation.status.workingButton')\n              : t('auth.acceptInvitation.form.submit')}\n          </Button>\n          <Button type=\"button\" variant=\"secondary\" onClick={onBackToLogin}>\n            {t('auth.acceptInvitation.actions.backToLogin')}\n          </Button>\n        </form>\n      </AuthPanel>\n    );\n  }\n\n  return (\n    <AuthLayout title={t('auth.acceptInvitation.title')}>{content}</AuthLayout>\n  );\n};\n"],"mappings":"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"}

package/lib/esm/{auth/login/AuthPanel.js → AuthPanel-ttoH9YxE.js}

@@ -1,28 +1,28 @@
-import { block as e, footer as t, helper as n, panel as r, panelTitle as i } from "./loginPage.css.js";
+import { i as e, l as t, n, s as r, u as i } from "./loginPage.css-BDQJNcSr.js";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region src/auth/login/AuthPanel.tsx
 var s = ({ title: s, description: c, children: l, footer: u }) => /* @__PURE__ */ a("div", {
-	className: r,
+	className: t,
 	children: /* @__PURE__ */ o("div", {
-		className: e,
+		className: n,
 		children: [
 			s == null ? null : /* @__PURE__ */ a("h2", {
 				className: i,
 				children: s
 			}),
 			c == null ? null : /* @__PURE__ */ a("p", {
-				className: n,
+				className: r,
 				children: c
 			}),
 			l,
 			u == null ? null : /* @__PURE__ */ a("div", {
-				className: t,
+				className: e,
 				children: u
 			})
 		]
 	})
 });
 //#endregion
-export { s as AuthPanel, s as default };
+export { s as t };
 
-//# sourceMappingURL=AuthPanel.js.map
+//# sourceMappingURL=AuthPanel-ttoH9YxE.js.map

package/lib/esm/AuthPanel-ttoH9YxE.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AuthPanel-ttoH9YxE.js","names":[],"sources":["../../src/auth/login/AuthPanel.tsx"],"sourcesContent":["/* eslint-disable no-ternary */\nimport { type JSX, type ReactNode } from 'react';\n\nimport * as styles from './loginPage.css.js';\n\ntype Props = {\n  title?: string;\n  description?: string;\n  children: ReactNode;\n  footer?: ReactNode;\n};\n\nexport const AuthPanel = ({\n  title,\n  description,\n  children,\n  footer,\n}: Props): JSX.Element => {\n  return (\n    <div className={styles.panel}>\n      <div className={styles.block}>\n        {title != null ? <h2 className={styles.panelTitle}>{title}</h2> : null}\n        {description != null ? (\n          <p className={styles.helper}>{description}</p>\n        ) : null}\n        {children}\n        {footer != null ? <div className={styles.footer}>{footer}</div> : null}\n      </div>\n    </div>\n  );\n};\n\nexport default AuthPanel;\n"],"mappings":";;;AAYA,IAAa,KAAa,EACxB,UACA,gBACA,aACA,QAAA,QAGE,kBAAC,OAAD;CAAK,WAAW;WACd,kBAAC,OAAD;EAAK,WAAW;YAAhB;GACG,KAAS,OAAwD,OAAjD,kBAAC,MAAD;IAAI,WAAW;cAAoB;IAAW,CAAA;GAC9D,KAAe,OAEZ,OADF,kBAAC,KAAD;IAAG,WAAW;cAAgB;IAAgB,CAAA;GAE/C;GACA,KAAU,OAAuD,OAAhD,kBAAC,OAAD;IAAK,WAAW;cAAgB;IAAa,CAAA;GAC3D;;CACF,CAAA"}

package/lib/esm/BackofficeAcceptInvitationPage-DRxM1Z-U.js

@@ -0,0 +1,30 @@
+import "./environment-BJeJTbIN.js";
+import "./useRelayEnvironment-vQ86aW-n.js";
+import { n as e } from "./sprinkles.css.ts.vanilla-n-NK_DwW.js";
+import "./loginPage.css-BDQJNcSr.js";
+import "./useAuth-AczFS-oL.js";
+import "./AuthPanel-ttoH9YxE.js";
+import { t } from "./AcceptInvitationScreen-CNLlSbdx.js";
+import "./mutationResult-CcQMY13J.js";
+import { t as n } from "./useBackofficeAuth-BHteJQzA.js";
+import { t as r } from "./backofficeAuthPaths-BiJvoI5Q.js";
+import { useCallback as i, useContext as a } from "react";
+import { RoutingContext as o } from "@plumile/router";
+import { jsx as s } from "react/jsx-runtime";
+//#region src/pages/BackofficeAcceptInvitationPage.tsx
+var c = () => {
+	let c = a(o), { basePath: l } = e();
+	return /* @__PURE__ */ s(t, {
+		auth: n(),
+		onSuccessRedirect: i(() => {
+			c?.history.push({ pathname: l });
+		}, [l, c?.history]),
+		onBackToLogin: i(() => {
+			c?.history.push({ pathname: r(l) });
+		}, [l, c?.history])
+	});
+};
+//#endregion
+export { c as BackofficeAcceptInvitationPage, c as default };
+
+//# sourceMappingURL=BackofficeAcceptInvitationPage-DRxM1Z-U.js.map

package/lib/esm/BackofficeAcceptInvitationPage-DRxM1Z-U.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficeAcceptInvitationPage-DRxM1Z-U.js","names":[],"sources":["../../src/pages/BackofficeAcceptInvitationPage.tsx"],"sourcesContent":["import { useCallback, useContext, type JSX } from 'react';\nimport { RoutingContext } from '@plumile/router';\n\nimport { AcceptInvitationScreen } from '../auth/pages/AcceptInvitationScreen.js';\nimport { useBackofficeAuth } from '../hooks/useBackofficeAuth.js';\nimport { useBackofficeConfig } from '../provider/BackofficeConfigContext.js';\nimport { getBackofficeLoginPath } from '../router/backofficeAuthPaths.js';\n\nexport const BackofficeAcceptInvitationPage = (): JSX.Element => {\n  const routerContext = useContext(RoutingContext);\n  const { basePath } = useBackofficeConfig();\n  const auth = useBackofficeAuth();\n\n  const handleSuccessRedirect = useCallback(() => {\n    routerContext?.history.push({ pathname: basePath });\n  }, [basePath, routerContext?.history]);\n\n  const handleBackToLogin = useCallback(() => {\n    routerContext?.history.push({ pathname: getBackofficeLoginPath(basePath) });\n  }, [basePath, routerContext?.history]);\n\n  return (\n    <AcceptInvitationScreen\n      auth={auth}\n      onSuccessRedirect={handleSuccessRedirect}\n      onBackToLogin={handleBackToLogin}\n    />\n  );\n};\n\nexport default BackofficeAcceptInvitationPage;\n"],"mappings":";;;;;;;;;;;;;;AAQA,IAAa,UAAoD;CAC/D,IAAM,IAAgB,EAAW,EAAe,EAC1C,EAAE,gBAAa,GAAqB;AAW1C,QACE,kBAAC,GAAD;EACQ,MAZG,GAAmB;EAa5B,mBAX0B,QAAkB;AAC9C,MAAe,QAAQ,KAAK,EAAE,UAAU,GAAU,CAAC;KAClD,CAAC,GAAU,GAAe,QAAQ,CAAC;EAUlC,eARsB,QAAkB;AAC1C,MAAe,QAAQ,KAAK,EAAE,UAAU,EAAuB,EAAS,EAAE,CAAC;KAC1E,CAAC,GAAU,GAAe,QAAQ,CAAC;EAOlC,CAAA"}

package/lib/esm/BackofficeDashboardPage-GKyT60qb.js

@@ -0,0 +1,195 @@
+import { n as e } from "./sprinkles.css.ts.vanilla-n-NK_DwW.js";
+import { n as t, t as n } from "./useBackofficeReactTranslation-WfXU8kCf.js";
+import { n as r, t as i } from "./BackofficeRightPageLayout-ktdlvTZJ.js";
+import "./BackofficeTopbarPortalContext-iD7dm4_h.js";
+import { a } from "./useBackofficeLazyValue-B0-ckL6e.js";
+import { t as o } from "./buildBreadcrumbs-CqF9Nh6x.js";
+import { Suspense as s } from "react";
+import { useTranslation as c } from "react-i18next";
+import { Link as l } from "@plumile/router";
+import { DataTable as u, DetailPageTemplate as d, InfoTile as f } from "@plumile/ui";
+import * as p from "react-relay";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
+//#region src/pages/backofficeDashboardPage.css.ts
+var g = "mt26ef0 vncd899ix vncd89byo vncd89aoo", _ = "mt26ef1 vncd899io vncd89ai6 vncd89ao6", v = "mt26ef2 vncd89a6 vncd89amx vncd89egx", y = "mt26ef3 vncd899io vncd89ajx vncd89qh6 vncd898vf", { useLazyLoadQuery: b } = p, x = (e, t) => e(t), S = (e, t) => {
+	switch (e.kind) {
+		case "entityCount":
+		case "shortcut": return e.label;
+		case "tablePreview":
+		case "textBlock": return e.title;
+		default: return t.title;
+	}
+}, C = (e) => "query" in e && e.query != null, w = ({ widget: t, globalData: i }) => {
+	let { t: a } = c(), { t: o } = n(), { entities: s } = e(), d = (e) => "resolve" in t && t.resolve != null ? t.resolve(e) : null;
+	if (t.kind === "textBlock") return /* @__PURE__ */ m(f, {
+		title: x(t.title, a),
+		children: /* @__PURE__ */ m("div", {
+			className: _,
+			children: x(t.body, a)
+		})
+	});
+	if (t.kind === "shortcut") {
+		let e = s[t.entityId];
+		if (e == null) return null;
+		let n = x(t.label, a);
+		return e.kind === "tool" ? /* @__PURE__ */ m(f, {
+			title: n,
+			children: /* @__PURE__ */ m("div", {
+				className: y,
+				children: /* @__PURE__ */ m(l, {
+					to: e.routes.list,
+					children: o("dashboard.actions.openTool")
+				})
+			})
+		}) : /* @__PURE__ */ m(f, {
+			title: n,
+			children: /* @__PURE__ */ m("div", {
+				className: y,
+				children: /* @__PURE__ */ m(l, {
+					to: e.routes.list,
+					children: o("dashboard.actions.openList")
+				})
+			})
+		});
+	}
+	if (t.kind === "tablePreview") {
+		let e = d(i);
+		if (e == null) return null;
+		let n = r(e.columns, {
+			tApp: a,
+			t: o,
+			resolveEntityHref: (e, t) => {
+				let n = s[e];
+				return n == null ? null : n.routes.detail(t);
+			}
+		});
+		return /* @__PURE__ */ m(f, {
+			title: x(t.title, a),
+			children: /* @__PURE__ */ m(u, {
+				columns: n,
+				rows: e.rows,
+				getRowId: (e, t) => {
+					if (typeof e == "object" && e) {
+						let { id: t } = e;
+						if (typeof t == "string" && t.trim() !== "") return t;
+					}
+					return String(t);
+				}
+			})
+		});
+	}
+	if (t.kind === "entityCount") {
+		let e = s[t.entityId];
+		if (e?.kind !== "list-detail") return null;
+		let n = d(i), r = o("common.notAvailable");
+		return typeof n?.count == "number" && (r = n.count), /* @__PURE__ */ m(f, {
+			title: x(t.label, a),
+			children: /* @__PURE__ */ h("div", {
+				className: _,
+				children: [/* @__PURE__ */ m("div", {
+					className: v,
+					children: r
+				}), /* @__PURE__ */ m("div", {
+					className: y,
+					children: /* @__PURE__ */ m(l, {
+						to: e.routes.list,
+						children: o("dashboard.actions.openList")
+					})
+				})]
+			})
+		});
+	}
+	return null;
+}, T = ({ widget: e }) => /* @__PURE__ */ m(w, {
+	widget: e,
+	globalData: b(e.query, {}, { fetchPolicy: "store-or-network" })
+}), E = ({ config: e, globalData: r }) => {
+	let { t: i } = c(), { t: a } = n();
+	return /* @__PURE__ */ m(d, {
+		header: {
+			title: x(e.title, i),
+			subtitle: (e.subtitle == null ? void 0 : x(e.subtitle, i)) ?? a("dashboard.subtitle")
+		},
+		children: /* @__PURE__ */ m("div", {
+			className: g,
+			children: e.widgets.map((n) => {
+				let o = C(n) ? /* @__PURE__ */ m(T, { widget: n }) : /* @__PURE__ */ m(w, {
+					widget: n,
+					globalData: r
+				});
+				return /* @__PURE__ */ m(t, {
+					fallback: () => /* @__PURE__ */ m(f, {
+						title: x(S(n, e), i),
+						children: /* @__PURE__ */ m("div", {
+							className: _,
+							children: a("common.notAvailable")
+						})
+					}),
+					children: /* @__PURE__ */ m(s, {
+						fallback: /* @__PURE__ */ m(f, {
+							title: x(S(n, e), i),
+							children: /* @__PURE__ */ m("div", {
+								className: _,
+								children: a("common.loading")
+							})
+						}),
+						children: o
+					})
+				}, n.id);
+			})
+		})
+	});
+}, D = ({ config: e }) => /* @__PURE__ */ m(E, {
+	config: e,
+	globalData: b(e.query, {}, { fetchPolicy: "store-or-network" })
+}), O = () => {
+	let { t } = c(), { t: r } = n(), { entities: s } = e(), u = a(), p = o(r);
+	if (u == null) {
+		let e = Object.values(s).filter((e) => e.kind === "list-detail" && e.hasList).map((e) => ({
+			config: e,
+			label: x(e.label, t)
+		})).sort((e, t) => e.label.localeCompare(t.label));
+		return /* @__PURE__ */ m(i, {
+			breadcrumb: p,
+			children: /* @__PURE__ */ m(d, {
+				header: {
+					title: r("dashboard.title"),
+					subtitle: r("dashboard.subtitle")
+				},
+				children: /* @__PURE__ */ m("div", {
+					className: g,
+					children: e.map(({ config: e, label: t }) => /* @__PURE__ */ m(f, {
+						title: t,
+						children: /* @__PURE__ */ h("div", {
+							className: _,
+							children: [/* @__PURE__ */ m("div", {
+								className: v,
+								children: r("common.notAvailable")
+							}), /* @__PURE__ */ m("div", {
+								className: y,
+								children: /* @__PURE__ */ m(l, {
+									to: e.routes.list,
+									children: r("dashboard.actions.openList")
+								})
+							})]
+						})
+					}, e.id))
+				})
+			})
+		});
+	}
+	return u.query == null ? /* @__PURE__ */ m(i, {
+		breadcrumb: p,
+		children: /* @__PURE__ */ m(E, {
+			config: u,
+			globalData: null
+		})
+	}) : /* @__PURE__ */ m(i, {
+		breadcrumb: p,
+		children: /* @__PURE__ */ m(D, { config: u })
+	});
+};
+//#endregion
+export { O as BackofficeDashboardPage, O as default };
+
+//# sourceMappingURL=BackofficeDashboardPage-GKyT60qb.js.map

package/lib/esm/BackofficeDashboardPage-GKyT60qb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficeDashboardPage-GKyT60qb.js","names":[],"sources":["../../src/pages/backofficeDashboardPage.css.ts","../../src/pages/BackofficeDashboardPage.tsx"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const tilesGrid = sprinkles({\n  display: 'grid',\n  gridTemplateColumns: 'autoFillMinmax320',\n  gap: 4,\n});\n\nexport const tileBody = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 2,\n});\n\nexport const tileCount = sprinkles({\n  fontSize: '3xl',\n  fontWeight: 'bold',\n  lineHeight: 1,\n});\n\nexport const links = sprinkles({\n  display: 'flex',\n  flexWrap: 'wrap',\n  rowGap: 2,\n  columnGap: 3,\n});\n","/* eslint-disable no-ternary */\nimport { type JSX, Suspense } from 'react';\nimport { Link } from '@plumile/router';\nimport type {\n  BackofficeDashboardConfig,\n  BackofficeDashboardWidget,\n  I18nLabel,\n} from '@plumile/backoffice-core/types.js';\nimport { DataTable, DetailPageTemplate, InfoTile } from '@plumile/ui';\nimport type { TFunction } from 'i18next';\nimport { useTranslation } from 'react-i18next';\nimport * as ReactRelay from 'react-relay';\nimport type { GraphQLTaggedNode, OperationType } from 'relay-runtime';\n\nimport { BackofficeErrorBoundary } from '../components/backoffice/errors/BackofficeErrorBoundary.js';\nimport { useBackofficeReactTranslation } from '../i18n/useBackofficeReactTranslation.js';\nimport { useBackofficeConfig } from '../provider/BackofficeConfigContext.js';\nimport { useBackofficeDashboardConfig } from '../provider/useBackofficeLazyValue.js';\nimport { buildDataTableColumns } from '../components/backoffice/columns/buildDataTableColumns.js';\nimport { BackofficeRightPageLayout } from '../components/backoffice/layout/breadcrumb/BackofficeRightPageLayout.js';\nimport { buildDashboardBreadcrumb } from '../components/backoffice/layout/breadcrumb/buildBreadcrumbs.js';\n\nimport * as styles from './backofficeDashboardPage.css.js';\n\nconst { useLazyLoadQuery } = ReactRelay;\n\nconst resolveLabel = (label: I18nLabel, tApp: TFunction): string => {\n  return label(tApp);\n};\n\nconst getWidgetLabel = (\n  widget: BackofficeDashboardWidget,\n  config: BackofficeDashboardConfig,\n): I18nLabel => {\n  switch (widget.kind) {\n    case 'entityCount':\n    case 'shortcut':\n      return widget.label;\n    case 'tablePreview':\n    case 'textBlock':\n      return widget.title;\n    default:\n      return config.title;\n  }\n};\n\nconst hasWidgetQuery = (\n  widget: BackofficeDashboardWidget,\n): widget is BackofficeDashboardWidget & { query: GraphQLTaggedNode } => {\n  return 'query' in widget && widget.query != null;\n};\n\ntype WidgetContentProps = {\n  widget: BackofficeDashboardWidget;\n  globalData: unknown;\n};\n\nconst WidgetContent = ({\n  widget,\n  globalData,\n}: WidgetContentProps): JSX.Element | null => {\n  const { t: tApp } = useTranslation();\n  const { t } = useBackofficeReactTranslation();\n  const { entities } = useBackofficeConfig();\n\n  const resolveData = (data: unknown): unknown => {\n    if ('resolve' in widget && widget.resolve != null) {\n      return widget.resolve(data);\n    }\n    return null;\n  };\n\n  if (widget.kind === 'textBlock') {\n    const title = resolveLabel(widget.title, tApp);\n    const body = resolveLabel(widget.body, tApp);\n    return (\n      <InfoTile title={title}>\n        <div className={styles.tileBody}>{body}</div>\n      </InfoTile>\n    );\n  }\n\n  if (widget.kind === 'shortcut') {\n    const entity = entities[widget.entityId];\n    if (entity == null) {\n      return null;\n    }\n    const title = resolveLabel(widget.label, tApp);\n    if (entity.kind === 'tool') {\n      return (\n        <InfoTile title={title}>\n          <div className={styles.links}>\n            <Link to={entity.routes.list}>\n              {t('dashboard.actions.openTool')}\n            </Link>\n          </div>\n        </InfoTile>\n      );\n    }\n    return (\n      <InfoTile title={title}>\n        <div className={styles.links}>\n          <Link to={entity.routes.list}>{t('dashboard.actions.openList')}</Link>\n        </div>\n      </InfoTile>\n    );\n  }\n\n  if (widget.kind === 'tablePreview') {\n    const resolved = resolveData(globalData) as {\n      columns: readonly unknown[];\n      rows: readonly unknown[];\n    } | null;\n    if (resolved == null) {\n      return null;\n    }\n    const columns = buildDataTableColumns(resolved.columns as never, {\n      tApp,\n      t,\n      resolveEntityHref: (entityId, refId) => {\n        const entityConfig = entities[entityId];\n        if (entityConfig == null) {\n          return null;\n        }\n        return entityConfig.routes.detail(refId);\n      },\n    });\n    const title = resolveLabel(widget.title, tApp);\n    return (\n      <InfoTile title={title}>\n        <DataTable\n          columns={columns}\n          rows={resolved.rows}\n          getRowId={(row, index) => {\n            if (row != null && typeof row === 'object') {\n              const record = row as Record<string, unknown>;\n              const { id } = record;\n              if (typeof id === 'string' && id.trim() !== '') {\n                return id;\n              }\n            }\n            return String(index);\n          }}\n        />\n      </InfoTile>\n    );\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n  if (widget.kind === 'entityCount') {\n    const entityManifest = entities[widget.entityId];\n    if (entityManifest?.kind !== 'list-detail') {\n      return null;\n    }\n    const resolved = resolveData(globalData) as { count: number | null } | null;\n    let countLabel: number | string = t('common.notAvailable');\n    if (typeof resolved?.count === 'number') {\n      countLabel = resolved.count;\n    }\n    const title = resolveLabel(widget.label, tApp);\n    return (\n      <InfoTile title={title}>\n        <div className={styles.tileBody}>\n          <div className={styles.tileCount}>{countLabel}</div>\n          <div className={styles.links}>\n            <Link to={entityManifest.routes.list}>\n              {t('dashboard.actions.openList')}\n            </Link>\n          </div>\n        </div>\n      </InfoTile>\n    );\n  }\n\n  return null;\n};\n\ntype WidgetWithQueryProps = {\n  widget: BackofficeDashboardWidget & { query: GraphQLTaggedNode };\n};\n\nconst WidgetWithQuery = ({ widget }: WidgetWithQueryProps): JSX.Element => {\n  const data = useLazyLoadQuery<OperationType>(\n    widget.query,\n    {},\n    {\n      fetchPolicy: 'store-or-network',\n    },\n  );\n\n  return <WidgetContent widget={widget} globalData={data} />;\n};\n\ntype DashboardContentProps = {\n  config: BackofficeDashboardConfig;\n  globalData: unknown;\n};\n\nconst DashboardContent = ({\n  config,\n  globalData,\n}: DashboardContentProps): JSX.Element => {\n  const { t: tApp } = useTranslation();\n  const { t } = useBackofficeReactTranslation();\n\n  const title = resolveLabel(config.title, tApp);\n  const subtitle =\n    config.subtitle != null ? resolveLabel(config.subtitle, tApp) : undefined;\n\n  return (\n    <DetailPageTemplate\n      header={{\n        title,\n        subtitle: subtitle ?? t('dashboard.subtitle'),\n      }}\n    >\n      <div className={styles.tilesGrid}>\n        {config.widgets.map((widget) => {\n          const content = hasWidgetQuery(widget) ? (\n            <WidgetWithQuery widget={widget} />\n          ) : (\n            <WidgetContent widget={widget} globalData={globalData} />\n          );\n\n          return (\n            <BackofficeErrorBoundary\n              key={widget.id}\n              fallback={() => {\n                return (\n                  <InfoTile\n                    title={resolveLabel(getWidgetLabel(widget, config), tApp)}\n                  >\n                    <div className={styles.tileBody}>\n                      {t('common.notAvailable')}\n                    </div>\n                  </InfoTile>\n                );\n              }}\n            >\n              <Suspense\n                fallback={\n                  <InfoTile\n                    title={resolveLabel(getWidgetLabel(widget, config), tApp)}\n                  >\n                    <div className={styles.tileBody}>{t('common.loading')}</div>\n                  </InfoTile>\n                }\n              >\n                {content}\n              </Suspense>\n            </BackofficeErrorBoundary>\n          );\n        })}\n      </div>\n    </DetailPageTemplate>\n  );\n};\n\ntype DashboardWithQueryProps = {\n  config: BackofficeDashboardConfig;\n};\n\nconst DashboardWithQuery = ({\n  config,\n}: DashboardWithQueryProps): JSX.Element => {\n  const data = useLazyLoadQuery<OperationType>(\n    config.query as never,\n    {},\n    { fetchPolicy: 'store-or-network' },\n  );\n\n  return <DashboardContent config={config} globalData={data} />;\n};\n\nexport const BackofficeDashboardPage = (): JSX.Element => {\n  const { t: tApp } = useTranslation();\n  const { t } = useBackofficeReactTranslation();\n  const { entities } = useBackofficeConfig();\n  const dashboard = useBackofficeDashboardConfig();\n  const breadcrumb = buildDashboardBreadcrumb(t);\n\n  if (dashboard == null) {\n    const items = Object.values(entities)\n      .filter((config) => {\n        return config.kind === 'list-detail' && config.hasList;\n      })\n      .map((config) => {\n        return {\n          config,\n          label: resolveLabel(config.label, tApp),\n        };\n      })\n      .sort((left, right) => {\n        return left.label.localeCompare(right.label);\n      });\n\n    return (\n      <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n        <DetailPageTemplate\n          header={{\n            title: t('dashboard.title'),\n            subtitle: t('dashboard.subtitle'),\n          }}\n        >\n          <div className={styles.tilesGrid}>\n            {items.map(({ config, label }) => {\n              return (\n                <InfoTile key={config.id} title={label}>\n                  <div className={styles.tileBody}>\n                    <div className={styles.tileCount}>\n                      {t('common.notAvailable')}\n                    </div>\n                    <div className={styles.links}>\n                      <Link to={config.routes.list}>\n                        {t('dashboard.actions.openList')}\n                      </Link>\n                    </div>\n                  </div>\n                </InfoTile>\n              );\n            })}\n          </div>\n        </DetailPageTemplate>\n      </BackofficeRightPageLayout>\n    );\n  }\n\n  if (dashboard.query != null) {\n    return (\n      <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n        <DashboardWithQuery config={dashboard} />\n      </BackofficeRightPageLayout>\n    );\n  }\n\n  return (\n    <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n      <DashboardContent config={dashboard} globalData={null} />\n    </BackofficeRightPageLayout>\n  );\n};\n\nexport default BackofficeDashboardPage;\n"],"mappings":"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"}

package/lib/esm/BackofficeDetailPayload-B-qs8Fai.js

@@ -0,0 +1,94 @@
+import { t as e } from "./useBackofficeReactTranslation-WfXU8kCf.js";
+import { useTranslation as t } from "react-i18next";
+import { CopyableText as n, LazyMarkdownRenderer as r, Tag as i, cx as a } from "@plumile/ui";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/backoffice/detail/backofficeDetailBadgeRow.css.ts
+var c = "lqrxsj0 vncd899io vncd89ajx vncd89ao6 vncd89co", l = ({ items: e }) => {
+	let { t: n } = t();
+	return /* @__PURE__ */ o("div", {
+		className: c,
+		children: e.map((e) => {
+			let t = typeof e.label == "function" ? e.label(n) : e.label;
+			return /* @__PURE__ */ o(i, {
+				tone: e.tone ?? "neutral",
+				children: t
+			}, e.id);
+		})
+	});
+}, u = "_1vn15b70 vncd899io vncd89ai6 vncd89anx vncd89k4x", d = "_1vn15b71 vncd898o vncd8966 vncd89eeo vncd89v8r", f = "_1vn15b72 vncd898x vncd89v8p vncd89ut6", p = "_1vn15b73 vncd89bg6", m = {
+	xs: "_1vn15b74",
+	s: "_1vn15b75",
+	m: "_1vn15b76",
+	l: "_1vn15b77",
+	xl: "_1vn15b78",
+	fluid: "_1vn15b79"
+}, h = ({ label: t, size: r, value: i, copyValue: c, fullWidth: l = !1 }) => {
+	let { t: h } = e(), g = i;
+	(g == null || typeof g == "string" && g.trim() === "") && (g = h("common.notAvailable")), c != null && c !== "" && (g = /* @__PURE__ */ o(n, {
+		value: c,
+		copyValue: c,
+		truncate: !1,
+		copyLabel: h("common.actions.copy"),
+		copiedLabel: h("common.actions.copied")
+	}));
+	let _ = [u, m[r]];
+	return l && _.push(p), /* @__PURE__ */ s("div", {
+		className: a(..._),
+		children: [/* @__PURE__ */ o("span", {
+			className: d,
+			children: t
+		}), /* @__PURE__ */ o("div", {
+			className: f,
+			children: g
+		})]
+	});
+}, g = "_1v7vur60 vncd899io vncd89ai6 vncd89aoo vncd89lax vncd891rf vncd89v2r vncd891co vncd891qf vncd89wo vncd898qx", _ = "_1v7vur61 vncd899io vncd89ai6 vncd89anx", v = "_1v7vur62 vncd8996 vncd89amo vncd89v8p", y = "_1v7vur63 vncd898x vncd89v8r", b = "_1v7vur64 vncd899ix vncd89aoo vncd89c0f", x = ({ title: e, description: t, items: n, children: r }) => {
+	let i = null;
+	t != null && t !== "" && (i = /* @__PURE__ */ o("p", {
+		className: y,
+		children: t
+	}));
+	let a = null;
+	return n != null && n.length > 0 && (a = /* @__PURE__ */ o("div", {
+		className: b,
+		children: n.map((e) => /* @__PURE__ */ o(h, { ...e }, e.id))
+	})), /* @__PURE__ */ s("section", {
+		className: g,
+		children: [
+			/* @__PURE__ */ s("header", {
+				className: _,
+				children: [/* @__PURE__ */ o("h3", {
+					className: v,
+					children: e
+				}), i]
+			}),
+			a,
+			r
+		]
+	});
+};
+//#endregion
+//#region src/components/backoffice/detail/detailPayloadUtils.ts
+function S(e) {
+	if (e == null) return "";
+	try {
+		return `\`\`\`json\n${JSON.stringify(e, null, 2)}\n\`\`\``;
+	} catch {
+		let t = "[unserializable]";
+		return typeof e == "string" ? t = e : (typeof e == "number" || typeof e == "boolean") && (t = String(e)), `\`\`\`\n${t}\n\`\`\``;
+	}
+}
+//#endregion
+//#region src/components/backoffice/detail/BackofficeDetailPayload.tsx
+var C = ({ title: t, content: n, format: i = "markdown", description: a }) => {
+	let { t: s } = e(), c = "";
+	return i === "json" ? c = S(n) : n != null && (c = typeof n == "string" ? n : typeof n == "number" || typeof n == "boolean" ? String(n) : S(n)), c.trim() === "" && (c = s("common.notAvailable")), /* @__PURE__ */ o(x, {
+		title: t,
+		description: a,
+		children: /* @__PURE__ */ o(r, { content: c })
+	});
+};
+//#endregion
+export { l as a, h as i, S as n, x as r, C as t };
+
+//# sourceMappingURL=BackofficeDetailPayload-B-qs8Fai.js.map

package/lib/esm/BackofficeDetailPayload-B-qs8Fai.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficeDetailPayload-B-qs8Fai.js","names":[],"sources":["../../src/components/backoffice/detail/backofficeDetailBadgeRow.css.ts","../../src/components/backoffice/detail/BackofficeDetailBadgeRow.tsx","../../src/components/backoffice/detail/backofficeDetailField.css.ts","../../src/components/backoffice/detail/BackofficeDetailField.tsx","../../src/components/backoffice/detail/backofficeDetailSection.css.ts","../../src/components/backoffice/detail/BackofficeDetailSection.tsx","../../src/components/backoffice/detail/detailPayloadUtils.ts","../../src/components/backoffice/detail/BackofficeDetailPayload.tsx"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const row = sprinkles({\n  display: 'flex',\n  flexWrap: 'wrap',\n  gap: 2,\n  alignItems: 'center',\n});\n","/* eslint-disable no-ternary */\nimport { type JSX } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport type { BackofficeBadgeItem } from '@plumile/backoffice-core/types.js';\nimport { Tag } from '@plumile/ui';\n\nimport * as styles from './backofficeDetailBadgeRow.css.js';\n\nexport type BackofficeDetailBadgeRowProps = {\n  items: readonly BackofficeBadgeItem[];\n};\n\nexport const BackofficeDetailBadgeRow = ({\n  items,\n}: BackofficeDetailBadgeRowProps): JSX.Element => {\n  const { t } = useTranslation();\n  return (\n    <div className={styles.row}>\n      {items.map((item) => {\n        const label =\n          typeof item.label === 'function' ? item.label(t) : item.label;\n        return (\n          <Tag key={item.id} tone={item.tone ?? 'neutral'}>\n            {label}\n          </Tag>\n        );\n      })}\n    </div>\n  );\n};\n\nexport default BackofficeDetailBadgeRow;\n","import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const field = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n  minWidth: 0,\n});\n\nexport const label = sprinkles({\n  fontSize: 'xs',\n  textTransform: 'uppercase',\n  letterSpacing: 'capsTight',\n  color: 'textSecondary',\n});\n\nexport const value = sprinkles({\n  fontSize: 'sm',\n  color: 'text',\n  wordBreak: 'break-word',\n});\n\nexport const fullWidth = sprinkles({\n  gridColumn: 'span-full',\n});\n\nexport const size = {\n  xs: style({ maxWidth: '10ch' }),\n  s: style({ maxWidth: '18ch' }),\n  m: style({ maxWidth: '28ch' }),\n  l: style({ maxWidth: '44ch' }),\n  xl: style({ maxWidth: '64ch' }),\n  fluid: style({ maxWidth: '100%' }),\n};\n","import { type JSX, type ReactNode } from 'react';\nimport type { BackofficeFieldSize } from '@plumile/backoffice-core/types.js';\n\nimport { CopyableText, cx } from '@plumile/ui';\n\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\n\nimport * as styles from './backofficeDetailField.css.js';\n\nexport type BackofficeDetailFieldProps = {\n  id: string;\n  label: string;\n  size: BackofficeFieldSize;\n  value: ReactNode | null | undefined;\n  copyValue?: string;\n  fullWidth?: boolean;\n};\n\nexport const BackofficeDetailField = ({\n  label,\n  size,\n  value,\n  copyValue,\n  fullWidth = false,\n}: BackofficeDetailFieldProps): JSX.Element => {\n  const { t } = useBackofficeReactTranslation();\n  let resolvedValue: ReactNode = value;\n  if (\n    resolvedValue == null ||\n    (typeof resolvedValue === 'string' && resolvedValue.trim() === '')\n  ) {\n    resolvedValue = t('common.notAvailable');\n  }\n\n  if (copyValue != null && copyValue !== '') {\n    resolvedValue = (\n      <CopyableText\n        value={copyValue}\n        copyValue={copyValue}\n        truncate={false}\n        copyLabel={t('common.actions.copy')}\n        copiedLabel={t('common.actions.copied')}\n      />\n    );\n  }\n\n  const fieldClassNames = [styles.field, styles.size[size]];\n  if (fullWidth) {\n    fieldClassNames.push(styles.fullWidth);\n  }\n\n  return (\n    <div className={cx(...fieldClassNames)}>\n      <span className={styles.label}>{label}</span>\n      <div className={styles.value}>{resolvedValue}</div>\n    </div>\n  );\n};\n\nexport default BackofficeDetailField;\n","import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const section = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 4,\n  padding: 6,\n  borderRadius: 'md',\n  backgroundColor: 'surface',\n  borderWidth: 'default',\n  borderStyle: 'solid',\n  borderColor: 'borderSubtle',\n  boxShadow: 'inkSoft',\n});\n\nexport const header = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n});\n\nexport const title = sprinkles({\n  fontSize: 'base',\n  fontWeight: 'semibold',\n  color: 'text',\n});\n\nexport const description = sprinkles({\n  fontSize: 'sm',\n  color: 'textSecondary',\n});\n\nexport const grid = sprinkles({\n  display: 'grid',\n  gap: 4,\n  gridTemplateColumns: 'autoFitMinmax220',\n});\n","import { type JSX, type ReactNode } from 'react';\n\nimport {\n  BackofficeDetailField,\n  type BackofficeDetailFieldProps,\n} from './BackofficeDetailField.js';\nimport * as styles from './backofficeDetailSection.css.js';\n\nexport type BackofficeDetailSectionProps = {\n  title: string;\n  description?: string;\n  items?: readonly BackofficeDetailFieldProps[];\n  children?: ReactNode;\n};\n\nexport const BackofficeDetailSection = ({\n  title,\n  description,\n  items,\n  children,\n}: BackofficeDetailSectionProps): JSX.Element => {\n  let descriptionNode: JSX.Element | null = null;\n  if (description != null && description !== '') {\n    descriptionNode = <p className={styles.description}>{description}</p>;\n  }\n\n  let itemsNode: JSX.Element | null = null;\n  if (items != null && items.length > 0) {\n    itemsNode = (\n      <div className={styles.grid}>\n        {items.map((item) => {\n          return <BackofficeDetailField key={item.id} {...item} />;\n        })}\n      </div>\n    );\n  }\n\n  return (\n    <section className={styles.section}>\n      <header className={styles.header}>\n        <h3 className={styles.title}>{title}</h3>\n        {descriptionNode}\n      </header>\n      {itemsNode}\n      {children}\n    </section>\n  );\n};\n\nexport default BackofficeDetailSection;\n","/**\n * Formats a JSON payload into a fenced Markdown code block.\n */\nexport function formatJsonPayload(value: unknown): string {\n  if (value == null) {\n    return '';\n  }\n  try {\n    return `\\`\\`\\`json\\n${JSON.stringify(value, null, 2)}\\n\\`\\`\\``;\n  } catch {\n    let fallback = '[unserializable]';\n    if (typeof value === 'string') {\n      fallback = value;\n    } else if (typeof value === 'number' || typeof value === 'boolean') {\n      fallback = String(value);\n    }\n    return `\\`\\`\\`\\n${fallback}\\n\\`\\`\\``;\n  }\n}\n\n/**\n * Formats a list of strings as a Markdown bullet list.\n */\nexport function formatListAsMarkdown(items: readonly string[]): string {\n  if (items.length === 0) {\n    return '';\n  }\n  return items\n    .map((item) => {\n      return `- ${item}`;\n    })\n    .join('\\n');\n}\n","import { type JSX } from 'react';\n\nimport { LazyMarkdownRenderer } from '@plumile/ui';\n\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\nimport { BackofficeDetailSection } from './BackofficeDetailSection.js';\nimport { formatJsonPayload } from './detailPayloadUtils.js';\n\nexport type BackofficeDetailPayloadProps = {\n  title: string;\n  content: unknown;\n  format?: 'markdown' | 'json' | 'text';\n  description?: string;\n};\n\nexport const BackofficeDetailPayload = ({\n  title,\n  content,\n  format = 'markdown',\n  description,\n}: BackofficeDetailPayloadProps): JSX.Element => {\n  const { t } = useBackofficeReactTranslation();\n  let resolved = '';\n  if (format === 'json') {\n    resolved = formatJsonPayload(content);\n  } else if (content != null) {\n    if (typeof content === 'string') {\n      resolved = content;\n    } else if (typeof content === 'number' || typeof content === 'boolean') {\n      resolved = String(content);\n    } else {\n      resolved = formatJsonPayload(content);\n    }\n  }\n\n  if (resolved.trim() === '') {\n    resolved = t('common.notAvailable');\n  }\n\n  return (\n    <BackofficeDetailSection title={title} description={description}>\n      <LazyMarkdownRenderer content={resolved} />\n    </BackofficeDetailSection>\n  );\n};\n\nexport default BackofficeDetailPayload;\n"],"mappings":";;;;;0DCaa,KAA4B,EACvC,eACgD;CAChD,IAAM,EAAE,SAAM,GAAgB;AAC9B,QACE,kBAAC,OAAD;EAAK,WAAW;YACb,EAAM,KAAK,MAAS;GACnB,IAAM,IACJ,OAAO,EAAK,SAAU,aAAa,EAAK,MAAM,EAAE,GAAG,EAAK;AAC1D,UACE,kBAAC,GAAD;IAAmB,MAAM,EAAK,QAAQ;cACnC;IACG,EAFI,EAAK,GAET;IAER;EACE,CAAA;;;;;;;;GEVG,KAAyB,EACpC,OAAA,GACA,MAAA,GACA,OAAA,GACA,cACA,WAAA,IAAY,SACiC;CAC7C,IAAM,EAAE,SAAM,GAA+B,EACzC,IAA2B;AAQ/B,EANE,KAAiB,QAChB,OAAO,KAAkB,YAAY,EAAc,MAAM,KAAK,QAE/D,IAAgB,EAAE,sBAAsB,GAGtC,KAAa,QAAQ,MAAc,OACrC,IACE,kBAAC,GAAD;EACE,OAAO;EACI;EACX,UAAU;EACV,WAAW,EAAE,sBAAsB;EACnC,aAAa,EAAE,wBAAwB;EACvC,CAAA;CAIN,IAAM,IAAkB,CAAC,GAAc,EAAY,GAAM;AAKzD,QAJI,KACF,EAAgB,KAAK,EAAiB,EAItC,kBAAC,OAAD;EAAK,WAAW,EAAG,GAAG,EAAgB;YAAtC,CACE,kBAAC,QAAD;GAAM,WAAW;aAAe;GAAa,CAAA,EAC7C,kBAAC,OAAD;GAAK,WAAW;aAAe;GAAoB,CAAA,CAC/C;;uSExCG,KAA2B,EACtC,OAAA,GACA,aAAA,GACA,UACA,kBAC+C;CAC/C,IAAI,IAAsC;AAC1C,CAAI,KAAe,QAAQ,MAAgB,OACzC,IAAkB,kBAAC,KAAD;EAAG,WAAW;YAAqB;EAAgB,CAAA;CAGvE,IAAI,IAAgC;AAWpC,QAVI,KAAS,QAAQ,EAAM,SAAS,MAClC,IACE,kBAAC,OAAD;EAAK,WAAW;YACb,EAAM,KAAK,MACH,kBAAC,GAAD,EAAqC,GAAI,GAAQ,EAArB,EAAK,GAAgB,CACxD;EACE,CAAA,GAKR,kBAAC,WAAD;EAAS,WAAW;YAApB;GACE,kBAAC,UAAD;IAAQ,WAAW;cAAnB,CACE,kBAAC,MAAD;KAAI,WAAW;eAAe;KAAW,CAAA,EACxC,EACM;;GACR;GACA;GACO;;;;;AC1Cd,SAAgB,EAAkB,GAAwB;AACxD,KAAI,KAAS,KACX,QAAO;AAET,KAAI;AACF,SAAO,eAAe,KAAK,UAAU,GAAO,MAAM,EAAE,CAAC;SAC/C;EACN,IAAI,IAAW;AAMf,SALI,OAAO,KAAU,WACnB,IAAW,KACF,OAAO,KAAU,YAAY,OAAO,KAAU,eACvD,IAAW,OAAO,EAAM,GAEnB,WAAW,EAAS;;;;;ACD/B,IAAa,KAA2B,EACtC,UACA,YACA,YAAS,YACT,qBAC+C;CAC/C,IAAM,EAAE,SAAM,GAA+B,EACzC,IAAW;AAiBf,QAhBI,MAAW,SACb,IAAW,EAAkB,EAAQ,GAC5B,KAAW,SACpB,AAKE,IALE,OAAO,KAAY,WACV,IACF,OAAO,KAAY,YAAY,OAAO,KAAY,YAChD,OAAO,EAAQ,GAEf,EAAkB,EAAQ,GAIrC,EAAS,MAAM,KAAK,OACtB,IAAW,EAAE,sBAAsB,GAInC,kBAAC,GAAD;EAAgC;EAAoB;YAClD,kBAAC,GAAD,EAAsB,SAAS,GAAY,CAAA;EACnB,CAAA"}