@plumile/ui 0.1.61 → 0.1.63

package/lib/esm/backoffice/molecules/backoffice_json_viewer/backofficeJsonViewer.css.js

@@ -0,0 +1,8 @@
+/* empty css                                      */
+/* empty css                                    */
+//#region src/backoffice/molecules/backoffice_json_viewer/backofficeJsonViewer.css.ts
+var e = "_1d30zcn0 txvbqb9io txvbqbai6 txvbqbao6 txvbqbu6f", t = "_1d30zcn1 txvbqb9io txvbqbco txvbqbdoo txvbqbaof", n = "_1d30zcn2 txvbqb8x txvbqbamf txvbqbv8r", r = "_1d30zcn3 txvbqb9jf txvbqbco txvbqbao6", i = "_1d30zcn4 txvbqbfbo txvbqblaf txvbqb1co txvbqb1qf txvbqbwf txvbqb1ro txvbqbv8p txvbqbal6 txvbqb8o txvbqbf4o txvbqbl66 txvbqbisx txvbqbuwo", a = "_1d30zcn5 txvbqbiqx";
+//#endregion
+export { r as actions, e as container, t as header, i as pre, n as title, a as truncated };
+
+//# sourceMappingURL=backofficeJsonViewer.css.js.map

package/lib/esm/backoffice/molecules/backoffice_json_viewer/backofficeJsonViewer.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"backofficeJsonViewer.css.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_json_viewer/backofficeJsonViewer.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const container = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 2,\n  width: 'full',\n});\n\nexport const header = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  gap: 3,\n});\n\nexport const title = sprinkles({\n  fontSize: 'sm',\n  fontWeight: 'medium',\n  color: 'textSecondary',\n});\n\nexport const actions = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: 2,\n});\n\nexport const pre = sprinkles({\n  margin: 0,\n  padding: 4,\n  borderWidth: 'default',\n  borderStyle: 'solid',\n  borderColor: 'border',\n  borderRadius: 'lg',\n  color: 'text',\n  fontFamily: 'mono',\n  fontSize: 'xs',\n  lineHeight: 1.45,\n  overflow: 'auto',\n  maxHeight: 96,\n  whiteSpace: 'pre',\n});\n\nexport const truncated = sprinkles({\n  maxHeight: 48,\n});\n"],"mappings":""}

package/lib/esm/backoffice/molecules/backoffice_key_value_list/BackofficeKeyValueList.js

@@ -0,0 +1,22 @@
+import { cx as e } from "../../../theme/tools.js";
+import { item as t, itemSurface as n, label as r, labelSize as i, list as a, value as o } from "./backofficeKeyValueList.css.js";
+import "../../../index.js";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/backoffice/molecules/backoffice_key_value_list/BackofficeKeyValueList.tsx
+var l = ({ items: l }) => /* @__PURE__ */ s("dl", {
+	className: a,
+	children: l.map((a) => /* @__PURE__ */ c("div", {
+		className: e(t, n),
+		children: [/* @__PURE__ */ s("dt", {
+			className: e(r, i),
+			children: a.label
+		}), /* @__PURE__ */ s("dd", {
+			className: o,
+			children: a.value
+		})]
+	}, a.id))
+});
+//#endregion
+export { l as BackofficeKeyValueList, l as default };
+
+//# sourceMappingURL=BackofficeKeyValueList.js.map

package/lib/esm/backoffice/molecules/backoffice_key_value_list/BackofficeKeyValueList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficeKeyValueList.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_key_value_list/BackofficeKeyValueList.tsx"],"sourcesContent":["import { type JSX, type ReactNode } from 'react';\n\nimport * as styles from './backofficeKeyValueList.css.js';\nimport { cx } from '@plumile/ui';\n\nexport type BackofficeKeyValueItem = {\n  id: string;\n  label: ReactNode;\n  value: ReactNode;\n};\n\nexport type BackofficeKeyValueListProps = {\n  items: readonly BackofficeKeyValueItem[];\n};\n\nexport const BackofficeKeyValueList = ({\n  items,\n}: BackofficeKeyValueListProps): JSX.Element => {\n  return (\n    <dl className={styles.list}>\n      {items.map((item) => {\n        return (\n          <div key={item.id} className={cx(styles.item, styles.itemSurface)}>\n            <dt className={cx(styles.label, styles.labelSize)}>{item.label}</dt>\n            <dd className={styles.value}>{item.value}</dd>\n          </div>\n        );\n      })}\n    </dl>\n  );\n};\n\nexport default BackofficeKeyValueList;\n"],"mappings":";;;;;AAeA,IAAa,KAA0B,EACrC,eAGE,kBAAC,MAAD;CAAI,WAAW;WACZ,EAAM,KAAK,MAER,kBAAC,OAAD;EAAmB,WAAW,EAAG,GAAa,EAAmB;YAAjE,CACE,kBAAC,MAAD;GAAI,WAAW,EAAG,GAAc,EAAiB;aAAG,EAAK;GAAW,CAAA,EACpE,kBAAC,MAAD;GAAI,WAAW;aAAe,EAAK;GAAW,CAAA,CAC1C;IAHI,EAAK,GAGT,CAER;CACC,CAAA"}

package/lib/esm/backoffice/molecules/backoffice_key_value_list/backofficeKeyValueList.css.js

@@ -0,0 +1,7 @@
+/* empty css                                      */
+//#region src/backoffice/molecules/backoffice_key_value_list/backofficeKeyValueList.css.ts
+var e = "tx0dqq0", t = "tx0dqq1", n = "tx0dqq2", r = "tx0dqq3", i = "tx0dqq4", a = "tx0dqq5";
+//#endregion
+export { t as item, n as itemSurface, r as label, i as labelSize, e as list, a as value };
+
+//# sourceMappingURL=backofficeKeyValueList.css.js.map

package/lib/esm/backoffice/molecules/backoffice_key_value_list/backofficeKeyValueList.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"backofficeKeyValueList.css.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_key_value_list/backofficeKeyValueList.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { vars } from '@plumile/ui/theme/themeContract.js';\n\nexport const list = style({\n  display: 'grid',\n  gap: vars.spacing[2],\n});\n\nexport const item = style({\n  display: 'grid',\n  gridTemplateColumns: vars.gridTemplateColumns.keyValueSplit,\n  gap: vars.spacing[2],\n  alignItems: 'center',\n  paddingTop: vars.spacing[2],\n  paddingBottom: vars.spacing[2],\n  paddingLeft: vars.spacing[3],\n  paddingRight: vars.spacing[3],\n  borderRadius: vars.borderRadius.lg,\n  backgroundColor: vars.colors.surfaceMuted,\n});\n\nexport const itemSurface = style({\n  borderWidth: vars.borderWidth.default,\n  borderStyle: 'solid',\n  borderColor: vars.colors.borderSubtle,\n});\n\nexport const label = style({\n  color: vars.colors.textMuted,\n  textTransform: 'uppercase',\n  letterSpacing: vars.letterSpacing.caps,\n  fontWeight: vars.fontWeight.semibold,\n});\n\nexport const labelSize = style({\n  fontSize: vars.fontSize.xs,\n  lineHeight: vars.lineHeight.xs,\n});\n\nexport const value = style({\n  fontSize: vars.fontSize.base,\n  lineHeight: vars.lineHeight.base,\n  color: vars.colors.text,\n  margin: 0,\n});\n"],"mappings":""}

package/lib/esm/backoffice/molecules/backoffice_load_more/BackofficeLoadMore.js

