@plumile/backoffice-react 0.1.104 → 0.1.105

package/lib/esm/{AcceptInvitationScreen-B1IPafwD.js → AcceptInvitationScreen-VaWXQPHp.js}

@@ -1,6 +1,6 @@
 import { t as e } from "./useBackofficeReactTranslation-Btt58EIo.js";
 import { a as t, d as n, s as r } from "./loginPage.css-B7Io_DuU.js";
-import { o as i } from "./useAuth-CheTnq60.js";
+import { o as i } from "./useAuth-CWf8ZspF.js";
 import { t as a } from "./AuthPanel-BaIRFGbX.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";
@@ -26,8 +26,8 @@ var h = ({ auth: h, onSuccessRedirect: g, onBackToLogin: _, token: v }) => {
 				return;
 			}
 			S("completed"), g();
-		}).catch((e) => {
-			S("error"), e instanceof Error ? A(e.message) : A(typeof e == "string" ? e : y("auth.acceptInvitation.errors.default"));
+		}).catch(() => {
+			S("error"), A(y("auth.acceptInvitation.errors.default"));
 		}).finally(() => {
 			O(!1);
 		});
@@ -114,4 +114,4 @@ var h = ({ auth: h, onSuccessRedirect: g, onBackToLogin: _, token: v }) => {
 //#endregion
 export { h as t };
 
-//# sourceMappingURL=AcceptInvitationScreen-B1IPafwD.js.map
+//# sourceMappingURL=AcceptInvitationScreen-VaWXQPHp.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AcceptInvitationScreen-VaWXQPHp.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 { useBackofficeReactTranslation } from '../../i18n/useBackofficeReactTranslation.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 } = useBackofficeReactTranslation();\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(() => {\n          setStatus('error');\n          setErrorMessage(t('auth.acceptInvitation.errors.default'));\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/{BackofficeAcceptInvitationPage-BfRsORii.js → BackofficeAcceptInvitationPage-tpfBfhT9.js}

@@ -1,7 +1,7 @@
 import { r as e } from "./useBackofficeReactTranslation-Btt58EIo.js";
-import { t } from "./AcceptInvitationScreen-B1IPafwD.js";
-import { t as n } from "./useBackofficeAuth-DVAXNAjP.js";
-import { t as r } from "./backofficeAuthPaths-2KMmkBLv.js";
+import { t } from "./AcceptInvitationScreen-VaWXQPHp.js";
+import { t as n } from "./useBackofficeAuth-Da7FPNys.js";
+import { t as r } from "./backofficeAuthPaths-2hHNn8D3.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";
@@ -21,4 +21,4 @@ var c = () => {
 //#endregion
 export { c as BackofficeAcceptInvitationPage, c as default };
 
-//# sourceMappingURL=BackofficeAcceptInvitationPage-BfRsORii.js.map
+//# sourceMappingURL=BackofficeAcceptInvitationPage-tpfBfhT9.js.map

package/lib/esm/{BackofficeAcceptInvitationPage-BfRsORii.js.map → BackofficeAcceptInvitationPage-tpfBfhT9.js.map}

@@ -1 +1 @@
-{"version":3,"file":"BackofficeAcceptInvitationPage-BfRsORii.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;CAW1C,OACE,kBAAC,GAAD;EACQ,MAZG,GAYH;EACN,mBAX0B,QAAkB;GAC9C,GAAe,QAAQ,KAAK,EAAE,UAAU,GAAU,CAAC;KAClD,CAAC,GAAU,GAAe,QAAQ,CASd;EACnB,eARsB,QAAkB;GAC1C,GAAe,QAAQ,KAAK,EAAE,UAAU,EAAuB,EAAS,EAAE,CAAC;KAC1E,CAAC,GAAU,GAAe,QAAQ,CAMlB;EACf,CAAA"}
+{"version":3,"file":"BackofficeAcceptInvitationPage-tpfBfhT9.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;CAW1C,OACE,kBAAC,GAAD;EACQ,MAZG,GAYH;EACN,mBAX0B,QAAkB;GAC9C,GAAe,QAAQ,KAAK,EAAE,UAAU,GAAU,CAAC;KAClD,CAAC,GAAU,GAAe,QAAQ,CASd;EACnB,eARsB,QAAkB;GAC1C,GAAe,QAAQ,KAAK,EAAE,UAAU,EAAuB,EAAS,EAAE,CAAC;KAC1E,CAAC,GAAU,GAAe,QAAQ,CAMlB;EACf,CAAA"}

package/lib/esm/BackofficeDashboardPage-D5W36DY-.js

@@ -0,0 +1,329 @@
+import { r as e, t } from "./useBackofficeReactTranslation-Btt58EIo.js";
+import { t as n } from "./BackofficeErrorBoundary-BwRVSDHU.js";
+import { t as r } from "./buildDataTableColumns-DdmF-EYq.js";
+import { t as i } from "./BackofficeRightPageLayout-CfNkrMvH.js";
+import { a } from "./useBackofficeLazyValue-CW9xfRzQ.js";
+import { t as o } from "./buildBreadcrumbs-C5St167Y.js";
+import { Suspense as s } from "react";
+import { useTranslation as c } from "react-i18next";
+import { Link as l } from "@plumile/router";
+import { BackofficeEmptyState as u, DashboardGrid as d, DashboardGridItem as f, DataTable as p, DetailPageTemplate as m, InfoTile as h, MetricCard as g, MetricTileGroup as _, Spinner as v, cx as y } from "@plumile/ui";
+import * as b from "react-relay";
+import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
+//#region src/pages/BackofficeDashboardPage.helpers.ts
+var w = (e, t) => e(t), T = (e, t) => {
+	switch (e.kind) {
+		case "entityCount":
+		case "shortcut": return e.label;
+		case "tablePreview":
+		case "textBlock": return e.title;
+		case "recentItems":
+		case "metricGroup":
+		case "quickActions":
+		case "statusSummary": return e.title == null ? t.title : e.title;
+		default: return t.title;
+	}
+}, ee = (e) => "query" in e && e.query != null, te = "_9npmwz0 txvbqbcgg", E = "_9npmwz1 _1v9etop0 txvbqbv41 txvbqbwp txvbqb1rp txvbqb1qg txvbqb1cp", D = "_9npmwz2 txvbqbv67 txvbqb9ip txvbqb3b txvbqbu7g", O = ({ metrics: e, emptyState: t = null }) => e.length === 0 ? /* @__PURE__ */ S(x, { children: t }) : /* @__PURE__ */ S(_, {
+	className: te,
+	children: e.map((e, t) => {
+		let n = `${e.id}-${t}`, r = /* @__PURE__ */ S(g, {
+			className: E,
+			label: e.label,
+			value: e.value,
+			hint: e.hint
+		}, n);
+		return e.href == null ? r : /* @__PURE__ */ S(l, {
+			to: e.href,
+			className: D,
+			children: r
+		}, n);
+	})
+}), k = "_1v9etop0 txvbqbv41 txvbqbwp txvbqb1rp txvbqb1qg txvbqb1cp", A = ({ actions: e, children: t, subtitle: n, title: r }) => /* @__PURE__ */ S(h, {
+	title: r,
+	subtitle: n,
+	actions: e,
+	className: k,
+	children: t
+}), j = "txvbqb9iy txvbqbao7 txvbqbbtp txvbqbbth", M = "txvbqbbtg", N = "txvbqbbtg", P = "_3w0i4k0 txvbqbnw7 txvbqbojg txvbqbp6g txvbqbly7 txvbqb9ip txvbqbcp txvbqbdoy txvbqbjjp txvbqb1rg txvbqb1cp txvbqb1qg txvbqbwp txvbqbv43 txvbqbv99 txvbqbamp txvbqb3b", F = ({ actions: e, emptyState: t = null, layout: n = "grid" }) => {
+	if (e.length === 0) return /* @__PURE__ */ S(x, { children: t });
+	let r = e.length === 1;
+	return /* @__PURE__ */ S("div", {
+		className: y(j, {
+			[N]: n === "stack",
+			[M]: r
+		}),
+		children: e.map((e, t) => {
+			let n = `${e.id}-${t}`;
+			return /* @__PURE__ */ S(l, {
+				to: e.href,
+				className: P,
+				children: e.label
+			}, n);
+		})
+	});
+}, I = "txvbqb9ip txvbqbai7 txvbqbany", L = "s560xy1 s560xy0 txvbqbnvy txvbqboj7 txvbqbp6g txvbqbly7 txvbqb9ip txvbqbcp txvbqbdpp txvbqbaog txvbqb1rg txvbqbv9z", R = "s560xy2 s560xy0 txvbqbnvy txvbqboj7 txvbqbp6g txvbqbly7 txvbqb9ip txvbqbcp txvbqbdpp txvbqbaog txvbqb1rg txvbqbv9z txvbqb3b", z = "txvbqbk5y txvbqbva1 txvbqbl87", B = "txvbqbaj7 txvbqbamp txvbqbv9z txvbqbakg txvbqbuxg", V = ({ items: e, emptyState: t = null }) => e.length === 0 ? /* @__PURE__ */ S(x, { children: t }) : /* @__PURE__ */ S("div", {
+	className: I,
+	children: e.map((e, t) => {
+		let n = `${e.id}-${t}`, r = /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ S("span", {
+			className: z,
+			children: e.label
+		}), /* @__PURE__ */ S("span", {
+			className: B,
+			children: e.value
+		})] });
+		return e.href == null ? /* @__PURE__ */ S("div", {
+			className: L,
+			children: r
+		}, n) : /* @__PURE__ */ S(l, {
+			to: e.href,
+			className: R,
+			children: r
+		}, n);
+	})
+}), H = "txvbqb9ip txvbqbai7 txvbqbao7", U = "txvbqb9ip txvbqbcp txvbqbao7 txvbqbva3 txvbqb8y", W = "txvbqba7 txvbqbamy txvbqbehy", { useLazyLoadQuery: G } = b, K = () => {
+	let { t: e } = t();
+	return /* @__PURE__ */ S(u, { title: e("common.notAvailable") });
+}, q = () => {
+	let { t: e } = t();
+	return /* @__PURE__ */ C("div", {
+		className: U,
+		children: [/* @__PURE__ */ S(v, { ariaLabel: e("common.loading") }), /* @__PURE__ */ S("span", { children: e("common.loading") })]
+	});
+}, J = (e) => e ?? "m", Y = (e) => {
+	if (e.layout?.span != null) return e.layout.span;
+	let t = J(e.size);
+	return t === "s" ? 3 : t === "m" ? 4 : t === "l" ? 6 : t === "xl" ? 8 : 12;
+}, X = (e) => e.layout?.tabletSpan, Z = ({ widget: n, globalData: i }) => {
+	let { t: a } = c(), { t: o } = t(), { entities: s } = e(), l = n.description == null ? void 0 : w(n.description, a), u = (e) => "resolve" in n && n.resolve != null ? n.resolve(e) : null;
+	if (n.kind === "textBlock") return /* @__PURE__ */ S(A, {
+		title: w(n.title, a),
+		subtitle: l,
+		children: /* @__PURE__ */ S("div", {
+			className: H,
+			children: w(n.body, a)
+		})
+	});
+	if (n.kind === "shortcut") {
+		let e = s[n.entityId], t = w(n.label, a);
+		return e == null ? /* @__PURE__ */ S(A, {
+			title: t,
+			subtitle: l,
+			children: /* @__PURE__ */ S(K, {})
+		}) : e.kind === "tool" ? /* @__PURE__ */ S(A, {
+			title: t,
+			subtitle: l,
+			children: /* @__PURE__ */ S(F, { actions: [{
+				id: e.id,
+				href: e.routes.list,
+				label: o("dashboard.actions.openTool")
+			}] })
+		}) : /* @__PURE__ */ S(A, {
+			title: t,
+			subtitle: l,
+			children: /* @__PURE__ */ S(F, { actions: [{
+				id: e.id,
+				href: e.routes.list,
+				label: o("dashboard.actions.openList")
+			}] })
+		});
+	}
+	if (n.kind === "tablePreview") {
+		let e = u(i);
+		if (e == null) return /* @__PURE__ */ S(A, {
+			title: w(n.title, a),
+			subtitle: l,
+			children: /* @__PURE__ */ S(K, {})
+		});
+		let t = r(e.columns, {
+			tApp: a,
+			t: o,
+			resolveEntityHref: (e, t) => {
+				let n = s[e];
+				return n == null ? null : n.routes.detail(t);
+			}
+		});
+		return /* @__PURE__ */ S(A, {
+			title: w(n.title, a),
+			subtitle: l,
+			children: /* @__PURE__ */ S(p, {
+				columns: t,
+				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 (n.kind === "metricGroup") {
+		let e = u(i);
+		return e == null ? /* @__PURE__ */ S(K, {}) : /* @__PURE__ */ S(O, {
+			emptyState: /* @__PURE__ */ S(K, {}),
+			metrics: e.map((e) => ({
+				id: e.id,
+				href: e.href,
+				label: w(e.label, a),
+				value: e.value ?? o("common.notAvailable"),
+				hint: e.meta == null ? void 0 : w(e.meta, a)
+			}))
+		});
+	}
+	if (n.kind === "quickActions") return /* @__PURE__ */ S(A, {
+		title: n.title == null ? o("dashboard.actions.openTool") : w(n.title, a),
+		subtitle: l,
+		children: /* @__PURE__ */ S(F, {
+			layout: n.layout?.zone === "aside" ? "stack" : "grid",
+			emptyState: /* @__PURE__ */ S(K, {}),
+			actions: n.actions.map((e) => ({
+				id: e.id,
+				href: e.href,
+				label: w(e.label, a)
+			}))
+		})
+	});
+	if (n.kind === "statusSummary") {
+		let e = u(i);
+		return e == null ? /* @__PURE__ */ S(A, {
+			title: n.title == null ? void 0 : w(n.title, a),
+			subtitle: l,
+			children: /* @__PURE__ */ S(K, {})
+		}) : /* @__PURE__ */ S(A, {
+			title: n.title == null ? void 0 : w(n.title, a),
+			subtitle: l,
+			children: /* @__PURE__ */ S(V, {
+				emptyState: /* @__PURE__ */ S(K, {}),
+				items: e.map((e) => ({
+					id: e.id,
+					href: e.href,
+					label: w(e.label, a),
+					value: e.value ?? o("common.notAvailable")
+				}))
+			})
+		});
+	}
+	if (n.kind === "recentItems") return /* @__PURE__ */ S(A, {
+		title: n.title == null ? o("dashboard.title") : w(n.title, a),
+		subtitle: l,
+		children: /* @__PURE__ */ S(K, {})
+	});
+	let d = s[n.entityId];
+	if (d?.kind !== "list-detail") return /* @__PURE__ */ S(A, {
+		title: w(n.label, a),
+		subtitle: l,
+		children: /* @__PURE__ */ S(K, {})
+	});
+	let f = u(i), m = o("common.notAvailable");
+	return typeof f?.count == "number" && (m = f.count), /* @__PURE__ */ S(A, {
+		title: w(n.label, a),
+		subtitle: l,
+		children: /* @__PURE__ */ C("div", {
+			className: H,
+			children: [/* @__PURE__ */ S("div", {
+				className: W,
+				children: m
+			}), /* @__PURE__ */ S(F, {
+				emptyState: /* @__PURE__ */ S(K, {}),
+				actions: [{
+					id: d.id,
+					href: d.routes.list,
+					label: o("dashboard.actions.openList")
+				}]
+			})]
+		})
+	});
+}, ne = ({ widget: e }) => /* @__PURE__ */ S(Z, {
+	widget: e,
+	globalData: G(e.query, {}, { fetchPolicy: "store-or-network" })
+}), Q = ({ config: e, globalData: r }) => {
+	let { t: i } = c(), { t: a } = t();
+	return /* @__PURE__ */ S(m, {
+		header: {
+			title: w(e.title, i),
+			subtitle: (e.subtitle == null ? void 0 : w(e.subtitle, i)) ?? a("dashboard.subtitle")
+		},
+		children: /* @__PURE__ */ S(d, {
+			columns: 12,
+			children: e.widgets.map((t) => {
+				let a = w(T(t, e), i), o = ee(t) ? /* @__PURE__ */ S(ne, { widget: t }) : /* @__PURE__ */ S(Z, {
+					widget: t,
+					globalData: r
+				});
+				return /* @__PURE__ */ S(f, {
+					minHeight: t.minHeight ?? "auto",
+					span: Y(t),
+					tabletSpan: X(t),
+					children: /* @__PURE__ */ S(n, {
+						fallback: () => /* @__PURE__ */ S(A, {
+							title: a,
+							children: /* @__PURE__ */ S(K, {})
+						}),
+						children: /* @__PURE__ */ S(s, {
+							fallback: /* @__PURE__ */ S(A, {
+								title: a,
+								children: /* @__PURE__ */ S(q, {})
+							}),
+							children: o
+						})
+					})
+				}, t.id);
+			})
+		})
+	});
+}, re = ({ config: e }) => /* @__PURE__ */ S(Q, {
+	config: e,
+	globalData: G(e.query, {}, { fetchPolicy: "store-or-network" })
+}), $ = () => {
+	let { t: n } = c(), { t: r } = t(), { entities: s } = e(), l = a(), u = o(r);
+	if (l == null) {
+		let e = Object.values(s).filter((e) => e.kind === "list-detail" && e.hasList).map((e) => ({
+			config: e,
+			label: w(e.label, n)
+		})).sort((e, t) => e.label.localeCompare(t.label));
+		return /* @__PURE__ */ S(i, {
+			breadcrumb: u,
+			children: /* @__PURE__ */ S(m, {
+				header: {
+					title: r("dashboard.title"),
+					subtitle: r("dashboard.subtitle")
+				},
+				children: /* @__PURE__ */ S(d, {
+					columns: 12,
+					children: e.map(({ config: e, label: t }) => /* @__PURE__ */ S(f, {
+						span: 4,
+						children: /* @__PURE__ */ S(A, {
+							title: t,
+							children: /* @__PURE__ */ C("div", {
+								className: H,
+								children: [/* @__PURE__ */ S("div", {
+									className: W,
+									children: r("common.notAvailable")
+								}), /* @__PURE__ */ S(F, { actions: [{
+									id: e.id,
+									href: e.routes.list,
+									label: r("dashboard.actions.openList")
+								}] })]
+							})
+						})
+					}, e.id))
+				})
+			})
+		});
+	}
+	return l.query == null ? /* @__PURE__ */ S(i, {
+		breadcrumb: u,
+		children: /* @__PURE__ */ S(Q, {
+			config: l,
+			globalData: null
+		})
+	}) : /* @__PURE__ */ S(i, {
+		breadcrumb: u,
+		children: /* @__PURE__ */ S(re, { config: l })
+	});
+};
+//#endregion
+export { $ as BackofficeDashboardPage, $ as default };
+
+//# sourceMappingURL=BackofficeDashboardPage-D5W36DY-.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficeDashboardPage-D5W36DY-.js","names":[],"sources":["../../src/pages/BackofficeDashboardPage.helpers.ts","../../src/pages/dashboard/dashboardMetricGroup.css.ts","../../src/pages/dashboard/DashboardMetricGroup.tsx","../../src/pages/dashboard/dashboardPanel.css.ts","../../src/pages/dashboard/DashboardPanel.tsx","../../src/pages/dashboard/dashboardQuickActions.css.ts","../../src/pages/dashboard/DashboardQuickActions.tsx","../../src/pages/dashboard/dashboardStatusList.css.ts","../../src/pages/dashboard/DashboardStatusList.tsx","../../src/pages/backofficeDashboardPage.css.ts","../../src/pages/BackofficeDashboardPage.tsx"],"sourcesContent":["import type {\n  BackofficeDashboardConfig,\n  BackofficeDashboardWidget,\n  I18nLabel,\n} from '@plumile/backoffice-core/types.js';\nimport type { TFunction } from 'i18next';\nimport type { GraphQLTaggedNode } from 'relay-runtime';\n\nexport const resolveLabel = (label: I18nLabel, tApp: TFunction): string => {\n  return label(tApp);\n};\n\nexport const 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    case 'recentItems':\n    case 'metricGroup':\n    case 'quickActions':\n    case 'statusSummary':\n      if (widget.title != null) {\n        return widget.title;\n      }\n      return config.title;\n    default:\n      return config.title;\n  }\n};\n\nexport const hasWidgetQuery = (\n  widget: BackofficeDashboardWidget,\n): widget is BackofficeDashboardWidget & { query: GraphQLTaggedNode } => {\n  return 'query' in widget && widget.query != null;\n};\n","import { style } from '@vanilla-extract/css';\nimport { sprinkles, vars } from '@plumile/ui';\n\nimport { panel } from './dashboardPanel.css.js';\n\nexport const group = style([\n  sprinkles({\n    height: 'full',\n  }),\n  {\n    alignItems: 'stretch',\n  },\n]);\n\nexport const card = style([\n  panel,\n  {\n    height: '100%',\n    transitionProperty: 'border-color, box-shadow, transform',\n    transitionDuration: vars.transitionDuration[150],\n    transitionTimingFunction: vars.transitionTimingFunction.ease,\n  },\n]);\n\nexport const link = style([\n  sprinkles({\n    color: 'inherit',\n    display: 'flex',\n    textDecoration: 'none',\n    width: 'full',\n  }),\n  {\n    transitionProperty: 'transform',\n    transitionDuration: vars.transitionDuration[150],\n    transitionTimingFunction: vars.transitionTimingFunction.ease,\n    selectors: {\n      '&:hover': {\n        transform: 'translateY(-1px)',\n      },\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors.primary}`,\n        outlineOffset: '3px',\n        borderRadius: vars.borderRadius.lg,\n      },\n    },\n  },\n]);\n","import { type JSX, type ReactNode } from 'react';\nimport { Link } from '@plumile/router';\nimport { MetricCard, MetricTileGroup } from '@plumile/ui';\n\nimport * as styles from './dashboardMetricGroup.css.js';\n\nexport type DashboardMetricItem = {\n  id: string;\n  label: ReactNode;\n  value: ReactNode;\n  hint?: ReactNode;\n  href?: string;\n};\n\nexport type DashboardMetricGroupProps = {\n  metrics: readonly DashboardMetricItem[];\n  emptyState?: ReactNode;\n};\n\nexport const DashboardMetricGroup = ({\n  metrics,\n  emptyState = null,\n}: DashboardMetricGroupProps): JSX.Element => {\n  if (metrics.length === 0) {\n    return <>{emptyState}</>;\n  }\n\n  return (\n    <MetricTileGroup className={styles.group}>\n      {metrics.map((metric, index) => {\n        const key = `${metric.id}-${index}`;\n        const card = (\n          <MetricCard\n            key={key}\n            className={styles.card}\n            label={metric.label}\n            value={metric.value}\n            hint={metric.hint}\n          />\n        );\n\n        if (metric.href == null) {\n          return card;\n        }\n\n        return (\n          <Link key={key} to={metric.href} className={styles.link}>\n            {card}\n          </Link>\n        );\n      })}\n    </MetricTileGroup>\n  );\n};\n","import { style } from '@vanilla-extract/css';\nimport { sprinkles, vars } from '@plumile/ui';\n\nexport const panel = style([\n  sprinkles({\n    backgroundColor: 'surface',\n    borderColor: 'borderSubtle',\n    borderRadius: 'lg',\n    borderStyle: 'solid',\n    borderWidth: 'default',\n  }),\n  {\n    minHeight: '100%',\n    boxShadow: `0 1px 0 ${vars.colors.borderLight}`,\n    selectors: {\n      '&&': {\n        backgroundColor: vars.colors.surface,\n      },\n    },\n  },\n]);\n","import { type JSX, type ReactNode } from 'react';\nimport { InfoTile } from '@plumile/ui';\n\nimport * as styles from './dashboardPanel.css.js';\n\nexport type DashboardPanelProps = {\n  title?: ReactNode;\n  subtitle?: ReactNode;\n  actions?: ReactNode;\n  children?: ReactNode;\n};\n\nexport const DashboardPanel = ({\n  actions,\n  children,\n  subtitle,\n  title,\n}: DashboardPanelProps): JSX.Element => {\n  return (\n    <InfoTile\n      title={title}\n      subtitle={subtitle}\n      actions={actions}\n      className={styles.panel}\n    >\n      {children}\n    </InfoTile>\n  );\n};\n","import { style } from '@vanilla-extract/css';\nimport { sprinkles, vars } from '@plumile/ui';\n\nexport const grid = sprinkles({\n  display: 'grid',\n  gap: 2,\n  gridTemplateColumns: {\n    base: 2,\n    sm: 1,\n  },\n});\n\nexport const gridSingle = sprinkles({\n  gridTemplateColumns: 1,\n});\n\nexport const gridStack = sprinkles({\n  gridTemplateColumns: 1,\n});\n\nexport const action = style([\n  sprinkles({\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    minHeight: 10,\n    paddingX: 3,\n    paddingY: 2,\n    borderRadius: 'md',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'borderSubtle',\n    backgroundColor: 'surfaceSecondary',\n    color: 'primary',\n    fontWeight: 'semibold',\n    textDecoration: 'none',\n  }),\n  {\n    transitionProperty: 'background-color, border-color, box-shadow',\n    transitionDuration: vars.transitionDuration[150],\n    transitionTimingFunction: vars.transitionTimingFunction.ease,\n    selectors: {\n      '&:hover': {\n        backgroundColor: vars.colors.primaryLight,\n        borderColor: vars.colors.primary,\n      },\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors.primary}`,\n        outlineOffset: '2px',\n      },\n    },\n  },\n]);\n","import { type JSX, type ReactNode } from 'react';\nimport { Link } from '@plumile/router';\nimport { cx } from '@plumile/ui';\n\nimport * as styles from './dashboardQuickActions.css.js';\n\nexport type DashboardQuickAction = {\n  id: string;\n  label: ReactNode;\n  href: string;\n};\n\nexport type DashboardQuickActionsProps = {\n  actions: readonly DashboardQuickAction[];\n  emptyState?: ReactNode;\n  layout?: 'grid' | 'stack';\n};\n\nexport const DashboardQuickActions = ({\n  actions,\n  emptyState = null,\n  layout = 'grid',\n}: DashboardQuickActionsProps): JSX.Element => {\n  if (actions.length === 0) {\n    return <>{emptyState}</>;\n  }\n\n  const isSingleAction = actions.length === 1;\n\n  return (\n    <div\n      className={cx(styles.grid, {\n        [styles.gridStack]: layout === 'stack',\n        [styles.gridSingle]: isSingleAction,\n      })}\n    >\n      {actions.map((action, index) => {\n        const key = `${action.id}-${index}`;\n        return (\n          <Link key={key} to={action.href} className={styles.action}>\n            {action.label}\n          </Link>\n        );\n      })}\n    </div>\n  );\n};\n","import { style } from '@vanilla-extract/css';\nimport { sprinkles, vars } from '@plumile/ui';\n\nexport const list = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n});\n\nconst rowBase = style([\n  sprinkles({\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    gap: 3,\n    paddingY: 2,\n    paddingX: 2,\n    borderRadius: 'md',\n    color: 'text',\n  }),\n]);\n\nexport const item = style([rowBase]);\n\nexport const itemLink = style([\n  rowBase,\n  sprinkles({\n    textDecoration: 'none',\n  }),\n  {\n    transitionProperty: 'background-color, color',\n    transitionDuration: vars.transitionDuration[150],\n    transitionTimingFunction: vars.transitionTimingFunction.ease,\n    selectors: {\n      '&:hover': {\n        backgroundColor: vars.colors.surfaceMuted,\n        color: vars.colors.primary,\n      },\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors.primary}`,\n        outlineOffset: '2px',\n      },\n    },\n  },\n]);\n\nexport const label = sprinkles({\n  minWidth: 0,\n  color: 'textSecondary',\n  overflowWrap: 'anywhere',\n});\n\nexport const value = sprinkles({\n  flexShrink: 0,\n  fontWeight: 'semibold',\n  color: 'text',\n  fontVariantNumeric: 'tabular-nums',\n  whiteSpace: 'nowrap',\n});\n","import { type JSX, type ReactNode } from 'react';\nimport { Link } from '@plumile/router';\n\nimport * as styles from './dashboardStatusList.css.js';\n\nexport type DashboardStatusItem = {\n  id: string;\n  label: ReactNode;\n  value: ReactNode;\n  href?: string;\n};\n\nexport type DashboardStatusListProps = {\n  items: readonly DashboardStatusItem[];\n  emptyState?: ReactNode;\n};\n\nexport const DashboardStatusList = ({\n  items,\n  emptyState = null,\n}: DashboardStatusListProps): JSX.Element => {\n  if (items.length === 0) {\n    return <>{emptyState}</>;\n  }\n\n  return (\n    <div className={styles.list}>\n      {items.map((item, index) => {\n        const key = `${item.id}-${index}`;\n        const content = (\n          <>\n            <span className={styles.label}>{item.label}</span>\n            <span className={styles.value}>{item.value}</span>\n          </>\n        );\n\n        if (item.href == null) {\n          return (\n            <div key={key} className={styles.item}>\n              {content}\n            </div>\n          );\n        }\n\n        return (\n          <Link key={key} to={item.href} className={styles.itemLink}>\n            {content}\n          </Link>\n        );\n      })}\n    </div>\n  );\n};\n","import { sprinkles } from '@plumile/ui';\n\nexport const tileBody = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 2,\n});\n\nexport const loadingBody = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  gap: 2,\n  color: 'textMuted',\n  fontSize: 'sm',\n});\n\nexport const tileCount = sprinkles({\n  fontSize: '3xl',\n  fontWeight: 'bold',\n  lineHeight: 1,\n});\n","/* eslint-disable no-ternary */\nimport { type JSX, Suspense } from 'react';\nimport type {\n  BackofficeDashboardConfig,\n  BackofficeDashboardWidget,\n  BackofficeDashboardWidgetSpan,\n  BackofficeDashboardWidgetTabletSpan,\n  BackofficeDashboardWidgetSize,\n  I18nLabel,\n} from '@plumile/backoffice-core/types.js';\nimport {\n  BackofficeEmptyState,\n  DataTable,\n  DashboardGrid,\n  DashboardGridItem,\n  DetailPageTemplate,\n  Spinner,\n} from '@plumile/ui';\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';\nimport {\n  getWidgetLabel,\n  hasWidgetQuery,\n  resolveLabel,\n} from './BackofficeDashboardPage.helpers.js';\nimport { DashboardMetricGroup } from './dashboard/DashboardMetricGroup.js';\nimport { DashboardPanel } from './dashboard/DashboardPanel.js';\nimport { DashboardQuickActions } from './dashboard/DashboardQuickActions.js';\nimport { DashboardStatusList } from './dashboard/DashboardStatusList.js';\n\nimport * as styles from './backofficeDashboardPage.css.js';\n\nconst { useLazyLoadQuery } = ReactRelay;\n\ntype WidgetContentProps = {\n  widget: BackofficeDashboardWidget;\n  globalData: unknown;\n};\n\nconst DashboardUnavailableState = (): JSX.Element => {\n  const { t } = useBackofficeReactTranslation();\n\n  return <BackofficeEmptyState title={t('common.notAvailable')} />;\n};\n\nconst DashboardLoadingState = (): JSX.Element => {\n  const { t } = useBackofficeReactTranslation();\n\n  return (\n    <div className={styles.loadingBody}>\n      <Spinner ariaLabel={t('common.loading')} />\n      <span>{t('common.loading')}</span>\n    </div>\n  );\n};\n\nconst resolveWidgetSize = (\n  size: BackofficeDashboardWidgetSize | undefined,\n): BackofficeDashboardWidgetSize => {\n  return size ?? 'm';\n};\n\nconst resolveWidgetSpan = (\n  widget: BackofficeDashboardWidget,\n): BackofficeDashboardWidgetSpan => {\n  if (widget.layout?.span != null) {\n    return widget.layout.span;\n  }\n\n  const size = resolveWidgetSize(widget.size);\n  if (size === 's') {\n    return 3;\n  }\n  if (size === 'm') {\n    return 4;\n  }\n  if (size === 'l') {\n    return 6;\n  }\n  if (size === 'xl') {\n    return 8;\n  }\n  return 12;\n};\n\nconst resolveWidgetTabletSpan = (\n  widget: BackofficeDashboardWidget,\n): BackofficeDashboardWidgetTabletSpan | undefined => {\n  return widget.layout?.tabletSpan;\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  const description =\n    widget.description != null\n      ? resolveLabel(widget.description, tApp)\n      : undefined;\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      <DashboardPanel title={title} subtitle={description}>\n        <div className={styles.tileBody}>{body}</div>\n      </DashboardPanel>\n    );\n  }\n\n  if (widget.kind === 'shortcut') {\n    const entity = entities[widget.entityId];\n    const title = resolveLabel(widget.label, tApp);\n    if (entity == null) {\n      return (\n        <DashboardPanel title={title} subtitle={description}>\n          <DashboardUnavailableState />\n        </DashboardPanel>\n      );\n    }\n    if (entity.kind === 'tool') {\n      return (\n        <DashboardPanel title={title} subtitle={description}>\n          <DashboardQuickActions\n            actions={[\n              {\n                id: entity.id,\n                href: entity.routes.list,\n                label: t('dashboard.actions.openTool'),\n              },\n            ]}\n          />\n        </DashboardPanel>\n      );\n    }\n    return (\n      <DashboardPanel title={title} subtitle={description}>\n        <DashboardQuickActions\n          actions={[\n            {\n              id: entity.id,\n              href: entity.routes.list,\n              label: t('dashboard.actions.openList'),\n            },\n          ]}\n        />\n      </DashboardPanel>\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 (\n        <DashboardPanel\n          title={resolveLabel(widget.title, tApp)}\n          subtitle={description}\n        >\n          <DashboardUnavailableState />\n        </DashboardPanel>\n      );\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      <DashboardPanel title={title} subtitle={description}>\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      </DashboardPanel>\n    );\n  }\n\n  if (widget.kind === 'metricGroup') {\n    const resolved = resolveData(globalData) as\n      | readonly {\n          id: string;\n          label: I18nLabel;\n          value: string | number | null;\n          meta?: I18nLabel;\n          href?: string;\n        }[]\n      | null;\n    if (resolved == null) {\n      return <DashboardUnavailableState />;\n    }\n    return (\n      <DashboardMetricGroup\n        emptyState={<DashboardUnavailableState />}\n        metrics={resolved.map((metric) => {\n          return {\n            id: metric.id,\n            href: metric.href,\n            label: resolveLabel(metric.label, tApp),\n            value: metric.value ?? t('common.notAvailable'),\n            hint:\n              metric.meta != null ? resolveLabel(metric.meta, tApp) : undefined,\n          };\n        })}\n      />\n    );\n  }\n\n  if (widget.kind === 'quickActions') {\n    const title =\n      widget.title != null\n        ? resolveLabel(widget.title, tApp)\n        : t('dashboard.actions.openTool');\n    return (\n      <DashboardPanel title={title} subtitle={description}>\n        <DashboardQuickActions\n          layout={widget.layout?.zone === 'aside' ? 'stack' : 'grid'}\n          emptyState={<DashboardUnavailableState />}\n          actions={widget.actions.map((action) => {\n            return {\n              id: action.id,\n              href: action.href,\n              label: resolveLabel(action.label, tApp),\n            };\n          })}\n        />\n      </DashboardPanel>\n    );\n  }\n\n  if (widget.kind === 'statusSummary') {\n    const resolved = resolveData(globalData) as\n      | readonly {\n          id: string;\n          label: I18nLabel;\n          value: string | number | null;\n          href?: string;\n        }[]\n      | null;\n    if (resolved == null) {\n      const title =\n        widget.title != null ? resolveLabel(widget.title, tApp) : undefined;\n      return (\n        <DashboardPanel title={title} subtitle={description}>\n          <DashboardUnavailableState />\n        </DashboardPanel>\n      );\n    }\n    const title =\n      widget.title != null ? resolveLabel(widget.title, tApp) : undefined;\n    return (\n      <DashboardPanel title={title} subtitle={description}>\n        <DashboardStatusList\n          emptyState={<DashboardUnavailableState />}\n          items={resolved.map((item) => {\n            return {\n              id: item.id,\n              href: item.href,\n              label: resolveLabel(item.label, tApp),\n              value: item.value ?? t('common.notAvailable'),\n            };\n          })}\n        />\n      </DashboardPanel>\n    );\n  }\n\n  if (widget.kind === 'recentItems') {\n    const title =\n      widget.title != null\n        ? resolveLabel(widget.title, tApp)\n        : t('dashboard.title');\n    return (\n      <DashboardPanel title={title} subtitle={description}>\n        <DashboardUnavailableState />\n      </DashboardPanel>\n    );\n  }\n\n  const entityManifest = entities[widget.entityId];\n  if (entityManifest?.kind !== 'list-detail') {\n    return (\n      <DashboardPanel\n        title={resolveLabel(widget.label, tApp)}\n        subtitle={description}\n      >\n        <DashboardUnavailableState />\n      </DashboardPanel>\n    );\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    <DashboardPanel title={title} subtitle={description}>\n      <div className={styles.tileBody}>\n        <div className={styles.tileCount}>{countLabel}</div>\n        <DashboardQuickActions\n          emptyState={<DashboardUnavailableState />}\n          actions={[\n            {\n              id: entityManifest.id,\n              href: entityManifest.routes.list,\n              label: t('dashboard.actions.openList'),\n            },\n          ]}\n        />\n      </div>\n    </DashboardPanel>\n  );\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      <DashboardGrid columns={12}>\n        {config.widgets.map((widget) => {\n          const widgetTitle = resolveLabel(\n            getWidgetLabel(widget, config),\n            tApp,\n          );\n          const content = hasWidgetQuery(widget) ? (\n            <WidgetWithQuery widget={widget} />\n          ) : (\n            <WidgetContent widget={widget} globalData={globalData} />\n          );\n\n          return (\n            <DashboardGridItem\n              key={widget.id}\n              minHeight={widget.minHeight ?? 'auto'}\n              span={resolveWidgetSpan(widget)}\n              tabletSpan={resolveWidgetTabletSpan(widget)}\n            >\n              <BackofficeErrorBoundary\n                fallback={() => {\n                  return (\n                    <DashboardPanel title={widgetTitle}>\n                      <DashboardUnavailableState />\n                    </DashboardPanel>\n                  );\n                }}\n              >\n                <Suspense\n                  fallback={\n                    <DashboardPanel title={widgetTitle}>\n                      <DashboardLoadingState />\n                    </DashboardPanel>\n                  }\n                >\n                  {content}\n                </Suspense>\n              </BackofficeErrorBoundary>\n            </DashboardGridItem>\n          );\n        })}\n      </DashboardGrid>\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          <DashboardGrid columns={12}>\n            {items.map(({ config, label }) => {\n              return (\n                <DashboardGridItem key={config.id} span={4}>\n                  <DashboardPanel title={label}>\n                    <div className={styles.tileBody}>\n                      <div className={styles.tileCount}>\n                        {t('common.notAvailable')}\n                      </div>\n                      <DashboardQuickActions\n                        actions={[\n                          {\n                            id: config.id,\n                            href: config.routes.list,\n                            label: t('dashboard.actions.openList'),\n                          },\n                        ]}\n                      />\n                    </div>\n                  </DashboardPanel>\n                </DashboardGridItem>\n              );\n            })}\n          </DashboardGrid>\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-CZcsDv2w.js

@@ -0,0 +1,98 @@
+import { t as e } from "./useBackofficeReactTranslation-Btt58EIo.js";
+import { useId as t } from "react";
+import { useTranslation as n } from "react-i18next";
+import { CopyableText as r, LazyMarkdownRenderer as i, Tag as a, cx as o } from "@plumile/ui";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/components/backoffice/detail/backofficeDetailBadgeRow.css.ts
+var l = "txvbqb9ip txvbqbajy txvbqbao7 txvbqbcp", u = ({ items: e }) => {
+	let { t } = n();
+	return /* @__PURE__ */ s("div", {
+		className: l,
+		children: e.map((e) => {
+			let n = typeof e.label == "function" ? e.label(t) : e.label;
+			return /* @__PURE__ */ s(a, {
+				tone: e.tone ?? "neutral",
+				children: n
+			}, e.id);
+		})
+	});
+}, d = "txvbqb9ip txvbqbai7 txvbqbany txvbqbk5y", f = "txvbqb8p txvbqb66 txvbqbefp txvbqbva1", p = "txvbqb8y txvbqbv9z txvbqbl87 txvbqbuu7", m = "txvbqbbg7", h = {
+	xs: "_1vn15b70",
+	s: "_1vn15b71",
+	statusAction: "_1vn15b72",
+	m: "_1vn15b73",
+	l: "_1vn15b74",
+	xl: "_1vn15b75",
+	fluid: "_1vn15b76"
+}, g = ({ label: t, size: n, value: i, copyValue: a, fullWidth: l = !1 }) => {
+	let { t: u } = e(), g = i;
+	(g == null || typeof g == "string" && g.trim() === "") && (g = u("common.notAvailable")), a != null && a !== "" && (g = /* @__PURE__ */ s(r, {
+		value: a,
+		copyValue: a,
+		truncate: !1,
+		copyLabel: u("common.actions.copy"),
+		copiedLabel: u("common.actions.copied")
+	}));
+	let _ = [d, h[n]];
+	return l && _.push(m), /* @__PURE__ */ c("div", {
+		className: o(..._),
+		children: [/* @__PURE__ */ s("span", {
+			className: f,
+			children: t
+		}), /* @__PURE__ */ s("div", {
+			className: p,
+			children: g
+		})]
+	});
+}, _ = "txvbqb9ip txvbqbai7 txvbqbaog txvbqblb7 txvbqb1rg txvbqbv43 txvbqb1cp txvbqb1qg txvbqbx7 txvbqb8ug", v = "txvbqb9ip txvbqbai7 txvbqbany", y = "txvbqb97 txvbqbamp txvbqbv9z", b = "txvbqb8y txvbqbva1", x = "txvbqb9iy txvbqbaog txvbqbc0y", S = ({ title: e, description: n, items: r, children: i }) => {
+	let a = t(), o = null;
+	n != null && n !== "" && (o = /* @__PURE__ */ s("p", {
+		className: b,
+		children: n
+	}));
+	let l = null;
+	return r != null && r.length > 0 && (l = /* @__PURE__ */ s("div", {
+		className: x,
+		children: r.map((e) => /* @__PURE__ */ s(g, { ...e }, e.id))
+	})), /* @__PURE__ */ c("section", {
+		className: _,
+		"aria-labelledby": a,
+		children: [
+			/* @__PURE__ */ c("header", {
+				className: v,
+				children: [/* @__PURE__ */ s("h3", {
+					className: y,
+					id: a,
+					children: e
+				}), o]
+			}),
+			l,
+			i
+		]
+	});
+};
+//#endregion
+//#region src/components/backoffice/detail/detailPayloadUtils.ts
+function C(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 w = ({ title: t, content: n, format: r = "markdown", description: a }) => {
+	let { t: o } = e(), c = "";
+	return r === "json" ? c = C(n) : n != null && (c = typeof n == "string" ? n : typeof n == "number" || typeof n == "boolean" ? String(n) : C(n)), c.trim() === "" && (c = o("common.notAvailable")), /* @__PURE__ */ s(S, {
+		title: t,
+		description: a,
+		children: /* @__PURE__ */ s(i, { content: c })
+	});
+};
+//#endregion
+export { u as a, g as i, C as n, S as r, w as t };
+
+//# sourceMappingURL=BackofficeDetailPayload-CZcsDv2w.js.map

package/lib/esm/BackofficeDetailPayload-CZcsDv2w.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficeDetailPayload-CZcsDv2w.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';\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';\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  overflowWrap: 'anywhere',\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  statusAction: style({ maxWidth: '28ch' }),\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';\n\nexport const section = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n  padding: 3,\n  borderRadius: 'md',\n  backgroundColor: 'surfaceSecondary',\n  borderWidth: 'default',\n  borderStyle: 'solid',\n  borderColor: 'borderLight',\n  boxShadow: 'none',\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: 3,\n  gridTemplateColumns: 'autoFitMinmax220',\n});\n","import { useId, 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  const headingId = useId();\n\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} aria-labelledby={headingId}>\n      <header className={styles.header}>\n        <h3 className={styles.title} id={headingId}>\n          {title}\n        </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":";;;;;;kDCaa,KAA4B,EACvC,eACgD;CAChD,IAAM,EAAE,MAAM,GAAgB;CAC9B,OACE,kBAAC,OAAD;EAAK,WAAW;YACb,EAAM,KAAK,MAAS;GACnB,IAAM,IACJ,OAAO,EAAK,SAAU,aAAa,EAAK,MAAM,EAAE,GAAG,EAAK;GAC1D,OACE,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;CAQ/B,CANE,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;CAKzD,OAJI,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;;qPExCG,KAA2B,EACtC,OAAA,GACA,aAAA,GACA,UACA,kBAC+C;CAC/C,IAAM,IAAY,GAAO,EAErB,IAAsC;CAC1C,AAAI,KAAe,QAAQ,MAAgB,OACzC,IAAkB,kBAAC,KAAD;EAAG,WAAW;YAAqB;EAAgB,CAAA;CAGvE,IAAI,IAAgC;CAWpC,OAVI,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;EAAgB,mBAAiB;YAArD;GACE,kBAAC,UAAD;IAAQ,WAAW;cAAnB,CACE,kBAAC,MAAD;KAAI,WAAW;KAAc,IAAI;eAC9B;KACE,CAAA,EACJ,EACM;;GACR;GACA;GACO;;;;;AC9Cd,SAAgB,EAAkB,GAAwB;CACxD,IAAI,KAAS,MACX,OAAO;CAET,IAAI;EACF,OAAO,eAAe,KAAK,UAAU,GAAO,MAAM,EAAE,CAAC;SAC/C;EACN,IAAI,IAAW;EAMf,OALI,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;CAiBf,OAhBI,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"}