@plumile/backoffice-react 0.1.59

package/lib/esm/components/backoffice/layout/buildSidebarSections.js

@@ -0,0 +1,183 @@
+import { actionButton as e } from "./backofficeSidebarActions.css.js";
+import { buildEntityGroupLookup as t, isActivePath as n, resolveLabel as r, resolveSidebarGroups as i } from "./sidebarUtils.js";
+import { jsx as a } from "react/jsx-runtime";
+import { GripDotsSvg as o } from "@plumile/ui/icons/GripDotsSvg.js";
+import { PinFilledSvg as s } from "@plumile/ui/icons/PinFilledSvg.js";
+import { PinSvg as c } from "@plumile/ui/icons/PinSvg.js";
+import { SidebarHomeSvg as l } from "@plumile/ui/icons/SidebarHomeSvg.js";
+import { SidebarTasksSvg as u } from "@plumile/ui/icons/SidebarTasksSvg.js";
+//#region src/components/backoffice/layout/buildSidebarSections.tsx
+var d = (e, t) => e == null ? t ?? null : /* @__PURE__ */ a(e, {
+	width: 18,
+	height: 18,
+	"aria-hidden": "true"
+});
+function f(f) {
+	let { basePath: p, pathname: m, entities: h, sidebar: g, permissions: _, searchQuery: v, tApp: y, t: b, pinnedEntityIds: x = [], onTogglePin: S, onReorderPin: C, collapsedByGroupId: w, onGroupCollapsedChange: T } = f, E = i(h, g), D = Object.entries(E), O = new Set(x), k = b("sidebar.actions.pin"), A = b("sidebar.actions.unpin"), j = b("sidebar.actions.reorder"), M = t(E), N = v?.trim().toLowerCase() ?? "", P = (t) => {
+		if (S == null) return null;
+		let n = O.has(t), r = k, i = c;
+		return n && (r = A, i = s), /* @__PURE__ */ a("button", {
+			type: "button",
+			className: e,
+			"aria-pressed": n,
+			"aria-label": r,
+			title: r,
+			onClick: (e) => {
+				e.preventDefault(), e.stopPropagation(), S(t);
+			},
+			children: /* @__PURE__ */ a(i, {
+				width: 14,
+				height: 14,
+				"aria-hidden": "true"
+			})
+		});
+	}, F = (e) => {
+		let { entityId: t, groupId: i, groupIcon: s, enableReorder: c } = e, l = h[t];
+		if (l == null) return null;
+		let f = {
+			kind: "entity",
+			id: t
+		};
+		if (l.kind === "tool" && (f = {
+			kind: "tool",
+			id: t
+		}), g?.isItemVisible?.(f, _) === !1) return null;
+		if (l.kind === "tool") {
+			let e = r(l.label, y);
+			return N !== "" && !e.toLowerCase().includes(N) ? null : {
+				id: `tool-${t}`,
+				data: {
+					kind: "tool",
+					id: t,
+					groupId: i
+				},
+				label: e,
+				href: l.routes.list,
+				icon: d(s, /* @__PURE__ */ a(u, {
+					width: 18,
+					height: 18,
+					"aria-hidden": "true"
+				})),
+				isActive: n(m, l.routes.list),
+				ariaLabel: e,
+				actionSlot: P(t)
+			};
+		}
+		if (!l.hasList) return null;
+		let p = r(l.label, y);
+		if (N !== "" && !p.toLowerCase().includes(N)) return null;
+		let v, b, x, S, w = !1;
+		c === !0 && C != null && (w = !0, v = /* @__PURE__ */ a(o, {
+			width: 14,
+			height: 14,
+			"aria-hidden": "true"
+		}), b = (e) => {
+			let { dataTransfer: n } = e;
+			n.effectAllowed = "move", n.setData("text/plain", t);
+		}, x = (e) => {
+			e.preventDefault();
+			let { dataTransfer: t } = e;
+			t.dropEffect = "move";
+		}, S = (e) => {
+			e.preventDefault();
+			let n = e.dataTransfer.getData("text/plain");
+			n === "" || n === t || C(n, t);
+		});
+		let T;
+		return v != null && (T = j), {
+			id: t,
+			data: {
+				kind: "entity",
+				id: t,
+				groupId: i
+			},
+			label: p,
+			href: l.routes.list,
+			icon: d(s, /* @__PURE__ */ a(u, {
+				width: 18,
+				height: 18,
+				"aria-hidden": "true"
+			})),
+			isActive: n(m, l.routes.list),
+			ariaLabel: p,
+			actionSlot: P(t),
+			dragHandleSlot: v,
+			dragHandleLabel: T,
+			draggable: w,
+			onDragStart: b,
+			onDragOver: x,
+			onDrop: S
+		};
+	}, I = [];
+	if (x.length > 0) {
+		let e = x.map((e) => {
+			let t = M.get(e);
+			return F({
+				entityId: e,
+				groupId: t?.groupId,
+				groupIcon: t?.icon,
+				enableReorder: !0
+			});
+		}).filter((e) => e != null);
+		e.length > 0 && I.push({
+			id: "pinned",
+			title: b("sidebar.sections.pinned"),
+			items: e,
+			collapsible: !1
+		});
+	}
+	return D.forEach(([e, t], i) => {
+		if (t.isVisible != null && !t.isVisible(_)) return;
+		let o = [];
+		if (i === 0 && g?.isItemVisible?.({
+			kind: "dashboard",
+			id: "dashboard"
+		}, _) !== !1) {
+			let t = b("sidebar.items.dashboard");
+			if (N !== "" && !t.toLowerCase().includes(N)) return;
+			o.push({
+				id: "dashboard",
+				data: {
+					kind: "dashboard",
+					id: "dashboard",
+					groupId: e
+				},
+				label: t,
+				href: p,
+				icon: d(void 0, /* @__PURE__ */ a(l, {
+					width: 18,
+					height: 18,
+					"aria-hidden": "true"
+				})),
+				isActive: n(m, p),
+				ariaLabel: b("sidebar.items.dashboard")
+			});
+		}
+		if (t.entities != null && t.entities.forEach((n) => {
+			let r = F({
+				entityId: n,
+				groupId: e,
+				groupIcon: t.icon
+			});
+			r != null && o.push(r);
+		}), o.length === 0) return;
+		let s;
+		t.title != null && (s = r(t.title, y));
+		let c = w?.[e], u;
+		T != null && (u = (t) => {
+			T(e, t);
+		}), I.push({
+			id: e,
+			title: s,
+			items: o,
+			collapsible: !0,
+			defaultCollapsed: !0,
+			isCollapsed: c,
+			onCollapsedChange: u
+		});
+	}), I;
+}
+//#endregion
+export { f as buildSidebarSections };
+
+//# sourceMappingURL=buildSidebarSections.js.map