@@ -0,0 +1,27 @@
+import { Spinner as e } from "../../atoms/spinner/Spinner.js";
+import { container as t, left as n, meta as r } from "./backofficeLoadMore.css.js";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/backoffice/molecules/backoffice_load_more/BackofficeLoadMore.tsx
+var o = ({ hasNextPage: o, isLoading: s, loadMoreLabel: c = "More results available", endLabel: l = "End of results", loadingLabel: u = "Loading more…", meta: d }) => {
+	let f = l;
+	o && (f = c), s && (f = u);
+	let p = null;
+	return s && (p = /* @__PURE__ */ i(e, { size: 16 })), /* @__PURE__ */ i("div", {
+		className: t,
+		children: /* @__PURE__ */ a("div", {
+			className: n,
+			children: [
+				p,
+				/* @__PURE__ */ i("span", {
+					className: r,
+					children: f
+				}),
+				d
+			]
+		})
+	});
+};
+//#endregion
+export { o as BackofficeLoadMore, o as default };
+
+//# sourceMappingURL=BackofficeLoadMore.js.map

package/lib/esm/backoffice/molecules/backoffice_load_more/BackofficeLoadMore.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficeLoadMore.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_load_more/BackofficeLoadMore.tsx"],"sourcesContent":["import { type JSX, type ReactNode } from 'react';\nimport { Spinner } from '../../atoms/spinner/Spinner.js';\n\nimport * as styles from './backofficeLoadMore.css.js';\n\nexport type BackofficeLoadMoreProps = {\n  hasNextPage: boolean;\n  isLoading: boolean;\n  loadMoreLabel?: string;\n  endLabel?: string;\n  loadingLabel?: string;\n  meta?: ReactNode;\n};\n\nexport const BackofficeLoadMore = ({\n  hasNextPage,\n  isLoading,\n  loadMoreLabel = 'More results available',\n  endLabel = 'End of results',\n  loadingLabel = 'Loading more…',\n  meta,\n}: BackofficeLoadMoreProps): JSX.Element => {\n  let statusLabel = endLabel;\n  if (hasNextPage) {\n    statusLabel = loadMoreLabel;\n  }\n  if (isLoading) {\n    statusLabel = loadingLabel;\n  }\n\n  let spinnerNode: JSX.Element | null = null;\n  if (isLoading) {\n    spinnerNode = <Spinner size={16} />;\n  }\n\n  return (\n    <div className={styles.container}>\n      <div className={styles.left}>\n        {spinnerNode}\n        <span className={styles.meta}>{statusLabel}</span>\n        {meta}\n      </div>\n    </div>\n  );\n};\n\nexport default BackofficeLoadMore;\n"],"mappings":";;;;AAcA,IAAa,KAAsB,EACjC,gBACA,cACA,mBAAgB,0BAChB,cAAW,kBACX,kBAAe,iBACf,MAAA,QAC0C;CAC1C,IAAI,IAAc;AAIlB,CAHI,MACF,IAAc,IAEZ,MACF,IAAc;CAGhB,IAAI,IAAkC;AAKtC,QAJI,MACF,IAAc,kBAAC,GAAD,EAAS,MAAM,IAAM,CAAA,GAInC,kBAAC,OAAD;EAAK,WAAW;YACd,kBAAC,OAAD;GAAK,WAAW;aAAhB;IACG;IACD,kBAAC,QAAD;KAAM,WAAW;eAAc;KAAmB,CAAA;IACjD;IACG;;EACF,CAAA"}

package/lib/esm/backoffice/molecules/backoffice_load_more/backofficeLoadMore.css.js

@@ -0,0 +1,8 @@
+/* empty css                                      */
+/* empty css                                  */
+//#region src/backoffice/molecules/backoffice_load_more/backofficeLoadMore.css.ts
+var e = "_1pc2pbg0 txvbqbnvf txvbqboio txvbqbp5o txvbqblxf txvbqb9io txvbqbco txvbqbdoo txvbqbaof txvbqb12f txvbqb4ro txvbqb1qf txvbqb2cx txvbqbuzn", t = "_1pc2pbg1 txvbqb9jf txvbqbco txvbqbao6 txvbqbk4x", n = "_1pc2pbg2 txvbqb8x txvbqbv8r txvbqbl6f txvbqbt6f txvbqbuw6";
+//#endregion
+export { e as container, t as left, n as meta };
+
+//# sourceMappingURL=backofficeLoadMore.css.js.map

package/lib/esm/backoffice/molecules/backoffice_load_more/backofficeLoadMore.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"backofficeLoadMore.css.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_load_more/backofficeLoadMore.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const container = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  gap: 3,\n  paddingY: 3,\n  paddingX: 4,\n  borderWidth: 0,\n  borderTopWidth: 'default',\n  borderStyle: 'solid',\n  borderTopColor: 'borderLight',\n  backgroundColor: 'white',\n});\n\nexport const left = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: 2,\n  minWidth: 0,\n});\n\nexport const meta = sprinkles({\n  fontSize: 'sm',\n  color: 'textSecondary',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n});\n"],"mappings":""}

package/lib/esm/backoffice/molecules/backoffice_page_header/BackofficePageHeader.js

@@ -0,0 +1,31 @@
+import { cx as e } from "../../../theme/tools.js";
+import { container as t, left as n, title as r, titleRow as i } from "./backofficePageHeader.css.js";
+import "../../../index.js";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/backoffice/molecules/backoffice_page_header/BackofficePageHeader.tsx
+var s = ({ title: s, subtitle: c, actions: l, meta: u, className: d }) => /* @__PURE__ */ o("div", {
+	className: e(t, d),
+	children: [/* @__PURE__ */ o("div", {
+		className: n,
+		children: [/* @__PURE__ */ o("div", {
+			className: i,
+			children: [/* @__PURE__ */ a("h1", {
+				className: r,
+				children: s
+			}), u != null && /* @__PURE__ */ a("div", {
+				className: "_1puq2a85",
+				children: u
+			})]
+		}), c != null && (typeof c != "string" || c.trim() !== "") && /* @__PURE__ */ a("p", {
+			className: "_1puq2a84",
+			children: c
+		})]
+	}), l != null && /* @__PURE__ */ a("div", {
+		className: "_1puq2a86",
+		children: l
+	})]
+});
+//#endregion
+export { s as BackofficePageHeader, s as default };
+
+//# sourceMappingURL=BackofficePageHeader.js.map

package/lib/esm/backoffice/molecules/backoffice_page_header/BackofficePageHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficePageHeader.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_page_header/BackofficePageHeader.tsx"],"sourcesContent":["import { type JSX, type ReactNode } from 'react';\n\nimport { cx } from '@plumile/ui';\n\nimport * as styles from './backofficePageHeader.css.js';\n\nexport type BackofficePageHeaderProps = {\n  title: string;\n  subtitle?: ReactNode;\n  actions?: ReactNode;\n  meta?: ReactNode;\n  className?: string;\n};\n\nexport const BackofficePageHeader = ({\n  title,\n  subtitle,\n  actions,\n  meta,\n  className,\n}: BackofficePageHeaderProps): JSX.Element => {\n  return (\n    <div className={cx(styles.container, className)}>\n      <div className={styles.left}>\n        <div className={styles.titleRow}>\n          <h1 className={styles.title}>{title}</h1>\n          {meta != null && <div className={styles.metaRow}>{meta}</div>}\n        </div>\n        {subtitle != null &&\n          (typeof subtitle !== 'string' || subtitle.trim() !== '') && (\n            <p className={styles.subtitle}>{subtitle}</p>\n          )}\n      </div>\n      {actions != null && <div className={styles.actions}>{actions}</div>}\n    </div>\n  );\n};\n\nexport default BackofficePageHeader;\n"],"mappings":";;;;;AAcA,IAAa,KAAwB,EACnC,OAAA,GACA,UAAA,GACA,SAAA,GACA,SACA,mBAGE,kBAAC,OAAD;CAAK,WAAW,EAAG,GAAkB,EAAU;WAA/C,CACE,kBAAC,OAAD;EAAK,WAAW;YAAhB,CACE,kBAAC,OAAD;GAAK,WAAW;aAAhB,CACE,kBAAC,MAAD;IAAI,WAAW;cAAe;IAAW,CAAA,EACxC,KAAQ,QAAQ,kBAAC,OAAD;IAAK,WAAW;cAAiB;IAAW,CAAA,CACzD;MACL,KAAY,SACV,OAAO,KAAa,YAAY,EAAS,MAAM,KAAK,OACnD,kBAAC,KAAD;GAAG,WAAW;aAAkB;GAAa,CAAA,CAE7C;KACL,KAAW,QAAQ,kBAAC,OAAD;EAAK,WAAW;YAAiB;EAAc,CAAA,CAC/D"}

