@plumile/ui 0.1.134 → 0.1.142

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

@@ -1,188 +1,188 @@
 import { cx as e } from "../../../theme/tools.js";
 import { ChevronDownSvg as t } from "../../../icons/ChevronDownSvg.js";
-import { SidebarNavItem as n } from "../sidebar_nav_item/SidebarNavItem.js";
-import { CSS as r } from "../../../node_modules/@dnd-kit/utilities/dist/utilities.esm.js";
-import { DndContext as i, DragOverlay as a, KeyboardSensor as o, PointerSensor as s, TouchSensor as c, closestCenter as ee, useSensor as l, useSensors as u } from "../../../node_modules/@dnd-kit/core/dist/core.esm.js";
-import { SortableContext as d, sortableKeyboardCoordinates as f, useSortable as p, verticalListSortingStrategy as m } from "../../../node_modules/@dnd-kit/sortable/dist/sortable.esm.js";
-import { header as h, headerButton as g, headerButtonSidebarCollapsed as _, headerSidebarCollapsed as te, items as v, itemsNested as y, section as ne, sortableItem as b, sortableItemDragging as x, title as re, titleContent as S, titleIcon as ie, titleSidebarCollapsed as ae, toggleIcon as oe, toggleIconCollapsed as se } from "./sidebarNavSection.css.js";
-import { useCallback as C, useId as w, useMemo as T, useState as E } from "react";
-import { jsx as D, jsxs as O } from "react/jsx-runtime";
-import { useTranslation as ce } from "react-i18next";
+import { CSS as n } from "../../../node_modules/@dnd-kit/utilities/dist/utilities.esm.js";
+import { DndContext as r, DragOverlay as i, KeyboardSensor as a, PointerSensor as o, TouchSensor as s, closestCenter as ee, useSensor as c, useSensors as l } from "../../../node_modules/@dnd-kit/core/dist/core.esm.js";
+import { SortableContext as u, sortableKeyboardCoordinates as d, useSortable as f, verticalListSortingStrategy as p } from "../../../node_modules/@dnd-kit/sortable/dist/sortable.esm.js";
+import { SidebarNavItem as m } from "../sidebar_nav_item/SidebarNavItem.js";
+import { header as h, headerButton as g, headerButtonSidebarCollapsed as te, headerSidebarCollapsed as ne, items as _, itemsNested as v, section as re, sortableItem as y, sortableItemDragging as b, title as ie, titleContent as x, titleIcon as ae, titleIconTheme as oe, titleSidebarCollapsed as se, titleTheme as ce, toggleIcon as le, toggleIconCollapsed as ue } from "./sidebarNavSection.css.js";
+import { useCallback as S, useId as C, useMemo as w, useState as T } from "react";
+import { jsx as E, jsxs as D } from "react/jsx-runtime";
+import { useTranslation as de } from "react-i18next";
 //#region src/backoffice/molecules/sidebar_nav_section/SidebarNavSection.tsx