package/lib/esm/components/backoffice/layout/buildSidebarSections.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"buildSidebarSections.js","names":[],"sources":["../../../../../src/components/backoffice/layout/buildSidebarSections.tsx"],"sourcesContent":["import { type DragEvent, type ReactNode } from 'react';\nimport type { TFunction } from 'i18next';\n\nimport type { BackofficeEntityManifestMap } from '@plumile/backoffice-core/types.js';\nimport type {\n  BackofficeSidebarConfig,\n  BackofficeSidebarItemDescriptor,\n  BackofficeIconComponent,\n} from '../../../provider/types.js';\nimport type { BackofficeSidebarSection } from '@plumile/ui-backoffice/backoffice/organisms/backoffice_sidebar/BackofficeSidebar.js';\nimport type { SidebarNavSectionItem } from '@plumile/ui-backoffice/backoffice/molecules/sidebar_nav_section/SidebarNavSection.js';\nimport { GripDotsSvg } from '@plumile/ui/icons/GripDotsSvg.js';\nimport { PinFilledSvg } from '@plumile/ui/icons/PinFilledSvg.js';\nimport { PinSvg } from '@plumile/ui/icons/PinSvg.js';\nimport { SidebarHomeSvg } from '@plumile/ui/icons/SidebarHomeSvg.js';\nimport { SidebarTasksSvg } from '@plumile/ui/icons/SidebarTasksSvg.js';\nimport type { SidebarGroupCollapseState } from '../../../hooks/useSidebarGroupCollapse.js';\nimport * as styles from './backofficeSidebarActions.css.js';\nimport {\n  buildEntityGroupLookup,\n  isActivePath,\n  resolveLabel,\n  resolveSidebarGroups,\n} from './sidebarUtils.js';\n\nconst renderIcon = (\n  Icon?: BackofficeIconComponent,\n  fallback?: ReactNode,\n): ReactNode => {\n  if (Icon != null) {\n    return <Icon width={18} height={18} aria-hidden=\"true\" />;\n  }\n  return fallback ?? null;\n};\n\nexport type BuildSidebarSectionsInput = {\n  basePath: string;\n  pathname: string;\n  entities: BackofficeEntityManifestMap;\n  sidebar?: BackofficeSidebarConfig;\n  permissions: unknown;\n  searchQuery?: string;\n  tApp: TFunction;\n  t: TFunction;\n  pinnedEntityIds?: readonly string[];\n  onTogglePin?: (entityId: string) => void;\n  onReorderPin?: (fromId: string, toId: string) => void;\n  collapsedByGroupId?: SidebarGroupCollapseState;\n  onGroupCollapsedChange?: (groupId: string, collapsed: boolean) => void;\n};\n\n/**\n * Builds the sidebar sections for the backoffice layout.\n */\nexport function buildSidebarSections(\n  input: BuildSidebarSectionsInput,\n): readonly BackofficeSidebarSection[] {\n  const {\n    basePath,\n    pathname,\n    entities,\n    sidebar,\n    permissions,\n    searchQuery,\n    tApp,\n    t,\n    pinnedEntityIds = [],\n    onTogglePin,\n    onReorderPin,\n    collapsedByGroupId,\n    onGroupCollapsedChange,\n  } = input;\n\n  const groups = resolveSidebarGroups(entities, sidebar);\n  const entries = Object.entries(groups);\n  const pinnedSet = new Set(pinnedEntityIds);\n  const pinLabel = t('sidebar.actions.pin');\n  const unpinLabel = t('sidebar.actions.unpin');\n  const reorderLabel = t('sidebar.actions.reorder');\n  const entityGroupLookup = buildEntityGroupLookup(groups);\n  const normalizedQuery = searchQuery?.trim().toLowerCase() ?? '';\n\n  const renderPinAction = (entityId: string): ReactNode | null => {\n    if (onTogglePin == null) {\n      return null;\n    }\n    const isPinned = pinnedSet.has(entityId);\n    let label = pinLabel;\n    let Icon = PinSvg;\n    if (isPinned) {\n      label = unpinLabel;\n      Icon = PinFilledSvg;\n    }\n\n    return (\n      <button\n        type=\"button\"\n        className={styles.actionButton}\n        aria-pressed={isPinned}\n        aria-label={label}\n        title={label}\n        onClick={(event) => {\n          event.preventDefault();\n          event.stopPropagation();\n          onTogglePin(entityId);\n        }}\n      >\n        <Icon width={14} height={14} aria-hidden=\"true\" />\n      </button>\n    );\n  };\n\n  const buildEntityItem = (inputItem: {\n    entityId: string;\n    groupId?: string;\n    groupIcon?: BackofficeIconComponent;\n    enableReorder?: boolean;\n  }): SidebarNavSectionItem | null => {\n    const { entityId, groupId, groupIcon, enableReorder } = inputItem;\n    const config = entities[entityId];\n    if (config == null) {\n      return null;\n    }\n\n    let descriptor: BackofficeSidebarItemDescriptor = {\n      kind: 'entity',\n      id: entityId,\n    };\n    if (config.kind === 'tool') {\n      descriptor = { kind: 'tool', id: entityId };\n    }\n    const isEntityVisible = sidebar?.isItemVisible?.(descriptor, permissions);\n    if (isEntityVisible === false) {\n      return null;\n    }\n\n    if (config.kind === 'tool') {\n      const label = resolveLabel(config.label, tApp);\n      if (\n        normalizedQuery !== '' &&\n        !label.toLowerCase().includes(normalizedQuery)\n      ) {\n        return null;\n      }\n      return {\n        id: `tool-${entityId}`,\n        data: {\n          kind: 'tool',\n          id: entityId,\n          groupId,\n        },\n        label,\n        href: config.routes.list,\n        icon: renderIcon(\n          groupIcon,\n          <SidebarTasksSvg width={18} height={18} aria-hidden=\"true\" />,\n        ),\n        isActive: isActivePath(pathname, config.routes.list),\n        ariaLabel: label,\n        actionSlot: renderPinAction(entityId),\n      };\n    }\n\n    if (!config.hasList) {\n      return null;\n    }\n\n    const label = resolveLabel(config.label, tApp);\n    if (\n      normalizedQuery !== '' &&\n      !label.toLowerCase().includes(normalizedQuery)\n    ) {\n      return null;\n    }\n\n    let dragHandleSlot: ReactNode | undefined;\n    let onDragStart: ((event: DragEvent) => void) | undefined;\n    let onDragOver: ((event: DragEvent) => void) | undefined;\n    let onDrop: ((event: DragEvent) => void) | undefined;\n    let draggable = false;\n\n    if (enableReorder === true && onReorderPin != null) {\n      draggable = true;\n      dragHandleSlot = (\n        <GripDotsSvg width={14} height={14} aria-hidden=\"true\" />\n      );\n      onDragStart = (event) => {\n        const { dataTransfer } = event;\n        dataTransfer.effectAllowed = 'move';\n        dataTransfer.setData('text/plain', entityId);\n      };\n      onDragOver = (event) => {\n        event.preventDefault();\n        const { dataTransfer } = event;\n        dataTransfer.dropEffect = 'move';\n      };\n      onDrop = (event) => {\n        event.preventDefault();\n        const fromId = event.dataTransfer.getData('text/plain');\n        if (fromId === '' || fromId === entityId) {\n          return;\n        }\n        onReorderPin(fromId, entityId);\n      };\n    }\n\n    let dragHandleLabel: string | undefined;\n    if (dragHandleSlot != null) {\n      dragHandleLabel = reorderLabel;\n    }\n\n    return {\n      id: entityId,\n      data: {\n        kind: 'entity',\n        id: entityId,\n        groupId,\n      },\n      label,\n      href: config.routes.list,\n      icon: renderIcon(\n        groupIcon,\n        <SidebarTasksSvg width={18} height={18} aria-hidden=\"true\" />,\n      ),\n      isActive: isActivePath(pathname, config.routes.list),\n      ariaLabel: label,\n      actionSlot: renderPinAction(entityId),\n      dragHandleSlot,\n      dragHandleLabel,\n      draggable,\n      onDragStart,\n      onDragOver,\n      onDrop,\n    };\n  };\n\n  const sections: BackofficeSidebarSection[] = [];\n\n  if (pinnedEntityIds.length > 0) {\n    const pinnedItems = pinnedEntityIds\n      .map((entityId) => {\n        const groupMeta = entityGroupLookup.get(entityId);\n        return buildEntityItem({\n          entityId,\n          groupId: groupMeta?.groupId,\n          groupIcon: groupMeta?.icon,\n          enableReorder: true,\n        });\n      })\n      .filter((item): item is SidebarNavSectionItem => {\n        return item != null;\n      });\n\n    if (pinnedItems.length > 0) {\n      sections.push({\n        id: 'pinned',\n        title: t('sidebar.sections.pinned'),\n        items: pinnedItems,\n        collapsible: false,\n      });\n    }\n  }\n\n  entries.forEach(([groupId, group], index) => {\n    if (group.isVisible != null && !group.isVisible(permissions)) {\n      return;\n    }\n\n    const items: SidebarNavSectionItem[] = [];\n\n    if (index === 0) {\n      const dashboardDescriptor: BackofficeSidebarItemDescriptor = {\n        kind: 'dashboard',\n        id: 'dashboard',\n      };\n      const isDashboardVisible = sidebar?.isItemVisible?.(\n        dashboardDescriptor,\n        permissions,\n      );\n      if (isDashboardVisible !== false) {\n        const dashboardLabel = t('sidebar.items.dashboard');\n        if (\n          normalizedQuery !== '' &&\n          !dashboardLabel.toLowerCase().includes(normalizedQuery)\n        ) {\n          return;\n        }\n        items.push({\n          id: 'dashboard',\n          data: {\n            kind: 'dashboard',\n            id: 'dashboard',\n            groupId,\n          },\n          label: dashboardLabel,\n          href: basePath,\n          icon: renderIcon(\n            undefined,\n            <SidebarHomeSvg width={18} height={18} aria-hidden=\"true\" />,\n          ),\n          isActive: isActivePath(pathname, basePath),\n          ariaLabel: t('sidebar.items.dashboard'),\n        });\n      }\n    }\n\n    if (group.entities != null) {\n      group.entities.forEach((entityId) => {\n        const item = buildEntityItem({\n          entityId,\n          groupId,\n          groupIcon: group.icon,\n        });\n        if (item != null) {\n          items.push(item);\n        }\n      });\n    }\n\n    if (items.length === 0) {\n      return;\n    }\n\n    let title: string | undefined;\n    if (group.title != null) {\n      title = resolveLabel(group.title, tApp);\n    }\n\n    const isCollapsed = collapsedByGroupId?.[groupId];\n    let onCollapsedChange: ((collapsed: boolean) => void) | undefined;\n    if (onGroupCollapsedChange != null) {\n      onCollapsedChange = (collapsed: boolean) => {\n        onGroupCollapsedChange(groupId, collapsed);\n      };\n    }\n\n    sections.push({\n      id: groupId,\n      title,\n      items,\n      collapsible: true,\n      defaultCollapsed: true,\n      isCollapsed,\n      onCollapsedChange,\n    });\n  });\n\n  return sections;\n}\n"],"mappings":";;;;;;;;;AAyBA,IAAM,KACJ,GACA,MAEI,KAAQ,OAGL,KAAY,OAFV,kBAAC,GAAD;CAAM,OAAO;CAAI,QAAQ;CAAI,eAAY;CAAS,CAAA;AAwB7D,SAAgB,EACd,GACqC;CACrC,IAAM,EACJ,aACA,aACA,aACA,YACA,gBACA,gBACA,SACA,MACA,qBAAkB,EAAE,EACpB,gBACA,iBACA,uBACA,8BACE,GAEE,IAAS,EAAqB,GAAU,EAAQ,EAChD,IAAU,OAAO,QAAQ,EAAO,EAChC,IAAY,IAAI,IAAI,EAAgB,EACpC,IAAW,EAAE,sBAAsB,EACnC,IAAa,EAAE,wBAAwB,EACvC,IAAe,EAAE,0BAA0B,EAC3C,IAAoB,EAAuB,EAAO,EAClD,IAAkB,GAAa,MAAM,CAAC,aAAa,IAAI,IAEvD,KAAmB,MAAuC;AAC9D,MAAI,KAAe,KACjB,QAAO;EAET,IAAM,IAAW,EAAU,IAAI,EAAS,EACpC,IAAQ,GACR,IAAO;AAMX,SALI,MACF,IAAQ,GACR,IAAO,IAIP,kBAAC,UAAD;GACE,MAAK;GACL,WAAW;GACX,gBAAc;GACd,cAAY;GACZ,OAAO;GACP,UAAU,MAAU;AAGlB,IAFA,EAAM,gBAAgB,EACtB,EAAM,iBAAiB,EACvB,EAAY,EAAS;;aAGvB,kBAAC,GAAD;IAAM,OAAO;IAAI,QAAQ;IAAI,eAAY;IAAS,CAAA;GAC3C,CAAA;IAIP,KAAmB,MAKW;EAClC,IAAM,EAAE,aAAU,YAAS,cAAW,qBAAkB,GAClD,IAAS,EAAS;AACxB,MAAI,KAAU,KACZ,QAAO;EAGT,IAAI,IAA8C;GAChD,MAAM;GACN,IAAI;GACL;AAKD,MAJI,EAAO,SAAS,WAClB,IAAa;GAAE,MAAM;GAAQ,IAAI;GAAU,GAErB,GAAS,gBAAgB,GAAY,EAAY,KACjD,GACtB,QAAO;AAGT,MAAI,EAAO,SAAS,QAAQ;GAC1B,IAAM,IAAQ,EAAa,EAAO,OAAO,EAAK;AAO9C,UALE,MAAoB,MACpB,CAAC,EAAM,aAAa,CAAC,SAAS,EAAgB,GAEvC,OAEF;IACL,IAAI,QAAQ;IACZ,MAAM;KACJ,MAAM;KACN,IAAI;KACJ;KACD;IACD;IACA,MAAM,EAAO,OAAO;IACpB,MAAM,EACJ,GACA,kBAAC,GAAD;KAAiB,OAAO;KAAI,QAAQ;KAAI,eAAY;KAAS,CAAA,CAC9D;IACD,UAAU,EAAa,GAAU,EAAO,OAAO,KAAK;IACpD,WAAW;IACX,YAAY,EAAgB,EAAS;IACtC;;AAGH,MAAI,CAAC,EAAO,QACV,QAAO;EAGT,IAAM,IAAQ,EAAa,EAAO,OAAO,EAAK;AAC9C,MACE,MAAoB,MACpB,CAAC,EAAM,aAAa,CAAC,SAAS,EAAgB,CAE9C,QAAO;EAGT,IAAI,GACA,GACA,GACA,GACA,IAAY;AAEhB,EAAI,MAAkB,MAAQ,KAAgB,SAC5C,IAAY,IACZ,IACE,kBAAC,GAAD;GAAa,OAAO;GAAI,QAAQ;GAAI,eAAY;GAAS,CAAA,EAE3D,KAAe,MAAU;GACvB,IAAM,EAAE,oBAAiB;AAEzB,GADA,EAAa,gBAAgB,QAC7B,EAAa,QAAQ,cAAc,EAAS;KAE9C,KAAc,MAAU;AACtB,KAAM,gBAAgB;GACtB,IAAM,EAAE,oBAAiB;AACzB,KAAa,aAAa;KAE5B,KAAU,MAAU;AAClB,KAAM,gBAAgB;GACtB,IAAM,IAAS,EAAM,aAAa,QAAQ,aAAa;AACnD,SAAW,MAAM,MAAW,KAGhC,EAAa,GAAQ,EAAS;;EAIlC,IAAI;AAKJ,SAJI,KAAkB,SACpB,IAAkB,IAGb;GACL,IAAI;GACJ,MAAM;IACJ,MAAM;IACN,IAAI;IACJ;IACD;GACD;GACA,MAAM,EAAO,OAAO;GACpB,MAAM,EACJ,GACA,kBAAC,GAAD;IAAiB,OAAO;IAAI,QAAQ;IAAI,eAAY;IAAS,CAAA,CAC9D;GACD,UAAU,EAAa,GAAU,EAAO,OAAO,KAAK;GACpD,WAAW;GACX,YAAY,EAAgB,EAAS;GACrC;GACA;GACA;GACA;GACA;GACA;GACD;IAGG,IAAuC,EAAE;AAE/C,KAAI,EAAgB,SAAS,GAAG;EAC9B,IAAM,IAAc,EACjB,KAAK,MAAa;GACjB,IAAM,IAAY,EAAkB,IAAI,EAAS;AACjD,UAAO,EAAgB;IACrB;IACA,SAAS,GAAW;IACpB,WAAW,GAAW;IACtB,eAAe;IAChB,CAAC;IACF,CACD,QAAQ,MACA,KAAQ,KACf;AAEJ,EAAI,EAAY,SAAS,KACvB,EAAS,KAAK;GACZ,IAAI;GACJ,OAAO,EAAE,0BAA0B;GACnC,OAAO;GACP,aAAa;GACd,CAAC;;AAwFN,QApFA,EAAQ,SAAS,CAAC,GAAS,IAAQ,MAAU;AAC3C,MAAI,EAAM,aAAa,QAAQ,CAAC,EAAM,UAAU,EAAY,CAC1D;EAGF,IAAM,IAAiC,EAAE;AAEzC,MAAI,MAAU,KAKe,GAAS,gBAJyB;GAC3D,MAAM;GACN,IAAI;GACL,EAGC,EACD,KAC0B,IAAO;GAChC,IAAM,IAAiB,EAAE,0BAA0B;AACnD,OACE,MAAoB,MACpB,CAAC,EAAe,aAAa,CAAC,SAAS,EAAgB,CAEvD;AAEF,KAAM,KAAK;IACT,IAAI;IACJ,MAAM;KACJ,MAAM;KACN,IAAI;KACJ;KACD;IACD,OAAO;IACP,MAAM;IACN,MAAM,EACJ,KAAA,GACA,kBAAC,GAAD;KAAgB,OAAO;KAAI,QAAQ;KAAI,eAAY;KAAS,CAAA,CAC7D;IACD,UAAU,EAAa,GAAU,EAAS;IAC1C,WAAW,EAAE,0BAA0B;IACxC,CAAC;;AAiBN,MAbI,EAAM,YAAY,QACpB,EAAM,SAAS,SAAS,MAAa;GACnC,IAAM,IAAO,EAAgB;IAC3B;IACA;IACA,WAAW,EAAM;IAClB,CAAC;AACF,GAAI,KAAQ,QACV,EAAM,KAAK,EAAK;IAElB,EAGA,EAAM,WAAW,EACnB;EAGF,IAAI;AACJ,EAAI,EAAM,SAAS,SACjB,IAAQ,EAAa,EAAM,OAAO,EAAK;EAGzC,IAAM,IAAc,IAAqB,IACrC;AAOJ,EANI,KAA0B,SAC5B,KAAqB,MAAuB;AAC1C,KAAuB,GAAS,EAAU;MAI9C,EAAS,KAAK;GACZ,IAAI;GACJ;GACA;GACA,aAAa;GACb,kBAAkB;GAClB;GACA;GACD,CAAC;GACF,EAEK"}