package/lib/esm/backoffice/molecules/backoffice_page_header/backofficePageHeader.css.js

@@ -0,0 +1,7 @@
+/* empty css                                    */
+//#region src/backoffice/molecules/backoffice_page_header/backofficePageHeader.css.ts
+var e = "_1puq2a80", t = "_1puq2a81", n = "_1puq2a82", r = "_1puq2a83", i = "_1puq2a84", a = "_1puq2a85", o = "_1puq2a86";
+//#endregion
+export { o as actions, e as container, t as left, a as metaRow, i as subtitle, r as title, n as titleRow };
+
+//# sourceMappingURL=backofficePageHeader.css.js.map

package/lib/esm/backoffice/molecules/backoffice_page_header/backofficePageHeader.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"backofficePageHeader.css.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_page_header/backofficePageHeader.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { vars } from '@plumile/ui/theme/themeContract.js';\n\nexport const container = style({\n  display: 'flex',\n  alignItems: 'flex-start',\n  justifyContent: 'space-between',\n  gap: vars.spacing[4],\n  flexWrap: 'wrap',\n});\n\nexport const left = style({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: vars.spacing[2],\n  minWidth: 0,\n  flex: 1,\n});\n\nexport const titleRow = style({\n  display: 'flex',\n  alignItems: 'center',\n  gap: vars.spacing[2],\n  flexWrap: 'wrap',\n});\n\nexport const title = style({\n  fontSize: vars.fontSize['2xl'],\n  lineHeight: vars.lineHeight['2xl'],\n  fontWeight: vars.fontWeight.semibold,\n  color: vars.colors.text,\n  margin: 0,\n});\n\nexport const subtitle = style({\n  margin: 0,\n  fontSize: vars.fontSize.base,\n  lineHeight: vars.lineHeight.base,\n  color: vars.colors.textSecondary,\n});\n\nexport const metaRow = style({\n  display: 'flex',\n  alignItems: 'center',\n  gap: vars.spacing[2],\n  flexWrap: 'wrap',\n});\n\nexport const actions = style({\n  display: 'flex',\n  alignItems: 'center',\n  gap: vars.spacing[2],\n  flexWrap: 'wrap',\n});\n"],"mappings":""}

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

@@ -0,0 +1,68 @@
+import { cx as e } from "../../../theme/tools.js";
+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 { 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(() => {
+		if (!m) return;
+		let e = (e) => {
+			e.target instanceof Node && (g.current?.contains(e.target) || h(!1));
+		};
+		return document.addEventListener("pointerdown", e), () => {
+			document.removeEventListener("pointerdown", e);
+		};
+	}, [m]), p.length === 0 ? /* @__PURE__ */ o(t, {
+		type: "button",
+		variant: "secondary",
+		size: "small",
+		disabled: !0,
+		children: f
+	}) : /* @__PURE__ */ s("div", {
+		className: n,
+		ref: g,
+		children: [/* @__PURE__ */ s(t, {
+			type: "button",
+			variant: "secondary",
+			size: "small",
+			onClick: () => {
+				h((e) => !e);
+			},
+			"aria-expanded": m,
+			"aria-haspopup": "menu",
+			children: [f, /* @__PURE__ */ o(a, {
+				size: 14,
+				className: e(r, { [i]: m })
+			})]
+		}), m && /* @__PURE__ */ o("div", {
+			className: "_16f61fj3",
+			role: "menu",
+			children: p.map((e) => {
+				let t = null;
+				return typeof e.count == "number" && (t = e.count), /* @__PURE__ */ s(d, {
+					to: e.href,
+					className: "_16f61fj4",
+					onClick: (t) => {
+						h(!1), (e.onClick?.(t))?.catch(() => {});
+					},
+					children: [/* @__PURE__ */ o("span", {
+						className: "_16f61fj5",
+						children: e.label
+					}), t != null && /* @__PURE__ */ o("span", {
+						className: "_16f61fj6",
+						children: t
+					})]
+				}, e.id);
+			})
+		})]
+	});
+};
+//#endregion
+export { f as BackofficeRelationsMenu, f as default };
+
+//# sourceMappingURL=BackofficeRelationsMenu.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficeRelationsMenu.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_relations_menu/BackofficeRelationsMenu.tsx"],"sourcesContent":["import {\n  type JSX,\n  type MouseEvent as ReactMouseEvent,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { Link } from '@plumile/router';\n\nimport { Button, ChevronDownIcon, cx } from '@plumile/ui';\n\nimport * as styles from './backofficeRelationsMenu.css.js';\n\nexport type BackofficeRelationsMenuItem = {\n  id: string;\n  label: string;\n  count?: number | null;\n  href: string;\n  onClick?: (event: ReactMouseEvent<HTMLAnchorElement>) => void | Promise<void>;\n};\n\nexport type BackofficeRelationsMenuProps = {\n  label?: string;\n  items: readonly BackofficeRelationsMenuItem[];\n};\n\nexport const BackofficeRelationsMenu = ({\n  label = 'Relations',\n  items,\n}: BackofficeRelationsMenuProps): JSX.Element => {\n  const [isOpen, setIsOpen] = useState(false);\n  const containerRef = useRef<HTMLDivElement | null>(null);\n\n  useEffect(() => {\n    if (!isOpen) {\n      return undefined;\n    }\n\n    const handleClick = (event: PointerEvent) => {\n      if (!(event.target instanceof Node)) {\n        return;\n      }\n      if (containerRef.current?.contains(event.target)) {\n        return;\n      }\n      setIsOpen(false);\n    };\n\n    document.addEventListener('pointerdown', handleClick);\n    return () => {\n      document.removeEventListener('pointerdown', handleClick);\n    };\n  }, [isOpen]);\n\n  if (items.length === 0) {\n    return (\n      <Button type=\"button\" variant=\"secondary\" size=\"small\" disabled>\n        {label}\n      </Button>\n    );\n  }\n\n  return (\n    <div className={styles.container} ref={containerRef}>\n      <Button\n        type=\"button\"\n        variant=\"secondary\"\n        size=\"small\"\n        onClick={() => {\n          setIsOpen((prev) => {\n            return !prev;\n          });\n        }}\n        aria-expanded={isOpen}\n        aria-haspopup=\"menu\"\n      >\n        {label}\n        <ChevronDownIcon\n          size={14}\n          className={cx(styles.triggerIcon, {\n            [styles.triggerIconOpen]: isOpen,\n          })}\n        />\n      </Button>\n\n      {isOpen && (\n        <div className={styles.menu} role=\"menu\">\n          {items.map((item) => {\n            let countValue: number | null = null;\n            if (typeof item.count === 'number') {\n              countValue = item.count;\n            }\n            return (\n              <Link\n                key={item.id}\n                to={item.href}\n                className={styles.menuItem}\n                onClick={(event: ReactMouseEvent<HTMLAnchorElement>) => {\n                  setIsOpen(false);\n                  const result = item.onClick?.(event);\n                  if (result != null) {\n                    result.catch(() => {});\n                  }\n                }}\n              >\n                <span className={styles.itemLabel}>{item.label}</span>\n                {countValue != null && (\n                  <span className={styles.count}>{countValue}</span>\n                )}\n              </Link>\n            );\n          })}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default BackofficeRelationsMenu;\n"],"mappings":";;;;;;;;;AA0BA,IAAa,KAA2B,EACtC,WAAQ,aACR,eAC+C;CAC/C,IAAM,CAAC,GAAQ,KAAa,EAAS,GAAM,EACrC,IAAe,EAA8B,KAAK;AA+BxD,QA7BA,QAAgB;AACd,MAAI,CAAC,EACH;EAGF,IAAM,KAAe,MAAwB;AACrC,KAAM,kBAAkB,SAG1B,EAAa,SAAS,SAAS,EAAM,OAAO,IAGhD,EAAU,GAAM;;AAIlB,SADA,SAAS,iBAAiB,eAAe,EAAY,QACxC;AACX,YAAS,oBAAoB,eAAe,EAAY;;IAEzD,CAAC,EAAO,CAAC,EAER,EAAM,WAAW,IAEjB,kBAAC,GAAD;EAAQ,MAAK;EAAS,SAAQ;EAAY,MAAK;EAAQ,UAAA;YACpD;EACM,CAAA,GAKX,kBAAC,OAAD;EAAK,WAAW;EAAkB,KAAK;YAAvC,CACE,kBAAC,GAAD;GACE,MAAK;GACL,SAAQ;GACR,MAAK;GACL,eAAe;AACb,OAAW,MACF,CAAC,EACR;;GAEJ,iBAAe;GACf,iBAAc;aAVhB,CAYG,GACD,kBAAC,GAAD;IACE,MAAM;IACN,WAAW,EAAG,GAAoB,GAC/B,IAAyB,GAC3B,CAAC;IACF,CAAA,CACK;MAER,KACC,kBAAC,OAAD;GAAK,WAAW;GAAa,MAAK;aAC/B,EAAM,KAAK,MAAS;IACnB,IAAI,IAA4B;AAIhC,WAHI,OAAO,EAAK,SAAU,aACxB,IAAa,EAAK,QAGlB,kBAAC,GAAD;KAEE,IAAI,EAAK;KACT,WAAW;KACX,UAAU,MAA8C;AAGtD,MAFA,EAAU,GAAM,GACD,EAAK,UAAU,EAAM,GAE3B,YAAY,GAAG;;eAR5B,CAYE,kBAAC,QAAD;MAAM,WAAW;gBAAmB,EAAK;MAAa,CAAA,EACrD,KAAc,QACb,kBAAC,QAAD;MAAM,WAAW;gBAAe;MAAkB,CAAA,CAE/C;OAfA,EAAK,GAeL;KAET;GACE,CAAA,CAEJ"}