-var le = ({ item: t, isNested: i, sidebarCollapsed: a, dragHandleLabel: o, insertionPlacement: s }) => {
-	let { id: c, data: ee, ...l } = t, { attributes: u, listeners: d, setNodeRef: f, transform: m, transition: h, isDragging: g } = p({
-		id: c,
-		disabled: a
+var fe = ({ item: t, isNested: r, sidebarCollapsed: i, dragHandleLabel: a, insertionPlacement: o }) => {
+	let { id: s, data: ee, ...c } = t, { attributes: l, listeners: u, setNodeRef: d, transform: p, transition: h, isDragging: g } = f({
+		id: s,
+		disabled: i
 	});
-	return /* @__PURE__ */ O("div", {
-		ref: f,
+	return /* @__PURE__ */ D("div", {
+		ref: d,
 		style: {
-			transform: r.Transform.toString(m),
+			transform: n.Transform.toString(p),
 			transition: h
 		},
-		className: e(b, { [x]: g }),
+		className: e(y, { [b]: g }),
 		children: [
-			s === "before" && /* @__PURE__ */ D("span", {
-				className: "_1rp5mg6k _1rp5mg6j txvbqbqv7 txvbqbo2g txvbqbdqi txvbqb2is txvbqb1961",
+			o === "before" && /* @__PURE__ */ E("span", {
+				className: "_1rp5mg6l _1rp5mg6k txvbqbqv7 txvbqbo2g txvbqbdqi txvbqb2is",
 				"aria-hidden": "true"
 			}),
-			/* @__PURE__ */ D(n, {
-				...l,
-				collapsed: a,
-				nested: i,
-				dragHandleLabel: l.dragHandleLabel ?? o,
+			/* @__PURE__ */ E(m, {
+				...c,
+				collapsed: i,
+				nested: r,
+				dragHandleLabel: c.dragHandleLabel ?? a,
 				dragHandleProps: {
-					...u,
-					...d
+					...l,
+					...u
 				},
 				isDragging: g
 			}),
-			s === "after" && /* @__PURE__ */ D("span", {
-				className: "_1rp5mg6k _1rp5mg6j txvbqbqv7 txvbqbo2g txvbqbdqi txvbqb2is txvbqb1961",
+			o === "after" && /* @__PURE__ */ E("span", {
+				className: "_1rp5mg6l _1rp5mg6k txvbqbqv7 txvbqbo2g txvbqbdqi txvbqb2is",
 				"aria-hidden": "true"
 			})
 		]
 	});
-}, k = ({ title: r, icon: p, items: b, collapsible: x = !1, isCollapsed: k, defaultCollapsed: ue = !1, onCollapsedChange: A, collapsed: j = !1, reorder: M, className: de }) => {
-	let [fe, pe] = E(ue), N = w(), P = w(), { t: F } = ce("ui", { useSuspense: !1 }), [I, L] = E(null), [R, z] = E(null), B = k ?? fe, V = x, me = C(() => {
+}, O = ({ title: n, icon: f, items: y, collapsible: b = !1, isCollapsed: O, defaultCollapsed: pe = !1, onCollapsedChange: k, collapsed: A = !1, reorder: j, className: M }) => {
+	let [me, he] = T(pe), N = C(), P = C(), { t: F } = de("ui", { useSuspense: !1 }), [I, L] = T(null), [R, z] = T(null), B = O ?? me, V = b, ge = S(() => {
 		if (!V) return;
 		let e = !B;
-		k ?? pe(e), A?.(e);
+		O ?? he(e), k?.(e);
 	}, [
 		V,
 		B,
-		k,
-		A
+		O,
+		k
 	]), H;
-	typeof r == "string" && (H = r);
-	let U = e(re, { [ae]: j }), he = e(oe, { [se]: B }), W;
-	j && (W = H);
+	typeof n == "string" && (H = n);
+	let U = e(ie, ce, { [se]: A }), _e = e(le, { [ue]: B }), W;
+	A && (W = H);
 	let G = null;
-	p != null && (G = /* @__PURE__ */ D("span", {
-		className: ie,
+	f != null && (G = /* @__PURE__ */ E("span", {
+		className: e(ae, oe),
 		"aria-hidden": "true",
-		children: p
+		children: f
 	}));
-	let ge = M?.enabled === !0 && b.length > 1, K = T(() => b.map((e) => e.id), [b]), _e = u(l(s, { activationConstraint: { distance: 4 } }), l(c, { activationConstraint: {
+	let ve = j?.enabled === !0 && y.length > 1, K = w(() => y.map((e) => e.id), [y]), ye = l(c(o, { activationConstraint: { distance: 4 } }), c(s, { activationConstraint: {
 		delay: 180,
 		tolerance: 5
-	} }), l(o, { coordinateGetter: f })), q = C(() => {
+	} }), c(a, { coordinateGetter: d })), q = S(() => {
 		L(null), z(null);
-	}, []), ve = C((e) => {
+	}, []), be = S((e) => {
 		L(e.active.id), z(e.active.id);
-	}, []), ye = C((e) => {
-		let t = b.find((t) => t.id === String(e.active.id)) ?? null, n = null;
-		e.over != null && (n = b.find((t) => t.id === String(e.over?.id)) ?? null);
+	}, []), xe = S((e) => {
+		let t = y.find((t) => t.id === String(e.active.id)) ?? null, n = null;
+		e.over != null && (n = y.find((t) => t.id === String(e.over?.id)) ?? null);
 		let r = t?.data?.id ?? String(e.active.id), i = null;
-		n != null && (i = n.data?.id ?? String(e.over?.id)), q(), !(i == null || r === i) && M?.onReorder(r, i);
+		n != null && (i = n.data?.id ?? String(e.over?.id)), q(), !(i == null || r === i) && j?.onReorder(r, i);
 	}, [
-		b,
-		M,
+		y,
+		j,
 		q
-	]), J = T(() => I == null ? null : b.find((e) => e.id === String(I)) ?? null, [I, b]), Y = null, X = "before";
+	]), J = w(() => I == null ? null : y.find((e) => e.id === String(I)) ?? null, [I, y]), Y = null, X = "before";
 	if (I != null && R != null && I !== R) {
 		let e = K.indexOf(String(I)), t = K.indexOf(String(R));
 		e !== -1 && t !== -1 && (Y = String(R), e < t && (X = "after"));
 	}
-	let be = F("navigation.sidebar.reorder.handle"), xe = F("navigation.sidebar.reorder.instructions"), Z = null;
-	r != null && (Z = V ? /* @__PURE__ */ O("button", {
+	let Se = F("navigation.sidebar.reorder.handle"), Ce = F("navigation.sidebar.reorder.instructions"), Z = null;
+	n != null && (Z = V ? /* @__PURE__ */ D("button", {
 		id: P,
 		type: "button",
-		className: e(g, { [_]: j }),
-		onClick: me,
+		className: e(g, { [te]: A }),
+		onClick: ge,
 		"aria-expanded": !B,
 		"aria-controls": N,
 		"aria-label": W,
 		title: W,
-		children: [/* @__PURE__ */ O("span", {
-			className: S,
-			children: [G, /* @__PURE__ */ D("span", {
+		children: [/* @__PURE__ */ D("span", {
+			className: x,
+			children: [G, /* @__PURE__ */ E("span", {
 				className: U,
-				children: r
+				children: n
 			})]
-		}), !j && /* @__PURE__ */ D("span", {
-			className: he,
+		}), !A && /* @__PURE__ */ E("span", {
+			className: _e,
 			"aria-hidden": "true",
-			children: /* @__PURE__ */ D(t, {
+			children: /* @__PURE__ */ E(t, {
 				width: 18,
 				height: 18
 			})
 		})]
-	}) : /* @__PURE__ */ D("div", {
-		className: e(h, { [te]: j }),
+	}) : /* @__PURE__ */ E("div", {
+		className: e(h, { [ne]: A }),
 		title: W,
-		children: /* @__PURE__ */ O("div", {
-			className: S,
+		children: /* @__PURE__ */ D("div", {
+			className: x,
 			id: P,
-			children: [G, /* @__PURE__ */ D("span", {
+			children: [G, /* @__PURE__ */ E("span", {
 				className: U,
-				children: r
+				children: n
 			})]
 		})
 	}));
 	let Q = null;
 	if (!B) {
-		let t = r != null && !j;
-		Q = /* @__PURE__ */ D("div", {
-			className: e(v, { [y]: t }),
+		let t = n != null && !A;
+		Q = /* @__PURE__ */ E("div", {
+			className: e(_, { [v]: t }),
 			id: N,
 			role: "list",
-			children: b.map((e) => {
-				let { id: r, data: i, ...a } = e;
-				return /* @__PURE__ */ D(n, {
-					...a,
-					collapsed: j,
+			children: y.map((e) => {
+				let { id: n, data: r, ...i } = e;
+				return /* @__PURE__ */ E(m, {
+					...i,
+					collapsed: A,
 					nested: t
-				}, r);
+				}, n);
 			})
-		}), ge && !j && (Q = /* @__PURE__ */ O(i, {
-			accessibility: { screenReaderInstructions: { draggable: xe } },
+		}), ve && !A && (Q = /* @__PURE__ */ D(r, {
+			accessibility: { screenReaderInstructions: { draggable: Ce } },
 			collisionDetection: ee,
-			sensors: _e,
-			onDragStart: ve,
+			sensors: ye,
+			onDragStart: be,
 			onDragOver: (e) => {
 				z(e.over?.id ?? null);
 			},
 			onDragCancel: q,
-			onDragEnd: ye,
-			children: [/* @__PURE__ */ D(d, {
+			onDragEnd: xe,
+			children: [/* @__PURE__ */ E(u, {
 				items: K,
-				strategy: m,
-				children: /* @__PURE__ */ D("div", {
-					className: e(v, { [y]: t }),
+				strategy: p,
+				children: /* @__PURE__ */ E("div", {
+					className: e(_, { [v]: t }),
 					id: N,
 					role: "list",
-					children: b.map((e) => {
+					children: y.map((e) => {
 						let n;
-						return e.id === Y && (n = X), /* @__PURE__ */ D(le, {
+						return e.id === Y && (n = X), /* @__PURE__ */ E(fe, {
 							item: e,
 							isNested: t,
-							sidebarCollapsed: j,
-							dragHandleLabel: be,
+							sidebarCollapsed: A,
+							dragHandleLabel: Se,
 							insertionPlacement: n
 						}, e.id);
 					})
 				})
-			}), /* @__PURE__ */ D(a, { children: J != null && /* @__PURE__ */ O("div", {
-				className: "_1rp5mg6m _1rp5mg6l txvbqbyoi txvbqbzm3 txvbqb11ed txvbqbwqg txvbqbdr8 txvbqbey txvbqbff6 txvbqb2gm txvbqb9j txvbqbfd0 txvbqb196b txvbqb19c9 txvbqb1uy txvbqb17h txvbqbck9",
-				children: [J.icon != null && /* @__PURE__ */ D("span", {
-					className: "_1rp5mg6n txvbqbdsb txvbqbey txvbqbjtp txvbqb17hx txvbqbhnc txvbqbf7y",
+			}), /* @__PURE__ */ E(i, { children: J != null && /* @__PURE__ */ D("div", {
+				className: "_1rp5mg6n _1rp5mg6m txvbqbyoi txvbqbzm3 txvbqb11ed txvbqbwqg txvbqbdr8 txvbqbey txvbqbff6 txvbqb2gm txvbqb9j txvbqbfd0 txvbqb1uy txvbqbck9",
+				children: [J.icon != null && /* @__PURE__ */ E("span", {
+					className: "_1rp5mg6o txvbqbdsb txvbqbey txvbqbjtp txvbqb17hx txvbqbhnc txvbqbf7y",
 					children: J.icon
-				}), /* @__PURE__ */ D("span", {
-					className: "_1rp5mg6p _1rp5mg6o txvbqbt9i",
+				}), /* @__PURE__ */ E("span", {
+					className: "_1rp5mg6q _1rp5mg6p txvbqbt9i",
 					children: J.label
 				})]
 			}) })]
 		}));
 	}
 	let $;
-	return r != null && ($ = P), /* @__PURE__ */ O("section", {
-		className: e(ne, de),
+	return n != null && ($ = P), /* @__PURE__ */ D("section", {
+		className: e(re, M),
 		"aria-labelledby": $,
 		children: [Z, Q]
 	});
 };
 //#endregion
-export { k as SidebarNavSection, k as default };
+export { O as SidebarNavSection, O as default };
 
 //# sourceMappingURL=SidebarNavSection.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"SidebarNavSection.js","names":[],"sources":["../../../../../src/backoffice/molecules/sidebar_nav_section/SidebarNavSection.tsx"],"sourcesContent":["import {\n  DndContext,\n  DragOverlay,\n  KeyboardSensor,\n  PointerSensor,\n  TouchSensor,\n  closestCenter,\n  useSensor,\n  useSensors,\n  type DragEndEvent,\n  type DragStartEvent,\n  type UniqueIdentifier,\n} from '@dnd-kit/core';\nimport {\n  SortableContext,\n  sortableKeyboardCoordinates,\n  useSortable,\n  verticalListSortingStrategy,\n} from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport {\n  type CSSProperties,\n  type JSX,\n  type ReactNode,\n  useCallback,\n  useId,\n  useMemo,\n  useState,\n} from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { ChevronDownSvg } from '../../../icons/ChevronDownSvg.js';\n\nimport {\n  SidebarNavItem,\n  type SidebarNavItemProps,\n} from '../sidebar_nav_item/SidebarNavItem.js';\nimport * as styles from './sidebarNavSection.css.js';\nimport { cx } from '../../../theme/tools.js';\n\nexport type SidebarNavSectionItemData = {\n  kind: 'dashboard' | 'entity' | 'tool' | 'hub';\n  id: string;\n  groupId?: string;\n};\n\nexport type SidebarNavSectionItem = SidebarNavItemProps & {\n  id: string;\n  data?: SidebarNavSectionItemData;\n};\n\nexport type SidebarNavSectionReorder = {\n  enabled: boolean;\n  onReorder: (fromId: string, toId: string) => void;\n};\n\nexport type SidebarNavSectionProps = {\n  title?: ReactNode;\n  icon?: ReactNode;\n  items: readonly SidebarNavSectionItem[];\n  collapsible?: boolean;\n  isCollapsed?: boolean;\n  defaultCollapsed?: boolean;\n  onCollapsedChange?: (collapsed: boolean) => void;\n  collapsed?: boolean;\n  reorder?: SidebarNavSectionReorder;\n  className?: string;\n};\n\ntype InsertionPlacement = 'before' | 'after';\n\ntype SortableSidebarNavItemProps = {\n  item: SidebarNavSectionItem;\n  isNested: boolean;\n  sidebarCollapsed: boolean;\n  dragHandleLabel?: string;\n  insertionPlacement?: InsertionPlacement;\n};\n\nconst SortableSidebarNavItem = ({\n  item,\n  isNested,\n  sidebarCollapsed,\n  dragHandleLabel,\n  insertionPlacement,\n}: SortableSidebarNavItemProps): JSX.Element => {\n  const { id, data, ...rest } = item;\n  const {\n    attributes,\n    listeners,\n    setNodeRef,\n    transform,\n    transition,\n    isDragging,\n  } = useSortable({\n    id,\n    disabled: sidebarCollapsed,\n  });\n  const style: CSSProperties = {\n    transform: CSS.Transform.toString(transform),\n    transition,\n  };\n\n  return (\n    <div\n      ref={setNodeRef}\n      style={style}\n      className={cx(styles.sortableItem, {\n        [styles.sortableItemDragging]: isDragging,\n      })}\n    >\n      {insertionPlacement === 'before' && (\n        <span className={styles.insertionIndicator} aria-hidden=\"true\" />\n      )}\n      <SidebarNavItem\n        {...rest}\n        collapsed={sidebarCollapsed}\n        nested={isNested}\n        dragHandleLabel={rest.dragHandleLabel ?? dragHandleLabel}\n        dragHandleProps={{\n          ...attributes,\n          ...listeners,\n        }}\n        isDragging={isDragging}\n      />\n      {insertionPlacement === 'after' && (\n        <span className={styles.insertionIndicator} aria-hidden=\"true\" />\n      )}\n    </div>\n  );\n};\n\nexport const SidebarNavSection = ({\n  title,\n  icon,\n  items,\n  collapsible = false,\n  isCollapsed,\n  defaultCollapsed = false,\n  onCollapsedChange,\n  collapsed: sidebarCollapsed = false,\n  reorder,\n  className,\n}: SidebarNavSectionProps): JSX.Element => {\n  const [uncontrolledCollapsed, setUncontrolledCollapsed] =\n    useState(defaultCollapsed);\n  const itemsId = useId();\n  const titleId = useId();\n  const { t } = useTranslation('ui', { useSuspense: false });\n  const [activeSortableId, setActiveSortableId] =\n    useState<UniqueIdentifier | null>(null);\n  const [overSortableId, setOverSortableId] = useState<UniqueIdentifier | null>(\n    null,\n  );\n\n  const collapsed = isCollapsed ?? uncontrolledCollapsed;\n\n  const canCollapse = collapsible;\n\n  const handleToggle = useCallback(() => {\n    if (!canCollapse) {\n      return;\n    }\n    const next = !collapsed;\n    if (isCollapsed == null) {\n      setUncontrolledCollapsed(next);\n    }\n    onCollapsedChange?.(next);\n  }, [canCollapse, collapsed, isCollapsed, onCollapsedChange]);\n\n  let resolvedTitle: string | undefined;\n  if (typeof title === 'string') {\n    resolvedTitle = title;\n  }\n\n  const titleClassName = cx(styles.title, {\n    [styles.titleSidebarCollapsed]: sidebarCollapsed,\n  });\n  const toggleIconClassName = cx(styles.toggleIcon, {\n    [styles.toggleIconCollapsed]: collapsed,\n  });\n  let sidebarCollapsedTitle: string | undefined;\n  if (sidebarCollapsed) {\n    sidebarCollapsedTitle = resolvedTitle;\n  }\n  let iconNode: JSX.Element | null = null;\n  if (icon != null) {\n    iconNode = (\n      <span className={styles.titleIcon} aria-hidden=\"true\">\n        {icon}\n      </span>\n    );\n  }\n\n  const sortableEnabled = reorder?.enabled === true && items.length > 1;\n  const sortableIds = useMemo(() => {\n    return items.map((item) => {\n      return item.id;\n    });\n  }, [items]);\n  const sensors = useSensors(\n    useSensor(PointerSensor, {\n      activationConstraint: {\n        distance: 4,\n      },\n    }),\n    useSensor(TouchSensor, {\n      activationConstraint: {\n        delay: 180,\n        tolerance: 5,\n      },\n    }),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  );\n\n  const resetDragState = useCallback(() => {\n    setActiveSortableId(null);\n    setOverSortableId(null);\n  }, []);\n\n  const handleDragStart = useCallback((event: DragStartEvent) => {\n    setActiveSortableId(event.active.id);\n    setOverSortableId(event.active.id);\n  }, []);\n\n  const handleDragEnd = useCallback(\n    (event: DragEndEvent) => {\n      const activeItem =\n        items.find((item) => {\n          return item.id === String(event.active.id);\n        }) ?? null;\n      let overItem: SidebarNavSectionItem | null = null;\n      if (event.over != null) {\n        overItem =\n          items.find((item) => {\n            return item.id === String(event.over?.id);\n          }) ?? null;\n      }\n      const fromId = activeItem?.data?.id ?? String(event.active.id);\n      let toId: string | null = null;\n      if (overItem != null) {\n        toId = overItem.data?.id ?? String(event.over?.id);\n      }\n      resetDragState();\n      if (toId == null || fromId === toId) {\n        return;\n      }\n      reorder?.onReorder(fromId, toId);\n    },\n    [items, reorder, resetDragState],\n  );\n\n  const activeItem = useMemo(() => {\n    if (activeSortableId == null) {\n      return null;\n    }\n    return (\n      items.find((item) => {\n        return item.id === String(activeSortableId);\n      }) ?? null\n    );\n  }, [activeSortableId, items]);\n\n  let insertionId: string | null = null;\n  let insertionPlacement: InsertionPlacement = 'before';\n  if (\n    activeSortableId != null &&\n    overSortableId != null &&\n    activeSortableId !== overSortableId\n  ) {\n    const activeIndex = sortableIds.indexOf(String(activeSortableId));\n    const overIndex = sortableIds.indexOf(String(overSortableId));\n    if (activeIndex !== -1 && overIndex !== -1) {\n      insertionId = String(overSortableId);\n      if (activeIndex < overIndex) {\n        insertionPlacement = 'after';\n      }\n    }\n  }\n\n  const dragHandleLabel = t('navigation.sidebar.reorder.handle');\n  const dragInstructions = t('navigation.sidebar.reorder.instructions');\n\n  let headerNode: JSX.Element | null = null;\n  if (title != null) {\n    if (canCollapse) {\n      headerNode = (\n        <button\n          id={titleId}\n          type=\"button\"\n          className={cx(styles.headerButton, {\n            [styles.headerButtonSidebarCollapsed]: sidebarCollapsed,\n          })}\n          onClick={handleToggle}\n          aria-expanded={!collapsed}\n          aria-controls={itemsId}\n          aria-label={sidebarCollapsedTitle}\n          title={sidebarCollapsedTitle}\n        >\n          <span className={styles.titleContent}>\n            {iconNode}\n            <span className={titleClassName}>{title}</span>\n          </span>\n          {!sidebarCollapsed && (\n            <span className={toggleIconClassName} aria-hidden=\"true\">\n              <ChevronDownSvg width={18} height={18} />\n            </span>\n          )}\n        </button>\n      );\n    } else {\n      headerNode = (\n        <div\n          className={cx(styles.header, {\n            [styles.headerSidebarCollapsed]: sidebarCollapsed,\n          })}\n          title={sidebarCollapsedTitle}\n        >\n          <div className={styles.titleContent} id={titleId}>\n            {iconNode}\n            <span className={titleClassName}>{title}</span>\n          </div>\n        </div>\n      );\n    }\n  }\n\n  let itemsNode: JSX.Element | null = null;\n  if (!collapsed) {\n    const isNested = title != null && !sidebarCollapsed;\n    const regularItemsNode = (\n      <div\n        className={cx(styles.items, {\n          [styles.itemsNested]: isNested,\n        })}\n        id={itemsId}\n        role=\"list\"\n      >\n        {items.map((item) => {\n          const { id, data, ...rest } = item;\n          return (\n            <SidebarNavItem\n              key={id}\n              {...rest}\n              collapsed={sidebarCollapsed}\n              nested={isNested}\n            />\n          );\n        })}\n      </div>\n    );\n\n    itemsNode = regularItemsNode;\n\n    if (sortableEnabled && !sidebarCollapsed) {\n      itemsNode = (\n        <DndContext\n          accessibility={{\n            screenReaderInstructions: {\n              draggable: dragInstructions,\n            },\n          }}\n          collisionDetection={closestCenter}\n          sensors={sensors}\n          onDragStart={handleDragStart}\n          onDragOver={(event) => {\n            setOverSortableId(event.over?.id ?? null);\n          }}\n          onDragCancel={resetDragState}\n          onDragEnd={handleDragEnd}\n        >\n          <SortableContext\n            items={sortableIds}\n            strategy={verticalListSortingStrategy}\n          >\n            <div\n              className={cx(styles.items, {\n                [styles.itemsNested]: isNested,\n              })}\n              id={itemsId}\n              role=\"list\"\n            >\n              {items.map((item) => {\n                let placement: InsertionPlacement | undefined;\n                if (item.id === insertionId) {\n                  placement = insertionPlacement;\n                }\n                return (\n                  <SortableSidebarNavItem\n                    key={item.id}\n                    item={item}\n                    isNested={isNested}\n                    sidebarCollapsed={sidebarCollapsed}\n                    dragHandleLabel={dragHandleLabel}\n                    insertionPlacement={placement}\n                  />\n                );\n              })}\n            </div>\n          </SortableContext>\n          <DragOverlay>\n            {activeItem != null && (\n              <div className={styles.dragOverlay}>\n                {activeItem.icon != null && (\n                  <span className={styles.dragOverlayIcon}>\n                    {activeItem.icon}\n                  </span>\n                )}\n                <span className={styles.dragOverlayLabel}>\n                  {activeItem.label}\n                </span>\n              </div>\n            )}\n          </DragOverlay>\n        </DndContext>\n      );\n    }\n  }\n\n  let ariaLabelledBy: string | undefined;\n  if (title != null) {\n    ariaLabelledBy = titleId;\n  }\n\n  return (\n    <section\n      className={cx(styles.section, className)}\n      aria-labelledby={ariaLabelledBy}\n    >\n      {headerNode}\n      {itemsNode}\n    </section>\n  );\n};\n\nexport default SidebarNavSection;\n"],"mappings":"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"}
+{"version":3,"file":"SidebarNavSection.js","names":[],"sources":["../../../../../src/backoffice/molecules/sidebar_nav_section/SidebarNavSection.tsx"],"sourcesContent":["import {\n  DndContext,\n  DragOverlay,\n  KeyboardSensor,\n  PointerSensor,\n  TouchSensor,\n  closestCenter,\n  useSensor,\n  useSensors,\n  type DragEndEvent,\n  type DragStartEvent,\n  type UniqueIdentifier,\n} from '@dnd-kit/core';\nimport {\n  SortableContext,\n  sortableKeyboardCoordinates,\n  useSortable,\n  verticalListSortingStrategy,\n} from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport {\n  type CSSProperties,\n  type JSX,\n  type ReactNode,\n  useCallback,\n  useId,\n  useMemo,\n  useState,\n} from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { ChevronDownSvg } from '../../../icons/ChevronDownSvg.js';\n\nimport {\n  SidebarNavItem,\n  type SidebarNavItemProps,\n} from '../sidebar_nav_item/SidebarNavItem.js';\nimport * as styles from './sidebarNavSection.css.js';\nimport { cx } from '../../../theme/tools.js';\n\nexport type SidebarNavSectionItemData = {\n  kind: 'dashboard' | 'entity' | 'tool' | 'hub';\n  id: string;\n  groupId?: string;\n};\n\nexport type SidebarNavSectionItem = SidebarNavItemProps & {\n  id: string;\n  data?: SidebarNavSectionItemData;\n};\n\nexport type SidebarNavSectionReorder = {\n  enabled: boolean;\n  onReorder: (fromId: string, toId: string) => void;\n};\n\nexport type SidebarNavSectionProps = {\n  title?: ReactNode;\n  icon?: ReactNode;\n  items: readonly SidebarNavSectionItem[];\n  collapsible?: boolean;\n  isCollapsed?: boolean;\n  defaultCollapsed?: boolean;\n  onCollapsedChange?: (collapsed: boolean) => void;\n  collapsed?: boolean;\n  reorder?: SidebarNavSectionReorder;\n  className?: string;\n};\n\ntype InsertionPlacement = 'before' | 'after';\n\ntype SortableSidebarNavItemProps = {\n  item: SidebarNavSectionItem;\n  isNested: boolean;\n  sidebarCollapsed: boolean;\n  dragHandleLabel?: string;\n  insertionPlacement?: InsertionPlacement;\n};\n\nconst SortableSidebarNavItem = ({\n  item,\n  isNested,\n  sidebarCollapsed,\n  dragHandleLabel,\n  insertionPlacement,\n}: SortableSidebarNavItemProps): JSX.Element => {\n  const { id, data, ...rest } = item;\n  const {\n    attributes,\n    listeners,\n    setNodeRef,\n    transform,\n    transition,\n    isDragging,\n  } = useSortable({\n    id,\n    disabled: sidebarCollapsed,\n  });\n  const style: CSSProperties = {\n    transform: CSS.Transform.toString(transform),\n    transition,\n  };\n\n  return (\n    <div\n      ref={setNodeRef}\n      style={style}\n      className={cx(styles.sortableItem, {\n        [styles.sortableItemDragging]: isDragging,\n      })}\n    >\n      {insertionPlacement === 'before' && (\n        <span className={styles.insertionIndicator} aria-hidden=\"true\" />\n      )}\n      <SidebarNavItem\n        {...rest}\n        collapsed={sidebarCollapsed}\n        nested={isNested}\n        dragHandleLabel={rest.dragHandleLabel ?? dragHandleLabel}\n        dragHandleProps={{\n          ...attributes,\n          ...listeners,\n        }}\n        isDragging={isDragging}\n      />\n      {insertionPlacement === 'after' && (\n        <span className={styles.insertionIndicator} aria-hidden=\"true\" />\n      )}\n    </div>\n  );\n};\n\nexport const SidebarNavSection = ({\n  title,\n  icon,\n  items,\n  collapsible = false,\n  isCollapsed,\n  defaultCollapsed = false,\n  onCollapsedChange,\n  collapsed: sidebarCollapsed = false,\n  reorder,\n  className,\n}: SidebarNavSectionProps): JSX.Element => {\n  const [uncontrolledCollapsed, setUncontrolledCollapsed] =\n    useState(defaultCollapsed);\n  const itemsId = useId();\n  const titleId = useId();\n  const { t } = useTranslation('ui', { useSuspense: false });\n  const [activeSortableId, setActiveSortableId] =\n    useState<UniqueIdentifier | null>(null);\n  const [overSortableId, setOverSortableId] = useState<UniqueIdentifier | null>(\n    null,\n  );\n\n  const collapsed = isCollapsed ?? uncontrolledCollapsed;\n\n  const canCollapse = collapsible;\n\n  const handleToggle = useCallback(() => {\n    if (!canCollapse) {\n      return;\n    }\n    const next = !collapsed;\n    if (isCollapsed == null) {\n      setUncontrolledCollapsed(next);\n    }\n    onCollapsedChange?.(next);\n  }, [canCollapse, collapsed, isCollapsed, onCollapsedChange]);\n\n  let resolvedTitle: string | undefined;\n  if (typeof title === 'string') {\n    resolvedTitle = title;\n  }\n\n  const titleClassName = cx(styles.title, styles.titleTheme, {\n    [styles.titleSidebarCollapsed]: sidebarCollapsed,\n  });\n  const toggleIconClassName = cx(styles.toggleIcon, {\n    [styles.toggleIconCollapsed]: collapsed,\n  });\n  let sidebarCollapsedTitle: string | undefined;\n  if (sidebarCollapsed) {\n    sidebarCollapsedTitle = resolvedTitle;\n  }\n  let iconNode: JSX.Element | null = null;\n  if (icon != null) {\n    iconNode = (\n      <span\n        className={cx(styles.titleIcon, styles.titleIconTheme)}\n        aria-hidden=\"true\"\n      >\n        {icon}\n      </span>\n    );\n  }\n\n  const sortableEnabled = reorder?.enabled === true && items.length > 1;\n  const sortableIds = useMemo(() => {\n    return items.map((item) => {\n      return item.id;\n    });\n  }, [items]);\n  const sensors = useSensors(\n    useSensor(PointerSensor, {\n      activationConstraint: {\n        distance: 4,\n      },\n    }),\n    useSensor(TouchSensor, {\n      activationConstraint: {\n        delay: 180,\n        tolerance: 5,\n      },\n    }),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  );\n\n  const resetDragState = useCallback(() => {\n    setActiveSortableId(null);\n    setOverSortableId(null);\n  }, []);\n\n  const handleDragStart = useCallback((event: DragStartEvent) => {\n    setActiveSortableId(event.active.id);\n    setOverSortableId(event.active.id);\n  }, []);\n\n  const handleDragEnd = useCallback(\n    (event: DragEndEvent) => {\n      const activeItem =\n        items.find((item) => {\n          return item.id === String(event.active.id);\n        }) ?? null;\n      let overItem: SidebarNavSectionItem | null = null;\n      if (event.over != null) {\n        overItem =\n          items.find((item) => {\n            return item.id === String(event.over?.id);\n          }) ?? null;\n      }\n      const fromId = activeItem?.data?.id ?? String(event.active.id);\n      let toId: string | null = null;\n      if (overItem != null) {\n        toId = overItem.data?.id ?? String(event.over?.id);\n      }\n      resetDragState();\n      if (toId == null || fromId === toId) {\n        return;\n      }\n      reorder?.onReorder(fromId, toId);\n    },\n    [items, reorder, resetDragState],\n  );\n\n  const activeItem = useMemo(() => {\n    if (activeSortableId == null) {\n      return null;\n    }\n    return (\n      items.find((item) => {\n        return item.id === String(activeSortableId);\n      }) ?? null\n    );\n  }, [activeSortableId, items]);\n\n  let insertionId: string | null = null;\n  let insertionPlacement: InsertionPlacement = 'before';\n  if (\n    activeSortableId != null &&\n    overSortableId != null &&\n    activeSortableId !== overSortableId\n  ) {\n    const activeIndex = sortableIds.indexOf(String(activeSortableId));\n    const overIndex = sortableIds.indexOf(String(overSortableId));\n    if (activeIndex !== -1 && overIndex !== -1) {\n      insertionId = String(overSortableId);\n      if (activeIndex < overIndex) {\n        insertionPlacement = 'after';\n      }\n    }\n  }\n\n  const dragHandleLabel = t('navigation.sidebar.reorder.handle');\n  const dragInstructions = t('navigation.sidebar.reorder.instructions');\n\n  let headerNode: JSX.Element | null = null;\n  if (title != null) {\n    if (canCollapse) {\n      headerNode = (\n        <button\n          id={titleId}\n          type=\"button\"\n          className={cx(styles.headerButton, {\n            [styles.headerButtonSidebarCollapsed]: sidebarCollapsed,\n          })}\n          onClick={handleToggle}\n          aria-expanded={!collapsed}\n          aria-controls={itemsId}\n          aria-label={sidebarCollapsedTitle}\n          title={sidebarCollapsedTitle}\n        >\n          <span className={styles.titleContent}>\n            {iconNode}\n            <span className={titleClassName}>{title}</span>\n          </span>\n          {!sidebarCollapsed && (\n            <span className={toggleIconClassName} aria-hidden=\"true\">\n              <ChevronDownSvg width={18} height={18} />\n            </span>\n          )}\n        </button>\n      );\n    } else {\n      headerNode = (\n        <div\n          className={cx(styles.header, {\n            [styles.headerSidebarCollapsed]: sidebarCollapsed,\n          })}\n          title={sidebarCollapsedTitle}\n        >\n          <div className={styles.titleContent} id={titleId}>\n            {iconNode}\n            <span className={titleClassName}>{title}</span>\n          </div>\n        </div>\n      );\n    }\n  }\n\n  let itemsNode: JSX.Element | null = null;\n  if (!collapsed) {\n    const isNested = title != null && !sidebarCollapsed;\n    const regularItemsNode = (\n      <div\n        className={cx(styles.items, {\n          [styles.itemsNested]: isNested,\n        })}\n        id={itemsId}\n        role=\"list\"\n      >\n        {items.map((item) => {\n          const { id, data, ...rest } = item;\n          return (\n            <SidebarNavItem\n              key={id}\n              {...rest}\n              collapsed={sidebarCollapsed}\n              nested={isNested}\n            />\n          );\n        })}\n      </div>\n    );\n\n    itemsNode = regularItemsNode;\n\n    if (sortableEnabled && !sidebarCollapsed) {\n      itemsNode = (\n        <DndContext\n          accessibility={{\n            screenReaderInstructions: {\n              draggable: dragInstructions,\n            },\n          }}\n          collisionDetection={closestCenter}\n          sensors={sensors}\n          onDragStart={handleDragStart}\n          onDragOver={(event) => {\n            setOverSortableId(event.over?.id ?? null);\n          }}\n          onDragCancel={resetDragState}\n          onDragEnd={handleDragEnd}\n        >\n          <SortableContext\n            items={sortableIds}\n            strategy={verticalListSortingStrategy}\n          >\n            <div\n              className={cx(styles.items, {\n                [styles.itemsNested]: isNested,\n              })}\n              id={itemsId}\n              role=\"list\"\n            >\n              {items.map((item) => {\n                let placement: InsertionPlacement | undefined;\n                if (item.id === insertionId) {\n                  placement = insertionPlacement;\n                }\n                return (\n                  <SortableSidebarNavItem\n                    key={item.id}\n                    item={item}\n                    isNested={isNested}\n                    sidebarCollapsed={sidebarCollapsed}\n                    dragHandleLabel={dragHandleLabel}\n                    insertionPlacement={placement}\n                  />\n                );\n              })}\n            </div>\n          </SortableContext>\n          <DragOverlay>\n            {activeItem != null && (\n              <div className={styles.dragOverlay}>\n                {activeItem.icon != null && (\n                  <span className={styles.dragOverlayIcon}>\n                    {activeItem.icon}\n                  </span>\n                )}\n                <span className={styles.dragOverlayLabel}>\n                  {activeItem.label}\n                </span>\n              </div>\n            )}\n          </DragOverlay>\n        </DndContext>\n      );\n    }\n  }\n\n  let ariaLabelledBy: string | undefined;\n  if (title != null) {\n    ariaLabelledBy = titleId;\n  }\n\n  return (\n    <section\n      className={cx(styles.section, className)}\n      aria-labelledby={ariaLabelledBy}\n    >\n      {headerNode}\n      {itemsNode}\n    </section>\n  );\n};\n\nexport default SidebarNavSection;\n"],"mappings":"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"}

package/lib/esm/backoffice/molecules/sidebar_nav_section/sidebarNavSection.css.js

@@ -1,8 +1,8 @@
 /* empty css                                      */
 /* empty css                                 */
 //#region src/backoffice/molecules/sidebar_nav_section/sidebarNavSection.css.ts
-var e = "_1rp5mg60 txvbqbdr8 txvbqbf6i txvbqbga8", t = "_1rp5mg61 txvbqbyo5 txvbqbzlq txvbqb11e0 txvbqbwq3 txvbqbdr8 txvbqbey txvbqbjus txvbqbff6 txvbqbscn", n = "_1rp5mg62 txvbqbynf txvbqbzl0 txvbqbjtp", r = "_1rp5mg65 _1rp5mg63 txvbqbyo5 txvbqbzlq txvbqb11e0 txvbqbwq3 txvbqbdr8 txvbqbey txvbqbjus txvbqbff6 txvbqb17w0 txvbqbscn txvbqb2g9 txvbqb1g5 txvbqb2e3 txvbqb1933 txvbqbv txvbqb16ex _1rp5mg64 txvbqb1aex", i = "_1rp5mg66 txvbqbynf txvbqbzl0 txvbqbjtp", a = "_1rp5mg67 txvbqb8t txvbqbfd0 txvbqb6a txvbqb19cd txvbqbkwc", o = "_1rp5mg68 txvbqbdsb txvbqbey txvbqbt9i txvbqbff6", s = "_1rp5mg69 txvbqbdsb txvbqbey txvbqbjtp txvbqb17h7 txvbqbhmm txvbqbf7y txvbqb19cd", c = "_1rp5mg6a txvbqbdq5", l = "_1rp5mg6c _1rp5mg6b txvbqbdsb txvbqbey txvbqbjtp txvbqb17hk txvbqbhmz txvbqb2fj txvbqb19cd", u = "_1rp5mg6d", d = "_1rp5mg6e txvbqbdr8 txvbqbf6i txvbqbga8", f = "_1rp5mg6g _1rp5mg6f txvbqbo62 txvbqbyo5 txvbqb9mg txvbqb655", p = "_1rp5mg6h", m = "_1rp5mg6i", h = "_1rp5mg6k _1rp5mg6j txvbqbqv7 txvbqbo2g txvbqbdqi txvbqb2is txvbqb1961", g = "_1rp5mg6m _1rp5mg6l txvbqbyoi txvbqbzm3 txvbqb11ed txvbqbwqg txvbqbdr8 txvbqbey txvbqbff6 txvbqb2gm txvbqb9j txvbqbfd0 txvbqb196b txvbqb19c9 txvbqb1uy txvbqb17h txvbqbck9", _ = "_1rp5mg6n txvbqbdsb txvbqbey txvbqbjtp txvbqb17hx txvbqbhnc txvbqbf7y", v = "_1rp5mg6p _1rp5mg6o txvbqbt9i";
+var e = "_1rp5mg60 txvbqbdr8 txvbqbf6i txvbqbga8", t = "_1rp5mg61 txvbqbyo5 txvbqbzlq txvbqb11e0 txvbqbwq3 txvbqbdr8 txvbqbey txvbqbjus txvbqbff6 txvbqbscn", n = "_1rp5mg62 txvbqbynf txvbqbzl0 txvbqbjtp", r = "_1rp5mg64 _1rp5mg63 txvbqbyo5 txvbqbzlq txvbqb11e0 txvbqbwq3 txvbqbdr8 txvbqbey txvbqbjus txvbqbff6 txvbqb17w0 txvbqbscn txvbqb2g9 txvbqb1g5 txvbqb2e3 txvbqb1933 txvbqbv txvbqb16ex", i = "_1rp5mg65 txvbqbynf txvbqbzl0 txvbqbjtp", a = "_1rp5mg66 txvbqb8t txvbqbfd0 txvbqb6a txvbqbkwc", o = "_1rp5mg67", s = "_1rp5mg68 txvbqbdsb txvbqbey txvbqbt9i txvbqbff6", c = "_1rp5mg69 txvbqbdsb txvbqbey txvbqbjtp txvbqb17h7 txvbqbhmm txvbqbf7y", l = "_1rp5mg6a", u = "_1rp5mg6b txvbqbdq5", d = "_1rp5mg6d _1rp5mg6c txvbqbdsb txvbqbey txvbqbjtp txvbqb17hk txvbqbhmz txvbqb2fj", f = "_1rp5mg6e", p = "_1rp5mg6f txvbqbdr8 txvbqbf6i txvbqbga8", m = "_1rp5mg6h _1rp5mg6g txvbqbo62 txvbqbyo5 txvbqb9mg", h = "_1rp5mg6i", g = "_1rp5mg6j", _ = "_1rp5mg6l _1rp5mg6k txvbqbqv7 txvbqbo2g txvbqbdqi txvbqb2is", v = "_1rp5mg6n _1rp5mg6m txvbqbyoi txvbqbzm3 txvbqb11ed txvbqbwqg txvbqbdr8 txvbqbey txvbqbff6 txvbqb2gm txvbqb9j txvbqbfd0 txvbqb1uy txvbqbck9", y = "_1rp5mg6o txvbqbdsb txvbqbey txvbqbjtp txvbqb17hx txvbqbhnc txvbqbf7y", b = "_1rp5mg6q _1rp5mg6p txvbqbt9i";
 //#endregion
-export { g as dragOverlay, _ as dragOverlayIcon, v as dragOverlayLabel, t as header, r as headerButton, i as headerButtonSidebarCollapsed, n as headerSidebarCollapsed, h as insertionIndicator, d as items, f as itemsNested, e as section, p as sortableItem, m as sortableItemDragging, a as title, o as titleContent, s as titleIcon, c as titleSidebarCollapsed, l as toggleIcon, u as toggleIconCollapsed };
+export { v as dragOverlay, y as dragOverlayIcon, b as dragOverlayLabel, t as header, r as headerButton, i as headerButtonSidebarCollapsed, n as headerSidebarCollapsed, _ as insertionIndicator, p as items, m as itemsNested, e as section, h as sortableItem, g as sortableItemDragging, a as title, s as titleContent, c as titleIcon, l as titleIconTheme, u as titleSidebarCollapsed, o as titleTheme, d as toggleIcon, f as toggleIconCollapsed };
 
 //# sourceMappingURL=sidebarNavSection.css.js.map

package/lib/esm/backoffice/molecules/sidebar_nav_section/sidebarNavSection.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidebarNavSection.css.js","names":[],"sources":["../../../../../src/backoffice/molecules/sidebar_nav_section/sidebarNavSection.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles, stateSprinkles } from '../../../theme/sprinkles.css.js';\nimport { vars } from '../../../theme/themeContract.css.js';\n\nexport const section = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1.5,\n});\n\nexport const header = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  gap: 2,\n  paddingX: 2,\n  paddingY: 0.5,\n  minHeight: 8,\n});\n\nexport const headerSidebarCollapsed = sprinkles({\n  justifyContent: 'center',\n  paddingX: 0,\n});\n\nexport const headerButton = style([\n  sprinkles({\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    gap: 2,\n    width: 'full',\n    paddingX: 2,\n    paddingY: 0.5,\n    minHeight: 8,\n    borderRadius: 'md',\n    borderWidth: 0,\n    borderStyle: 'none',\n    backgroundColor: 'transparent',\n    cursor: 'pointer',\n    textAlign: 'left',\n  }),\n  stateSprinkles({\n    backgroundColor: {\n      hover: 'surfaceMuted',\n    },\n  }),\n  {\n    selectors: {\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors.primary}`,\n        outlineOffset: '2px',\n      },\n    },\n  },\n]);\n\nexport const headerButtonSidebarCollapsed = sprinkles({\n  justifyContent: 'center',\n  paddingX: 0,\n});\n\nexport const title = sprinkles({\n  fontSize: '2xs',\n  fontWeight: 'semibold',\n  textTransform: 'uppercase',\n  color: 'textMuted',\n  letterSpacing: 'wide',\n});\n\nexport const titleContent = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  minWidth: 0,\n  gap: 2,\n});\n\nexport const titleIcon = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: 4,\n  height: 4,\n  flexShrink: 0,\n  color: 'textMuted',\n});\n\nexport const titleSidebarCollapsed = sprinkles({\n  display: 'none',\n});\n\nexport const toggleIcon = style([\n  sprinkles({\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: 5,\n    height: 5,\n    borderRadius: 'sm',\n    color: 'textMuted',\n  }),\n  {\n    transition: 'transform 120ms ease',\n  },\n]);\n\nexport const toggleIconCollapsed = style({\n  transform: 'rotate(-90deg)',\n});\n\nexport const items = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1.5,\n});\n\nexport const itemsNested = style([\n  sprinkles({\n    marginLeft: 4,\n    paddingLeft: 2,\n    borderLeftWidth: 'default',\n    borderLeftColor: 'border',\n  }),\n  {\n    borderLeftStyle: 'solid',\n  },\n]);\n\nexport const sortableItem = style({\n  position: 'relative',\n});\n\nexport const sortableItemDragging = style({\n  zIndex: 1,\n});\n\nexport const insertionIndicator = style([\n  sprinkles({\n    display: 'block',\n    marginY: 0.5,\n    borderRadius: 'full',\n    backgroundColor: 'primary',\n  }),\n  {\n    height: '2px',\n  },\n]);\n\nexport const dragOverlay = style([\n  sprinkles({\n    display: 'flex',\n    alignItems: 'center',\n    gap: 2,\n    paddingY: 1.5,\n    paddingX: 3,\n    borderRadius: 'lg',\n    fontSize: 'sm',\n    fontWeight: 'semibold',\n    backgroundColor: 'surface',\n    color: 'text',\n    borderWidth: 'default',\n    borderColor: 'border',\n    boxShadow: 'lg',\n  }),\n  {\n    borderStyle: 'solid',\n    cursor: 'grabbing',\n    minWidth: '12rem',\n    maxWidth: '18rem',\n  },\n]);\n\nexport const dragOverlayIcon = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: 6,\n  height: 6,\n  flexShrink: 0,\n});\n\nexport const dragOverlayLabel = style([\n  sprinkles({\n    minWidth: 0,\n  }),\n  {\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n  },\n]);\n"],"mappings":""}
+{"version":3,"file":"sidebarNavSection.css.js","names":[],"sources":["../../../../../src/backoffice/molecules/sidebar_nav_section/sidebarNavSection.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '../../../theme/sprinkles.css.js';\nimport { vars } from '../../../theme/themeContract.css.js';\n\nexport const section = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1.5,\n});\n\nexport const header = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  gap: 2,\n  paddingX: 2,\n  paddingY: 0.5,\n  minHeight: 8,\n});\n\nexport const headerSidebarCollapsed = sprinkles({\n  justifyContent: 'center',\n  paddingX: 0,\n});\n\nexport const headerButton = style([\n  sprinkles({\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    gap: 2,\n    width: 'full',\n    paddingX: 2,\n    paddingY: 0.5,\n    minHeight: 8,\n    borderRadius: 'md',\n    borderWidth: 0,\n    borderStyle: 'none',\n    backgroundColor: 'transparent',\n    cursor: 'pointer',\n    textAlign: 'left',\n  }),\n  {\n    selectors: {\n      '&:hover': {\n        backgroundColor: vars.sidebar.sectionHeaderHoverBackground,\n      },\n      '&:focus-visible': {\n        boxShadow: vars.sidebar.itemFocusRing,\n        outline: 'none',\n      },\n    },\n  },\n]);\n\nexport const headerButtonSidebarCollapsed = sprinkles({\n  justifyContent: 'center',\n  paddingX: 0,\n});\n\nexport const title = sprinkles({\n  fontSize: '2xs',\n  fontWeight: 'semibold',\n  textTransform: 'uppercase',\n  letterSpacing: 'wide',\n});\n\nexport const titleTheme = style({\n  color: vars.sidebar.sectionHeaderColor,\n});\n\nexport const titleContent = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  minWidth: 0,\n  gap: 2,\n});\n\nexport const titleIcon = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: 4,\n  height: 4,\n  flexShrink: 0,\n});\n\nexport const titleIconTheme = style({\n  color: vars.sidebar.sectionHeaderIconColor,\n});\n\nexport const titleSidebarCollapsed = sprinkles({\n  display: 'none',\n});\n\nexport const toggleIcon = style([\n  sprinkles({\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: 5,\n    height: 5,\n    borderRadius: 'sm',\n  }),\n  {\n    color: vars.sidebar.sectionToggleColor,\n    transition: 'transform 120ms ease',\n  },\n]);\n\nexport const toggleIconCollapsed = style({\n  transform: 'rotate(-90deg)',\n});\n\nexport const items = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1.5,\n});\n\nexport const itemsNested = style([\n  sprinkles({\n    marginLeft: 4,\n    paddingLeft: 2,\n    borderLeftWidth: 'default',\n  }),\n  {\n    borderLeftStyle: 'solid',\n    borderLeftColor: vars.sidebar.nestedBorderColor,\n  },\n]);\n\nexport const sortableItem = style({\n  position: 'relative',\n});\n\nexport const sortableItemDragging = style({\n  zIndex: 1,\n});\n\nexport const insertionIndicator = style([\n  sprinkles({\n    display: 'block',\n    marginY: 0.5,\n    borderRadius: 'full',\n  }),\n  {\n    backgroundColor: vars.sidebar.insertionIndicatorColor,\n    height: '2px',\n  },\n]);\n\nexport const dragOverlay = style([\n  sprinkles({\n    display: 'flex',\n    alignItems: 'center',\n    gap: 2,\n    paddingY: 1.5,\n    paddingX: 3,\n    borderRadius: 'lg',\n    fontSize: 'sm',\n    fontWeight: 'semibold',\n    borderWidth: 'default',\n    boxShadow: 'lg',\n  }),\n  {\n    backgroundColor: vars.sidebar.dragOverlayBackground,\n    borderColor: vars.sidebar.dragOverlayBorderColor,\n    borderStyle: 'solid',\n    color: vars.sidebar.dragOverlayColor,\n    cursor: 'grabbing',\n    minWidth: '12rem',\n    maxWidth: '18rem',\n  },\n]);\n\nexport const dragOverlayIcon = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: 6,\n  height: 6,\n  flexShrink: 0,\n});\n\nexport const dragOverlayLabel = style([\n  sprinkles({\n    minWidth: 0,\n  }),\n  {\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n  },\n]);\n"],"mappings":""}

package/lib/esm/backoffice/molecules/sidebar_profile_menu/BackofficeSidebarProfileMenu.js

@@ -2,80 +2,80 @@ import { cx as e } from "../../../theme/tools.js";
 import { ChevronDownSvg as t } from "../../../icons/ChevronDownSvg.js";
 import { Dropdown as n } from "../../../atomic/molecules/dropdown/Dropdown.js";
 import { ProfileDropdownLogoutSvg as r } from "../../../icons/ProfileDropdownLogoutSvg.js";
-import { avatar as i, container as a, hidden as o, menu as s, menuDisplayName as c, menuEmail as l, menuIcon as u, menuIdentity as d, menuItem as f, title as p, trigger as m, triggerMain as h } from "./sidebarProfileMenu.css.js";
-import { jsx as g, jsxs as _ } from "react/jsx-runtime";
+import { avatar as i, avatarTheme as a, container as o, hidden as s, menu as c, menuDisplayName as l, menuDisplayNameTheme as u, menuEmail as d, menuEmailTheme as f, menuIcon as p, menuIconTheme as m, menuIdentity as h, menuItem as g, title as _, titleTheme as v, trigger as y, triggerMain as b } from "./sidebarProfileMenu.css.js";
+import { jsx as x, jsxs as S } from "react/jsx-runtime";
 //#region src/backoffice/molecules/sidebar_profile_menu/BackofficeSidebarProfileMenu.tsx
-var v = ({ viewer: v, collapsed: y, labels: b, onSignOut: x, isSigningOut: S = !1, className: C }) => {
-	let w = p;
-	y && (w = o);
-	let T = `${b.menuAriaLabel}: ${v.displayName}`, E;
-	return y && (E = T), /* @__PURE__ */ _("div", {
-		className: e(a, C),
-		children: [/* @__PURE__ */ g("div", {
-			className: w,
-			children: b.sectionTitle
-		}), /* @__PURE__ */ g(n, {
-			trigger: (n) => /* @__PURE__ */ _("button", {
+var C = ({ viewer: C, collapsed: w, labels: T, onSignOut: E, isSigningOut: D = !1, className: O }) => {
+	let k = e(_, v);
+	w && (k = s);
+	let A = `${T.menuAriaLabel}: ${C.displayName}`, j;
+	return w && (j = A), /* @__PURE__ */ S("div", {
+		className: e(o, O),
+		children: [/* @__PURE__ */ x("div", {
+			className: k,
+			children: T.sectionTitle
+		}), /* @__PURE__ */ x(n, {
+			trigger: (n) => /* @__PURE__ */ S("button", {
 				type: "button",
-				className: m({ collapsed: y }),
-				"aria-label": T,
-				title: E,
-				children: [/* @__PURE__ */ _("span", {
-					className: h,
-					children: [/* @__PURE__ */ g("span", {
-						className: i,
-						children: v.initials
-					}), !y && /* @__PURE__ */ _("span", {
-						className: "_1uw3f9ob txvbqbdr8 txvbqbf6i txvbqbt9i",
-						children: [/* @__PURE__ */ g("span", {
-							className: "_1uw3f9oc txvbqb9j txvbqbfd0 txvbqb19c9 txvbqb18xk txvbqbusr txvbqb16g0",
-							children: v.displayName
-						}), /* @__PURE__ */ g("span", {
-							className: "_1uw3f9od txvbqb96 txvbqb19cb txvbqb18xk txvbqbusr txvbqb16g0",
-							children: v.email
+				className: y({ collapsed: w }),
+				"aria-label": A,
+				title: j,
+				children: [/* @__PURE__ */ S("span", {
+					className: b,
+					children: [/* @__PURE__ */ x("span", {
+						className: e(i, a),
+						children: C.initials
+					}), !w && /* @__PURE__ */ S("span", {
+						className: "_1uw3f9od txvbqbdr8 txvbqbf6i txvbqbt9i",
+						children: [/* @__PURE__ */ x("span", {
+							className: e("_1uw3f9oe txvbqb9j txvbqbfd0 txvbqb18xk txvbqbusr txvbqb16g0", "_1uw3f9of"),
+							children: C.displayName
+						}), /* @__PURE__ */ x("span", {
+							className: e("_1uw3f9og txvbqb96 txvbqb18xk txvbqbusr txvbqb16g0", "_1uw3f9oh"),
+							children: C.email
 						})]
 					})]
-				}), !y && /* @__PURE__ */ g(t, {
+				}), !w && /* @__PURE__ */ x(t, {
 					width: 16,
 					height: 16,
-					className: e("_1uw3f9oe txvbqb19cb txvbqb7p txvbqb75 txvbqb7t", { "_1uw3f9of txvbqb30": n })
+					className: e("_1uw3f9oi txvbqb7p txvbqb75 txvbqb7t", "_1uw3f9oj", { "_1uw3f9ok txvbqb30": n })
 				})]
 			}),
-			ariaLabel: T,
+			ariaLabel: A,
 			contentRole: "dialog",
-			contentAriaLabel: T,
+			contentAriaLabel: A,
 			placement: "top-start",
 			closeOnItemClick: !0,
 			matchTriggerWidth: !1,
-			children: /* @__PURE__ */ _("div", {
-				className: s,
-				children: [/* @__PURE__ */ _("div", {
-					className: d,
-					children: [/* @__PURE__ */ g("span", {
-						className: c,
-						children: v.displayName
-					}), /* @__PURE__ */ g("span", {
-						className: l,
-						children: v.email
+			children: /* @__PURE__ */ S("div", {
+				className: c,
+				children: [/* @__PURE__ */ S("div", {
+					className: h,
+					children: [/* @__PURE__ */ x("span", {
+						className: e(l, u),
+						children: C.displayName
+					}), /* @__PURE__ */ x("span", {
+						className: e(d, f),
+						children: C.email
 					})]
-				}), /* @__PURE__ */ _("button", {
+				}), /* @__PURE__ */ S("button", {
 					type: "button",
-					className: f,
-					onClick: x,
-					disabled: S,
-					children: [/* @__PURE__ */ g("span", {
-						className: u,
-						children: /* @__PURE__ */ g(r, {
+					className: g,
+					onClick: E,
+					disabled: D,
+					children: [/* @__PURE__ */ x("span", {
+						className: e(p, m),
+						children: /* @__PURE__ */ x(r, {
 							width: 16,
 							height: 16
 						})
-					}), b.signOut]
+					}), T.signOut]
 				})]
 			})
 		})]
 	});
 };
 //#endregion
-export { v as BackofficeSidebarProfileMenu, v as default };
+export { C as BackofficeSidebarProfileMenu, C as default };
 
 //# sourceMappingURL=BackofficeSidebarProfileMenu.js.map

package/lib/esm/backoffice/molecules/sidebar_profile_menu/BackofficeSidebarProfileMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"BackofficeSidebarProfileMenu.js","names":[],"sources":["../../../../../src/backoffice/molecules/sidebar_profile_menu/BackofficeSidebarProfileMenu.tsx"],"sourcesContent":["import { type JSX } from 'react';\n\nimport { Dropdown } from '../../../atomic/molecules/dropdown/Dropdown.js';\nimport { ChevronDownSvg } from '../../../icons/ChevronDownSvg.js';\nimport { ProfileDropdownLogoutSvg } from '../../../icons/ProfileDropdownLogoutSvg.js';\nimport { cx } from '../../../theme/tools.js';\n\nimport * as styles from './sidebarProfileMenu.css.js';\n\nexport type BackofficeSidebarProfileViewer = {\n  displayName: string;\n  email: string;\n  initials: string;\n  ariaLabel: string;\n};\n\nexport type BackofficeSidebarProfileMenuLabels = {\n  sectionTitle: string;\n  menuAriaLabel: string;\n  signOut: string;\n};\n\nexport type BackofficeSidebarProfileMenuProps = {\n  viewer: BackofficeSidebarProfileViewer;\n  collapsed: boolean;\n  labels: BackofficeSidebarProfileMenuLabels;\n  onSignOut: () => void;\n  isSigningOut?: boolean;\n  className?: string;\n};\n\nexport const BackofficeSidebarProfileMenu = ({\n  viewer,\n  collapsed,\n  labels,\n  onSignOut,\n  isSigningOut = false,\n  className,\n}: BackofficeSidebarProfileMenuProps): JSX.Element => {\n  let titleClassName = styles.title;\n  if (collapsed) {\n    titleClassName = styles.hidden;\n  }\n  const triggerAriaLabel = `${labels.menuAriaLabel}: ${viewer.displayName}`;\n  let triggerTitle: string | undefined;\n  if (collapsed) {\n    triggerTitle = triggerAriaLabel;\n  }\n\n  return (\n    <div className={cx(styles.container, className)}>\n      <div className={titleClassName}>{labels.sectionTitle}</div>\n      <Dropdown\n        trigger={(isOpen: boolean) => {\n          return (\n            <button\n              type=\"button\"\n              className={styles.trigger({ collapsed })}\n              aria-label={triggerAriaLabel}\n              title={triggerTitle}\n            >\n              <span className={styles.triggerMain}>\n                <span className={styles.avatar}>{viewer.initials}</span>\n                {!collapsed && (\n                  <span className={styles.identity}>\n                    <span className={styles.displayName}>\n                      {viewer.displayName}\n                    </span>\n                    <span className={styles.email}>{viewer.email}</span>\n                  </span>\n                )}\n              </span>\n              {!collapsed && (\n                <ChevronDownSvg\n                  width={16}\n                  height={16}\n                  className={cx(styles.chevron, {\n                    [styles.chevronOpen]: isOpen,\n                  })}\n                />\n              )}\n            </button>\n          );\n        }}\n        ariaLabel={triggerAriaLabel}\n        contentRole=\"dialog\"\n        contentAriaLabel={triggerAriaLabel}\n        placement=\"top-start\"\n        closeOnItemClick\n        matchTriggerWidth={false}\n      >\n        <div className={styles.menu}>\n          <div className={styles.menuIdentity}>\n            <span className={styles.menuDisplayName}>{viewer.displayName}</span>\n            <span className={styles.menuEmail}>{viewer.email}</span>\n          </div>\n          <button\n            type=\"button\"\n            className={styles.menuItem}\n            onClick={onSignOut}\n            disabled={isSigningOut}\n          >\n            <span className={styles.menuIcon}>\n              <ProfileDropdownLogoutSvg width={16} height={16} />\n            </span>\n            {labels.signOut}\n          </button>\n        </div>\n      </Dropdown>\n    </div>\n  );\n};\n\nexport default BackofficeSidebarProfileMenu;\n"],"mappings":";;;;;;;AA+BA,IAAa,KAAgC,EAC3C,WACA,cACA,WACA,cACA,kBAAe,IACf,mBACoD;CACpD,IAAI,IAAiB;CACrB,AAAI,MACF,IAAiB;CAEnB,IAAM,IAAmB,GAAG,EAAO,cAAc,IAAI,EAAO,eACxD;CAKJ,OAJI,MACF,IAAe,IAIf,kBAAC,OAAD;EAAK,WAAW,EAAG,GAAkB,EAAU;YAA/C,CACE,kBAAC,OAAD;GAAK,WAAW;aAAiB,EAAO;GAAmB,CAAA,EAC3D,kBAAC,GAAD;GACE,UAAU,MAEN,kBAAC,UAAD;IACE,MAAK;IACL,WAAW,EAAe,EAAE,cAAW,CAAC;IACxC,cAAY;IACZ,OAAO;cAJT,CAME,kBAAC,QAAD;KAAM,WAAW;eAAjB,CACE,kBAAC,QAAD;MAAM,WAAW;gBAAgB,EAAO;MAAgB,CAAA,EACvD,CAAC,KACA,kBAAC,QAAD;MAAM,WAAW;gBAAjB,CACE,kBAAC,QAAD;OAAM,WAAW;iBACd,EAAO;OACH,CAAA,EACP,kBAAC,QAAD;OAAM,WAAW;iBAAe,EAAO;OAAa,CAAA,CAC/C;QAEJ;QACN,CAAC,KACA,kBAAC,GAAD;KACE,OAAO;KACP,QAAQ;KACR,WAAW,EAAG,mDAAgB,EAC3B,sBAAqB,GACvB,CAAC;KACF,CAAA,CAEG;;GAGb,WAAW;GACX,aAAY;GACZ,kBAAkB;GAClB,WAAU;GACV,kBAAA;GACA,mBAAmB;aAEnB,kBAAC,OAAD;IAAK,WAAW;cAAhB,CACE,kBAAC,OAAD;KAAK,WAAW;eAAhB,CACE,kBAAC,QAAD;MAAM,WAAW;gBAAyB,EAAO;MAAmB,CAAA,EACpE,kBAAC,QAAD;MAAM,WAAW;gBAAmB,EAAO;MAAa,CAAA,CACpD;QACN,kBAAC,UAAD;KACE,MAAK;KACL,WAAW;KACX,SAAS;KACT,UAAU;eAJZ,CAME,kBAAC,QAAD;MAAM,WAAW;gBACf,kBAAC,GAAD;OAA0B,OAAO;OAAI,QAAQ;OAAM,CAAA;MAC9C,CAAA,EACN,EAAO,QACD;OACL;;GACG,CAAA,CACP"}
+{"version":3,"file":"BackofficeSidebarProfileMenu.js","names":[],"sources":["../../../../../src/backoffice/molecules/sidebar_profile_menu/BackofficeSidebarProfileMenu.tsx"],"sourcesContent":["import { type JSX } from 'react';\n\nimport { Dropdown } from '../../../atomic/molecules/dropdown/Dropdown.js';\nimport { ChevronDownSvg } from '../../../icons/ChevronDownSvg.js';\nimport { ProfileDropdownLogoutSvg } from '../../../icons/ProfileDropdownLogoutSvg.js';\nimport { cx } from '../../../theme/tools.js';\n\nimport * as styles from './sidebarProfileMenu.css.js';\n\nexport type BackofficeSidebarProfileViewer = {\n  displayName: string;\n  email: string;\n  initials: string;\n  ariaLabel: string;\n};\n\nexport type BackofficeSidebarProfileMenuLabels = {\n  sectionTitle: string;\n  menuAriaLabel: string;\n  signOut: string;\n};\n\nexport type BackofficeSidebarProfileMenuProps = {\n  viewer: BackofficeSidebarProfileViewer;\n  collapsed: boolean;\n  labels: BackofficeSidebarProfileMenuLabels;\n  onSignOut: () => void;\n  isSigningOut?: boolean;\n  className?: string;\n};\n\nexport const BackofficeSidebarProfileMenu = ({\n  viewer,\n  collapsed,\n  labels,\n  onSignOut,\n  isSigningOut = false,\n  className,\n}: BackofficeSidebarProfileMenuProps): JSX.Element => {\n  let titleClassName = cx(styles.title, styles.titleTheme);\n  if (collapsed) {\n    titleClassName = styles.hidden;\n  }\n  const triggerAriaLabel = `${labels.menuAriaLabel}: ${viewer.displayName}`;\n  let triggerTitle: string | undefined;\n  if (collapsed) {\n    triggerTitle = triggerAriaLabel;\n  }\n\n  return (\n    <div className={cx(styles.container, className)}>\n      <div className={titleClassName}>{labels.sectionTitle}</div>\n      <Dropdown\n        trigger={(isOpen: boolean) => {\n          return (\n            <button\n              type=\"button\"\n              className={styles.trigger({ collapsed })}\n              aria-label={triggerAriaLabel}\n              title={triggerTitle}\n            >\n              <span className={styles.triggerMain}>\n                <span className={cx(styles.avatar, styles.avatarTheme)}>\n                  {viewer.initials}\n                </span>\n                {!collapsed && (\n                  <span className={styles.identity}>\n                    <span\n                      className={cx(\n                        styles.displayName,\n                        styles.displayNameTheme,\n                      )}\n                    >\n                      {viewer.displayName}\n                    </span>\n                    <span className={cx(styles.email, styles.emailTheme)}>\n                      {viewer.email}\n                    </span>\n                  </span>\n                )}\n              </span>\n              {!collapsed && (\n                <ChevronDownSvg\n                  width={16}\n                  height={16}\n                  className={cx(styles.chevron, styles.chevronTheme, {\n                    [styles.chevronOpen]: isOpen,\n                  })}\n                />\n              )}\n            </button>\n          );\n        }}\n        ariaLabel={triggerAriaLabel}\n        contentRole=\"dialog\"\n        contentAriaLabel={triggerAriaLabel}\n        placement=\"top-start\"\n        closeOnItemClick\n        matchTriggerWidth={false}\n      >\n        <div className={styles.menu}>\n          <div className={styles.menuIdentity}>\n            <span\n              className={cx(\n                styles.menuDisplayName,\n                styles.menuDisplayNameTheme,\n              )}\n            >\n              {viewer.displayName}\n            </span>\n            <span className={cx(styles.menuEmail, styles.menuEmailTheme)}>\n              {viewer.email}\n            </span>\n          </div>\n          <button\n            type=\"button\"\n            className={styles.menuItem}\n            onClick={onSignOut}\n            disabled={isSigningOut}\n          >\n            <span className={cx(styles.menuIcon, styles.menuIconTheme)}>\n              <ProfileDropdownLogoutSvg width={16} height={16} />\n            </span>\n            {labels.signOut}\n          </button>\n        </div>\n      </Dropdown>\n    </div>\n  );\n};\n\nexport default BackofficeSidebarProfileMenu;\n"],"mappings":";;;;;;;AA+BA,IAAa,KAAgC,EAC3C,WACA,cACA,WACA,cACA,kBAAe,IACf,mBACoD;CACpD,IAAI,IAAiB,EAAG,GAAc,EAAkB;CACxD,AAAI,MACF,IAAiB;CAEnB,IAAM,IAAmB,GAAG,EAAO,cAAc,IAAI,EAAO,eACxD;CAKJ,OAJI,MACF,IAAe,IAIf,kBAAC,OAAD;EAAK,WAAW,EAAG,GAAkB,EAAU;YAA/C,CACE,kBAAC,OAAD;GAAK,WAAW;aAAiB,EAAO;GAAmB,CAAA,EAC3D,kBAAC,GAAD;GACE,UAAU,MAEN,kBAAC,UAAD;IACE,MAAK;IACL,WAAW,EAAe,EAAE,cAAW,CAAC;IACxC,cAAY;IACZ,OAAO;cAJT,CAME,kBAAC,QAAD;KAAM,WAAW;eAAjB,CACE,kBAAC,QAAD;MAAM,WAAW,EAAG,GAAe,EAAmB;gBACnD,EAAO;MACH,CAAA,EACN,CAAC,KACA,kBAAC,QAAD;MAAM,WAAW;gBAAjB,CACE,kBAAC,QAAD;OACE,WAAW,EACT,gEACA,YACD;iBAEA,EAAO;OACH,CAAA,EACP,kBAAC,QAAD;OAAM,WAAW,EAAG,sDAAc,YAAkB;iBACjD,EAAO;OACH,CAAA,CACF;QAEJ;QACN,CAAC,KACA,kBAAC,GAAD;KACE,OAAO;KACP,QAAQ;KACR,WAAW,EAAG,wCAAgB,aAAqB,EAChD,sBAAqB,GACvB,CAAC;KACF,CAAA,CAEG;;GAGb,WAAW;GACX,aAAY;GACZ,kBAAkB;GAClB,WAAU;GACV,kBAAA;GACA,mBAAmB;aAEnB,kBAAC,OAAD;IAAK,WAAW;cAAhB,CACE,kBAAC,OAAD;KAAK,WAAW;eAAhB,CACE,kBAAC,QAAD;MACE,WAAW,EACT,GACA,EACD;gBAEA,EAAO;MACH,CAAA,EACP,kBAAC,QAAD;MAAM,WAAW,EAAG,GAAkB,EAAsB;gBACzD,EAAO;MACH,CAAA,CACH;QACN,kBAAC,UAAD;KACE,MAAK;KACL,WAAW;KACX,SAAS;KACT,UAAU;eAJZ,CAME,kBAAC,QAAD;MAAM,WAAW,EAAG,GAAiB,EAAqB;gBACxD,kBAAC,GAAD;OAA0B,OAAO;OAAI,QAAQ;OAAM,CAAA;MAC9C,CAAA,EACN,EAAO,QACD;OACL;;GACG,CAAA,CACP"}

package/lib/esm/backoffice/molecules/sidebar_profile_menu/sidebarProfileMenu.css.js

@@ -2,16 +2,16 @@
 /* empty css                                  */
 import { createRuntimeFn as e } from "@vanilla-extract/recipes/createRuntimeFn";
 //#region src/backoffice/molecules/sidebar_profile_menu/sidebarProfileMenu.css.ts
-var t = "_1uw3f9o0 txvbqbdr8 txvbqbf6i txvbqbff6 txvbqb17w0", n = "_1uw3f9o1 txvbqbyns txvbqbzld txvbqb96 txvbqbfd0 txvbqb19cb", r = "_1uw3f9o2 txvbqbdq5", i = e({
-	defaultClassName: "_1uw3f9o6 _1uw3f9o3 txvbqbdr8 txvbqbey txvbqb17w0 txvbqb1uy txvbqb2et txvbqb17u txvbqb2gm txvbqb196d txvbqb7h txvbqb75 txvbqb7t txvbqbv",
+var t = "_1uw3f9o0 txvbqbdr8 txvbqbf6i txvbqbff6 txvbqb17w0", n = "_1uw3f9o1 txvbqbyns txvbqbzld txvbqb96 txvbqbfd0", r = "_1uw3f9o2", i = "_1uw3f9o3 txvbqbdq5", a = e({
+	defaultClassName: "_1uw3f9o7 _1uw3f9o4 txvbqbdr8 txvbqbey txvbqb17w0 txvbqb1uy txvbqb2et txvbqb2gm txvbqb7h txvbqb75 txvbqb7t txvbqbv",
 	variantClassNames: { collapsed: {
-		true: "_1uw3f9o7 _1uw3f9o4 txvbqbjtp txvbqbuxt",
-		false: "_1uw3f9o8 _1uw3f9o5 txvbqbyoi txvbqbzm3 txvbqb10jb txvbqbvve txvbqbjus txvbqbff6"
+		true: "_1uw3f9o8 _1uw3f9o5 txvbqbjtp txvbqbuxt",
+		false: "_1uw3f9o9 _1uw3f9o6 txvbqbyoi txvbqbzm3 txvbqb10jb txvbqbvve txvbqbjus txvbqbff6"
 	} },
 	defaultVariants: { collapsed: !1 },
 	compoundVariants: []
-}), a = "_1uw3f9o9 txvbqbdr8 txvbqbey txvbqbff6 txvbqbt9i txvbqbdxd", o = "_1uw3f9oa txvbqb17in txvbqbho2 txvbqbtce txvbqbscn txvbqb2is txvbqbdr8 txvbqbey txvbqbjtp txvbqb96 txvbqbfd0 txvbqb19dj txvbqb190g txvbqb6a", s = "_1uw3f9ob txvbqbdr8 txvbqbf6i txvbqbt9i", c = "_1uw3f9oc txvbqb9j txvbqbfd0 txvbqb19c9 txvbqb18xk txvbqbusr txvbqb16g0", l = "_1uw3f9od txvbqb96 txvbqb19cb txvbqb18xk txvbqbusr txvbqb16g0", u = "_1uw3f9oe txvbqb19cb txvbqb7p txvbqb75 txvbqb7t", d = "_1uw3f9of txvbqb30", f = "_1uw3f9og txvbqbtkc txvbqbuxt txvbqbdr8 txvbqbf6i txvbqbfet", p = "_1uw3f9oi _1uw3f9oh txvbqbyoi txvbqbzm3 txvbqb10jb txvbqbvve txvbqbdr8 txvbqbf6i txvbqbg9v txvbqb8pl txvbqb577 txvbqbn7e", m = "_1uw3f9oj txvbqb9j txvbqbfd0 txvbqb19c9 txvbqb18xk txvbqbusr txvbqb16g0", h = "_1uw3f9ok txvbqb96 txvbqb19cb txvbqb18xk txvbqbusr txvbqb16g0", g = "_1uw3f9om _1uw3f9ol txvbqbyoi txvbqbzm3 txvbqb10jb txvbqbvve txvbqbdr8 txvbqbey txvbqbff6 txvbqb17w0 txvbqb1g5 txvbqb2e3 txvbqb2g9 txvbqb1933 txvbqb19c9 txvbqb9j txvbqbfcn txvbqb16ex txvbqbv txvbqb7h txvbqb75 txvbqb7t", _ = "_1uw3f9on txvbqbdsb txvbqbey txvbqb19cb";
+}), o = "_1uw3f9oa txvbqbdr8 txvbqbey txvbqbff6 txvbqbt9i txvbqbdxd", s = "_1uw3f9ob txvbqb17in txvbqbho2 txvbqbtce txvbqbscn txvbqb2is txvbqbdr8 txvbqbey txvbqbjtp txvbqb96 txvbqbfd0 txvbqb6a", c = "_1uw3f9oc", l = "_1uw3f9od txvbqbdr8 txvbqbf6i txvbqbt9i", u = "_1uw3f9oe txvbqb9j txvbqbfd0 txvbqb18xk txvbqbusr txvbqb16g0", d = "_1uw3f9of", f = "_1uw3f9og txvbqb96 txvbqb18xk txvbqbusr txvbqb16g0", p = "_1uw3f9oh", m = "_1uw3f9oi txvbqb7p txvbqb75 txvbqb7t", h = "_1uw3f9oj", g = "_1uw3f9ok txvbqb30", _ = "_1uw3f9ol txvbqbtkc txvbqbuxt txvbqbdr8 txvbqbf6i txvbqbfet", v = "_1uw3f9on _1uw3f9om txvbqbyoi txvbqbzm3 txvbqb10jb txvbqbvve txvbqbdr8 txvbqbf6i txvbqbg9v txvbqb8pl txvbqbn7e", y = "_1uw3f9oo txvbqb9j txvbqbfd0 txvbqb18xk txvbqbusr txvbqb16g0", b = "_1uw3f9op", x = "_1uw3f9oq txvbqb96 txvbqb18xk txvbqbusr txvbqb16g0", S = "_1uw3f9or", C = "_1uw3f9ot _1uw3f9os txvbqbyoi txvbqbzm3 txvbqb10jb txvbqbvve txvbqbdr8 txvbqbey txvbqbff6 txvbqb17w0 txvbqb1g5 txvbqb2e3 txvbqb2g9 txvbqb1933 txvbqb9j txvbqbfcn txvbqb16ex txvbqbv txvbqb7h txvbqb75 txvbqb7t", w = "_1uw3f9ou txvbqbdsb txvbqbey", T = "_1uw3f9ov";
 //#endregion
-export { o as avatar, u as chevron, d as chevronOpen, t as container, c as displayName, l as email, r as hidden, s as identity, f as menu, m as menuDisplayName, h as menuEmail, _ as menuIcon, p as menuIdentity, g as menuItem, n as title, i as trigger, a as triggerMain };
+export { s as avatar, c as avatarTheme, m as chevron, g as chevronOpen, h as chevronTheme, t as container, u as displayName, d as displayNameTheme, f as email, p as emailTheme, i as hidden, l as identity, _ as menu, y as menuDisplayName, b as menuDisplayNameTheme, x as menuEmail, S as menuEmailTheme, w as menuIcon, T as menuIconTheme, v as menuIdentity, C as menuItem, n as title, r as titleTheme, a as trigger, o as triggerMain };
 
 //# sourceMappingURL=sidebarProfileMenu.css.js.map