package/lib/esm/components/backoffice/layout/mapViewerToSidebarProfileView.js

@@ -0,0 +1,18 @@
+//#region src/components/backoffice/layout/mapViewerToSidebarProfileView.ts
+var e = (e) => e?.trim() ?? "", t = ({ viewer: t, unknownUserLabel: n }) => {
+	let r = [e(t?.firstName), e(t?.lastName)].filter((e) => e !== "").join(" ").trim();
+	r === "" && (r = n);
+	let i = e(t?.email), a = e(t?.initials);
+	a === "" && (a = "?");
+	let o = [r];
+	return i !== "" && o.push(i), {
+		displayName: r,
+		email: i,
+		initials: a,
+		ariaLabel: o.join(" - ")
+	};
+};
+//#endregion
+export { t as default, t as mapViewerToSidebarProfileView };
+
+//# sourceMappingURL=mapViewerToSidebarProfileView.js.map

package/lib/esm/components/backoffice/layout/mapViewerToSidebarProfileView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mapViewerToSidebarProfileView.js","names":[],"sources":["../../../../../src/components/backoffice/layout/mapViewerToSidebarProfileView.ts"],"sourcesContent":["import type { BackofficeSidebarProfileViewer } from '@plumile/ui-backoffice/backoffice/molecules/sidebar_profile_menu/BackofficeSidebarProfileMenu.js';\n\nexport type BackofficeViewerIdentity = {\n  id: string;\n  firstName: string;\n  lastName: string;\n  email: string;\n  initials: string;\n};\n\ntype MapViewerToSidebarProfileViewInput = {\n  viewer: BackofficeViewerIdentity | null | undefined;\n  unknownUserLabel: string;\n};\n\nconst sanitizeToken = (value: string | null | undefined): string => {\n  return value?.trim() ?? '';\n};\n\nexport const mapViewerToSidebarProfileView = ({\n  viewer,\n  unknownUserLabel,\n}: MapViewerToSidebarProfileViewInput): BackofficeSidebarProfileViewer => {\n  const firstName = sanitizeToken(viewer?.firstName);\n  const lastName = sanitizeToken(viewer?.lastName);\n  const joinedDisplayName = [firstName, lastName]\n    .filter((token) => {\n      return token !== '';\n    })\n    .join(' ')\n    .trim();\n  let displayName = joinedDisplayName;\n  if (displayName === '') {\n    displayName = unknownUserLabel;\n  }\n\n  const email = sanitizeToken(viewer?.email);\n  const initialsToken = sanitizeToken(viewer?.initials);\n  let initials = initialsToken;\n  if (initials === '') {\n    initials = '?';\n  }\n\n  const ariaParts = [displayName];\n  if (email !== '') {\n    ariaParts.push(email);\n  }\n\n  return {\n    displayName,\n    email,\n    initials,\n    ariaLabel: ariaParts.join(' - '),\n  };\n};\n\nexport default mapViewerToSidebarProfileView;\n"],"mappings":";AAeA,IAAM,KAAiB,MACd,GAAO,MAAM,IAAI,IAGb,KAAiC,EAC5C,WACA,0BACwE;CASxE,IAAI,IANsB,CAFR,EAAc,GAAQ,UAAU,EACjC,EAAc,GAAQ,SAAS,CACD,CAC5C,QAAQ,MACA,MAAU,GACjB,CACD,KAAK,IAAI,CACT,MAAM;AAET,CAAI,MAAgB,OAClB,IAAc;CAGhB,IAAM,IAAQ,EAAc,GAAQ,MAAM,EAEtC,IADkB,EAAc,GAAQ,SAAS;AAErD,CAAI,MAAa,OACf,IAAW;CAGb,IAAM,IAAY,CAAC,EAAY;AAK/B,QAJI,MAAU,MACZ,EAAU,KAAK,EAAM,EAGhB;EACL;EACA;EACA;EACA,WAAW,EAAU,KAAK,MAAM;EACjC"}