package/lib/esm/backoffice/molecules/backoffice_relations_menu/backofficeRelationsMenu.css.js

@@ -0,0 +1,7 @@
+/* empty css                                       */
+//#region src/backoffice/molecules/backoffice_relations_menu/backofficeRelationsMenu.css.ts
+var e = "_16f61fj0", t = "_16f61fj1", n = "_16f61fj2", r = "_16f61fj3", i = "_16f61fj4", a = "_16f61fj5", o = "_16f61fj6";
+//#endregion
+export { e as container, o as count, a as itemLabel, r as menu, i as menuItem, t as triggerIcon, n as triggerIconOpen };
+
+//# sourceMappingURL=backofficeRelationsMenu.css.js.map

package/lib/esm/backoffice/molecules/backoffice_relations_menu/backofficeRelationsMenu.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"backofficeRelationsMenu.css.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_relations_menu/backofficeRelationsMenu.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { vars } from '@plumile/ui/theme/themeContract.js';\n\nexport const container = style({\n  position: 'relative',\n  display: 'inline-flex',\n});\n\nexport const triggerIcon = style({\n  transitionProperty: 'transform',\n  transitionDuration: vars.transitionDuration[150],\n  transitionTimingFunction: vars.transitionTimingFunction.ease,\n});\n\nexport const triggerIconOpen = style({\n  transform: 'rotate(180deg)',\n});\n\nexport const menu = style({\n  position: 'absolute',\n  right: 0,\n  top: vars.spacing.full,\n  marginTop: vars.spacing[2],\n  minWidth: vars.spacing[64],\n  backgroundColor: vars.colors.surface,\n  borderWidth: vars.borderWidth.default,\n  borderStyle: 'solid',\n  borderColor: vars.colors.borderSubtle,\n  borderRadius: vars.borderRadius.lg,\n  boxShadow: vars.boxShadow.md,\n  padding: vars.spacing[2],\n  display: 'flex',\n  flexDirection: 'column',\n  gap: vars.spacing[1],\n  zIndex: vars.zIndex[20],\n});\n\nexport const menuItem = style([\n  {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    gap: vars.spacing[2],\n    paddingTop: vars.spacing[2],\n    paddingBottom: vars.spacing[2],\n    paddingLeft: vars.spacing[3],\n    paddingRight: vars.spacing[3],\n    borderRadius: vars.borderRadius.md,\n    color: vars.colors.text,\n    textDecoration: 'none',\n    fontSize: vars.fontSize.sm,\n    lineHeight: vars.lineHeight.sm,\n  },\n  {\n    selectors: {\n      '&:hover': {\n        backgroundColor: vars.colors.surfaceSecondary,\n      },\n    },\n  },\n]);\n\nexport const itemLabel = style({\n  display: 'flex',\n  alignItems: 'center',\n  gap: vars.spacing[2],\n});\n\nexport const count = style({\n  fontSize: vars.fontSize.xs,\n  lineHeight: vars.lineHeight.xs,\n  color: vars.colors.textMuted,\n});\n"],"mappings":""}

package/lib/esm/backoffice/molecules/backoffice_table_skeleton/BackofficeTableSkeleton.js

@@ -0,0 +1,37 @@
+import { Skeleton as e } from "../../atoms/skeleton/Skeleton.js";
+import { body as t, cell as n, container as r, header as i, headerCell as a, row as o } from "./backofficeTableSkeleton.css.js";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/backoffice/molecules/backoffice_table_skeleton/BackofficeTableSkeleton.tsx
+var l = ({ rows: l = 6, columns: u = 4 }) => {
+	let d = Array.from({ length: u }, (t, n) => /* @__PURE__ */ s("div", {
+		className: a,
+		children: /* @__PURE__ */ s(e, {
+			variant: "text",
+			width: "70%"
+		})
+	}, `header-${n}`)), f = Array.from({ length: l }, (t, r) => /* @__PURE__ */ s("div", {
+		className: o,
+		children: Array.from({ length: u }, (t, i) => /* @__PURE__ */ s("div", {
+			className: n,
+			children: /* @__PURE__ */ s(e, {
+				variant: "text",
+				width: "80%"
+			})
+		}, `cell-${r}-${i}`))
+	}, `row-${r}`));
+	return /* @__PURE__ */ c("div", {
+		className: r,
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ s("div", {
+			className: i,
+			children: d
+		}), /* @__PURE__ */ s("div", {
+			className: t,
+			children: f
+		})]
+	});
+};
+//#endregion
+export { l as BackofficeTableSkeleton, l as default };
+
+//# sourceMappingURL=BackofficeTableSkeleton.js.map

