@plumile/ui 0.1.67 → 0.1.69

package/lib/esm/backoffice/molecules/backoffice_json_viewer/LazyBackofficeJsonViewer.js

@@ -1,8 +1,8 @@
 import "./LazyBackofficeJsonViewer.css.js";
-import { jsx as e } from "react/jsx-runtime";
-import { Suspense as t, lazy as n } from "react";
+import { Suspense as e, lazy as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
 //#region src/backoffice/molecules/backoffice_json_viewer/LazyBackofficeJsonViewer.tsx
-var r = n(async () => ({ default: (await import("./BackofficeJsonViewer.js")).BackofficeJsonViewer })), i = (e) => {
+var r = t(async () => ({ default: (await import("./BackofficeJsonViewer.js")).BackofficeJsonViewer })), i = (e) => {
 	try {
 		return JSON.stringify(e, null, 2);
 	} catch (e) {
@@ -12,15 +12,15 @@ var r = n(async () => ({ default: (await import("./BackofficeJsonViewer.js")).Ba
 			message: t
 		});
 	}
-}, a = ({ value: t, className: n }) => /* @__PURE__ */ e("pre", {
-	className: n ?? "_13lprza0",
-	children: i(t)
-}), o = (n) => /* @__PURE__ */ e(t, {
-	fallback: /* @__PURE__ */ e(a, {
-		value: n.value,
-		className: n.className
+}, a = ({ value: e, className: t }) => /* @__PURE__ */ n("pre", {
+	className: t ?? "_13lprza0",
+	children: i(e)
+}), o = (t) => /* @__PURE__ */ n(e, {
+	fallback: /* @__PURE__ */ n(a, {
+		value: t.value,
+		className: t.className
 	}),
-	children: /* @__PURE__ */ e(r, { ...n })
+	children: /* @__PURE__ */ n(r, { ...t })
 });
 //#endregion
 export { o as LazyBackofficeJsonViewer, o as default };

package/lib/esm/backoffice/molecules/backoffice_relations_menu/BackofficeRelationsMenu.js

@@ -3,13 +3,13 @@ import { Button as t } from "../../../atomic/atoms/button/Button.js";
 import { container as n, triggerIcon as r, triggerIconOpen as i } from "./backofficeRelationsMenu.css.js";
 import { ChevronDownIcon as a } from "../../../svg/ChevronDownIcon.js";
 import "../../../index.js";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import { useEffect as c, useRef as l, useState as u } from "react";
+import { useEffect as o, useRef as s, useState as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
 import { Link as d } from "@plumile/router";
 //#region src/backoffice/molecules/backoffice_relations_menu/BackofficeRelationsMenu.tsx
 var f = ({ label: f = "Relations", items: p }) => {
-	let [m, h] = u(!1), g = l(null);
-	return c(() => {
+	let [m, h] = c(!1), g = s(null);
+	return o(() => {
 		if (!m) return;
 		let e = (e) => {
 			e.target instanceof Node && (g.current?.contains(e.target) || h(!1));
@@ -17,16 +17,16 @@ var f = ({ label: f = "Relations", items: p }) => {
 		return document.addEventListener("pointerdown", e), () => {
 			document.removeEventListener("pointerdown", e);
 		};
-	}, [m]), p.length === 0 ? /* @__PURE__ */ o(t, {
+	}, [m]), p.length === 0 ? /* @__PURE__ */ l(t, {
 		type: "button",
 		variant: "secondary",
 		size: "small",
 		disabled: !0,
 		children: f
-	}) : /* @__PURE__ */ s("div", {
+	}) : /* @__PURE__ */ u("div", {
 		className: n,
 		ref: g,
-		children: [/* @__PURE__ */ s(t, {
+		children: [/* @__PURE__ */ u(t, {
 			type: "button",
 			variant: "secondary",
 			size: "small",
@@ -35,25 +35,25 @@ var f = ({ label: f = "Relations", items: p }) => {
 			},
 			"aria-expanded": m,
 			"aria-haspopup": "menu",
-			children: [f, /* @__PURE__ */ o(a, {
+			children: [f, /* @__PURE__ */ l(a, {
 				size: 14,
 				className: e(r, { [i]: m })
 			})]
-		}), m && /* @__PURE__ */ o("div", {
+		}), m && /* @__PURE__ */ l("div", {
 			className: "_16f61fj3",
 			role: "menu",
 			children: p.map((e) => {
 				let t = null;
-				return typeof e.count == "number" && (t = e.count), /* @__PURE__ */ s(d, {
+				return typeof e.count == "number" && (t = e.count), /* @__PURE__ */ u(d, {
 					to: e.href,
 					className: "_16f61fj4",
 					onClick: (t) => {
 						h(!1), (e.onClick?.(t))?.catch(() => {});
 					},
-					children: [/* @__PURE__ */ o("span", {
+					children: [/* @__PURE__ */ l("span", {
 						className: "_16f61fj5",
 						children: e.label
-					}), t != null && /* @__PURE__ */ o("span", {
+					}), t != null && /* @__PURE__ */ l("span", {
 						className: "_16f61fj6",
 						children: t
 					})]

package/lib/esm/backoffice/molecules/confirm_dialog/ConfirmDialog.js

@@ -2,13 +2,13 @@ import { Button as e } from "../../../atomic/atoms/button/Button.js";
 import { ErrorMessage as t } from "../../../atomic/atoms/error_message/ErrorMessage.js";
 import { Modal as n } from "../../../atomic/atoms/modal/Modal.js";
 import { body as r, footer as i } from "./confirmDialog.css.js";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { useCallback as s, useState as c } from "react";
+import { useCallback as a, useState as o } from "react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/backoffice/molecules/confirm_dialog/ConfirmDialog.tsx
 var l = ({ isOpen: l, title: u, children: d, confirmLabel: f = "Confirm", cancelLabel: p = "Cancel", confirmTone: m = "default", onClose: h, onConfirm: g, closeOnConfirm: _ = !0 }) => {
-	let [v, y] = c(!1), [b, x] = c(null), S = s(() => {
+	let [v, y] = o(!1), [b, x] = o(null), S = a(() => {
 		v || (x(null), h());
-	}, [v, h]), C = s(async () => {
+	}, [v, h]), C = a(async () => {
 		if (!v) {
 			x(null), y(!0);
 			try {
@@ -27,15 +27,15 @@ var l = ({ isOpen: l, title: u, children: d, confirmLabel: f = "Confirm", cancel
 		g
 	]), w = "primary";
 	m === "danger" && (w = "danger");
-	let T = /* @__PURE__ */ o("div", {
+	let T = /* @__PURE__ */ c("div", {
 		className: i,
-		children: [/* @__PURE__ */ a(e, {
+		children: [/* @__PURE__ */ s(e, {
 			type: "button",
 			variant: "secondary",
 			onClick: S,
 			disabled: v,
 			children: p
-		}), /* @__PURE__ */ a(e, {
+		}), /* @__PURE__ */ s(e, {
 			type: "button",
 			variant: w,
 			onClick: () => {
@@ -45,12 +45,12 @@ var l = ({ isOpen: l, title: u, children: d, confirmLabel: f = "Confirm", cancel
 			children: f
 		})]
 	}), E = null;
-	return b != null && (E = /* @__PURE__ */ a(t, { children: b })), /* @__PURE__ */ a(n, {
+	return b != null && (E = /* @__PURE__ */ s(t, { children: b })), /* @__PURE__ */ s(n, {
 		isOpen: l,
 		onClose: S,
 		title: u,
 		footer: T,
-		children: /* @__PURE__ */ o("div", {
+		children: /* @__PURE__ */ c("div", {
 			className: r,
 			children: [E, d]
 		})

package/lib/esm/backoffice/molecules/global_search_input/GlobalSearchInput.js

@@ -1,9 +1,9 @@
 import { Input as e } from "../../../atomic/atoms/input/Input.js";
 import { ModalCloseSvg as t } from "../../../icons/ModalCloseSvg.js";
 import { SidebarSearchSvg as n } from "../../../icons/SidebarSearchSvg.js";
-import { ShortcutHint as r } from "../../atoms/shortcut_hint/ShortcutHint.js";
-import { clearButton as i, container as a } from "./globalSearchInput.css.js";
+import { clearButton as r, container as i } from "./globalSearchInput.css.js";
 import "../../../index.js";
+import { ShortcutHint as a } from "../../atoms/shortcut_hint/ShortcutHint.js";
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/backoffice/molecules/global_search_input/GlobalSearchInput.tsx
 var c = ({ value: c, onChange: l, placeholder: u = "Search…", ariaLabel: d, className: f, shortcut: p, rightSlot: m, clearLabel: h = "Clear search" }) => {
@@ -14,7 +14,7 @@ var c = ({ value: c, onChange: l, placeholder: u = "Search…", ariaLabel: d, cl
 		onClick: () => {
 			l("");
 		},
-		className: i,
+		className: r,
 		children: /* @__PURE__ */ o(t, {
 			width: 16,
 			height: 16,
@@ -22,9 +22,9 @@ var c = ({ value: c, onChange: l, placeholder: u = "Search…", ariaLabel: d, cl
 		})
 	}));
 	let y = null;
-	p != null && (y = /* @__PURE__ */ o(r, { keys: p }));
+	p != null && (y = /* @__PURE__ */ o(a, { keys: p }));
 	let b = /* @__PURE__ */ s("span", {
-		className: a,
+		className: i,
 		children: [
 			v,
 			y,

package/lib/esm/backoffice/molecules/sidebar_collapse_toggle/SidebarCollapseToggle.js

@@ -1,18 +1,18 @@
-import { cx as e } from "../../../theme/tools.js";
-import { ChevronLeftSvg as t } from "../../../icons/ChevronLeftSvg.js";
-import { ChevronRightSvg as n } from "../../../icons/ChevronRightSvg.js";
+import { ChevronLeftSvg as e } from "../../../icons/ChevronLeftSvg.js";
+import { ChevronRightSvg as t } from "../../../icons/ChevronRightSvg.js";
+import { cx as n } from "../../../theme/tools.js";
+import "../../../index.js";
 import { ShortcutHint as r } from "../../atoms/shortcut_hint/ShortcutHint.js";
 import { button as i, icon as a, label as o } from "./sidebarCollapseToggle.css.js";
-import "../../../index.js";
 import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/backoffice/molecules/sidebar_collapse_toggle/SidebarCollapseToggle.tsx
 var l = ({ isCollapsed: l, onToggle: u, label: d = "Collapse", shortcut: f, className: p }) => {
-	let m = t, h = d;
-	l && (m = n, h = "Expand");
+	let m = e, h = d;
+	l && (m = t, h = "Expand");
 	let g = null;
 	return f != null && (g = /* @__PURE__ */ s(r, { keys: f })), /* @__PURE__ */ c("button", {
 		type: "button",
-		className: e(i, p),
+		className: n(i, p),
 		onClick: u,
 		"aria-pressed": l,
 		children: [

package/lib/esm/backoffice/molecules/sidebar_nav_item/SidebarNavItem.js

@@ -1,13 +1,13 @@
 import { cx as e } from "../../../theme/tools.js";
-import { actionSlot as t, actions as ee, actionsVisible as te, badge as ne, badgeCollapsed as n, dragHandle as r, icon as i, item as a, itemActive as o, itemCollapsed as s, itemDisabled as c, label as l, labelCollapsed as re, link as u } from "./sidebarNavItem.css.js";
+import { actionSlot as t, actions as ee, actionsVisible as te, badge as n, badgeCollapsed as r, dragHandle as i, icon as a, item as o, itemActive as s, itemCollapsed as c, itemDisabled as l, label as u, labelCollapsed as ne, link as d } from "./sidebarNavItem.css.js";
 import "../../../index.js";
-import { Fragment as ie, jsx as d, jsxs as f } from "react/jsx-runtime";
-import { useCallback as p, useEffect as m, useRef as h, useState as g } from "react";
+import { useCallback as re, useEffect as ie, useRef as f, useState as p } from "react";
+import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
 import { Link as _ } from "@plumile/router";
 //#region src/backoffice/molecules/sidebar_nav_item/SidebarNavItem.tsx
 var v = _, y = ({ label: _, href: y, icon: b, badge: x, isActive: S = !1, disabled: C = !1, onClick: ae, onDragStart: oe, onDragOver: se, onDrop: ce, onDragEnd: le, collapsed: w = !1, ariaLabel: ue, className: T, actionSlot: E, dragHandleSlot: D, dragHandleLabel: O, draggable: k = !1 }) => {
-	let A = h(null), j = h(null), [M, N] = g(!1), [P, F] = g(!1), I = [a];
-	w && I.push(s), S && I.push(o), C && I.push(c), T != null && I.push(T);
+	let A = f(null), j = f(null), [M, N] = p(!1), [P, F] = p(!1), I = [o];
+	w && I.push(c), S && I.push(s), C && I.push(l), T != null && I.push(T);
 	let L = e(...I), R = ue;
 	R == null && typeof _ == "string" && (R = _);
 	let z, B;
@@ -15,33 +15,33 @@ var v = _, y = ({ label: _, href: y, icon: b, badge: x, isActive: S = !1, disabl
 	let V;
 	S && (V = "page");
 	let H = null;
-	b != null && (H = /* @__PURE__ */ d("span", {
-		className: i,
+	b != null && (H = /* @__PURE__ */ h("span", {
+		className: a,
 		children: b
 	}));
 	let U = null;
-	w && (U = re);
-	let de = e(l, U), W = null;
+	w && (U = ne);
+	let de = e(u, U), W = null;
 	if (x != null) {
 		let t = null;
-		w && (t = n), W = /* @__PURE__ */ d("span", {
-			className: e(ne, t),
+		w && (t = r), W = /* @__PURE__ */ h("span", {
+			className: e(n, t),
 			children: x
 		});
 	}
-	let G = /* @__PURE__ */ f(ie, { children: [
+	let G = /* @__PURE__ */ g(m, { children: [
 		H,
-		/* @__PURE__ */ d("span", {
+		/* @__PURE__ */ h("span", {
 			className: de,
 			children: _
 		}),
 		W
 	] }), K = () => {
 		ae?.();
-	}, q = !w && !C && (E != null || D != null), J = p(() => {
+	}, q = !w && !C && (E != null || D != null), J = re(() => {
 		j.current != null && (clearTimeout(j.current), j.current = null);
 	}, []);
-	m(() => (q || (N(!1), F(!1), J()), () => {
+	ie(() => (q || (N(!1), F(!1), J()), () => {
 		J();
 	}), [J, q]);
 	let fe = () => {
@@ -60,23 +60,23 @@ var v = _, y = ({ label: _, href: y, icon: b, badge: x, isActive: S = !1, disabl
 		let t = e.relatedTarget;
 		t != null && A.current?.contains(t) || F(!1);
 	}, Y;
-	Y = C ? /* @__PURE__ */ d("span", {
-		className: u,
+	Y = C ? /* @__PURE__ */ h("span", {
+		className: d,
 		"aria-disabled": "true",
 		"aria-label": z,
 		title: B,
 		children: G
-	}) : y == null ? /* @__PURE__ */ d("button", {
+	}) : y == null ? /* @__PURE__ */ h("button", {
 		type: "button",
-		className: u,
+		className: d,
 		onClick: K,
 		"aria-current": V,
 		"aria-label": z,
 		title: B,
 		children: G
-	}) : /* @__PURE__ */ d(v, {
+	}) : /* @__PURE__ */ h(v, {
 		to: y,
-		className: u,
+		className: d,
 		"aria-current": V,
 		"aria-label": z,
 		title: B,
@@ -86,9 +86,9 @@ var v = _, y = ({ label: _, href: y, icon: b, badge: x, isActive: S = !1, disabl
 	let ge = q && (M || P), X;
 	ge && (X = te);
 	let _e = e(ee, X), Z = null;
-	D != null && !w && (Z = /* @__PURE__ */ d("button", {
+	D != null && !w && (Z = /* @__PURE__ */ h("button", {
 		type: "button",
-		className: r,
+		className: i,
 		draggable: k,
 		onDragStart: oe,
 		onDragEnd: le,
@@ -97,15 +97,15 @@ var v = _, y = ({ label: _, href: y, icon: b, badge: x, isActive: S = !1, disabl
 		children: D
 	}));
 	let Q = null;
-	E != null && !w && (Q = /* @__PURE__ */ d("span", {
+	E != null && !w && (Q = /* @__PURE__ */ h("span", {
 		className: t,
 		children: E
 	}));
 	let $ = null;
-	return q && ($ = /* @__PURE__ */ f("span", {
+	return q && ($ = /* @__PURE__ */ g("span", {
 		className: _e,
 		children: [Z, Q]
-	})), /* @__PURE__ */ f("div", {
+	})), /* @__PURE__ */ g("div", {
 		className: L,
 		onDragOver: se,
 		onDrop: ce,

package/lib/esm/backoffice/molecules/sidebar_nav_item/SidebarNavItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarNavItem.js","names":[],"sources":["../../../../../src/backoffice/molecules/sidebar_nav_item/SidebarNavItem.tsx"],"sourcesContent":["import { Link } from '@plumile/router';\nimport {\n  type AnchorHTMLAttributes,\n  type ComponentPropsWithoutRef,\n  type DragEvent,\n  type FocusEvent,\n  type JSX,\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport * as styles from './sidebarNavItem.css.js';\nimport { cx } from '@plumile/ui';\n\ntype RouterLinkProps = ComponentPropsWithoutRef<typeof Link> &\n  AnchorHTMLAttributes<HTMLAnchorElement>;\nconst RouterLink = Link as unknown as (props: RouterLinkProps) => JSX.Element;\n\nexport type SidebarNavItemProps = {\n  label: ReactNode;\n  href?: string;\n  icon?: ReactNode;\n  badge?: ReactNode;\n  isActive?: boolean;\n  disabled?: boolean;\n  onClick?: () => void;\n  onDragStart?: (event: DragEvent) => void;\n  onDragOver?: (event: DragEvent) => void;\n  onDrop?: (event: DragEvent) => void;\n  onDragEnd?: (event: DragEvent) => void;\n  collapsed?: boolean;\n  ariaLabel?: string;\n  className?: string;\n  actionSlot?: ReactNode;\n  dragHandleSlot?: ReactNode;\n  dragHandleLabel?: string;\n  draggable?: boolean;\n};\n\nexport const SidebarNavItem = ({\n  label,\n  href,\n  icon,\n  badge,\n  isActive = false,\n  disabled = false,\n  onClick,\n  onDragStart,\n  onDragOver,\n  onDrop,\n  onDragEnd,\n  collapsed = false,\n  ariaLabel,\n  className,\n  actionSlot,\n  dragHandleSlot,\n  dragHandleLabel,\n  draggable = false,\n}: SidebarNavItemProps): JSX.Element => {\n  const itemRef = useRef<HTMLDivElement | null>(null);\n  const hoverTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const [isHoverIntent, setIsHoverIntent] = useState(false);\n  const [isFocusWithin, setIsFocusWithin] = useState(false);\n\n  const itemClassNames: (string | null | undefined)[] = [styles.item];\n  if (collapsed) {\n    itemClassNames.push(styles.itemCollapsed);\n  }\n  if (isActive) {\n    itemClassNames.push(styles.itemActive);\n  }\n  if (disabled) {\n    itemClassNames.push(styles.itemDisabled);\n  }\n  if (className != null) {\n    itemClassNames.push(className);\n  }\n  const itemClassName = cx(...itemClassNames);\n\n  let resolvedAriaLabel: string | undefined = ariaLabel;\n  if (resolvedAriaLabel == null && typeof label === 'string') {\n    resolvedAriaLabel = label;\n  }\n\n  let collapsedAriaLabel: string | undefined;\n  let collapsedTitle: string | undefined;\n  if (collapsed) {\n    collapsedAriaLabel = resolvedAriaLabel;\n    collapsedTitle = resolvedAriaLabel;\n  }\n\n  let ariaCurrent: 'page' | undefined;\n  if (isActive) {\n    ariaCurrent = 'page';\n  }\n\n  let iconNode: JSX.Element | null = null;\n  if (icon != null) {\n    iconNode = <span className={styles.icon}>{icon}</span>;\n  }\n\n  let labelExtraClass: string | null = null;\n  if (collapsed) {\n    labelExtraClass = styles.labelCollapsed;\n  }\n  const labelClassName = cx(styles.label, labelExtraClass);\n\n  let badgeNode: JSX.Element | null = null;\n  if (badge != null) {\n    let badgeExtraClass: string | null = null;\n    if (collapsed) {\n      badgeExtraClass = styles.badgeCollapsed;\n    }\n    badgeNode = (\n      <span className={cx(styles.badge, badgeExtraClass)}>{badge}</span>\n    );\n  }\n\n  const content = (\n    <>\n      {iconNode}\n      <span className={labelClassName}>{label}</span>\n      {badgeNode}\n    </>\n  );\n\n  const handleClick = (): void => {\n    if (onClick != null) {\n      onClick();\n    }\n  };\n\n  const shouldRenderActions =\n    !collapsed && !disabled && (actionSlot != null || dragHandleSlot != null);\n\n  const clearHoverTimeout = useCallback((): void => {\n    if (hoverTimeoutRef.current != null) {\n      clearTimeout(hoverTimeoutRef.current);\n      hoverTimeoutRef.current = null;\n    }\n  }, []);\n\n  useEffect(() => {\n    if (!shouldRenderActions) {\n      setIsHoverIntent(false);\n      setIsFocusWithin(false);\n      clearHoverTimeout();\n    }\n\n    return () => {\n      clearHoverTimeout();\n    };\n  }, [clearHoverTimeout, shouldRenderActions]);\n\n  const handleMouseEnter = (): void => {\n    if (!shouldRenderActions) {\n      return;\n    }\n    clearHoverTimeout();\n    hoverTimeoutRef.current = setTimeout(() => {\n      setIsHoverIntent(true);\n    }, 150);\n  };\n\n  const handleMouseLeave = (): void => {\n    clearHoverTimeout();\n    setIsHoverIntent(false);\n  };\n\n  const handleFocusCapture = (): void => {\n    if (!shouldRenderActions) {\n      return;\n    }\n    setIsFocusWithin(true);\n  };\n\n  const handleBlurCapture = (event: FocusEvent<HTMLDivElement>): void => {\n    if (!shouldRenderActions) {\n      setIsFocusWithin(false);\n      return;\n    }\n    const nextTarget = event.relatedTarget as Node | null;\n    if (nextTarget != null && itemRef.current?.contains(nextTarget)) {\n      return;\n    }\n    setIsFocusWithin(false);\n  };\n\n  let mainNode: JSX.Element;\n  if (disabled) {\n    mainNode = (\n      <span\n        className={styles.link}\n        aria-disabled=\"true\"\n        aria-label={collapsedAriaLabel}\n        title={collapsedTitle}\n      >\n        {content}\n      </span>\n    );\n  } else if (href != null) {\n    mainNode = (\n      <RouterLink\n        to={href}\n        className={styles.link}\n        aria-current={ariaCurrent}\n        aria-label={collapsedAriaLabel}\n        title={collapsedTitle}\n        onClick={handleClick}\n      >\n        {content}\n      </RouterLink>\n    );\n  } else {\n    mainNode = (\n      <button\n        type=\"button\"\n        className={styles.link}\n        onClick={handleClick}\n        aria-current={ariaCurrent}\n        aria-label={collapsedAriaLabel}\n        title={collapsedTitle}\n      >\n        {content}\n      </button>\n    );\n  }\n\n  const isActionsVisible =\n    shouldRenderActions && (isHoverIntent || isFocusWithin);\n  let actionsVisibilityClass: string | undefined;\n  if (isActionsVisible) {\n    actionsVisibilityClass = styles.actionsVisible;\n  }\n  const actionsClassName = cx(styles.actions, actionsVisibilityClass);\n\n  let dragHandleNode: JSX.Element | null = null;\n  if (dragHandleSlot != null && !collapsed) {\n    dragHandleNode = (\n      <button\n        type=\"button\"\n        className={styles.dragHandle}\n        draggable={draggable}\n        onDragStart={onDragStart}\n        onDragEnd={onDragEnd}\n        aria-label={dragHandleLabel}\n        title={dragHandleLabel}\n      >\n        {dragHandleSlot}\n      </button>\n    );\n  }\n\n  let actionNode: JSX.Element | null = null;\n  if (actionSlot != null && !collapsed) {\n    actionNode = <span className={styles.actionSlot}>{actionSlot}</span>;\n  }\n\n  let actionsNode: JSX.Element | null = null;\n  if (shouldRenderActions) {\n    actionsNode = (\n      <span className={actionsClassName}>\n        {dragHandleNode}\n        {actionNode}\n      </span>\n    );\n  }\n\n  return (\n    <div\n      className={itemClassName}\n      onDragOver={onDragOver}\n      onDrop={onDrop}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      onFocusCapture={handleFocusCapture}\n      onBlurCapture={handleBlurCapture}\n      ref={itemRef}\n    >\n      {mainNode}\n      {actionsNode}\n    </div>\n  );\n};\n\nexport default SidebarNavItem;\n"],"mappings":"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"}
+{"version":3,"file":"SidebarNavItem.js","names":[],"sources":["../../../../../src/backoffice/molecules/sidebar_nav_item/SidebarNavItem.tsx"],"sourcesContent":["import { Link } from '@plumile/router';\nimport {\n  type AnchorHTMLAttributes,\n  type ComponentPropsWithoutRef,\n  type DragEvent,\n  type FocusEvent,\n  type JSX,\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport * as styles from './sidebarNavItem.css.js';\nimport { cx } from '@plumile/ui';\n\ntype RouterLinkProps = ComponentPropsWithoutRef<typeof Link> &\n  AnchorHTMLAttributes<HTMLAnchorElement>;\nconst RouterLink = Link as unknown as (props: RouterLinkProps) => JSX.Element;\n\nexport type SidebarNavItemProps = {\n  label: ReactNode;\n  href?: string;\n  icon?: ReactNode;\n  badge?: ReactNode;\n  isActive?: boolean;\n  disabled?: boolean;\n  onClick?: () => void;\n  onDragStart?: (event: DragEvent) => void;\n  onDragOver?: (event: DragEvent) => void;\n  onDrop?: (event: DragEvent) => void;\n  onDragEnd?: (event: DragEvent) => void;\n  collapsed?: boolean;\n  ariaLabel?: string;\n  className?: string;\n  actionSlot?: ReactNode;\n  dragHandleSlot?: ReactNode;\n  dragHandleLabel?: string;\n  draggable?: boolean;\n};\n\nexport const SidebarNavItem = ({\n  label,\n  href,\n  icon,\n  badge,\n  isActive = false,\n  disabled = false,\n  onClick,\n  onDragStart,\n  onDragOver,\n  onDrop,\n  onDragEnd,\n  collapsed = false,\n  ariaLabel,\n  className,\n  actionSlot,\n  dragHandleSlot,\n  dragHandleLabel,\n  draggable = false,\n}: SidebarNavItemProps): JSX.Element => {\n  const itemRef = useRef<HTMLDivElement | null>(null);\n  const hoverTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const [isHoverIntent, setIsHoverIntent] = useState(false);\n  const [isFocusWithin, setIsFocusWithin] = useState(false);\n\n  const itemClassNames: (string | null | undefined)[] = [styles.item];\n  if (collapsed) {\n    itemClassNames.push(styles.itemCollapsed);\n  }\n  if (isActive) {\n    itemClassNames.push(styles.itemActive);\n  }\n  if (disabled) {\n    itemClassNames.push(styles.itemDisabled);\n  }\n  if (className != null) {\n    itemClassNames.push(className);\n  }\n  const itemClassName = cx(...itemClassNames);\n\n  let resolvedAriaLabel: string | undefined = ariaLabel;\n  if (resolvedAriaLabel == null && typeof label === 'string') {\n    resolvedAriaLabel = label;\n  }\n\n  let collapsedAriaLabel: string | undefined;\n  let collapsedTitle: string | undefined;\n  if (collapsed) {\n    collapsedAriaLabel = resolvedAriaLabel;\n    collapsedTitle = resolvedAriaLabel;\n  }\n\n  let ariaCurrent: 'page' | undefined;\n  if (isActive) {\n    ariaCurrent = 'page';\n  }\n\n  let iconNode: JSX.Element | null = null;\n  if (icon != null) {\n    iconNode = <span className={styles.icon}>{icon}</span>;\n  }\n\n  let labelExtraClass: string | null = null;\n  if (collapsed) {\n    labelExtraClass = styles.labelCollapsed;\n  }\n  const labelClassName = cx(styles.label, labelExtraClass);\n\n  let badgeNode: JSX.Element | null = null;\n  if (badge != null) {\n    let badgeExtraClass: string | null = null;\n    if (collapsed) {\n      badgeExtraClass = styles.badgeCollapsed;\n    }\n    badgeNode = (\n      <span className={cx(styles.badge, badgeExtraClass)}>{badge}</span>\n    );\n  }\n\n  const content = (\n    <>\n      {iconNode}\n      <span className={labelClassName}>{label}</span>\n      {badgeNode}\n    </>\n  );\n\n  const handleClick = (): void => {\n    if (onClick != null) {\n      onClick();\n    }\n  };\n\n  const shouldRenderActions =\n    !collapsed && !disabled && (actionSlot != null || dragHandleSlot != null);\n\n  const clearHoverTimeout = useCallback((): void => {\n    if (hoverTimeoutRef.current != null) {\n      clearTimeout(hoverTimeoutRef.current);\n      hoverTimeoutRef.current = null;\n    }\n  }, []);\n\n  useEffect(() => {\n    if (!shouldRenderActions) {\n      setIsHoverIntent(false);\n      setIsFocusWithin(false);\n      clearHoverTimeout();\n    }\n\n    return () => {\n      clearHoverTimeout();\n    };\n  }, [clearHoverTimeout, shouldRenderActions]);\n\n  const handleMouseEnter = (): void => {\n    if (!shouldRenderActions) {\n      return;\n    }\n    clearHoverTimeout();\n    hoverTimeoutRef.current = setTimeout(() => {\n      setIsHoverIntent(true);\n    }, 150);\n  };\n\n  const handleMouseLeave = (): void => {\n    clearHoverTimeout();\n    setIsHoverIntent(false);\n  };\n\n  const handleFocusCapture = (): void => {\n    if (!shouldRenderActions) {\n      return;\n    }\n    setIsFocusWithin(true);\n  };\n\n  const handleBlurCapture = (event: FocusEvent<HTMLDivElement>): void => {\n    if (!shouldRenderActions) {\n      setIsFocusWithin(false);\n      return;\n    }\n    const nextTarget = event.relatedTarget as Node | null;\n    if (nextTarget != null && itemRef.current?.contains(nextTarget)) {\n      return;\n    }\n    setIsFocusWithin(false);\n  };\n\n  let mainNode: JSX.Element;\n  if (disabled) {\n    mainNode = (\n      <span\n        className={styles.link}\n        aria-disabled=\"true\"\n        aria-label={collapsedAriaLabel}\n        title={collapsedTitle}\n      >\n        {content}\n      </span>\n    );\n  } else if (href != null) {\n    mainNode = (\n      <RouterLink\n        to={href}\n        className={styles.link}\n        aria-current={ariaCurrent}\n        aria-label={collapsedAriaLabel}\n        title={collapsedTitle}\n        onClick={handleClick}\n      >\n        {content}\n      </RouterLink>\n    );\n  } else {\n    mainNode = (\n      <button\n        type=\"button\"\n        className={styles.link}\n        onClick={handleClick}\n        aria-current={ariaCurrent}\n        aria-label={collapsedAriaLabel}\n        title={collapsedTitle}\n      >\n        {content}\n      </button>\n    );\n  }\n\n  const isActionsVisible =\n    shouldRenderActions && (isHoverIntent || isFocusWithin);\n  let actionsVisibilityClass: string | undefined;\n  if (isActionsVisible) {\n    actionsVisibilityClass = styles.actionsVisible;\n  }\n  const actionsClassName = cx(styles.actions, actionsVisibilityClass);\n\n  let dragHandleNode: JSX.Element | null = null;\n  if (dragHandleSlot != null && !collapsed) {\n    dragHandleNode = (\n      <button\n        type=\"button\"\n        className={styles.dragHandle}\n        draggable={draggable}\n        onDragStart={onDragStart}\n        onDragEnd={onDragEnd}\n        aria-label={dragHandleLabel}\n        title={dragHandleLabel}\n      >\n        {dragHandleSlot}\n      </button>\n    );\n  }\n\n  let actionNode: JSX.Element | null = null;\n  if (actionSlot != null && !collapsed) {\n    actionNode = <span className={styles.actionSlot}>{actionSlot}</span>;\n  }\n\n  let actionsNode: JSX.Element | null = null;\n  if (shouldRenderActions) {\n    actionsNode = (\n      <span className={actionsClassName}>\n        {dragHandleNode}\n        {actionNode}\n      </span>\n    );\n  }\n\n  return (\n    <div\n      className={itemClassName}\n      onDragOver={onDragOver}\n      onDrop={onDrop}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      onFocusCapture={handleFocusCapture}\n      onBlurCapture={handleBlurCapture}\n      ref={itemRef}\n    >\n      {mainNode}\n      {actionsNode}\n    </div>\n  );\n};\n\nexport default SidebarNavItem;\n"],"mappings":"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"}

package/lib/esm/backoffice/molecules/sidebar_nav_section/SidebarNavSection.js

@@ -3,11 +3,11 @@ import { ChevronDownSvg as t } from "../../../icons/ChevronDownSvg.js";
 import { SidebarNavItem as n } from "../sidebar_nav_item/SidebarNavItem.js";
 import { header as r, items as i, section as a, title as o, toggle as s } from "./sidebarNavSection.css.js";
 import "../../../index.js";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
-import { useCallback as u, useMemo as d, useState as f } from "react";
+import { useCallback as c, useMemo as l, useState as u } from "react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region src/backoffice/molecules/sidebar_nav_section/SidebarNavSection.tsx
 var p = ({ title: p, items: m, collapsible: h = !1, isCollapsed: g, defaultCollapsed: _ = !1, onCollapsedChange: v, collapsed: y = !1, className: b }) => {
-	let [x, S] = f(_), C = g ?? x, w = h, T = u(() => {
+	let [x, S] = u(_), C = g ?? x, w = h, T = c(() => {
 		if (!w) return;
 		let e = !C;
 		g ?? S(e), v?.(e);
@@ -16,7 +16,7 @@ var p = ({ title: p, items: m, collapsible: h = !1, isCollapsed: g, defaultColla
 		C,
 		g,
 		v
-	]), E = d(() => {
+	]), E = l(() => {
 		let e = "rotate(0deg)";
 		return C && (e = "rotate(-90deg)"), {
 			transform: e,
@@ -25,35 +25,35 @@ var p = ({ title: p, items: m, collapsible: h = !1, isCollapsed: g, defaultColla
 	}, [C]), D = null;
 	if (p != null) {
 		let e = null;
-		w && (e = /* @__PURE__ */ c("button", {
+		w && (e = /* @__PURE__ */ d("button", {
 			type: "button",
 			className: s,
 			onClick: T,
 			"aria-expanded": !C,
-			children: /* @__PURE__ */ c(t, {
+			children: /* @__PURE__ */ d(t, {
 				width: 18,
 				height: 18,
 				style: E
 			})
-		})), D = /* @__PURE__ */ l("div", {
+		})), D = /* @__PURE__ */ f("div", {
 			className: r,
-			children: [/* @__PURE__ */ c("div", {
+			children: [/* @__PURE__ */ d("div", {
 				className: o,
 				children: p
 			}), e]
 		});
 	}
 	let O = null;
-	return C || (O = /* @__PURE__ */ c("div", {
+	return C || (O = /* @__PURE__ */ d("div", {
 		className: i,
 		children: m.map((e) => {
 			let { id: t, data: r, ...i } = e;
-			return /* @__PURE__ */ c(n, {
+			return /* @__PURE__ */ d(n, {
 				...i,
 				collapsed: y
 			}, t);
 		})
-	})), /* @__PURE__ */ l("section", {
+	})), /* @__PURE__ */ f("section", {
 		className: e(a, b),
 		children: [D, O]
 	});

package/lib/esm/backoffice/organisms/backoffice_data_table/BackofficeDataTable.js

@@ -5,15 +5,15 @@ import { BulkActionsBar as r } from "../../molecules/bulk_actions_bar/BulkAction
 import { TableToolbar as i } from "../../molecules/table_toolbar/TableToolbar.js";
 import { selectionCell as a, wrapper as o } from "./backofficeDataTable.css.js";
 import "../../../index.js";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
-import { useCallback as l, useMemo as u } from "react";
+import { useCallback as s, useMemo as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region src/backoffice/organisms/backoffice_data_table/BackofficeDataTable.tsx
 var d = (e) => {
 	let { rows: n, selection: r } = e, i = [];
 	for (let e of n) e.selectable && i.push(e.id);
-	let o = i.filter((e) => r.selectedRowIds.has(e)).length, c = i.length > 0 && o === i.length, l = () => {
+	let o = i.filter((e) => r.selectedRowIds.has(e)).length, s = i.length > 0 && o === i.length, c = () => {
 		if (i.length !== 0) {
-			if (c) {
+			if (s) {
 				r.onSelectionChange(/* @__PURE__ */ new Set());
 				return;
 			}
@@ -22,21 +22,21 @@ var d = (e) => {
 	};
 	return {
 		id: "__select",
-		header: /* @__PURE__ */ s("div", {
+		header: /* @__PURE__ */ l("div", {
 			className: a,
-			children: /* @__PURE__ */ s(t, {
-				checked: c,
+			children: /* @__PURE__ */ l(t, {
+				checked: s,
 				onChange: () => {
-					l();
+					c();
 				},
 				"aria-label": "Select all"
 			})
 		}),
 		cell: (e) => {
 			let { id: n, selectable: i } = e;
-			return /* @__PURE__ */ s("div", {
+			return /* @__PURE__ */ l("div", {
 				className: a,
-				children: /* @__PURE__ */ s(t, {
+				children: /* @__PURE__ */ l(t, {
 					checked: r.selectedRowIds.has(n),
 					disabled: !i,
 					onChange: () => {
@@ -50,7 +50,7 @@ var d = (e) => {
 		className: a
 	};
 }, f = ({ columns: t, rows: a, getRowId: f, toolbar: p, selection: m, bulkActions: h, emptyState: g, className: _ }) => {
-	let v = u(() => a.map((e, t) => ({
+	let v = c(() => a.map((e, t) => ({
 		row: e,
 		index: t,
 		id: f(e, t),
@@ -59,41 +59,41 @@ var d = (e) => {
 		f,
 		a,
 		m
-	]), y = u(() => m == null ? null : d({
+	]), y = c(() => m == null ? null : d({
 		rows: v,
 		selection: m
-	}), [m, v]), b = u(() => {
+	}), [m, v]), b = c(() => {
 		let e = t.map((e) => ({
 			...e,
 			cell: (t) => e.cell(t.row)
 		}));
 		return y == null ? e : [y, ...e];
-	}, [t, y]), x = u(() => {
+	}, [t, y]), x = c(() => {
 		if (b.some((e) => e.isPrimary === !0) || b.length === 0) return b;
 		let e = 0;
 		return y != null && b.length > 1 && (e = 1), b.map((t, n) => n === e ? {
 			...t,
 			isPrimary: !0
 		} : t);
-	}, [b, y]), S = u(() => {
+	}, [b, y]), S = c(() => {
 		if (y != null) return `2.75rem repeat(${Math.max(0, b.length - 1)}, minmax(0, 1fr))`;
 	}, [b.length, y]), C = 0;
 	m != null && (C = m.selectedRowIds.size);
-	let w = l(() => {
+	let w = s(() => {
 		m?.onSelectionChange(/* @__PURE__ */ new Set());
 	}, [m]), T = null;
-	p != null && (T = /* @__PURE__ */ s(i, { ...p }));
+	p != null && (T = /* @__PURE__ */ l(i, { ...p }));
 	let E = null;
-	return m != null && (E = /* @__PURE__ */ s(r, {
+	return m != null && (E = /* @__PURE__ */ l(r, {
 		selectedCount: C,
 		actions: h,
 		onClearSelection: w
-	})), /* @__PURE__ */ c("div", {
+	})), /* @__PURE__ */ u("div", {
 		className: e(o, _),
 		children: [
 			T,
 			E,
-			/* @__PURE__ */ s(n, {
+			/* @__PURE__ */ l(n, {
 				columns: x,
 				rows: v,
 				getRowId: (e) => e.id,

package/lib/esm/components/data-table/TableCell.js

@@ -3,8 +3,8 @@ import { Badge as t } from "../../atomic/atoms/badge/Badge.js";
 import { FormattedDate as n } from "../../atomic/atoms/formatted-date/FormattedDate.js";
 import { date as r, muted as i, number as a, text as o } from "./TableCell.css.js";
 import { TableCellBase as s } from "./TableCellBase.js";
-import { jsx as c } from "react/jsx-runtime";
-import { useMemo as l } from "react";
+import { useMemo as c } from "react";
+import { jsx as l } from "react/jsx-runtime";
 //#region src/components/data-table/TableCell.tsx
 var u = "—", d = u, f = { maximumFractionDigits: 2 }, p = {
 	dateStyle: "medium",
@@ -12,22 +12,22 @@ var u = "—", d = u, f = { maximumFractionDigits: 2 }, p = {
 }, m = {
 	Base: s,
 	Text: ({ value: t, fallback: n = d, children: r, ellipsis: i = !1, className: a }) => {
-		let l = r ?? t;
-		if (l == null) l = n;
-		else if (typeof l == "string") {
-			let e = l.trim();
-			l = e.length === 0 ? n : e;
+		let c = r ?? t;
+		if (c == null) c = n;
+		else if (typeof c == "string") {
+			let e = c.trim();
+			c = e.length === 0 ? n : e;
 		}
-		return /* @__PURE__ */ c(s, {
+		return /* @__PURE__ */ l(s, {
 			ellipsis: i,
 			className: e(o, a),
-			children: l
+			children: c
 		});
 	},
-	Number: ({ value: e, fallback: t = d, locale: n, formatOptions: r = f }) => /* @__PURE__ */ c(s, {
+	Number: ({ value: e, fallback: t = d, locale: n, formatOptions: r = f }) => /* @__PURE__ */ l(s, {
 		align: "end",
 		className: a,
-		children: l(() => {
+		children: c(() => {
 			if (e == null || Number.isNaN(Number(e))) return t;
 			try {
 				return new Intl.NumberFormat(n, r).format(e);
@@ -41,30 +41,30 @@ var u = "—", d = u, f = { maximumFractionDigits: 2 }, p = {
 			r
 		])
 	}),
-	Status: ({ label: e, tone: n, isLoading: r = !1 }) => /* @__PURE__ */ c(s, { children: /* @__PURE__ */ c(t, {
+	Status: ({ label: e, tone: n, isLoading: r = !1 }) => /* @__PURE__ */ l(s, { children: /* @__PURE__ */ l(t, {
 		tone: n,
 		loading: r,
 		children: e
 	}) }),
-	Date: ({ value: e, fallback: t = u, locale: i, options: a = p }) => /* @__PURE__ */ c(s, {
+	Date: ({ value: e, fallback: t = u, locale: i, options: a = p }) => /* @__PURE__ */ l(s, {
 		className: r,
-		children: /* @__PURE__ */ c(n, {
+		children: /* @__PURE__ */ l(n, {
 			value: e,
 			fallback: t,
 			locale: i,
 			options: a
 		})
 	}),
-	Badge: ({ label: e, tone: n }) => /* @__PURE__ */ c(s, { children: /* @__PURE__ */ c(t, {
+	Badge: ({ label: e, tone: n }) => /* @__PURE__ */ l(s, { children: /* @__PURE__ */ l(t, {
 		tone: n,
 		children: e
 	}) }),
-	Actions: ({ children: e, className: t }) => /* @__PURE__ */ c(s, {
+	Actions: ({ children: e, className: t }) => /* @__PURE__ */ l(s, {
 		align: "end",
 		className: t,
 		children: e
 	}),
-	Muted: ({ children: e }) => /* @__PURE__ */ c("span", {
+	Muted: ({ children: e }) => /* @__PURE__ */ l("span", {
 		className: i,
 		children: e
 	})