package/lib/esm/components/backoffice/layout/sidebarUtils.js

@@ -0,0 +1,44 @@
+//#region src/components/backoffice/layout/sidebarUtils.ts
+var e = (e, t) => e(t), t = (e, t) => !!(e === t || t !== "/" && e.startsWith(`${t}/`)), n = (e) => ({ main: { entities: Object.keys(e) } }), r = (e, t) => t?.groups ?? n(e), i = (e) => {
+	let t = /* @__PURE__ */ new Map();
+	return Object.entries(e).forEach(([e, n]) => {
+		n.entities != null && n.entities.forEach((r) => {
+			t.has(r) || t.set(r, {
+				groupId: e,
+				icon: n.icon
+			});
+		});
+	}), t;
+}, a = (e, t, n, r) => {
+	let i = t[e];
+	if (i == null) return !1;
+	let a = {
+		kind: "entity",
+		id: e
+	};
+	return i.kind === "tool" && (a = {
+		kind: "tool",
+		id: e
+	}), n?.isItemVisible == null ? i.kind === "tool" ? !0 : i.hasList : n.isItemVisible(a, r);
+}, o = (e, t, n, r) => {
+	let i = [], o = /* @__PURE__ */ new Set();
+	return Object.entries(e).forEach(([, e]) => {
+		e.isVisible != null && !e.isVisible(r) || e.entities != null && e.entities.forEach((e) => {
+			o.has(e) || a(e, t, n, r) && (o.add(e), i.push(e));
+		});
+	}), i;
+}, s = (e, n) => {
+	let r = Object.entries(n);
+	for (let [n, i] of r) if (i.kind === "tool") {
+		if (t(e, i.routes.list)) return n;
+	} else if (i.hasList && t(e, i.routes.list)) return n;
+	return null;
+}, c = (e, t, n, r, i) => {
+	if (t == null || !a(t, n, r, i)) return null;
+	for (let [n, r] of Object.entries(e)) if ((r.isVisible == null || r.isVisible(i)) && r.entities?.includes(t) === !0) return n;
+	return null;
+};
+//#endregion
+export { n as buildDefaultGroups, i as buildEntityGroupLookup, t as isActivePath, s as resolveActiveEntityId, c as resolveActiveGroupId, e as resolveLabel, r as resolveSidebarGroups, o as resolveVisibleEntityIds };
+
+//# sourceMappingURL=sidebarUtils.js.map