package/lib/esm/backoffice/molecules/backoffice_table_skeleton/BackofficeTableSkeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficeTableSkeleton.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_table_skeleton/BackofficeTableSkeleton.tsx"],"sourcesContent":["import { type JSX } from 'react';\n\nimport { Skeleton } from '../../atoms/skeleton/Skeleton.js';\nimport * as styles from './backofficeTableSkeleton.css.js';\n\nexport type BackofficeTableSkeletonProps = {\n  rows?: number;\n  columns?: number;\n};\n\nexport const BackofficeTableSkeleton = ({\n  rows = 6,\n  columns = 4,\n}: BackofficeTableSkeletonProps): JSX.Element => {\n  const headerCells = Array.from({ length: columns }, (_, index) => {\n    return (\n      <div key={`header-${index}`} className={styles.headerCell}>\n        <Skeleton variant=\"text\" width=\"70%\" />\n      </div>\n    );\n  });\n\n  const bodyRows = Array.from({ length: rows }, (_, rowIndex) => {\n    return (\n      <div key={`row-${rowIndex}`} className={styles.row}>\n        {Array.from({ length: columns }, (_, colIndex) => {\n          return (\n            <div key={`cell-${rowIndex}-${colIndex}`} className={styles.cell}>\n              <Skeleton variant=\"text\" width=\"80%\" />\n            </div>\n          );\n        })}\n      </div>\n    );\n  });\n\n  return (\n    <div className={styles.container} aria-hidden=\"true\">\n      <div className={styles.header}>{headerCells}</div>\n      <div className={styles.body}>{bodyRows}</div>\n    </div>\n  );\n};\n\nexport default BackofficeTableSkeleton;\n"],"mappings":";;;;AAUA,IAAa,KAA2B,EACtC,UAAO,GACP,aAAU,QACqC;CAC/C,IAAM,IAAc,MAAM,KAAK,EAAE,QAAQ,GAAS,GAAG,GAAG,MAEpD,kBAAC,OAAD;EAA6B,WAAW;YACtC,kBAAC,GAAD;GAAU,SAAQ;GAAO,OAAM;GAAQ,CAAA;EACnC,EAFI,UAAU,IAEd,CAER,EAEI,IAAW,MAAM,KAAK,EAAE,QAAQ,GAAM,GAAG,GAAG,MAE9C,kBAAC,OAAD;EAA6B,WAAW;YACrC,MAAM,KAAK,EAAE,QAAQ,GAAS,GAAG,GAAG,MAEjC,kBAAC,OAAD;GAA0C,WAAW;aACnD,kBAAC,GAAD;IAAU,SAAQ;IAAO,OAAM;IAAQ,CAAA;GACnC,EAFI,QAAQ,EAAS,GAAG,IAExB,CAER;EACE,EARI,OAAO,IAQX,CAER;AAEF,QACE,kBAAC,OAAD;EAAK,WAAW;EAAkB,eAAY;YAA9C,CACE,kBAAC,OAAD;GAAK,WAAW;aAAgB;GAAkB,CAAA,EAClD,kBAAC,OAAD;GAAK,WAAW;aAAc;GAAe,CAAA,CACzC"}

package/lib/esm/backoffice/molecules/backoffice_table_skeleton/backofficeTableSkeleton.css.js

@@ -0,0 +1,8 @@
+/* empty css                                      */
+/* empty css                                       */
+//#region src/backoffice/molecules/backoffice_table_skeleton/backofficeTableSkeleton.css.ts
+var e = "_597for0 txvbqb9io txvbqbai6 txvbqb1ro txvbqb1co txvbqb1qf txvbqbwo txvbqbl6f", t = "_597for1 txvbqb9ix txvbqbbyx txvbqbao6 txvbqbla6 txvbqbv2t txvbqb12f txvbqb1qf txvbqb62o txvbqb3nx", n = "_597for2 txvbqb9io txvbqbco", r = "_597for3 txvbqb9io txvbqbai6 txvbqbao6 txvbqbla6", i = "_597for4 txvbqb9ix txvbqbbyx txvbqbao6", a = "_597for5 txvbqb9io txvbqbco";
+//#endregion
+export { r as body, a as cell, e as container, t as header, n as headerCell, i as row };
+
+//# sourceMappingURL=backofficeTableSkeleton.css.js.map

package/lib/esm/backoffice/molecules/backoffice_table_skeleton/backofficeTableSkeleton.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"backofficeTableSkeleton.css.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_table_skeleton/backofficeTableSkeleton.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const container = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  borderRadius: 'lg',\n  borderWidth: 'default',\n  borderStyle: 'solid',\n  borderColor: 'borderSubtle',\n  overflow: 'hidden',\n});\n\nexport const header = sprinkles({\n  display: 'grid',\n  gridTemplateColumns: 'autoFitMinmax0',\n  gap: 2,\n  padding: 3,\n  backgroundColor: 'surfaceSecondary',\n  borderWidth: 0,\n  borderStyle: 'solid',\n  borderBottomWidth: 'default',\n  borderBottomColor: 'borderSubtle',\n});\n\nexport const headerCell = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n});\n\nexport const body = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 2,\n  padding: 3,\n});\n\nexport const row = sprinkles({\n  display: 'grid',\n  gridTemplateColumns: 'autoFitMinmax0',\n  gap: 2,\n});\n\nexport const cell = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n});\n"],"mappings":""}

package/lib/esm/backoffice/molecules/backoffice_table_toolbar/BackofficeTableToolbar.js

@@ -0,0 +1,32 @@
+import { cx as e } from "../../../theme/tools.js";
+import { container as t } from "./backofficeTableToolbar.css.js";
+import "../../../index.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/backoffice/molecules/backoffice_table_toolbar/BackofficeTableToolbar.tsx
+var i = ({ searchSlot: i, filtersSlot: a, sortSlot: o, refreshSlot: s, ctaSlot: c, chipsSlot: l, className: u }) => {
+	let d = i != null || a != null || o != null || s != null || c != null, f = l != null;
+	return !d && !f ? null : /* @__PURE__ */ r("div", {
+		className: e(t, u),
+		children: [d && /* @__PURE__ */ r("div", {
+			className: "p4hwvs1",
+			children: [/* @__PURE__ */ r("div", {
+				className: "p4hwvs2",
+				children: [
+					i,
+					a,
+					o
+				]
+			}), /* @__PURE__ */ r("div", {
+				className: "p4hwvs3",
+				children: [s, c]
+			})]
+		}), f && /* @__PURE__ */ n("div", {
+			className: "p4hwvs4",
+			children: l
+		})]
+	});
+};
+//#endregion
+export { i as BackofficeTableToolbar, i as default };
+
+//# sourceMappingURL=BackofficeTableToolbar.js.map

package/lib/esm/backoffice/molecules/backoffice_table_toolbar/BackofficeTableToolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficeTableToolbar.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_table_toolbar/BackofficeTableToolbar.tsx"],"sourcesContent":["import { type JSX, type ReactNode } from 'react';\n\nimport { cx } from '@plumile/ui';\n\nimport * as styles from './backofficeTableToolbar.css.js';\n\nexport type BackofficeTableToolbarProps = {\n  searchSlot?: ReactNode;\n  filtersSlot?: ReactNode;\n  sortSlot?: ReactNode;\n  refreshSlot?: ReactNode;\n  ctaSlot?: ReactNode;\n  chipsSlot?: ReactNode;\n  className?: string;\n};\n\nexport const BackofficeTableToolbar = ({\n  searchSlot,\n  filtersSlot,\n  sortSlot,\n  refreshSlot,\n  ctaSlot,\n  chipsSlot,\n  className,\n}: BackofficeTableToolbarProps): JSX.Element | null => {\n  const showTop =\n    searchSlot != null ||\n    filtersSlot != null ||\n    sortSlot != null ||\n    refreshSlot != null ||\n    ctaSlot != null;\n\n  const showChips = chipsSlot != null;\n\n  if (!showTop && !showChips) {\n    return null;\n  }\n\n  return (\n    <div className={cx(styles.container, className)}>\n      {showTop && (\n        <div className={styles.topRow}>\n          <div className={styles.left}>\n            {searchSlot}\n            {filtersSlot}\n            {sortSlot}\n          </div>\n          <div className={styles.right}>\n            {refreshSlot}\n            {ctaSlot}\n          </div>\n        </div>\n      )}\n      {showChips && <div className={styles.chipsRow}>{chipsSlot}</div>}\n    </div>\n  );\n};\n\nexport default BackofficeTableToolbar;\n"],"mappings":";;;;;AAgBA,IAAa,KAA0B,EACrC,eACA,gBACA,aACA,gBACA,YACA,cACA,mBACqD;CACrD,IAAM,IACJ,KAAc,QACd,KAAe,QACf,KAAY,QACZ,KAAe,QACf,KAAW,MAEP,IAAY,KAAa;AAM/B,QAJI,CAAC,KAAW,CAAC,IACR,OAIP,kBAAC,OAAD;EAAK,WAAW,EAAG,GAAkB,EAAU;YAA/C,CACG,KACC,kBAAC,OAAD;GAAK,WAAW;aAAhB,CACE,kBAAC,OAAD;IAAK,WAAW;cAAhB;KACG;KACA;KACA;KACG;OACN,kBAAC,OAAD;IAAK,WAAW;cAAhB,CACG,GACA,EACG;MACF;MAEP,KAAa,kBAAC,OAAD;GAAK,WAAW;aAAkB;GAAgB,CAAA,CAC5D"}