package/lib/esm/components/backoffice/layout/sidebarUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebarUtils.js","names":[],"sources":["../../../../../src/components/backoffice/layout/sidebarUtils.ts"],"sourcesContent":["import type { TFunction } from 'i18next';\n\nimport type {\n  BackofficeEntityManifestMap,\n  I18nLabel,\n} from '@plumile/backoffice-core/types.js';\nimport type {\n  BackofficeSidebarConfig,\n  BackofficeIconComponent,\n  BackofficeSidebarGroupConfig,\n  BackofficeSidebarItemDescriptor,\n} from '../../../provider/types.js';\n\nexport const resolveLabel = (label: I18nLabel, tApp: TFunction): string => {\n  return label(tApp);\n};\n\nexport const isActivePath = (pathname: string, href: string): boolean => {\n  if (pathname === href) {\n    return true;\n  }\n  if (href !== '/' && pathname.startsWith(`${href}/`)) {\n    return true;\n  }\n  return false;\n};\n\nexport const buildDefaultGroups = (\n  entities: BackofficeEntityManifestMap,\n): Record<string, BackofficeSidebarGroupConfig> => {\n  const entityIds = Object.keys(entities);\n\n  return {\n    main: {\n      entities: entityIds,\n    },\n  };\n};\n\nexport const resolveSidebarGroups = (\n  entities: BackofficeEntityManifestMap,\n  sidebar: BackofficeSidebarConfig | undefined,\n): Record<string, BackofficeSidebarGroupConfig> => {\n  return sidebar?.groups ?? buildDefaultGroups(entities);\n};\n\nexport type EntityGroupLookup = Map<\n  string,\n  { groupId: string; icon?: BackofficeIconComponent }\n>;\n\nexport const buildEntityGroupLookup = (\n  groups: Record<string, BackofficeSidebarGroupConfig>,\n): EntityGroupLookup => {\n  const lookup: EntityGroupLookup = new Map();\n\n  Object.entries(groups).forEach(([groupId, group]) => {\n    if (group.entities == null) {\n      return;\n    }\n    group.entities.forEach((entityId) => {\n      if (!lookup.has(entityId)) {\n        lookup.set(entityId, { groupId, icon: group.icon });\n      }\n    });\n  });\n\n  return lookup;\n};\n\nconst isEntityVisible = (\n  entityId: string,\n  entities: BackofficeEntityManifestMap,\n  sidebar: BackofficeSidebarConfig | undefined,\n  permissions: unknown,\n): boolean => {\n  const config = entities[entityId];\n  if (config == null) {\n    return false;\n  }\n\n  let descriptor: BackofficeSidebarItemDescriptor = {\n    kind: 'entity',\n    id: entityId,\n  };\n  if (config.kind === 'tool') {\n    descriptor = { kind: 'tool', id: entityId };\n  }\n\n  if (sidebar?.isItemVisible != null) {\n    return sidebar.isItemVisible(descriptor, permissions);\n  }\n\n  if (config.kind === 'tool') {\n    return true;\n  }\n  return config.hasList;\n};\n\nexport const resolveVisibleEntityIds = (\n  groups: Record<string, BackofficeSidebarGroupConfig>,\n  entities: BackofficeEntityManifestMap,\n  sidebar: BackofficeSidebarConfig | undefined,\n  permissions: unknown,\n): string[] => {\n  const output: string[] = [];\n  const seen = new Set<string>();\n\n  Object.entries(groups).forEach(([, group]) => {\n    if (group.isVisible != null && !group.isVisible(permissions)) {\n      return;\n    }\n    if (group.entities == null) {\n      return;\n    }\n    group.entities.forEach((entityId) => {\n      if (seen.has(entityId)) {\n        return;\n      }\n      if (!isEntityVisible(entityId, entities, sidebar, permissions)) {\n        return;\n      }\n      seen.add(entityId);\n      output.push(entityId);\n    });\n  });\n\n  return output;\n};\n\nexport const resolveActiveEntityId = (\n  pathname: string,\n  entities: BackofficeEntityManifestMap,\n): string | null => {\n  const entries = Object.entries(entities);\n  for (const [entityId, config] of entries) {\n    if (config.kind === 'tool') {\n      if (isActivePath(pathname, config.routes.list)) {\n        return entityId;\n      }\n    } else if (config.hasList && isActivePath(pathname, config.routes.list)) {\n      return entityId;\n    }\n  }\n  return null;\n};\n\nexport const resolveActiveGroupId = (\n  groups: Record<string, BackofficeSidebarGroupConfig>,\n  activeEntityId: string | null,\n  entities: BackofficeEntityManifestMap,\n  sidebar: BackofficeSidebarConfig | undefined,\n  permissions: unknown,\n): string | null => {\n  if (activeEntityId == null) {\n    return null;\n  }\n\n  if (!isEntityVisible(activeEntityId, entities, sidebar, permissions)) {\n    return null;\n  }\n\n  for (const [groupId, group] of Object.entries(groups)) {\n    const isVisible = group.isVisible == null || group.isVisible(permissions);\n    if (isVisible && group.entities?.includes(activeEntityId) === true) {\n      return groupId;\n    }\n  }\n\n  return null;\n};\n"],"mappings":";AAaA,IAAa,KAAgB,GAAkB,MACtC,EAAM,EAAK,EAGP,KAAgB,GAAkB,MAI7C,GAHI,MAAa,KAGb,MAAS,OAAO,EAAS,WAAW,GAAG,EAAK,GAAG,GAMxC,KACX,OAIO,EACL,MAAM,EACJ,UAJc,OAAO,KAAK,EAAS,EAKpC,EACF,GAGU,KACX,GACA,MAEO,GAAS,UAAU,EAAmB,EAAS,EAQ3C,KACX,MACsB;CACtB,IAAM,oBAA4B,IAAI,KAAK;AAa3C,QAXA,OAAO,QAAQ,EAAO,CAAC,SAAS,CAAC,GAAS,OAAW;AAC/C,IAAM,YAAY,QAGtB,EAAM,SAAS,SAAS,MAAa;AACnC,GAAK,EAAO,IAAI,EAAS,IACvB,EAAO,IAAI,GAAU;IAAE;IAAS,MAAM,EAAM;IAAM,CAAC;IAErD;GACF,EAEK;GAGH,KACJ,GACA,GACA,GACA,MACY;CACZ,IAAM,IAAS,EAAS;AACxB,KAAI,KAAU,KACZ,QAAO;CAGT,IAAI,IAA8C;EAChD,MAAM;EACN,IAAI;EACL;AAYD,QAXI,EAAO,SAAS,WAClB,IAAa;EAAE,MAAM;EAAQ,IAAI;EAAU,GAGzC,GAAS,iBAAiB,OAI1B,EAAO,SAAS,SACX,KAEF,EAAO,UANL,EAAQ,cAAc,GAAY,EAAY;GAS5C,KACX,GACA,GACA,GACA,MACa;CACb,IAAM,IAAmB,EAAE,EACrB,oBAAO,IAAI,KAAa;AAqB9B,QAnBA,OAAO,QAAQ,EAAO,CAAC,SAAS,GAAG,OAAW;AACxC,IAAM,aAAa,QAAQ,CAAC,EAAM,UAAU,EAAY,IAGxD,EAAM,YAAY,QAGtB,EAAM,SAAS,SAAS,MAAa;AAC/B,KAAK,IAAI,EAAS,IAGjB,EAAgB,GAAU,GAAU,GAAS,EAAY,KAG9D,EAAK,IAAI,EAAS,EAClB,EAAO,KAAK,EAAS;IACrB;GACF,EAEK;GAGI,KACX,GACA,MACkB;CAClB,IAAM,IAAU,OAAO,QAAQ,EAAS;AACxC,MAAK,IAAM,CAAC,GAAU,MAAW,EAC/B,KAAI,EAAO,SAAS;MACd,EAAa,GAAU,EAAO,OAAO,KAAK,CAC5C,QAAO;YAEA,EAAO,WAAW,EAAa,GAAU,EAAO,OAAO,KAAK,CACrE,QAAO;AAGX,QAAO;GAGI,KACX,GACA,GACA,GACA,GACA,MACkB;AAKlB,KAJI,KAAkB,QAIlB,CAAC,EAAgB,GAAgB,GAAU,GAAS,EAAY,CAClE,QAAO;AAGT,MAAK,IAAM,CAAC,GAAS,MAAU,OAAO,QAAQ,EAAO,CAEnD,MADkB,EAAM,aAAa,QAAQ,EAAM,UAAU,EAAY,KACxD,EAAM,UAAU,SAAS,EAAe,KAAK,GAC5D,QAAO;AAIX,QAAO"}

package/lib/esm/components/backoffice/list/RowFlagsCell.css.js

@@ -0,0 +1,7 @@
+/* empty css                            */
+//#region src/components/backoffice/list/RowFlagsCell.css.ts
+var e = "wy96wu0", t = "wy96wu1", n = "wy96wu2";
+//#endregion
+export { t as container, n as flag, e as rowFlagsColumnCell };
+
+//# sourceMappingURL=RowFlagsCell.css.js.map

package/lib/esm/components/backoffice/list/RowFlagsCell.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RowFlagsCell.css.js","names":[],"sources":["../../../../../src/components/backoffice/list/RowFlagsCell.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nexport const rowFlagsColumnCell = style({\n  justifyContent: 'center',\n  padding: '0 4px',\n});\n\nexport const container = style({\n  display: 'inline-flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  gap: 6,\n  width: '100%',\n});\n\nexport const flag = style({\n  display: 'grid',\n  placeItems: 'center',\n  width: 24,\n  height: 24,\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/list/RowFlagsCell.js

@@ -0,0 +1,37 @@
+import { container as e, flag as t } from "./RowFlagsCell.css.js";
+import { jsx as n } from "react/jsx-runtime";
+import { useMemo as r } from "react";
+//#region src/components/backoffice/list/RowFlagsCell.tsx
+var i = ({ row: i, flags: a, tApp: o }) => {
+	let s = r(() => {
+		let e = [];
+		for (let t of a) {
+			let n = t.render(i);
+			n != null && n !== "" && n !== !1 && e.push({
+				id: t.id,
+				node: n,
+				label: t.label(i)(o)
+			});
+		}
+		return e;
+	}, [
+		a,
+		i,
+		o
+	]), c = s.map((e) => e.label.trim()).filter((e) => e !== "").join(", "), l;
+	return c !== "" && (l = c), /* @__PURE__ */ n("div", {
+		className: e,
+		"aria-label": l,
+		children: s.map((e) => /* @__PURE__ */ n("span", {
+			className: t,
+			title: e.label,
+			role: "img",
+			"aria-label": e.label,
+			children: e.node
+		}, e.id))
+	});
+};
+//#endregion
+export { i as RowFlagsCell };
+
+//# sourceMappingURL=RowFlagsCell.js.map

package/lib/esm/components/backoffice/list/RowFlagsCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RowFlagsCell.js","names":[],"sources":["../../../../../src/components/backoffice/list/RowFlagsCell.tsx"],"sourcesContent":["import { useMemo, type JSX, type ReactNode } from 'react';\nimport type { TFunction } from 'i18next';\n\nimport type { BackofficeRowFlagSpec } from '@plumile/backoffice-core/types.js';\n\nimport * as styles from './RowFlagsCell.css.js';\n\nexport type RowFlagsCellProps<Row> = {\n  row: Row;\n  flags: readonly BackofficeRowFlagSpec<Row>[];\n  tApp: TFunction;\n};\n\n/**\n * Renders row-level flags (icons) in a dedicated compact column.\n */\nexport const RowFlagsCell = <Row,>({\n  row,\n  flags,\n  tApp,\n}: RowFlagsCellProps<Row>): JSX.Element => {\n  const resolved = useMemo(() => {\n    const out: { id: string; node: ReactNode; label: string }[] = [];\n    for (const flag of flags) {\n      const node = flag.render(row) as ReactNode;\n      if (node != null && node !== '' && node !== false) {\n        out.push({ id: flag.id, node, label: flag.label(row)(tApp) });\n      }\n    }\n    return out;\n  }, [flags, row, tApp]);\n\n  const ariaLabel = resolved\n    .map((entry) => {\n      return entry.label.trim();\n    })\n    .filter((label) => {\n      return label !== '';\n    })\n    .join(', ');\n\n  let ariaLabelProp: string | undefined;\n  if (ariaLabel !== '') {\n    ariaLabelProp = ariaLabel;\n  }\n\n  return (\n    <div className={styles.container} aria-label={ariaLabelProp}>\n      {resolved.map((entry) => {\n        return (\n          <span\n            key={entry.id}\n            className={styles.flag}\n            title={entry.label}\n            role=\"img\"\n            aria-label={entry.label}\n          >\n            {entry.node}\n          </span>\n        );\n      })}\n    </div>\n  );\n};\n"],"mappings":";;;;AAgBA,IAAa,KAAsB,EACjC,QACA,UACA,cACyC;CACzC,IAAM,IAAW,QAAc;EAC7B,IAAM,IAAwD,EAAE;AAChE,OAAK,IAAM,KAAQ,GAAO;GACxB,IAAM,IAAO,EAAK,OAAO,EAAI;AAC7B,GAAI,KAAQ,QAAQ,MAAS,MAAM,MAAS,MAC1C,EAAI,KAAK;IAAE,IAAI,EAAK;IAAI;IAAM,OAAO,EAAK,MAAM,EAAI,CAAC,EAAK;IAAE,CAAC;;AAGjE,SAAO;IACN;EAAC;EAAO;EAAK;EAAK,CAAC,EAEhB,IAAY,EACf,KAAK,MACG,EAAM,MAAM,MAAM,CACzB,CACD,QAAQ,MACA,MAAU,GACjB,CACD,KAAK,KAAK,EAET;AAKJ,QAJI,MAAc,OAChB,IAAgB,IAIhB,kBAAC,OAAD;EAAK,WAAW;EAAkB,cAAY;YAC3C,EAAS,KAAK,MAEX,kBAAC,QAAD;GAEE,WAAW;GACX,OAAO,EAAM;GACb,MAAK;GACL,cAAY,EAAM;aAEjB,EAAM;GACF,EAPA,EAAM,GAON,CAET;EACE,CAAA"}

package/lib/esm/components/backoffice/overview/BackofficeOverviewLayout.js

@@ -0,0 +1,31 @@
+import { aside as e, container as t, content as n, primary as r, summary as i } from "./backofficeOverviewLayout.css.js";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { cx as s } from "@plumile/ui/theme/tools.js";
+//#region src/components/backoffice/overview/BackofficeOverviewLayout.tsx
+var c = ({ summary: c, aside: l, children: u, className: d }) => {
+	let f = null;
+	c != null && (f = /* @__PURE__ */ a("div", {
+		className: i,
+		children: c
+	}));
+	let p = null;
+	l != null && (p = /* @__PURE__ */ a("aside", {
+		className: e,
+		children: l
+	}));
+	let m = null;
+	return (u != null || p != null) && (m = /* @__PURE__ */ a("div", {
+		className: r,
+		children: u
+	})), /* @__PURE__ */ o("div", {
+		className: s(t, d),
+		children: [f, /* @__PURE__ */ o("div", {
+			className: n,
+			children: [m, p]
+		})]
+	});
+};
+//#endregion
+export { c as BackofficeOverviewLayout, c as default };
+
+//# sourceMappingURL=BackofficeOverviewLayout.js.map

package/lib/esm/components/backoffice/overview/BackofficeOverviewLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficeOverviewLayout.js","names":[],"sources":["../../../../../src/components/backoffice/overview/BackofficeOverviewLayout.tsx"],"sourcesContent":["import { type JSX, type ReactNode } from 'react';\n\nimport { cx } from '@plumile/ui/theme/tools.js';\n\nimport * as styles from './backofficeOverviewLayout.css.js';\n\nexport type BackofficeOverviewLayoutProps = {\n  summary?: ReactNode;\n  aside?: ReactNode;\n  children?: ReactNode;\n  className?: string;\n};\n\nexport const BackofficeOverviewLayout = ({\n  summary,\n  aside,\n  children,\n  className,\n}: BackofficeOverviewLayoutProps): JSX.Element => {\n  let summaryNode: JSX.Element | null = null;\n  if (summary != null) {\n    summaryNode = <div className={styles.summary}>{summary}</div>;\n  }\n\n  let asideNode: JSX.Element | null = null;\n  if (aside != null) {\n    asideNode = <aside className={styles.aside}>{aside}</aside>;\n  }\n\n  let primaryNode: JSX.Element | null = null;\n  if (children != null || asideNode != null) {\n    primaryNode = <div className={styles.primary}>{children}</div>;\n  }\n\n  return (\n    <div className={cx(styles.container, className)}>\n      {summaryNode}\n      <div className={styles.content}>\n        {primaryNode}\n        {asideNode}\n      </div>\n    </div>\n  );\n};\n\nexport default BackofficeOverviewLayout;\n"],"mappings":";;;;AAaA,IAAa,KAA4B,EACvC,SAAA,GACA,OAAA,GACA,aACA,mBACgD;CAChD,IAAI,IAAkC;AACtC,CAAI,KAAW,SACb,IAAc,kBAAC,OAAD;EAAK,WAAW;YAAiB;EAAc,CAAA;CAG/D,IAAI,IAAgC;AACpC,CAAI,KAAS,SACX,IAAY,kBAAC,SAAD;EAAO,WAAW;YAAe;EAAc,CAAA;CAG7D,IAAI,IAAkC;AAKtC,SAJI,KAAY,QAAQ,KAAa,UACnC,IAAc,kBAAC,OAAD;EAAK,WAAW;EAAiB;EAAe,CAAA,GAI9D,kBAAC,OAAD;EAAK,WAAW,EAAG,GAAkB,EAAU;YAA/C,CACG,GACD,kBAAC,OAAD;GAAK,WAAW;aAAhB,CACG,GACA,EACG;KACF"}

package/lib/esm/components/backoffice/overview/backofficeOverviewLayout.css.js

@@ -0,0 +1,8 @@
+/* empty css                                             */
+/* empty css                                        */
+//#region src/components/backoffice/overview/backofficeOverviewLayout.css.ts
+var e = "_1f81p5z0 vncd899io vncd89ai6 vncd89ap6", t = "_1f81p5z1 vncd899io vncd89ai6 vncd89aoo", n = "_1f81p5z2 vncd899ix vncd89bwx vncd89ap6 vncd89cf", r = "_1f81p5z3 vncd899io vncd89ai6 vncd89ap6", i = "_1f81p5z4 vncd899io vncd89ai6 vncd89ap6";
+//#endregion
+export { i as aside, e as container, n as content, r as primary, t as summary };
+
+//# sourceMappingURL=backofficeOverviewLayout.css.js.map

package/lib/esm/components/backoffice/overview/backofficeOverviewLayout.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"backofficeOverviewLayout.css.js","names":[],"sources":["../../../../../src/components/backoffice/overview/backofficeOverviewLayout.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const container = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 6,\n});\n\nexport const summary = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 4,\n});\n\nexport const content = sprinkles({\n  display: 'grid',\n  gridTemplateColumns: 'twoFrOneFr',\n  gap: 6,\n  alignItems: 'flex-start',\n});\n\nexport const primary = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 6,\n});\n\nexport const aside = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 6,\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/pickers/EntityIdPickerDialog.js

@@ -0,0 +1,107 @@
+import { useBackofficeReactTranslation as e } from "../../../i18n/useBackofficeReactTranslation.js";
+import { BackofficeErrorBoundary as t } from "../errors/BackofficeErrorBoundary.js";
+import { useBackofficePickerEntityLoader as n } from "../../../provider/useBackofficeEntityLoader.js";
+import { searchRequiredMessage as r } from "./entityIdPickerDialog.css.js";
+import { EntityPickerShell as i } from "./shared/EntityPickerShell.js";
+import { EntityPickerList as a } from "./shared/EntityPickerList.js";
+import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+import { useTranslation as l } from "react-i18next";
+import { Button as u } from "@plumile/ui";
+import { Suspense as d, useCallback as f, useEffect as p, useMemo as m, useState as h } from "react";
+import { useFragment as g, useLazyLoadQuery as _ } from "react-relay";
+import { Modal as v } from "@plumile/ui/atomic/atoms/modal/Modal.js";
+import { Spinner as y } from "@plumile/ui-backoffice/backoffice/atoms/spinner/Spinner.js";
+//#region src/components/backoffice/pickers/EntityIdPickerDialog.tsx
+var b = "store-and-network", x = (e, t) => e(t), S = ({ config: e, search: t, scope: n, fetchKey: r, onSelectId: i }) => {
+	let o = m(() => {
+		let r = t.trim();
+		if (e.buildVariables != null) return e.buildVariables({
+			search: r,
+			scope: n
+		});
+		let i = r;
+		return r === "" && (i = null), {
+			search: i,
+			scope: n
+		};
+	}, [
+		e,
+		n,
+		t
+	]), c = _(e.query, o, {
+		fetchPolicy: b,
+		fetchKey: r
+	}), l = g(e.fragment, c), u = e.getConnection(l);
+	return /* @__PURE__ */ s(a, {
+		items: m(() => u.edges.map((t) => {
+			let n = e.toRow(t.node);
+			return {
+				id: e.getRowId(n),
+				title: n.title,
+				subtitle: n.subtitle
+			};
+		}), [e, u.edges]),
+		onSelectId: i
+	});
+}, C = (e, t) => /* @__PURE__ */ s(o, { children: /* @__PURE__ */ s(u, {
+	type: "button",
+	variant: "secondary",
+	onClick: e,
+	children: t
+}) }), w = ({ message: e }) => /* @__PURE__ */ s("div", { children: e }), T = ({ isOpen: a, entity: o, title: g, scope: _, onClose: b, onSelectId: T }) => {
+	let { t: E } = l(), { t: D } = e(), [O, k] = h(""), [A, j] = h(0), M = n(o, { enabled: a }), N;
+	M.status === "loaded" && (N = M.module.config.picker), p(() => {
+		a && (k(""), j((e) => e + 1));
+	}, [a]);
+	let P = m(() => C(b, D("common.actions.close")), [b, D]), F = f((e) => {
+		k(e), j((e) => e + 1);
+	}, []), I = f((e) => {
+		T(e), b();
+	}, [b, T]);
+	if (!a) return null;
+	let L;
+	N?.searchPlaceholder != null && (L = x(N.searchPlaceholder, E));
+	let R = O.trim(), z = N?.searchRequired === !0, B;
+	return B = M.status === "loading" ? /* @__PURE__ */ s(y, {}) : N == null ? /* @__PURE__ */ s(w, { message: D("picker.unavailable", { entity: o }) }) : z && R === "" ? /* @__PURE__ */ s("div", {
+		className: r,
+		children: D("picker.searchRequired")
+	}) : /* @__PURE__ */ s(S, {
+		config: N,
+		search: O,
+		scope: _,
+		fetchKey: A,
+		onSelectId: I
+	}), /* @__PURE__ */ s(v, {
+		isOpen: a,
+		onClose: b,
+		title: g,
+		footer: P,
+		children: /* @__PURE__ */ s(i, {
+			search: O,
+			onSearchChange: F,
+			searchPlaceholder: L,
+			searchEnabled: N?.searchEnabled ?? !0,
+			children: /* @__PURE__ */ s(t, {
+				fallback: (e) => {
+					let { reset: t } = e;
+					return /* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("div", { children: D("picker.errors.loadFailed") }), /* @__PURE__ */ s(u, {
+						type: "button",
+						variant: "secondary",
+						onClick: () => {
+							t(), j((e) => e + 1);
+						},
+						children: D("common.actions.retry")
+					})] });
+				},
+				children: /* @__PURE__ */ s(d, {
+					fallback: /* @__PURE__ */ s(y, {}),
+					children: B
+				})
+			})
+		})
+	});
+};
+//#endregion
+export { T as EntityIdPickerDialog, T as default };
+
+//# sourceMappingURL=EntityIdPickerDialog.js.map

package/lib/esm/components/backoffice/pickers/EntityIdPickerDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EntityIdPickerDialog.js","names":[],"sources":["../../../../../src/components/backoffice/pickers/EntityIdPickerDialog.tsx"],"sourcesContent":["import {\n  Suspense,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n  type JSX,\n} from 'react';\nimport type { TFunction } from 'i18next';\nimport { useTranslation } from 'react-i18next';\nimport { useFragment, useLazyLoadQuery } from 'react-relay';\n\nimport { Button } from '@plumile/ui';\nimport { Modal } from '@plumile/ui/atomic/atoms/modal/Modal.js';\nimport { Spinner } from '@plumile/ui-backoffice/backoffice/atoms/spinner/Spinner.js';\nimport type {\n  BackofficeEntityPickerConfig,\n  BackofficePickerScope,\n  I18nLabel,\n} from '@plumile/backoffice-core/types.js';\n\nimport { BackofficeErrorBoundary } from '../errors/BackofficeErrorBoundary.js';\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\nimport { useBackofficePickerEntityLoader } from '../../../provider/useBackofficeEntityLoader.js';\n\nimport { EntityPickerShell } from './shared/EntityPickerShell.js';\nimport { EntityPickerList } from './shared/EntityPickerList.js';\nimport type { EntityPickerRowViewModel } from './types.js';\nimport * as styles from './entityIdPickerDialog.css.js';\n\nexport type EntityIdPickerDialogProps = {\n  isOpen: boolean;\n  entity: string;\n  title: string;\n  scope?: BackofficePickerScope;\n  onClose: () => void;\n  onSelectId: (id: string) => void;\n};\n\nconst PICKER_FETCH_POLICY = 'store-and-network' as const;\n\nconst resolveLabel = (label: I18nLabel, tApp: TFunction): string => {\n  return label(tApp);\n};\n\ntype PickerBodyProps<RowRef, RowView extends EntityPickerRowViewModel> = {\n  config: BackofficeEntityPickerConfig<RowRef, RowView>;\n  search: string;\n  scope?: BackofficePickerScope;\n  fetchKey: number;\n  onSelectId: (id: string) => void;\n};\n\nconst PickerBody = <RowRef, RowView extends EntityPickerRowViewModel>({\n  config,\n  search,\n  scope,\n  fetchKey,\n  onSelectId,\n}: PickerBodyProps<RowRef, RowView>): JSX.Element => {\n  const variables = useMemo(() => {\n    const trimmed = search.trim();\n    if (config.buildVariables != null) {\n      return config.buildVariables({ search: trimmed, scope });\n    }\n    let searchValue: string | null = trimmed;\n    if (trimmed === '') {\n      searchValue = null;\n    }\n    return {\n      search: searchValue,\n      scope,\n    } as Record<string, unknown>;\n  }, [config, scope, search]);\n\n  const queryData = useLazyLoadQuery(config.query, variables, {\n    fetchPolicy: PICKER_FETCH_POLICY,\n    fetchKey,\n  });\n\n  const fragmentData = useFragment(\n    config.fragment,\n    queryData as never,\n  ) as unknown;\n\n  const connection = config.getConnection(fragmentData as never);\n\n  const items = useMemo<readonly EntityPickerRowViewModel[]>(() => {\n    return connection.edges.map((edge) => {\n      const row = config.toRow(edge.node);\n      const id = config.getRowId(row);\n      return {\n        id,\n        title: row.title,\n        subtitle: row.subtitle,\n      };\n    });\n  }, [config, connection.edges]);\n\n  return <EntityPickerList items={items} onSelectId={onSelectId} />;\n};\n\nconst buildFooter = (onClose: () => void, closeLabel: string): JSX.Element => {\n  return (\n    <>\n      <Button type=\"button\" variant=\"secondary\" onClick={onClose}>\n        {closeLabel}\n      </Button>\n    </>\n  );\n};\n\nconst PickerUnavailable = ({ message }: { message: string }) => {\n  return <div>{message}</div>;\n};\n\nexport const EntityIdPickerDialog = ({\n  isOpen,\n  entity,\n  title,\n  scope,\n  onClose,\n  onSelectId,\n}: EntityIdPickerDialogProps): JSX.Element | null => {\n  const { t: tApp } = useTranslation();\n  const { t } = useBackofficeReactTranslation();\n  const [search, setSearch] = useState('');\n  const [fetchKey, setFetchKey] = useState(0);\n  const entityState = useBackofficePickerEntityLoader(entity, {\n    enabled: isOpen,\n  });\n\n  let pickerConfig:\n    | BackofficeEntityPickerConfig<unknown, EntityPickerRowViewModel>\n    | undefined;\n  if (entityState.status === 'loaded') {\n    pickerConfig = entityState.module.config.picker as\n      | BackofficeEntityPickerConfig<unknown, EntityPickerRowViewModel>\n      | undefined;\n  }\n\n  useEffect(() => {\n    if (isOpen) {\n      setSearch('');\n      setFetchKey((value) => {\n        return value + 1;\n      });\n    }\n  }, [isOpen]);\n\n  const footer = useMemo(() => {\n    return buildFooter(onClose, t('common.actions.close'));\n  }, [onClose, t]);\n\n  const handleSearchChange = useCallback((next: string) => {\n    setSearch(next);\n    setFetchKey((value) => {\n      return value + 1;\n    });\n  }, []);\n\n  const handleSelectId = useCallback(\n    (id: string) => {\n      onSelectId(id);\n      onClose();\n    },\n    [onClose, onSelectId],\n  );\n\n  if (!isOpen) {\n    return null;\n  }\n\n  let resolvedSearchPlaceholder: string | undefined;\n  if (pickerConfig?.searchPlaceholder != null) {\n    resolvedSearchPlaceholder = resolveLabel(\n      pickerConfig.searchPlaceholder,\n      tApp,\n    );\n  }\n\n  const trimmedSearch = search.trim();\n  const isSearchRequired = pickerConfig?.searchRequired === true;\n\n  let pickerNode: JSX.Element;\n  if (entityState.status === 'loading') {\n    pickerNode = <Spinner />;\n  } else if (pickerConfig != null) {\n    if (isSearchRequired && trimmedSearch === '') {\n      pickerNode = (\n        <div className={styles.searchRequiredMessage}>\n          {t('picker.searchRequired')}\n        </div>\n      );\n    } else {\n      pickerNode = (\n        <PickerBody\n          config={pickerConfig}\n          search={search}\n          scope={scope}\n          fetchKey={fetchKey}\n          onSelectId={handleSelectId}\n        />\n      );\n    }\n  } else {\n    pickerNode = (\n      <PickerUnavailable message={t('picker.unavailable', { entity })} />\n    );\n  }\n\n  return (\n    <Modal isOpen={isOpen} onClose={onClose} title={title} footer={footer}>\n      <EntityPickerShell\n        search={search}\n        onSearchChange={handleSearchChange}\n        searchPlaceholder={resolvedSearchPlaceholder}\n        searchEnabled={pickerConfig?.searchEnabled ?? true}\n      >\n        <BackofficeErrorBoundary\n          fallback={(args: { error: unknown; reset: () => void }) => {\n            const { reset } = args;\n            return (\n              <div>\n                <div>{t('picker.errors.loadFailed')}</div>\n                <Button\n                  type=\"button\"\n                  variant=\"secondary\"\n                  onClick={() => {\n                    reset();\n                    setFetchKey((value) => {\n                      return value + 1;\n                    });\n                  }}\n                >\n                  {t('common.actions.retry')}\n                </Button>\n              </div>\n            );\n          }}\n        >\n          <Suspense fallback={<Spinner />}>{pickerNode}</Suspense>\n        </BackofficeErrorBoundary>\n      </EntityPickerShell>\n    </Modal>\n  );\n};\n\nexport type { BackofficePickerScope } from '@plumile/backoffice-core/types.js';\n\nexport default EntityIdPickerDialog;\n"],"mappings":"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"}

package/lib/esm/components/backoffice/pickers/entityIdPickerDialog.css.js

@@ -0,0 +1,8 @@
+/* empty css                                             */
+/* empty css                                    */
+//#region src/components/backoffice/pickers/entityIdPickerDialog.css.ts
+var e = "_10f5c550 vncd899io vncd89ai6 vncd89aof", t = "_10f5c551 vncd89nuf vncd89oho vncd89p5o vncd89lxf vncd89v8r vncd898x vncd89t5x", n = "_10f5c552 vncd899io vncd89ao6 vncd89co", r = "_10f5c553 vncd899mx vncd89k4x vncd899io vncd89ai6 vncd89t5o", i = "_10f5c554 vncd89v8p vncd89amf vncd8996 vncd89f3x", a = "_10f5c555 vncd89v8r vncd898x vncd89f3x", o = "_10f5c556 vncd89v8t vncd898o vncd89f3x vncd89uw6";
+//#endregion
+export { e as layout, n as row, o as rowMeta, a as rowSubtitle, r as rowText, i as rowTitle, t as searchRequiredMessage };
+
+//# sourceMappingURL=entityIdPickerDialog.css.js.map

package/lib/esm/components/backoffice/pickers/entityIdPickerDialog.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"entityIdPickerDialog.css.js","names":[],"sources":["../../../../../src/components/backoffice/pickers/entityIdPickerDialog.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const layout = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n});\n\nexport const searchRequiredMessage = sprinkles({\n  color: 'textSecondary',\n  fontSize: 'sm',\n  textAlign: 'center',\n  paddingY: 3,\n  paddingX: 0,\n});\n\nexport const row = sprinkles({\n  display: 'flex',\n  gap: 2,\n  alignItems: 'center',\n});\n\nexport const rowText = sprinkles({\n  flex: 1,\n  minWidth: 0,\n  display: 'flex',\n  flexDirection: 'column',\n  textAlign: 'left',\n});\n\nexport const rowTitle = sprinkles({\n  color: 'text',\n  fontWeight: 'medium',\n  fontSize: 'base',\n  lineHeight: 1.2,\n});\n\nexport const rowSubtitle = sprinkles({\n  color: 'textSecondary',\n  fontSize: 'sm',\n  lineHeight: 1.2,\n});\n\nexport const rowMeta = sprinkles({\n  color: 'textMuted',\n  fontSize: 'xs',\n  lineHeight: 1.2,\n  whiteSpace: 'nowrap',\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/pickers/shared/EntityPickerList.js

@@ -0,0 +1,24 @@
+import { EntityPickerRowBase as e } from "./EntityPickerRowBase.js";
+import { jsx as t } from "react/jsx-runtime";
+import { Button as n } from "@plumile/ui";
+import { BackofficeEmptyState as r } from "@plumile/ui-backoffice/backoffice/molecules/backoffice_empty_state/BackofficeEmptyState.js";
+//#region src/components/backoffice/pickers/shared/EntityPickerList.tsx
+var i = ({ items: i, onSelectId: a, emptyState: o }) => i.length === 0 ? o ?? /* @__PURE__ */ t(r, {
+	title: "No result",
+	description: "Try another search term."
+}) : /* @__PURE__ */ t("div", { children: i.map((r) => /* @__PURE__ */ t(n, {
+	type: "button",
+	variant: "text",
+	onClick: () => {
+		a(r.id);
+	},
+	width: "full",
+	children: /* @__PURE__ */ t(e, {
+		title: r.title,
+		subtitle: r.subtitle
+	})
+}, r.id)) });
+//#endregion
+export { i as EntityPickerList, i as default };
+
+//# sourceMappingURL=EntityPickerList.js.map

package/lib/esm/components/backoffice/pickers/shared/EntityPickerList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EntityPickerList.js","names":[],"sources":["../../../../../../src/components/backoffice/pickers/shared/EntityPickerList.tsx"],"sourcesContent":["import { type JSX } from 'react';\n\nimport { Button } from '@plumile/ui';\nimport { BackofficeEmptyState } from '@plumile/ui-backoffice/backoffice/molecules/backoffice_empty_state/BackofficeEmptyState.js';\n\nimport { EntityPickerRowBase } from './EntityPickerRowBase.js';\nimport type { EntityPickerRowViewModel } from '../types.js';\n\nexport type EntityPickerListProps = {\n  items: readonly EntityPickerRowViewModel[];\n  onSelectId: (id: string) => void;\n  emptyState?: JSX.Element;\n};\n\nexport const EntityPickerList = ({\n  items,\n  onSelectId,\n  emptyState,\n}: EntityPickerListProps): JSX.Element => {\n  if (items.length === 0) {\n    return (\n      emptyState ?? (\n        <BackofficeEmptyState\n          title=\"No result\"\n          description=\"Try another search term.\"\n        />\n      )\n    );\n  }\n\n  return (\n    <div>\n      {items.map((item) => {\n        return (\n          <Button\n            key={item.id}\n            type=\"button\"\n            variant=\"text\"\n            onClick={() => {\n              onSelectId(item.id);\n            }}\n            width=\"full\"\n          >\n            <EntityPickerRowBase title={item.title} subtitle={item.subtitle} />\n          </Button>\n        );\n      })}\n    </div>\n  );\n};\n\nexport default EntityPickerList;\n"],"mappings":";;;;;AAcA,IAAa,KAAoB,EAC/B,UACA,eACA,oBAEI,EAAM,WAAW,IAEjB,KACE,kBAAC,GAAD;CACE,OAAM;CACN,aAAY;CACZ,CAAA,GAMN,kBAAC,OAAD,EAAA,UACG,EAAM,KAAK,MAER,kBAAC,GAAD;CAEE,MAAK;CACL,SAAQ;CACR,eAAe;AACb,IAAW,EAAK,GAAG;;CAErB,OAAM;WAEN,kBAAC,GAAD;EAAqB,OAAO,EAAK;EAAO,UAAU,EAAK;EAAY,CAAA;CAC5D,EATF,EAAK,GASH,CAEX,EACE,CAAA"}

package/lib/esm/components/backoffice/pickers/shared/EntityPickerRowBase.js

@@ -0,0 +1,23 @@
+import { row as e, rowSubtitle as t, rowText as n, rowTitle as r } from "../entityIdPickerDialog.css.js";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/components/backoffice/pickers/shared/EntityPickerRowBase.tsx
+var o = ({ title: o, subtitle: s }) => {
+	let c = null;
+	return s != null && (c = /* @__PURE__ */ i("div", {
+		className: t,
+		children: s
+	})), /* @__PURE__ */ i("div", {
+		className: e,
+		children: /* @__PURE__ */ a("div", {
+			className: n,
+			children: [/* @__PURE__ */ i("div", {
+				className: r,
+				children: o
+			}), c]
+		})
+	});
+};
+//#endregion
+export { o as EntityPickerRowBase, o as default };
+
+//# sourceMappingURL=EntityPickerRowBase.js.map

package/lib/esm/components/backoffice/pickers/shared/EntityPickerRowBase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EntityPickerRowBase.js","names":[],"sources":["../../../../../../src/components/backoffice/pickers/shared/EntityPickerRowBase.tsx"],"sourcesContent":["import { type JSX, type ReactNode } from 'react';\n\nimport * as styles from '../entityIdPickerDialog.css.js';\n\nexport type EntityPickerRowBaseProps = {\n  title: ReactNode;\n  subtitle?: ReactNode;\n};\n\nexport const EntityPickerRowBase = ({\n  title,\n  subtitle,\n}: EntityPickerRowBaseProps): JSX.Element => {\n  let subtitleNode: ReactNode | null = null;\n  if (subtitle != null) {\n    subtitleNode = <div className={styles.rowSubtitle}>{subtitle}</div>;\n  }\n\n  return (\n    <div className={styles.row}>\n      <div className={styles.rowText}>\n        <div className={styles.rowTitle}>{title}</div>\n        {subtitleNode}\n      </div>\n    </div>\n  );\n};\n\nexport default EntityPickerRowBase;\n"],"mappings":";;;AASA,IAAa,KAAuB,EAClC,UACA,kBAC2C;CAC3C,IAAI,IAAiC;AAKrC,QAJI,KAAY,SACd,IAAe,kBAAC,OAAD;EAAK,WAAW;YAAqB;EAAe,CAAA,GAInE,kBAAC,OAAD;EAAK,WAAW;YACd,kBAAC,OAAD;GAAK,WAAW;aAAhB,CACE,kBAAC,OAAD;IAAK,WAAW;cAAkB;IAAY,CAAA,EAC7C,EACG;;EACF,CAAA"}