package/lib/esm/backoffice/molecules/backoffice_table_toolbar/backofficeTableToolbar.css.js

@@ -0,0 +1,7 @@
+/* empty css                                      */
+//#region src/backoffice/molecules/backoffice_table_toolbar/backofficeTableToolbar.css.ts
+var e = "p4hwvs0", t = "p4hwvs1", n = "p4hwvs2", r = "p4hwvs3", i = "p4hwvs4";
+//#endregion
+export { i as chipsRow, e as container, n as left, r as right, t as topRow };
+
+//# sourceMappingURL=backofficeTableToolbar.css.js.map

package/lib/esm/backoffice/molecules/backoffice_table_toolbar/backofficeTableToolbar.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"backofficeTableToolbar.css.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_table_toolbar/backofficeTableToolbar.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { vars } from '@plumile/ui/theme/themeContract.js';\nimport { screens } from '@plumile/ui/theme/common.js';\n\nexport const container = style({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: vars.spacing[3],\n  width: '100%',\n});\n\nexport const topRow = style({\n  display: 'flex',\n  justifyContent: 'space-between',\n  gap: vars.spacing[3],\n  flexWrap: 'wrap',\n  alignItems: 'center',\n  '@media': {\n    [screens.sm]: {\n      alignItems: 'stretch',\n      flexDirection: 'column',\n    },\n  },\n});\n\nexport const left = style({\n  display: 'flex',\n  alignItems: 'center',\n  gap: vars.spacing[2],\n  flexWrap: 'wrap',\n  minWidth: 0,\n  flex: 1,\n});\n\nexport const right = style({\n  display: 'flex',\n  alignItems: 'center',\n  gap: vars.spacing[2],\n  flexWrap: 'wrap',\n});\n\nexport const chipsRow = style({\n  display: 'flex',\n  alignItems: 'center',\n  flexWrap: 'wrap',\n  gap: vars.spacing[2],\n  paddingTop: vars.spacing[2],\n  borderTopWidth: vars.borderWidth.px,\n  borderTopStyle: 'solid',\n  borderTopColor: vars.colors.borderSubtle,\n});\n"],"mappings":""}

package/lib/esm/backoffice/molecules/backoffice_tabs/BackofficeTabs.js

@@ -0,0 +1,31 @@
+import { cx as e } from "../../../theme/tools.js";
+import { active as t, tab as n, tabs as r } from "./backofficeTabs.css.js";
+import "../../../index.js";
+import { jsx as i } from "react/jsx-runtime";
+import { Link as a } from "@plumile/router";
+//#region src/backoffice/molecules/backoffice_tabs/BackofficeTabs.tsx
+var o = ({ items: o, activeId: s, onChange: c, className: l }) => o.length === 0 ? null : /* @__PURE__ */ i("div", {
+	className: e(r, l),
+	role: "tablist",
+	children: o.map((r) => {
+		let o = r.id === s, l = e(n, { [t]: o });
+		return r.to == null ? /* @__PURE__ */ i("button", {
+			type: "button",
+			role: "tab",
+			"aria-selected": o,
+			className: l,
+			onClick: () => {
+				c(r.id);
+			},
+			children: r.label
+		}, r.id) : /* @__PURE__ */ i(a, {
+			to: r.to,
+			className: l,
+			children: r.label
+		}, r.id);
+	})
+});
+//#endregion
+export { o as BackofficeTabs, o as default };
+
+//# sourceMappingURL=BackofficeTabs.js.map

package/lib/esm/backoffice/molecules/backoffice_tabs/BackofficeTabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficeTabs.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_tabs/BackofficeTabs.tsx"],"sourcesContent":["import { Link } from '@plumile/router';\nimport { type ComponentPropsWithoutRef, type JSX, type ReactNode } from 'react';\n\nimport * as styles from './backofficeTabs.css.js';\nimport { cx } from '@plumile/ui';\n\nexport type BackofficeTabItem = {\n  id: string;\n  label: ReactNode;\n  to?: ComponentPropsWithoutRef<typeof Link>['to'];\n};\n\nexport type BackofficeTabsProps = {\n  items: readonly BackofficeTabItem[];\n  activeId: string;\n  onChange: (id: string) => void;\n  className?: string;\n};\n\nexport const BackofficeTabs = ({\n  items,\n  activeId,\n  onChange,\n  className,\n}: BackofficeTabsProps): JSX.Element | null => {\n  if (items.length === 0) {\n    return null;\n  }\n\n  return (\n    <div className={cx(styles.tabs, className)} role=\"tablist\">\n      {items.map((tab) => {\n        const isActive = tab.id === activeId;\n        const tabClassName = cx(styles.tab, { [styles.active]: isActive });\n        if (tab.to != null) {\n          return (\n            <Link key={tab.id} to={tab.to} className={tabClassName}>\n              {tab.label}\n            </Link>\n          );\n        }\n        return (\n          <button\n            key={tab.id}\n            type=\"button\"\n            role=\"tab\"\n            aria-selected={isActive}\n            className={tabClassName}\n            onClick={() => {\n              onChange(tab.id);\n            }}\n          >\n            {tab.label}\n          </button>\n        );\n      })}\n    </div>\n  );\n};\n\nexport default BackofficeTabs;\n"],"mappings":";;;;;;AAmBA,IAAa,KAAkB,EAC7B,UACA,aACA,aACA,mBAEI,EAAM,WAAW,IACZ,OAIP,kBAAC,OAAD;CAAK,WAAW,EAAG,GAAa,EAAU;CAAE,MAAK;WAC9C,EAAM,KAAK,MAAQ;EAClB,IAAM,IAAW,EAAI,OAAO,GACtB,IAAe,EAAG,GAAY,GAAG,IAAgB,GAAU,CAAC;AAQlE,SAPI,EAAI,MAAM,OAQZ,kBAAC,UAAD;GAEE,MAAK;GACL,MAAK;GACL,iBAAe;GACf,WAAW;GACX,eAAe;AACb,MAAS,EAAI,GAAG;;aAGjB,EAAI;GACE,EAVF,EAAI,GAUF,GAjBP,kBAAC,GAAD;GAAmB,IAAI,EAAI;GAAI,WAAW;aACvC,EAAI;GACA,EAFI,EAAI,GAER;GAiBX;CACE,CAAA"}

package/lib/esm/backoffice/molecules/backoffice_tabs/backofficeTabs.css.js

@@ -0,0 +1,8 @@
+/* empty css                                      */
+/* empty css                              */
+//#region src/backoffice/molecules/backoffice_tabs/backofficeTabs.css.ts
+var e = "_4p4jiq0 txvbqb9jf txvbqbajx txvbqbanx txvbqbl9o txvbqb1t6 txvbqbv2v txvbqb1co txvbqb1qf txvbqbwo", t = "_4p4jiq2 _4p4jiq1 txvbqbnv6 txvbqboif txvbqbpqx txvbqbmio txvbqb9jf txvbqbco txvbqb1t6 txvbqb8x txvbqbamf txvbqb1co txvbqb1qf txvbqbf6 txvbqbuzj txvbqbv8r txvbqbv", n = "_4p4jiq3 txvbqbv2r txvbqbwo txvbqbv8p txvbqb8pf";
+//#endregion
+export { n as active, t as tab, e as tabs };
+
+//# sourceMappingURL=backofficeTabs.css.js.map

package/lib/esm/backoffice/molecules/backoffice_tabs/backofficeTabs.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"backofficeTabs.css.js","names":[],"sources":["../../../../../src/backoffice/molecules/backoffice_tabs/backofficeTabs.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { vars } from '@plumile/ui/theme/themeContract.js';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const tabs = sprinkles({\n  display: 'inline-flex',\n  flexWrap: 'wrap',\n  gap: 1,\n  padding: 1,\n  borderRadius: 'full',\n  backgroundColor: 'surfaceMuted',\n  borderWidth: 'default',\n  borderStyle: 'solid',\n  borderColor: 'borderSubtle',\n});\n\nexport const tab = style([\n  sprinkles({\n    display: 'inline-flex',\n    alignItems: 'center',\n    paddingX: 3,\n    paddingY: 1.5,\n    borderRadius: 'full',\n    fontSize: 'sm',\n    fontWeight: 'medium',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'transparent',\n    backgroundColor: 'transparent',\n    color: 'textSecondary',\n    cursor: 'pointer',\n  }),\n  {\n    selectors: {\n      '&:hover': {\n        color: vars.colors.text,\n        backgroundColor: vars.colors.surface,\n      },\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors['blue-500']}`,\n        outlineOffset: 2,\n      },\n    },\n  },\n]);\n\nexport const active = sprinkles({\n  backgroundColor: 'surface',\n  borderColor: 'borderSubtle',\n  color: 'text',\n  boxShadow: 'sm',\n});\n"],"mappings":""}

package/lib/esm/backoffice/molecules/bulk_actions_bar/BulkActionsBar.js

@@ -0,0 +1,31 @@
+import { cx as e } from "../../../theme/tools.js";
+import { Button as t } from "../../../atomic/atoms/button/Button.js";
+import { bar as n, left as r, right as i } from "./bulkActionsBar.css.js";
+import "../../../index.js";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/backoffice/molecules/bulk_actions_bar/BulkActionsBar.tsx
+var s = ({ selectedCount: s, label: c = (e) => `${e} selected`, actions: l, onClearSelection: u, clearLabel: d = "Clear", className: f }) => {
+	if (s <= 0) return null;
+	let p = null;
+	return u != null && (p = /* @__PURE__ */ a(t, {
+		type: "button",
+		variant: "secondary",
+		size: "small",
+		onClick: u,
+		children: d
+	})), /* @__PURE__ */ o("div", {
+		className: e(n, f),
+		role: "status",
+		children: [/* @__PURE__ */ a("div", {
+			className: r,
+			children: c(s)
+		}), /* @__PURE__ */ o("div", {
+			className: i,
+			children: [l, p]
+		})]
+	});
+};
+//#endregion
+export { s as BulkActionsBar, s as default };
+
+//# sourceMappingURL=BulkActionsBar.js.map

package/lib/esm/backoffice/molecules/bulk_actions_bar/BulkActionsBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BulkActionsBar.js","names":[],"sources":["../../../../../src/backoffice/molecules/bulk_actions_bar/BulkActionsBar.tsx"],"sourcesContent":["import { type JSX, type ReactNode } from 'react';\n\nimport { Button, cx } from '@plumile/ui';\n\nimport * as styles from './bulkActionsBar.css.js';\n\nexport type BulkActionsBarProps = {\n  selectedCount: number;\n  label?: (count: number) => ReactNode;\n  actions?: ReactNode;\n  onClearSelection?: () => void;\n  clearLabel?: string;\n  className?: string;\n};\n\nexport const BulkActionsBar = ({\n  selectedCount,\n  label = (count) => {\n    return `${count} selected`;\n  },\n  actions,\n  onClearSelection,\n  clearLabel = 'Clear',\n  className,\n}: BulkActionsBarProps): JSX.Element | null => {\n  if (selectedCount <= 0) {\n    return null;\n  }\n\n  let clearButtonNode: JSX.Element | null = null;\n  if (onClearSelection != null) {\n    clearButtonNode = (\n      <Button\n        type=\"button\"\n        variant=\"secondary\"\n        size=\"small\"\n        onClick={onClearSelection}\n      >\n        {clearLabel}\n      </Button>\n    );\n  }\n\n  return (\n    <div className={cx(styles.bar, className)} role=\"status\">\n      <div className={styles.left}>{label(selectedCount)}</div>\n      <div className={styles.right}>\n        {actions}\n        {clearButtonNode}\n      </div>\n    </div>\n  );\n};\n\nexport default BulkActionsBar;\n"],"mappings":";;;;;;AAeA,IAAa,KAAkB,EAC7B,kBACA,YAAS,MACA,GAAG,EAAM,YAElB,YACA,qBACA,gBAAa,SACb,mBAC6C;AAC7C,KAAI,KAAiB,EACnB,QAAO;CAGT,IAAI,IAAsC;AAc1C,QAbI,KAAoB,SACtB,IACE,kBAAC,GAAD;EACE,MAAK;EACL,SAAQ;EACR,MAAK;EACL,SAAS;YAER;EACM,CAAA,GAKX,kBAAC,OAAD;EAAK,WAAW,EAAG,GAAY,EAAU;EAAE,MAAK;YAAhD,CACE,kBAAC,OAAD;GAAK,WAAW;aAAc,EAAM,EAAc;GAAO,CAAA,EACzD,kBAAC,OAAD;GAAK,WAAW;aAAhB,CACG,GACA,EACG;KACF"}

package/lib/esm/backoffice/molecules/bulk_actions_bar/bulkActionsBar.css.js

@@ -0,0 +1,8 @@
+/* empty css                                      */
+/* empty css                              */
+//#region src/backoffice/molecules/bulk_actions_bar/bulkActionsBar.css.ts
+var e = "ndiqkc0 txvbqbnvf txvbqboio txvbqbp5o txvbqblxf txvbqb9io txvbqbco txvbqbdoo txvbqbaof txvbqb1ro txvbqb1co txvbqb1qf txvbqbwf", t = "ndiqkc1 txvbqb9jf txvbqbco txvbqbao6 txvbqb8x", n = "ndiqkc2 txvbqb9jf txvbqbco txvbqbao6";
+//#endregion
+export { e as bar, t as left, n as right };
+
+//# sourceMappingURL=bulkActionsBar.css.js.map

package/lib/esm/backoffice/molecules/bulk_actions_bar/bulkActionsBar.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bulkActionsBar.css.js","names":[],"sources":["../../../../../src/backoffice/molecules/bulk_actions_bar/bulkActionsBar.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const bar = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  gap: 3,\n  paddingX: 4,\n  paddingY: 3,\n  borderRadius: 'lg',\n  borderWidth: 'default',\n  borderStyle: 'solid',\n  borderColor: 'border',\n});\n\nexport const left = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: 2,\n  fontSize: 'sm',\n});\n\nexport const right = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: 2,\n});\n"],"mappings":""}

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

@@ -0,0 +1,62 @@
+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";
+//#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(() => {
+		v || (x(null), h());
+	}, [v, h]), C = s(async () => {
+		if (!v) {
+			x(null), y(!0);
+			try {
+				await g(), _ && h();
+			} catch (e) {
+				let t = "An unexpected error occurred.";
+				e instanceof Error && (t = e.message), x(t);
+			} finally {
+				y(!1);
+			}
+		}
+	}, [
+		_,
+		v,
+		h,
+		g
+	]), w = "primary";
+	m === "danger" && (w = "danger");
+	let T = /* @__PURE__ */ o("div", {
+		className: i,
+		children: [/* @__PURE__ */ a(e, {
+			type: "button",
+			variant: "secondary",
+			onClick: S,
+			disabled: v,
+			children: p
+		}), /* @__PURE__ */ a(e, {
+			type: "button",
+			variant: w,
+			onClick: () => {
+				C().catch(() => {});
+			},
+			isLoading: v,
+			children: f
+		})]
+	}), E = null;
+	return b != null && (E = /* @__PURE__ */ a(t, { children: b })), /* @__PURE__ */ a(n, {
+		isOpen: l,
+		onClose: S,
+		title: u,
+		footer: T,
+		children: /* @__PURE__ */ o("div", {
+			className: r,
+			children: [E, d]
+		})
+	});
+};
+//#endregion
+export { l as ConfirmDialog, l as default };
+
+//# sourceMappingURL=ConfirmDialog.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ConfirmDialog.js","names":[],"sources":["../../../../../src/backoffice/molecules/confirm_dialog/ConfirmDialog.tsx"],"sourcesContent":["import { useCallback, useState, type JSX, type ReactNode } from 'react';\n\nimport { Button } from '../../../atomic/atoms/button/Button.js';\nimport { ErrorMessage } from '../../../atomic/atoms/error_message/ErrorMessage.js';\nimport { Modal } from '../../../atomic/atoms/modal/Modal.js';\n\nimport * as styles from './confirmDialog.css.js';\n\nexport type ConfirmDialogProps = {\n  isOpen: boolean;\n  title: string;\n  children: ReactNode;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  confirmTone?: 'default' | 'danger';\n  onClose: () => void;\n  onConfirm: () => Promise<void> | void;\n  closeOnConfirm?: boolean;\n};\n\nexport const ConfirmDialog = ({\n  isOpen,\n  title,\n  children,\n  confirmLabel = 'Confirm',\n  cancelLabel = 'Cancel',\n  confirmTone = 'default',\n  onClose,\n  onConfirm,\n  closeOnConfirm = true,\n}: ConfirmDialogProps): JSX.Element | null => {\n  const [isConfirming, setIsConfirming] = useState(false);\n  const [error, setError] = useState<string | null>(null);\n\n  const handleClose = useCallback(() => {\n    if (isConfirming) {\n      return;\n    }\n    setError(null);\n    onClose();\n  }, [isConfirming, onClose]);\n\n  const handleConfirm = useCallback(async () => {\n    if (isConfirming) {\n      return;\n    }\n    setError(null);\n    setIsConfirming(true);\n    try {\n      await onConfirm();\n      if (closeOnConfirm) {\n        onClose();\n      }\n    } catch (err) {\n      let message = 'An unexpected error occurred.';\n      if (err instanceof Error) {\n        message = err.message;\n      }\n      setError(message);\n    } finally {\n      setIsConfirming(false);\n    }\n  }, [closeOnConfirm, isConfirming, onClose, onConfirm]);\n\n  let confirmVariant: 'primary' | 'danger' = 'primary';\n  if (confirmTone === 'danger') {\n    confirmVariant = 'danger';\n  }\n\n  const handleConfirmClick = () => {\n    handleConfirm().catch(() => {});\n  };\n\n  const footer = (\n    <div className={styles.footer}>\n      <Button\n        type=\"button\"\n        variant=\"secondary\"\n        onClick={handleClose}\n        disabled={isConfirming}\n      >\n        {cancelLabel}\n      </Button>\n      <Button\n        type=\"button\"\n        variant={confirmVariant}\n        onClick={handleConfirmClick}\n        isLoading={isConfirming}\n      >\n        {confirmLabel}\n      </Button>\n    </div>\n  );\n\n  let errorNode: JSX.Element | null = null;\n  if (error != null) {\n    errorNode = <ErrorMessage>{error}</ErrorMessage>;\n  }\n\n  return (\n    <Modal isOpen={isOpen} onClose={handleClose} title={title} footer={footer}>\n      <div className={styles.body}>\n        {errorNode}\n        {children}\n      </div>\n    </Modal>\n  );\n};\n\nexport default ConfirmDialog;\n"],"mappings":";;;;;;;AAoBA,IAAa,KAAiB,EAC5B,WACA,UACA,aACA,kBAAe,WACf,iBAAc,UACd,iBAAc,WACd,YACA,cACA,oBAAiB,SAC2B;CAC5C,IAAM,CAAC,GAAc,KAAmB,EAAS,GAAM,EACjD,CAAC,GAAO,KAAY,EAAwB,KAAK,EAEjD,IAAc,QAAkB;AAChC,QAGJ,EAAS,KAAK,EACd,GAAS;IACR,CAAC,GAAc,EAAQ,CAAC,EAErB,IAAgB,EAAY,YAAY;AACxC,UAIJ;GADA,EAAS,KAAK,EACd,EAAgB,GAAK;AACrB,OAAI;AAEF,IADA,MAAM,GAAW,EACb,KACF,GAAS;YAEJ,GAAK;IACZ,IAAI,IAAU;AAId,IAHI,aAAe,UACjB,IAAU,EAAI,UAEhB,EAAS,EAAQ;aACT;AACR,MAAgB,GAAM;;;IAEvB;EAAC;EAAgB;EAAc;EAAS;EAAU,CAAC,EAElD,IAAuC;AAC3C,CAAI,MAAgB,aAClB,IAAiB;CAOnB,IAAM,IACJ,kBAAC,OAAD;EAAK,WAAW;YAAhB,CACE,kBAAC,GAAD;GACE,MAAK;GACL,SAAQ;GACR,SAAS;GACT,UAAU;aAET;GACM,CAAA,EACT,kBAAC,GAAD;GACE,MAAK;GACL,SAAS;GACT,eAjB2B;AAC/B,OAAe,CAAC,YAAY,GAAG;;GAiB3B,WAAW;aAEV;GACM,CAAA,CACL;KAGJ,IAAgC;AAKpC,QAJI,KAAS,SACX,IAAY,kBAAC,GAAD,EAAA,UAAe,GAAqB,CAAA,GAIhD,kBAAC,GAAD;EAAe;EAAQ,SAAS;EAAoB;EAAe,QAAA;YACjE,kBAAC,OAAD;GAAK,WAAW;aAAhB,CACG,GACA,EACG;;EACA,CAAA"}

package/lib/esm/backoffice/molecules/confirm_dialog/confirmDialog.css.js

@@ -0,0 +1,8 @@
+/* empty css                                      */
+/* empty css                             */
+//#region src/backoffice/molecules/confirm_dialog/confirmDialog.css.ts
+var e = "_1lxq4iv0 txvbqb9io txvbqbai6 txvbqbaof", t = "_1lxq4iv1 txvbqb9io txvbqbdo6 txvbqbaof";
+//#endregion
+export { e as body, t as footer };
+
+//# sourceMappingURL=confirmDialog.css.js.map

package/lib/esm/backoffice/molecules/confirm_dialog/confirmDialog.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"confirmDialog.css.js","names":[],"sources":["../../../../../src/backoffice/molecules/confirm_dialog/confirmDialog.css.ts"],"sourcesContent":["import { sprinkles } from '../../../theme/sprinkles.css.js';\n\nexport const body = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n});\n\nexport const footer = sprinkles({\n  display: 'flex',\n  justifyContent: 'flex-end',\n  gap: 3,\n});\n"],"mappings":""}

package/lib/esm/backoffice/molecules/filter_chip_row/FilterChipRow.js

@@ -0,0 +1,30 @@
+import { cx as e } from "../../../theme/tools.js";
+import { Button as t } from "../../../atomic/atoms/button/Button.js";
+import { Tag as n } from "../../atoms/tag/Tag.js";
+import { row as r } from "./filterChipRow.css.js";
+import "../../../index.js";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/backoffice/molecules/filter_chip_row/FilterChipRow.tsx
+var o = ({ chips: o, onClearAll: s, clearAllLabel: c = "Clear all", className: l }) => {
+	if (o.length === 0) return null;
+	let u = null;
+	return s != null && (u = /* @__PURE__ */ i(t, {
+		type: "button",
+		size: "small",
+		variant: "text",
+		onClick: s,
+		children: c
+	})), /* @__PURE__ */ a("div", {
+		className: e(r, l),
+		children: [o.map((e) => /* @__PURE__ */ i(n, {
+			tone: "neutral",
+			onRemove: e.onRemove,
+			removeLabel: "Remove filter",
+			children: e.label
+		}, e.id)), u]
+	});
+};
+//#endregion
+export { o as FilterChipRow, o as default };
+
+//# sourceMappingURL=FilterChipRow.js.map