@plumile/backoffice-react 0.1.109 → 0.1.113

package/lib/esm/components/backoffice/detail/backofficeDetailSection.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficeDetailSection.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeDetailSection.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui';\n\nexport const section = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n  padding: 3,\n  borderRadius: 'md',\n  backgroundColor: 'surfaceSecondary',\n  borderWidth: 'default',\n  borderStyle: 'solid',\n  borderColor: 'borderLight',\n  boxShadow: 'none',\n});\n\nexport const header = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n});\n\nexport const title = sprinkles({\n  fontSize: 'base',\n  fontWeight: 'semibold',\n  color: 'text',\n});\n\nexport const description = sprinkles({\n  fontSize: 'sm',\n  color: 'textSecondary',\n});\n\nexport const grid = sprinkles({\n  display: 'grid',\n  gap: 3,\n  gridTemplateColumns: 'autoFitMinmax220',\n});\n"],"mappings":""}
+{"version":3,"file":"backofficeDetailSection.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeDetailSection.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const section = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n  padding: 3,\n  borderRadius: 'md',\n  backgroundColor: 'surfaceSecondary',\n  borderWidth: 'default',\n  borderStyle: 'solid',\n  borderColor: 'borderLight',\n  boxShadow: 'none',\n});\n\nexport const header = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n});\n\nexport const title = sprinkles({\n  fontSize: 'base',\n  fontWeight: 'semibold',\n  color: 'text',\n});\n\nexport const description = sprinkles({\n  fontSize: 'sm',\n  color: 'textSecondary',\n});\n\nexport const grid = sprinkles({\n  display: 'grid',\n  gap: 3,\n  gridTemplateColumns: 'autoFitMinmax220',\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/detail/backofficeDetailTaggedValue.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficeDetailTaggedValue.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeDetailTaggedValue.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui';\n\nexport const container = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: 2,\n  flexWrap: 'wrap',\n});\n\nexport const value = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: 1,\n});\n"],"mappings":""}
+{"version":3,"file":"backofficeDetailTaggedValue.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeDetailTaggedValue.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const container = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: 2,\n  flexWrap: 'wrap',\n});\n\nexport const value = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: 1,\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/detail/backofficeEntitySummaryHeader.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficeEntitySummaryHeader.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeEntitySummaryHeader.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui';\n\nexport const root = style([\n  sprinkles({\n    display: 'flex',\n    flexDirection: 'column',\n    gap: 4,\n    padding: 4,\n    borderRadius: 'lg',\n    backgroundColor: 'surface',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'borderLight',\n  }),\n]);\n\nexport const top = sprinkles({\n  display: 'flex',\n  justifyContent: 'space-between',\n  alignItems: 'flex-start',\n  gap: 4,\n  flexWrap: 'wrap',\n});\n\nexport const identity = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 2,\n  minWidth: 0,\n});\n\nexport const titleRow = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  gap: 2,\n  flexWrap: 'wrap',\n});\n\nexport const title = sprinkles({\n  fontSize: '2xl',\n  lineHeight: 'tight',\n  fontWeight: 'semibold',\n  color: 'text',\n  overflowWrap: 'anywhere',\n});\n\nexport const subtitle = sprinkles({\n  fontSize: 'sm',\n  color: 'textSecondary',\n  overflowWrap: 'anywhere',\n});\n\nexport const actions = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'flex-end',\n  gap: 2,\n  flexWrap: 'wrap',\n});\n\nexport const meta = sprinkles({\n  display: 'grid',\n  gap: 3,\n  gridTemplateColumns: 'autoFitMinmax180',\n});\n\nexport const metaItem = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n  minWidth: 0,\n});\n\nexport const metaLabel = sprinkles({\n  fontSize: 'xs',\n  textTransform: 'uppercase',\n  letterSpacing: 'capsTight',\n  color: 'textSecondary',\n});\n\nexport const metaValue = sprinkles({\n  fontSize: 'sm',\n  color: 'text',\n  overflowWrap: 'anywhere',\n});\n"],"mappings":""}
+{"version":3,"file":"backofficeEntitySummaryHeader.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeEntitySummaryHeader.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const root = style([\n  sprinkles({\n    display: 'flex',\n    flexDirection: 'column',\n    gap: 4,\n    padding: 4,\n    borderRadius: 'lg',\n    backgroundColor: 'surface',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'borderLight',\n  }),\n]);\n\nexport const top = sprinkles({\n  display: 'flex',\n  justifyContent: 'space-between',\n  alignItems: 'flex-start',\n  gap: 4,\n  flexWrap: 'wrap',\n});\n\nexport const identity = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 2,\n  minWidth: 0,\n});\n\nexport const titleRow = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  gap: 2,\n  flexWrap: 'wrap',\n});\n\nexport const title = sprinkles({\n  fontSize: '2xl',\n  lineHeight: 'tight',\n  fontWeight: 'semibold',\n  color: 'text',\n  overflowWrap: 'anywhere',\n});\n\nexport const subtitle = sprinkles({\n  fontSize: 'sm',\n  color: 'textSecondary',\n  overflowWrap: 'anywhere',\n});\n\nexport const actions = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'flex-end',\n  gap: 2,\n  flexWrap: 'wrap',\n});\n\nexport const meta = sprinkles({\n  display: 'grid',\n  gap: 3,\n  gridTemplateColumns: 'autoFitMinmax180',\n});\n\nexport const metaItem = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n  minWidth: 0,\n});\n\nexport const metaLabel = sprinkles({\n  fontSize: 'xs',\n  textTransform: 'uppercase',\n  letterSpacing: 'capsTight',\n  color: 'textSecondary',\n});\n\nexport const metaValue = sprinkles({\n  fontSize: 'sm',\n  color: 'text',\n  overflowWrap: 'anywhere',\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/detail/backofficeKpiStrip.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficeKpiStrip.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeKpiStrip.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui';\n\nexport const group = sprinkles({\n  display: 'grid',\n  gap: 3,\n  gridTemplateColumns: 'autoFitMinmax180',\n});\n\nexport const compactGroup = sprinkles({\n  gap: 2,\n});\n\nexport const card = style({\n  minWidth: 0,\n});\n\nexport const value = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  gap: 2,\n});\n"],"mappings":""}
+{"version":3,"file":"backofficeKpiStrip.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeKpiStrip.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const group = sprinkles({\n  display: 'grid',\n  gap: 3,\n  gridTemplateColumns: 'autoFitMinmax180',\n});\n\nexport const compactGroup = sprinkles({\n  gap: 2,\n});\n\nexport const card = style({\n  minWidth: 0,\n});\n\nexport const value = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  gap: 2,\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/detail/backofficeLifecycleTimelineSection.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficeLifecycleTimelineSection.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeLifecycleTimelineSection.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui';\n\nexport const eventMeta = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n});\n\nexport const actor = sprinkles({\n  color: 'textSecondary',\n});\n"],"mappings":""}
+{"version":3,"file":"backofficeLifecycleTimelineSection.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeLifecycleTimelineSection.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const eventMeta = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n});\n\nexport const actor = sprinkles({\n  color: 'textSecondary',\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/detail/backofficePayloadInspectorSection.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficePayloadInspectorSection.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficePayloadInspectorSection.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui';\n\nexport const details = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n});\n\nexport const summary = style([\n  sprinkles({\n    cursor: 'pointer',\n    fontSize: 'sm',\n    fontWeight: 'medium',\n    color: 'primary',\n  }),\n]);\n\nexport const preview = sprinkles({\n  fontSize: 'sm',\n  color: 'textSecondary',\n  overflowWrap: 'anywhere',\n});\n"],"mappings":""}
+{"version":3,"file":"backofficePayloadInspectorSection.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficePayloadInspectorSection.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const details = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n});\n\nexport const summary = style([\n  sprinkles({\n    cursor: 'pointer',\n    fontSize: 'sm',\n    fontWeight: 'medium',\n    color: 'primary',\n  }),\n]);\n\nexport const preview = sprinkles({\n  fontSize: 'sm',\n  color: 'textSecondary',\n  overflowWrap: 'anywhere',\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/detail/backofficeReferenceValue.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficeReferenceValue.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeReferenceValue.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui';\n\nexport const root = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: 2,\n  minWidth: 0,\n});\n\nexport const value = sprinkles({\n  minWidth: 0,\n  overflowWrap: 'anywhere',\n});\n"],"mappings":""}
+{"version":3,"file":"backofficeReferenceValue.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeReferenceValue.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const root = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: 2,\n  minWidth: 0,\n});\n\nexport const value = sprinkles({\n  minWidth: 0,\n  overflowWrap: 'anywhere',\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/detail/backofficeRelationsSummaryGrid.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficeRelationsSummaryGrid.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeRelationsSummaryGrid.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui';\n\nexport const grid = sprinkles({\n  display: 'grid',\n  gap: 3,\n  gridTemplateColumns: 'autoFitMinmax180',\n});\n\nexport const item = style([\n  sprinkles({\n    display: 'flex',\n    flexDirection: 'column',\n    gap: 1,\n    padding: 3,\n    borderRadius: 'md',\n    backgroundColor: 'surface',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'borderLight',\n    minWidth: 0,\n  }),\n]);\n\nexport const label = sprinkles({\n  fontSize: 'xs',\n  textTransform: 'uppercase',\n  letterSpacing: 'capsTight',\n  color: 'textSecondary',\n});\n\nexport const count = sprinkles({\n  fontSize: 'xl',\n  fontWeight: 'semibold',\n  color: 'text',\n});\n\nexport const description = sprinkles({\n  fontSize: 'sm',\n  color: 'textSecondary',\n  overflowWrap: 'anywhere',\n});\n"],"mappings":""}
+{"version":3,"file":"backofficeRelationsSummaryGrid.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeRelationsSummaryGrid.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const grid = sprinkles({\n  display: 'grid',\n  gap: 3,\n  gridTemplateColumns: 'autoFitMinmax180',\n});\n\nexport const item = style([\n  sprinkles({\n    display: 'flex',\n    flexDirection: 'column',\n    gap: 1,\n    padding: 3,\n    borderRadius: 'md',\n    backgroundColor: 'surface',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'borderLight',\n    minWidth: 0,\n  }),\n]);\n\nexport const label = sprinkles({\n  fontSize: 'xs',\n  textTransform: 'uppercase',\n  letterSpacing: 'capsTight',\n  color: 'textSecondary',\n});\n\nexport const count = sprinkles({\n  fontSize: 'xl',\n  fontWeight: 'semibold',\n  color: 'text',\n});\n\nexport const description = sprinkles({\n  fontSize: 'sm',\n  color: 'textSecondary',\n  overflowWrap: 'anywhere',\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/detail/backofficeScopeStack.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficeScopeStack.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeScopeStack.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui';\n\nexport const list = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n});\n\nexport const item = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n  minWidth: 0,\n});\n\nexport const label = sprinkles({\n  fontSize: 'xs',\n  textTransform: 'uppercase',\n  letterSpacing: 'capsTight',\n  color: 'textSecondary',\n});\n\nexport const value = sprinkles({\n  fontSize: 'sm',\n  color: 'text',\n  overflowWrap: 'anywhere',\n});\n"],"mappings":""}
+{"version":3,"file":"backofficeScopeStack.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeScopeStack.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const list = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n});\n\nexport const item = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n  minWidth: 0,\n});\n\nexport const label = sprinkles({\n  fontSize: 'xs',\n  textTransform: 'uppercase',\n  letterSpacing: 'capsTight',\n  color: 'textSecondary',\n});\n\nexport const value = sprinkles({\n  fontSize: 'sm',\n  color: 'text',\n  overflowWrap: 'anywhere',\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/detail/backofficeStatusMetaBadge.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficeStatusMetaBadge.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeStatusMetaBadge.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui';\n\nexport const badge = sprinkles({\n  width: 'fit',\n});\n"],"mappings":""}
+{"version":3,"file":"backofficeStatusMetaBadge.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeStatusMetaBadge.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const badge = sprinkles({\n  width: 'fit',\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/detail/backofficeUsageCostBreakdown.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficeUsageCostBreakdown.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeUsageCostBreakdown.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui';\n\nexport const content = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n});\n\nexport const table = sprinkles({\n  display: 'grid',\n  gap: 2,\n});\n\nexport const row = style([\n  sprinkles({\n    display: 'grid',\n    gap: 3,\n    alignItems: 'center',\n  }),\n  {\n    gridTemplateColumns: 'minmax(0, 1fr) repeat(4, minmax(0, auto))',\n  },\n]);\n\nexport const header = sprinkles({\n  fontSize: 'xs',\n  textTransform: 'uppercase',\n  letterSpacing: 'capsTight',\n  color: 'textSecondary',\n});\n\nexport const cell = sprinkles({\n  fontSize: 'sm',\n  color: 'text',\n  overflowWrap: 'anywhere',\n});\n\nexport const label = sprinkles({\n  fontWeight: 'medium',\n});\n"],"mappings":""}
+{"version":3,"file":"backofficeUsageCostBreakdown.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeUsageCostBreakdown.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const content = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n});\n\nexport const table = sprinkles({\n  display: 'grid',\n  gap: 2,\n});\n\nexport const row = style([\n  sprinkles({\n    display: 'grid',\n    gap: 3,\n    alignItems: 'center',\n  }),\n  {\n    gridTemplateColumns: 'minmax(0, 1fr) repeat(4, minmax(0, auto))',\n  },\n]);\n\nexport const header = sprinkles({\n  fontSize: 'xs',\n  textTransform: 'uppercase',\n  letterSpacing: 'capsTight',\n  color: 'textSecondary',\n});\n\nexport const cell = sprinkles({\n  fontSize: 'sm',\n  color: 'text',\n  overflowWrap: 'anywhere',\n});\n\nexport const label = sprinkles({\n  fontWeight: 'medium',\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/filters/BackofficeFilterAction.js

@@ -3,25 +3,25 @@ import { useBackofficeConfig as t } from "../../../provider/BackofficeConfigCont
 import { useBackofficeListFilterContext as n } from "../scaffolds/BackofficeListFilterContext.js";
 import { canFilterValue as r, resolveFilterForColumn as i, resolveFilterForWhereKey as a } from "../../../filters/filterHelpers.js";
 import { action as o, icon as s } from "./backofficeFilterAction.css.js";
-import { SidebarSearchSvg as c } from "@plumile/ui";
-import { jsx as l } from "react/jsx-runtime";
-import { useTranslation as u } from "react-i18next";
-import { Link as d } from "@plumile/router";
-import { buildBackofficeListLink as f } from "@plumile/backoffice-core/state/buildListHref.js";
-import { setWhereValue as p } from "@plumile/backoffice-core/filters/where.js";
+import { jsx as c } from "react/jsx-runtime";
+import { useTranslation as l } from "react-i18next";
+import u from "@plumile/router/routing/Link.js";
+import { buildBackofficeListLink as d } from "@plumile/backoffice-core/state/buildListHref.js";
+import { setWhereValue as f } from "@plumile/backoffice-core/filters/where.js";
+import { SidebarSearchSvg as p } from "@plumile/ui/icons/SidebarSearchSvg.js";
 //#region src/components/backoffice/filters/BackofficeFilterAction.tsx
 var m = (e, t) => e(t), h = (h) => {
-	let { t: g } = u(), { t: _ } = e(), { filterColumnAliases: v } = t(), { whereKey: y, value: b, path: x, label: S, listConfig: C } = h, w = n(), T = null;
+	let { t: g } = l(), { t: _ } = e(), { filterColumnAliases: v } = t(), { whereKey: y, value: b, path: x, label: S, listConfig: C } = h, w = n(), T = null;
 	if (C == null ? w != null && (T = w.config) : T = C, T == null) return null;
 	let E = a(T, y, x);
 	if (E == null && x == null && (E = i(T, y, v)), E == null || !r(E, b)) return null;
-	let D = m(E.label, g), O = S ?? _("filters.actions.filterBy", { label: D }), k = /* @__PURE__ */ l(c, {
+	let D = m(E.label, g), O = S ?? _("filters.actions.filterBy", { label: D }), k = /* @__PURE__ */ c(p, {
 		width: 14,
 		height: 14,
 		className: s,
 		"aria-hidden": "true"
 	});
-	if (w != null) return /* @__PURE__ */ l("button", {
+	if (w != null) return /* @__PURE__ */ c("button", {
 		type: "button",
 		className: o,
 		title: O,
@@ -31,9 +31,9 @@ var m = (e, t) => e(t), h = (h) => {
 		},
 		children: k
 	});
-	let A = p(T.listDefaults?.where ?? T.list.defaultState?.where ?? null, y, b, x);
-	return /* @__PURE__ */ l(d, {
-		to: f(T, { where: A }),
+	let A = f(T.listDefaults?.where ?? T.list.defaultState?.where ?? null, y, b, x);
+	return /* @__PURE__ */ c(u, {
+		to: d(T, { where: A }),
 		className: o,
 		title: O,
 		"aria-label": O,

package/lib/esm/components/backoffice/filters/BackofficeFilterAction.js.map

@@ -1 +1 @@
-{"version":3,"file":"BackofficeFilterAction.js","names":[],"sources":["../../../../../src/components/backoffice/filters/BackofficeFilterAction.tsx"],"sourcesContent":["import { type JSX } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Link } from '@plumile/router';\nimport { SidebarSearchSvg } from '@plumile/ui';\n\nimport type {\n  BackofficeRuntimeResolvedListFacetConfig,\n  I18nLabel,\n} from '@plumile/backoffice-core/types.js';\nimport type { TFunction } from 'i18next';\nimport { buildBackofficeListLink } from '@plumile/backoffice-core/state/buildListHref.js';\nimport { setWhereValue } from '@plumile/backoffice-core/filters/where.js';\n\nimport {\n  canFilterValue,\n  resolveFilterForColumn,\n  resolveFilterForWhereKey,\n} from '../../../filters/filterHelpers.js';\nimport { useBackofficeConfig } from '../../../provider/BackofficeConfigContext.js';\nimport { useBackofficeListFilterContext } from '../scaffolds/BackofficeListFilterContext.js';\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\n\nimport * as styles from './backofficeFilterAction.css.js';\n\nexport type BackofficeFilterActionProps = {\n  whereKey: string;\n  value: unknown;\n  path?: readonly string[];\n  label?: string;\n  listConfig?: BackofficeRuntimeResolvedListFacetConfig;\n};\n\ntype ListFilterContext = {\n  config: BackofficeRuntimeResolvedListFacetConfig;\n  applyFilter: (\n    whereKey: string,\n    value: unknown,\n    path?: readonly string[],\n  ) => void;\n};\n\nconst resolveLabel = (label: I18nLabel, tApp: TFunction): string => {\n  return label(tApp);\n};\n\nexport const BackofficeFilterAction = (\n  props: BackofficeFilterActionProps,\n): JSX.Element | null => {\n  const { t: tApp } = useTranslation();\n  const { t } = useBackofficeReactTranslation();\n  const { filterColumnAliases } = useBackofficeConfig();\n  const { whereKey, value, path, label, listConfig } = props;\n\n  const getContext =\n    useBackofficeListFilterContext as () => ListFilterContext | null;\n  const context = getContext();\n  let config: BackofficeRuntimeResolvedListFacetConfig | null = null;\n\n  if (listConfig != null) {\n    config = listConfig;\n  } else if (context != null) {\n    config = context.config;\n  }\n\n  if (config == null) {\n    return null;\n  }\n\n  let filter = resolveFilterForWhereKey(config, whereKey, path);\n  if (filter == null && path == null) {\n    filter = resolveFilterForColumn(config, whereKey, filterColumnAliases);\n  }\n  if (filter == null || !canFilterValue(filter, value)) {\n    return null;\n  }\n\n  const filterLabel = resolveLabel(filter.label, tApp);\n  const actionLabel =\n    label ??\n    t('filters.actions.filterBy', {\n      label: filterLabel,\n    });\n  const icon = (\n    <SidebarSearchSvg\n      width={14}\n      height={14}\n      className={styles.icon}\n      aria-hidden=\"true\"\n    />\n  );\n\n  if (context != null) {\n    return (\n      <button\n        type=\"button\"\n        className={styles.action}\n        title={actionLabel}\n        aria-label={actionLabel}\n        onClick={() => {\n          context.applyFilter(whereKey, value, path);\n        }}\n      >\n        {icon}\n      </button>\n    );\n  }\n\n  const baseWhere =\n    config.listDefaults?.where ?? config.list.defaultState?.where ?? null;\n  const nextWhere = setWhereValue(baseWhere, whereKey, value, path);\n  const to = buildBackofficeListLink(config, { where: nextWhere });\n\n  return (\n    <Link\n      to={to}\n      className={styles.action}\n      title={actionLabel}\n      aria-label={actionLabel}\n    >\n      {icon}\n    </Link>\n  );\n};\n\nexport default BackofficeFilterAction;\n"],"mappings":";;;;;;;;;;;;AAyCA,IAAM,KAAgB,GAAkB,MAC/B,EAAM,EAAK,EAGP,KACX,MACuB;CACvB,IAAM,EAAE,GAAG,MAAS,GAAgB,EAC9B,EAAE,SAAM,GAA+B,EACvC,EAAE,2BAAwB,GAAqB,EAC/C,EAAE,aAAU,UAAO,SAAM,UAAO,kBAAe,GAI/C,IAAU,GAAY,EACxB,IAA0D;CAQ9D,IANI,KAAc,OAEP,KAAW,SACpB,IAAS,EAAQ,UAFjB,IAAS,GAKP,KAAU,MACZ,OAAO;CAGT,IAAI,IAAS,EAAyB,GAAQ,GAAU,EAAK;CAI7D,IAHI,KAAU,QAAQ,KAAQ,SAC5B,IAAS,EAAuB,GAAQ,GAAU,EAAoB,GAEpE,KAAU,QAAQ,CAAC,EAAe,GAAQ,EAAM,EAClD,OAAO;CAGT,IAAM,IAAc,EAAa,EAAO,OAAO,EAAK,EAC9C,IACJ,KACA,EAAE,4BAA4B,EAC5B,OAAO,GACR,CAAC,EACE,IACJ,kBAAC,GAAD;EACE,OAAO;EACP,QAAQ;EACR,WAAW;EACX,eAAY;EACZ,CAAA;CAGJ,IAAI,KAAW,MACb,OACE,kBAAC,UAAD;EACE,MAAK;EACL,WAAW;EACX,OAAO;EACP,cAAY;EACZ,eAAe;GACb,EAAQ,YAAY,GAAU,GAAO,EAAK;;YAG3C;EACM,CAAA;CAMb,IAAM,IAAY,EADhB,EAAO,cAAc,SAAS,EAAO,KAAK,cAAc,SAAS,MACxB,GAAU,GAAO,EAAK;CAGjE,OACE,kBAAC,GAAD;EACM,IAJG,EAAwB,GAAQ,EAAE,OAAO,GAAW,CAIvD;EACJ,WAAW;EACX,OAAO;EACP,cAAY;YAEX;EACI,CAAA"}
+{"version":3,"file":"BackofficeFilterAction.js","names":[],"sources":["../../../../../src/components/backoffice/filters/BackofficeFilterAction.tsx"],"sourcesContent":["import { type JSX } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport Link from '@plumile/router/routing/Link.js';\nimport { SidebarSearchSvg } from '@plumile/ui/icons/SidebarSearchSvg.js';\n\nimport type {\n  BackofficeRuntimeResolvedListFacetConfig,\n  I18nLabel,\n} from '@plumile/backoffice-core/types.js';\nimport type { TFunction } from 'i18next';\nimport { buildBackofficeListLink } from '@plumile/backoffice-core/state/buildListHref.js';\nimport { setWhereValue } from '@plumile/backoffice-core/filters/where.js';\n\nimport {\n  canFilterValue,\n  resolveFilterForColumn,\n  resolveFilterForWhereKey,\n} from '../../../filters/filterHelpers.js';\nimport { useBackofficeConfig } from '../../../provider/BackofficeConfigContext.js';\nimport { useBackofficeListFilterContext } from '../scaffolds/BackofficeListFilterContext.js';\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\n\nimport * as styles from './backofficeFilterAction.css.js';\n\nexport type BackofficeFilterActionProps = {\n  whereKey: string;\n  value: unknown;\n  path?: readonly string[];\n  label?: string;\n  listConfig?: BackofficeRuntimeResolvedListFacetConfig;\n};\n\ntype ListFilterContext = {\n  config: BackofficeRuntimeResolvedListFacetConfig;\n  applyFilter: (\n    whereKey: string,\n    value: unknown,\n    path?: readonly string[],\n  ) => void;\n};\n\nconst resolveLabel = (label: I18nLabel, tApp: TFunction): string => {\n  return label(tApp);\n};\n\nexport const BackofficeFilterAction = (\n  props: BackofficeFilterActionProps,\n): JSX.Element | null => {\n  const { t: tApp } = useTranslation();\n  const { t } = useBackofficeReactTranslation();\n  const { filterColumnAliases } = useBackofficeConfig();\n  const { whereKey, value, path, label, listConfig } = props;\n\n  const getContext =\n    useBackofficeListFilterContext as () => ListFilterContext | null;\n  const context = getContext();\n  let config: BackofficeRuntimeResolvedListFacetConfig | null = null;\n\n  if (listConfig != null) {\n    config = listConfig;\n  } else if (context != null) {\n    config = context.config;\n  }\n\n  if (config == null) {\n    return null;\n  }\n\n  let filter = resolveFilterForWhereKey(config, whereKey, path);\n  if (filter == null && path == null) {\n    filter = resolveFilterForColumn(config, whereKey, filterColumnAliases);\n  }\n  if (filter == null || !canFilterValue(filter, value)) {\n    return null;\n  }\n\n  const filterLabel = resolveLabel(filter.label, tApp);\n  const actionLabel =\n    label ??\n    t('filters.actions.filterBy', {\n      label: filterLabel,\n    });\n  const icon = (\n    <SidebarSearchSvg\n      width={14}\n      height={14}\n      className={styles.icon}\n      aria-hidden=\"true\"\n    />\n  );\n\n  if (context != null) {\n    return (\n      <button\n        type=\"button\"\n        className={styles.action}\n        title={actionLabel}\n        aria-label={actionLabel}\n        onClick={() => {\n          context.applyFilter(whereKey, value, path);\n        }}\n      >\n        {icon}\n      </button>\n    );\n  }\n\n  const baseWhere =\n    config.listDefaults?.where ?? config.list.defaultState?.where ?? null;\n  const nextWhere = setWhereValue(baseWhere, whereKey, value, path);\n  const to = buildBackofficeListLink(config, { where: nextWhere });\n\n  return (\n    <Link\n      to={to}\n      className={styles.action}\n      title={actionLabel}\n      aria-label={actionLabel}\n    >\n      {icon}\n    </Link>\n  );\n};\n\nexport default BackofficeFilterAction;\n"],"mappings":";;;;;;;;;;;;AAyCA,IAAM,KAAgB,GAAkB,MAC/B,EAAM,EAAK,EAGP,KACX,MACuB;CACvB,IAAM,EAAE,GAAG,MAAS,GAAgB,EAC9B,EAAE,SAAM,GAA+B,EACvC,EAAE,2BAAwB,GAAqB,EAC/C,EAAE,aAAU,UAAO,SAAM,UAAO,kBAAe,GAI/C,IAAU,GAAY,EACxB,IAA0D;CAQ9D,IANI,KAAc,OAEP,KAAW,SACpB,IAAS,EAAQ,UAFjB,IAAS,GAKP,KAAU,MACZ,OAAO;CAGT,IAAI,IAAS,EAAyB,GAAQ,GAAU,EAAK;CAI7D,IAHI,KAAU,QAAQ,KAAQ,SAC5B,IAAS,EAAuB,GAAQ,GAAU,EAAoB,GAEpE,KAAU,QAAQ,CAAC,EAAe,GAAQ,EAAM,EAClD,OAAO;CAGT,IAAM,IAAc,EAAa,EAAO,OAAO,EAAK,EAC9C,IACJ,KACA,EAAE,4BAA4B,EAC5B,OAAO,GACR,CAAC,EACE,IACJ,kBAAC,GAAD;EACE,OAAO;EACP,QAAQ;EACR,WAAW;EACX,eAAY;EACZ,CAAA;CAGJ,IAAI,KAAW,MACb,OACE,kBAAC,UAAD;EACE,MAAK;EACL,WAAW;EACX,OAAO;EACP,cAAY;EACZ,eAAe;GACb,EAAQ,YAAY,GAAU,GAAO,EAAK;;YAG3C;EACM,CAAA;CAMb,IAAM,IAAY,EADhB,EAAO,cAAc,SAAS,EAAO,KAAK,cAAc,SAAS,MACxB,GAAU,GAAO,EAAK;CAGjE,OACE,kBAAC,GAAD;EACM,IAJG,EAAwB,GAAQ,EAAE,OAAO,GAAW,CAIvD;EACJ,WAAW;EACX,OAAO;EACP,cAAY;YAEX;EACI,CAAA"}

package/lib/esm/components/backoffice/filters/DeferredFilterSearchInput.js

@@ -1,8 +1,10 @@
 import { useBackofficeReactTranslation as e } from "../../../i18n/useBackofficeReactTranslation.js";
 import { actions as t, container as n } from "./deferredFilterSearchInput.css.js";
 import { useEffect as r, useState as i } from "react";
-import { Button as a, Input as o, SidebarSearchSvg as s } from "@plumile/ui";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { Button as s } from "@plumile/ui/atomic/atoms/button/Button.js";
+import { Input as c } from "@plumile/ui/atomic/atoms/input/Input.js";
+import { SidebarSearchSvg as l } from "@plumile/ui/icons/SidebarSearchSvg.js";
 //#region src/components/backoffice/filters/DeferredFilterSearchInput.tsx
 var u = ({ value: u, placeholder: d, ariaLabel: f, className: p, inputMode: m = "search", type: h = "search", onApply: g }) => {
 	let { t: _ } = e(), [v, y] = i(u);
@@ -14,14 +16,14 @@ var u = ({ value: u, placeholder: d, ariaLabel: f, className: p, inputMode: m =
 	let E = () => {
 		C && g(b);
 	};
-	return /* @__PURE__ */ c("form", {
+	return /* @__PURE__ */ a("form", {
 		className: p,
 		onSubmit: (e) => {
 			e.preventDefault(), E();
 		},
-		children: /* @__PURE__ */ l("div", {
+		children: /* @__PURE__ */ o("div", {
 			className: n,
-			children: [/* @__PURE__ */ c(o, {
+			children: [/* @__PURE__ */ a(c, {
 				type: h,
 				inputMode: m,
 				value: v,
@@ -35,14 +37,14 @@ var u = ({ value: u, placeholder: d, ariaLabel: f, className: p, inputMode: m =
 				"aria-label": f ?? d,
 				size: "small",
 				fullWidth: !0,
-				leftIcon: /* @__PURE__ */ c(s, {
+				leftIcon: /* @__PURE__ */ a(l, {
 					width: 18,
 					height: 18,
 					"aria-hidden": "true"
 				})
-			}), /* @__PURE__ */ l("div", {
+			}), /* @__PURE__ */ o("div", {
 				className: t,
-				children: [w && /* @__PURE__ */ c(a, {
+				children: [w && /* @__PURE__ */ a(s, {
 					type: "button",
 					variant: "text",
 					size: "small",
@@ -50,7 +52,7 @@ var u = ({ value: u, placeholder: d, ariaLabel: f, className: p, inputMode: m =
 						y(""), x !== "" && g("");
 					},
 					children: _("common.actions.clear")
-				}), /* @__PURE__ */ c(a, {
+				}), /* @__PURE__ */ a(s, {
 					type: "submit",
 					variant: T,
 					size: "small",

package/lib/esm/components/backoffice/filters/DeferredFilterSearchInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DeferredFilterSearchInput.js","names":[],"sources":["../../../../../src/components/backoffice/filters/DeferredFilterSearchInput.tsx"],"sourcesContent":["import {\n  useEffect,\n  useState,\n  type ChangeEvent,\n  type FormEvent,\n  type JSX,\n  type KeyboardEvent,\n} from 'react';\n\nimport { Button, Input, SidebarSearchSvg } from '@plumile/ui';\n\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\n\nimport * as styles from './deferredFilterSearchInput.css.js';\n\nexport type DeferredFilterSearchInputProps = {\n  value: string;\n  placeholder: string;\n  ariaLabel?: string;\n  className?: string;\n  inputMode?: 'search' | 'numeric' | 'decimal';\n  type?: 'search' | 'number' | 'datetime-local';\n  onApply: (value: string) => void;\n};\n\nexport const DeferredFilterSearchInput = ({\n  value,\n  placeholder,\n  ariaLabel,\n  className,\n  inputMode = 'search',\n  type = 'search',\n  onApply,\n}: DeferredFilterSearchInputProps): JSX.Element => {\n  const { t } = useBackofficeReactTranslation();\n  const [draftValue, setDraftValue] = useState(value);\n\n  useEffect(() => {\n    setDraftValue(value);\n  }, [value]);\n\n  const normalizedDraft = draftValue.trim();\n  const normalizedValue = value.trim();\n  const hasDraft = normalizedDraft !== '';\n  const hasPendingValue = normalizedDraft !== normalizedValue;\n  const canClear = hasDraft || normalizedValue !== '';\n  let submitVariant: 'primary' | 'secondary' = 'secondary';\n  if (hasPendingValue) {\n    submitVariant = 'primary';\n  }\n\n  const applyDraft = () => {\n    if (!hasPendingValue) {\n      return;\n    }\n    onApply(normalizedDraft);\n  };\n\n  const clearValue = () => {\n    setDraftValue('');\n    if (normalizedValue !== '') {\n      onApply('');\n    }\n  };\n\n  return (\n    <form\n      className={className}\n      onSubmit={(event: FormEvent<HTMLFormElement>) => {\n        event.preventDefault();\n        applyDraft();\n      }}\n    >\n      <div className={styles.container}>\n        <Input\n          type={type}\n          inputMode={inputMode}\n          value={draftValue}\n          onChange={(event: ChangeEvent<HTMLInputElement>) => {\n            setDraftValue(event.target.value);\n          }}\n          onKeyDown={(event: KeyboardEvent<HTMLInputElement>) => {\n            if (event.key === 'Escape') {\n              event.preventDefault();\n              setDraftValue(value);\n            }\n          }}\n          placeholder={placeholder}\n          aria-label={ariaLabel ?? placeholder}\n          size=\"small\"\n          fullWidth\n          leftIcon={\n            <SidebarSearchSvg width={18} height={18} aria-hidden=\"true\" />\n          }\n        />\n        <div className={styles.actions}>\n          {canClear && (\n            <Button\n              type=\"button\"\n              variant=\"text\"\n              size=\"small\"\n              onClick={clearValue}\n            >\n              {t('common.actions.clear')}\n            </Button>\n          )}\n          <Button\n            type=\"submit\"\n            variant={submitVariant}\n            size=\"small\"\n            disabled={!hasPendingValue}\n          >\n            {t('filters.actions.apply')}\n          </Button>\n        </div>\n      </div>\n    </form>\n  );\n};\n\nexport default DeferredFilterSearchInput;\n"],"mappings":";;;;;;AAyBA,IAAa,KAA6B,EACxC,UACA,gBACA,cACA,cACA,eAAY,UACZ,UAAO,UACP,iBACiD;CACjD,IAAM,EAAE,SAAM,GAA+B,EACvC,CAAC,GAAY,KAAiB,EAAS,EAAM;CAEnD,QAAgB;EACd,EAAc,EAAM;IACnB,CAAC,EAAM,CAAC;CAEX,IAAM,IAAkB,EAAW,MAAM,EACnC,IAAkB,EAAM,MAAM,EAC9B,IAAW,MAAoB,IAC/B,IAAkB,MAAoB,GACtC,IAAW,KAAY,MAAoB,IAC7C,IAAyC;CAC7C,AAAI,MACF,IAAgB;CAGlB,IAAM,UAAmB;EAClB,KAGL,EAAQ,EAAgB;;CAU1B,OACE,kBAAC,QAAD;EACa;EACX,WAAW,MAAsC;GAE/C,AADA,EAAM,gBAAgB,EACtB,GAAY;;YAGd,kBAAC,OAAD;GAAK,WAAW;aAAhB,CACE,kBAAC,GAAD;IACQ;IACK;IACX,OAAO;IACP,WAAW,MAAyC;KAClD,EAAc,EAAM,OAAO,MAAM;;IAEnC,YAAY,MAA2C;KACrD,AAAI,EAAM,QAAQ,aAChB,EAAM,gBAAgB,EACtB,EAAc,EAAM;;IAGX;IACb,cAAY,KAAa;IACzB,MAAK;IACL,WAAA;IACA,UACE,kBAAC,GAAD;KAAkB,OAAO;KAAI,QAAQ;KAAI,eAAY;KAAS,CAAA;IAEhE,CAAA,EACF,kBAAC,OAAD;IAAK,WAAW;cAAhB,CACG,KACC,kBAAC,GAAD;KACE,MAAK;KACL,SAAQ;KACR,MAAK;KACL,eA3Ca;MAEvB,AADA,EAAc,GAAG,EACb,MAAoB,MACtB,EAAQ,GAAG;;eA0CF,EAAE,uBAAuB;KACnB,CAAA,EAEX,kBAAC,GAAD;KACE,MAAK;KACL,SAAS;KACT,MAAK;KACL,UAAU,CAAC;eAEV,EAAE,wBAAwB;KACpB,CAAA,CACL;MACF;;EACD,CAAA"}
+{"version":3,"file":"DeferredFilterSearchInput.js","names":[],"sources":["../../../../../src/components/backoffice/filters/DeferredFilterSearchInput.tsx"],"sourcesContent":["import {\n  useEffect,\n  useState,\n  type ChangeEvent,\n  type FormEvent,\n  type JSX,\n  type KeyboardEvent,\n} from 'react';\n\nimport { Button } from '@plumile/ui/atomic/atoms/button/Button.js';\nimport { Input } from '@plumile/ui/atomic/atoms/input/Input.js';\nimport { SidebarSearchSvg } from '@plumile/ui/icons/SidebarSearchSvg.js';\n\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\n\nimport * as styles from './deferredFilterSearchInput.css.js';\n\nexport type DeferredFilterSearchInputProps = {\n  value: string;\n  placeholder: string;\n  ariaLabel?: string;\n  className?: string;\n  inputMode?: 'search' | 'numeric' | 'decimal';\n  type?: 'search' | 'number' | 'datetime-local';\n  onApply: (value: string) => void;\n};\n\nexport const DeferredFilterSearchInput = ({\n  value,\n  placeholder,\n  ariaLabel,\n  className,\n  inputMode = 'search',\n  type = 'search',\n  onApply,\n}: DeferredFilterSearchInputProps): JSX.Element => {\n  const { t } = useBackofficeReactTranslation();\n  const [draftValue, setDraftValue] = useState(value);\n\n  useEffect(() => {\n    setDraftValue(value);\n  }, [value]);\n\n  const normalizedDraft = draftValue.trim();\n  const normalizedValue = value.trim();\n  const hasDraft = normalizedDraft !== '';\n  const hasPendingValue = normalizedDraft !== normalizedValue;\n  const canClear = hasDraft || normalizedValue !== '';\n  let submitVariant: 'primary' | 'secondary' = 'secondary';\n  if (hasPendingValue) {\n    submitVariant = 'primary';\n  }\n\n  const applyDraft = () => {\n    if (!hasPendingValue) {\n      return;\n    }\n    onApply(normalizedDraft);\n  };\n\n  const clearValue = () => {\n    setDraftValue('');\n    if (normalizedValue !== '') {\n      onApply('');\n    }\n  };\n\n  return (\n    <form\n      className={className}\n      onSubmit={(event: FormEvent<HTMLFormElement>) => {\n        event.preventDefault();\n        applyDraft();\n      }}\n    >\n      <div className={styles.container}>\n        <Input\n          type={type}\n          inputMode={inputMode}\n          value={draftValue}\n          onChange={(event: ChangeEvent<HTMLInputElement>) => {\n            setDraftValue(event.target.value);\n          }}\n          onKeyDown={(event: KeyboardEvent<HTMLInputElement>) => {\n            if (event.key === 'Escape') {\n              event.preventDefault();\n              setDraftValue(value);\n            }\n          }}\n          placeholder={placeholder}\n          aria-label={ariaLabel ?? placeholder}\n          size=\"small\"\n          fullWidth\n          leftIcon={\n            <SidebarSearchSvg width={18} height={18} aria-hidden=\"true\" />\n          }\n        />\n        <div className={styles.actions}>\n          {canClear && (\n            <Button\n              type=\"button\"\n              variant=\"text\"\n              size=\"small\"\n              onClick={clearValue}\n            >\n              {t('common.actions.clear')}\n            </Button>\n          )}\n          <Button\n            type=\"submit\"\n            variant={submitVariant}\n            size=\"small\"\n            disabled={!hasPendingValue}\n          >\n            {t('filters.actions.apply')}\n          </Button>\n        </div>\n      </div>\n    </form>\n  );\n};\n\nexport default DeferredFilterSearchInput;\n"],"mappings":";;;;;;;;AA2BA,IAAa,KAA6B,EACxC,UACA,gBACA,cACA,cACA,eAAY,UACZ,UAAO,UACP,iBACiD;CACjD,IAAM,EAAE,SAAM,GAA+B,EACvC,CAAC,GAAY,KAAiB,EAAS,EAAM;CAEnD,QAAgB;EACd,EAAc,EAAM;IACnB,CAAC,EAAM,CAAC;CAEX,IAAM,IAAkB,EAAW,MAAM,EACnC,IAAkB,EAAM,MAAM,EAC9B,IAAW,MAAoB,IAC/B,IAAkB,MAAoB,GACtC,IAAW,KAAY,MAAoB,IAC7C,IAAyC;CAC7C,AAAI,MACF,IAAgB;CAGlB,IAAM,UAAmB;EAClB,KAGL,EAAQ,EAAgB;;CAU1B,OACE,kBAAC,QAAD;EACa;EACX,WAAW,MAAsC;GAE/C,AADA,EAAM,gBAAgB,EACtB,GAAY;;YAGd,kBAAC,OAAD;GAAK,WAAW;aAAhB,CACE,kBAAC,GAAD;IACQ;IACK;IACX,OAAO;IACP,WAAW,MAAyC;KAClD,EAAc,EAAM,OAAO,MAAM;;IAEnC,YAAY,MAA2C;KACrD,AAAI,EAAM,QAAQ,aAChB,EAAM,gBAAgB,EACtB,EAAc,EAAM;;IAGX;IACb,cAAY,KAAa;IACzB,MAAK;IACL,WAAA;IACA,UACE,kBAAC,GAAD;KAAkB,OAAO;KAAI,QAAQ;KAAI,eAAY;KAAS,CAAA;IAEhE,CAAA,EACF,kBAAC,OAAD;IAAK,WAAW;cAAhB,CACG,KACC,kBAAC,GAAD;KACE,MAAK;KACL,SAAQ;KACR,MAAK;KACL,eA3Ca;MAEvB,AADA,EAAc,GAAG,EACb,MAAoB,MACtB,EAAQ,GAAG;;eA0CF,EAAE,uBAAuB;KACnB,CAAA,EAEX,kBAAC,GAAD;KACE,MAAK;KACL,SAAS;KACT,MAAK;KACL,UAAU,CAAC;eAEV,EAAE,wBAAwB;KACpB,CAAA,CACL;MACF;;EACD,CAAA"}

package/lib/esm/components/backoffice/filters/EntityIdFilterField.js

@@ -1,24 +1,25 @@
 import { useBackofficeReactTranslation as e } from "../../../i18n/useBackofficeReactTranslation.js";
 import { actionIcon as t, clearButton as n, container as r, content as i, labelText as a, pickActionButton as o, pickerButton as s, pickerControl as c, placeholder as l, valueText as u } from "./entityIdFilterField.css.js";
-import { BackofficeSidebarPenToolSvg as d, BackofficeSidebarSearchSvg as f } from "@plumile/ui";
-import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+import { BackofficeSidebarPenToolSvg as p } from "@plumile/ui/icons/backoffice/BackofficeSidebarPenToolSvg.js";
+import { BackofficeSidebarSearchSvg as m } from "@plumile/ui/icons/backoffice/BackofficeSidebarSearchSvg.js";
 //#region src/components/backoffice/filters/EntityIdFilterField.tsx
 var h = (h) => {
 	let { disabled: g = !1, id: _, label: v, value: y, displayValue: b, placeholder: x, ariaDescribedBy: S, ariaInvalid: C, isResolving: w = !1, onPick: T, onClear: E } = h, { t: D } = e(), O = y?.trim() ?? "", k = b?.trim() ?? "", A = O !== "", j = k !== "", M = x ?? D("filters.placeholders.anyEntity", { label: v }), N = D("filters.placeholders.unresolved"), P;
-	P = j ? /* @__PURE__ */ p("span", {
+	P = j ? /* @__PURE__ */ d("span", {
 		className: u,
 		children: k
-	}) : A ? /* @__PURE__ */ p("span", {
+	}) : A ? /* @__PURE__ */ d("span", {
 		className: l,
 		children: N
-	}) : /* @__PURE__ */ p("span", {
+	}) : /* @__PURE__ */ d("span", {
 		className: l,
 		children: M
 	});
 	let F = D("common.actions.pick");
 	A && (F = D("common.actions.change"));
 	let I = `${F} ${v}`, L = `${D("common.actions.clear")} ${v}`, R = null;
-	A && E != null && (R = /* @__PURE__ */ p("button", {
+	A && E != null && (R = /* @__PURE__ */ d("button", {
 		type: "button",
 		className: n,
 		"aria-label": L,
@@ -26,13 +27,13 @@ var h = (h) => {
 		onClick: (e) => {
 			e.stopPropagation(), E();
 		},
-		children: /* @__PURE__ */ p("svg", {
+		children: /* @__PURE__ */ d("svg", {
 			width: "12",
 			height: "12",
 			viewBox: "0 0 12 12",
 			fill: "none",
 			"aria-hidden": "true",
-			children: /* @__PURE__ */ p("path", {
+			children: /* @__PURE__ */ d("path", {
 				d: "M3 3L9 9M9 3L3 9",
 				stroke: "currentColor",
 				strokeWidth: "1.6",
@@ -42,17 +43,17 @@ var h = (h) => {
 	}));
 	let z = null;
 	if (T != null) {
-		let e = /* @__PURE__ */ p(f, {
+		let e = /* @__PURE__ */ d(m, {
 			className: t,
 			"aria-hidden": "true"
 		});
-		A && (e = /* @__PURE__ */ p(d, {
+		A && (e = /* @__PURE__ */ d(p, {
 			className: t,
 			"aria-hidden": "true"
-		})), z = /* @__PURE__ */ m("div", {
+		})), z = /* @__PURE__ */ f("div", {
 			className: c,
 			children: [
-				/* @__PURE__ */ p("button", {
+				/* @__PURE__ */ d("button", {
 					id: _,
 					type: "button",
 					className: s,
@@ -62,15 +63,15 @@ var h = (h) => {
 					"aria-busy": w || void 0,
 					disabled: g,
 					onClick: T,
-					children: /* @__PURE__ */ m("span", {
+					children: /* @__PURE__ */ f("span", {
 						className: i,
-						children: [/* @__PURE__ */ p("span", {
+						children: [/* @__PURE__ */ d("span", {
 							className: a,
 							children: v
 						}), P]
 					})
 				}),
-				/* @__PURE__ */ p("button", {
+				/* @__PURE__ */ d("button", {
 					type: "button",
 					className: o,
 					"aria-label": I,
@@ -83,9 +84,9 @@ var h = (h) => {
 			]
 		});
 	}
-	return /* @__PURE__ */ p("div", {
+	return /* @__PURE__ */ d("div", {
 		className: r,
-		children: z ?? /* @__PURE__ */ p("div", {
+		children: z ?? /* @__PURE__ */ d("div", {
 			className: "txvbqb9my txvbqbk5y txvbqb9ip txvbqbcp txvbqbl7g",
 			children: P
 		})

package/lib/esm/components/backoffice/filters/EntityIdFilterField.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityIdFilterField.js","names":[],"sources":["../../../../../src/components/backoffice/filters/EntityIdFilterField.tsx"],"sourcesContent":["import { type JSX } from 'react';\n\nimport {\n  BackofficeSidebarPenToolSvg,\n  BackofficeSidebarSearchSvg,\n} from '@plumile/ui';\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\n\nimport * as styles from './entityIdFilterField.css.js';\n\nexport type EntityIdFilterFieldProps = {\n  id?: string;\n  label: string;\n  value: string | null;\n  displayValue?: string | null;\n  placeholder?: string;\n  ariaDescribedBy?: string;\n  ariaInvalid?: boolean;\n  isResolving?: boolean;\n  onPick?: () => void;\n  onClear?: () => void;\n  disabled?: boolean;\n};\n\nexport const EntityIdFilterField = (\n  props: EntityIdFilterFieldProps,\n): JSX.Element => {\n  const {\n    disabled = false,\n    id,\n    label,\n    value,\n    displayValue,\n    placeholder,\n    ariaDescribedBy,\n    ariaInvalid,\n    isResolving = false,\n    onPick,\n    onClear,\n  } = props;\n  const { t } = useBackofficeReactTranslation();\n  const normalizedValue = value?.trim() ?? '';\n  const normalizedDisplayValue = displayValue?.trim() ?? '';\n  const hasValue = normalizedValue !== '';\n  const hasDisplayValue = normalizedDisplayValue !== '';\n\n  const resolvedPlaceholder =\n    placeholder ?? t('filters.placeholders.anyEntity', { label });\n  const unresolvedPlaceholder = t('filters.placeholders.unresolved');\n\n  let displayNode: JSX.Element;\n  if (hasDisplayValue) {\n    displayNode = (\n      <span className={styles.valueText}>{normalizedDisplayValue}</span>\n    );\n  } else if (hasValue) {\n    displayNode = (\n      <span className={styles.placeholder}>{unresolvedPlaceholder}</span>\n    );\n  } else {\n    displayNode = (\n      <span className={styles.placeholder}>{resolvedPlaceholder}</span>\n    );\n  }\n\n  let pickLabel = t('common.actions.pick');\n  if (hasValue) {\n    pickLabel = t('common.actions.change');\n  }\n  const pickAriaLabel = `${pickLabel} ${label}`;\n  const clearLabel = t('common.actions.clear');\n  const clearAriaLabel = `${clearLabel} ${label}`;\n\n  let clearNode: JSX.Element | null = null;\n  if (hasValue && onClear != null) {\n    clearNode = (\n      <button\n        type=\"button\"\n        className={styles.clearButton}\n        aria-label={clearAriaLabel}\n        disabled={disabled}\n        onClick={(event) => {\n          event.stopPropagation();\n          onClear();\n        }}\n      >\n        <svg\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 12 12\"\n          fill=\"none\"\n          aria-hidden=\"true\"\n        >\n          <path\n            d=\"M3 3L9 9M9 3L3 9\"\n            stroke=\"currentColor\"\n            strokeWidth=\"1.6\"\n            strokeLinecap=\"round\"\n          />\n        </svg>\n      </button>\n    );\n  }\n\n  let pickerNode: JSX.Element | null = null;\n  if (onPick != null) {\n    let actionIcon = (\n      <BackofficeSidebarSearchSvg\n        className={styles.actionIcon}\n        aria-hidden=\"true\"\n      />\n    );\n    if (hasValue) {\n      actionIcon = (\n        <BackofficeSidebarPenToolSvg\n          className={styles.actionIcon}\n          aria-hidden=\"true\"\n        />\n      );\n    }\n\n    pickerNode = (\n      <div className={styles.pickerControl}>\n        <button\n          id={id}\n          type=\"button\"\n          className={styles.pickerButton}\n          aria-label={pickAriaLabel}\n          aria-describedby={ariaDescribedBy}\n          aria-invalid={ariaInvalid}\n          aria-busy={isResolving || undefined}\n          disabled={disabled}\n          onClick={onPick}\n        >\n          <span className={styles.content}>\n            <span className={styles.labelText}>{label}</span>\n            {displayNode}\n          </span>\n        </button>\n        <button\n          type=\"button\"\n          className={styles.pickActionButton}\n          aria-label={pickAriaLabel}\n          title={pickAriaLabel}\n          disabled={disabled}\n          onClick={onPick}\n        >\n          {actionIcon}\n        </button>\n        {clearNode}\n      </div>\n    );\n  }\n\n  return (\n    <div className={styles.container}>\n      {pickerNode ?? <div className={styles.valueBox}>{displayNode}</div>}\n    </div>\n  );\n};\n\nexport default EntityIdFilterField;\n"],"mappings":";;;;;AAwBA,IAAa,KACX,MACgB;CAChB,IAAM,EACJ,cAAW,IACX,OACA,UACA,UACA,iBACA,aAAA,GACA,oBACA,gBACA,iBAAc,IACd,WACA,eACE,GACE,EAAE,SAAM,GAA+B,EACvC,IAAkB,GAAO,MAAM,IAAI,IACnC,IAAyB,GAAc,MAAM,IAAI,IACjD,IAAW,MAAoB,IAC/B,IAAkB,MAA2B,IAE7C,IACJ,KAAe,EAAE,kCAAkC,EAAE,UAAO,CAAC,EACzD,IAAwB,EAAE,kCAAkC,EAE9D;CACJ,AASE,IATE,IAEA,kBAAC,QAAD;EAAM,WAAW;YAAmB;EAA8B,CAAA,GAE3D,IAEP,kBAAC,QAAD;EAAM,WAAW;YAAqB;EAA6B,CAAA,GAInE,kBAAC,QAAD;EAAM,WAAW;YAAqB;EAA2B,CAAA;CAIrE,IAAI,IAAY,EAAE,sBAAsB;CACxC,AAAI,MACF,IAAY,EAAE,wBAAwB;CAExC,IAAM,IAAgB,GAAG,EAAU,GAAG,KAEhC,IAAiB,GADJ,EAAE,uBACK,CAAW,GAAG,KAEpC,IAAgC;CACpC,AAAI,KAAY,KAAW,SACzB,IACE,kBAAC,UAAD;EACE,MAAK;EACL,WAAW;EACX,cAAY;EACF;EACV,UAAU,MAAU;GAElB,AADA,EAAM,iBAAiB,EACvB,GAAS;;YAGX,kBAAC,OAAD;GACE,OAAM;GACN,QAAO;GACP,SAAQ;GACR,MAAK;GACL,eAAY;aAEZ,kBAAC,QAAD;IACE,GAAE;IACF,QAAO;IACP,aAAY;IACZ,eAAc;IACd,CAAA;GACE,CAAA;EACC,CAAA;CAIb,IAAI,IAAiC;CACrC,IAAI,KAAU,MAAM;EAClB,IAAI,IACF,kBAAC,GAAD;GACE,WAAW;GACX,eAAY;GACZ,CAAA;EAWJ,AATI,MACF,IACE,kBAAC,GAAD;GACE,WAAW;GACX,eAAY;GACZ,CAAA,GAIN,IACE,kBAAC,OAAD;GAAK,WAAW;aAAhB;IACE,kBAAC,UAAD;KACM;KACJ,MAAK;KACL,WAAW;KACX,cAAY;KACZ,oBAAkB;KAClB,gBAAc;KACd,aAAW,KAAe,KAAA;KAChB;KACV,SAAS;eAET,kBAAC,QAAD;MAAM,WAAW;gBAAjB,CACE,kBAAC,QAAD;OAAM,WAAW;iBAAmB;OAAa,CAAA,EAChD,EACI;;KACA,CAAA;IACT,kBAAC,UAAD;KACE,MAAK;KACL,WAAW;KACX,cAAY;KACZ,OAAO;KACG;KACV,SAAS;eAER;KACM,CAAA;IACR;IACG;;;CAIV,OACE,kBAAC,OAAD;EAAK,WAAW;YACb,KAAc,kBAAC,OAAD;GAAK,WAAW;aAAkB;GAAkB,CAAA;EAC/D,CAAA"}
+{"version":3,"file":"EntityIdFilterField.js","names":[],"sources":["../../../../../src/components/backoffice/filters/EntityIdFilterField.tsx"],"sourcesContent":["import { type JSX } from 'react';\n\nimport { BackofficeSidebarPenToolSvg } from '@plumile/ui/icons/backoffice/BackofficeSidebarPenToolSvg.js';\nimport { BackofficeSidebarSearchSvg } from '@plumile/ui/icons/backoffice/BackofficeSidebarSearchSvg.js';\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\n\nimport * as styles from './entityIdFilterField.css.js';\n\nexport type EntityIdFilterFieldProps = {\n  id?: string;\n  label: string;\n  value: string | null;\n  displayValue?: string | null;\n  placeholder?: string;\n  ariaDescribedBy?: string;\n  ariaInvalid?: boolean;\n  isResolving?: boolean;\n  onPick?: () => void;\n  onClear?: () => void;\n  disabled?: boolean;\n};\n\nexport const EntityIdFilterField = (\n  props: EntityIdFilterFieldProps,\n): JSX.Element => {\n  const {\n    disabled = false,\n    id,\n    label,\n    value,\n    displayValue,\n    placeholder,\n    ariaDescribedBy,\n    ariaInvalid,\n    isResolving = false,\n    onPick,\n    onClear,\n  } = props;\n  const { t } = useBackofficeReactTranslation();\n  const normalizedValue = value?.trim() ?? '';\n  const normalizedDisplayValue = displayValue?.trim() ?? '';\n  const hasValue = normalizedValue !== '';\n  const hasDisplayValue = normalizedDisplayValue !== '';\n\n  const resolvedPlaceholder =\n    placeholder ?? t('filters.placeholders.anyEntity', { label });\n  const unresolvedPlaceholder = t('filters.placeholders.unresolved');\n\n  let displayNode: JSX.Element;\n  if (hasDisplayValue) {\n    displayNode = (\n      <span className={styles.valueText}>{normalizedDisplayValue}</span>\n    );\n  } else if (hasValue) {\n    displayNode = (\n      <span className={styles.placeholder}>{unresolvedPlaceholder}</span>\n    );\n  } else {\n    displayNode = (\n      <span className={styles.placeholder}>{resolvedPlaceholder}</span>\n    );\n  }\n\n  let pickLabel = t('common.actions.pick');\n  if (hasValue) {\n    pickLabel = t('common.actions.change');\n  }\n  const pickAriaLabel = `${pickLabel} ${label}`;\n  const clearLabel = t('common.actions.clear');\n  const clearAriaLabel = `${clearLabel} ${label}`;\n\n  let clearNode: JSX.Element | null = null;\n  if (hasValue && onClear != null) {\n    clearNode = (\n      <button\n        type=\"button\"\n        className={styles.clearButton}\n        aria-label={clearAriaLabel}\n        disabled={disabled}\n        onClick={(event) => {\n          event.stopPropagation();\n          onClear();\n        }}\n      >\n        <svg\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 12 12\"\n          fill=\"none\"\n          aria-hidden=\"true\"\n        >\n          <path\n            d=\"M3 3L9 9M9 3L3 9\"\n            stroke=\"currentColor\"\n            strokeWidth=\"1.6\"\n            strokeLinecap=\"round\"\n          />\n        </svg>\n      </button>\n    );\n  }\n\n  let pickerNode: JSX.Element | null = null;\n  if (onPick != null) {\n    let actionIcon = (\n      <BackofficeSidebarSearchSvg\n        className={styles.actionIcon}\n        aria-hidden=\"true\"\n      />\n    );\n    if (hasValue) {\n      actionIcon = (\n        <BackofficeSidebarPenToolSvg\n          className={styles.actionIcon}\n          aria-hidden=\"true\"\n        />\n      );\n    }\n\n    pickerNode = (\n      <div className={styles.pickerControl}>\n        <button\n          id={id}\n          type=\"button\"\n          className={styles.pickerButton}\n          aria-label={pickAriaLabel}\n          aria-describedby={ariaDescribedBy}\n          aria-invalid={ariaInvalid}\n          aria-busy={isResolving || undefined}\n          disabled={disabled}\n          onClick={onPick}\n        >\n          <span className={styles.content}>\n            <span className={styles.labelText}>{label}</span>\n            {displayNode}\n          </span>\n        </button>\n        <button\n          type=\"button\"\n          className={styles.pickActionButton}\n          aria-label={pickAriaLabel}\n          title={pickAriaLabel}\n          disabled={disabled}\n          onClick={onPick}\n        >\n          {actionIcon}\n        </button>\n        {clearNode}\n      </div>\n    );\n  }\n\n  return (\n    <div className={styles.container}>\n      {pickerNode ?? <div className={styles.valueBox}>{displayNode}</div>}\n    </div>\n  );\n};\n\nexport default EntityIdFilterField;\n"],"mappings":";;;;;;AAsBA,IAAa,KACX,MACgB;CAChB,IAAM,EACJ,cAAW,IACX,OACA,UACA,UACA,iBACA,aAAA,GACA,oBACA,gBACA,iBAAc,IACd,WACA,eACE,GACE,EAAE,SAAM,GAA+B,EACvC,IAAkB,GAAO,MAAM,IAAI,IACnC,IAAyB,GAAc,MAAM,IAAI,IACjD,IAAW,MAAoB,IAC/B,IAAkB,MAA2B,IAE7C,IACJ,KAAe,EAAE,kCAAkC,EAAE,UAAO,CAAC,EACzD,IAAwB,EAAE,kCAAkC,EAE9D;CACJ,AASE,IATE,IAEA,kBAAC,QAAD;EAAM,WAAW;YAAmB;EAA8B,CAAA,GAE3D,IAEP,kBAAC,QAAD;EAAM,WAAW;YAAqB;EAA6B,CAAA,GAInE,kBAAC,QAAD;EAAM,WAAW;YAAqB;EAA2B,CAAA;CAIrE,IAAI,IAAY,EAAE,sBAAsB;CACxC,AAAI,MACF,IAAY,EAAE,wBAAwB;CAExC,IAAM,IAAgB,GAAG,EAAU,GAAG,KAEhC,IAAiB,GADJ,EAAE,uBACK,CAAW,GAAG,KAEpC,IAAgC;CACpC,AAAI,KAAY,KAAW,SACzB,IACE,kBAAC,UAAD;EACE,MAAK;EACL,WAAW;EACX,cAAY;EACF;EACV,UAAU,MAAU;GAElB,AADA,EAAM,iBAAiB,EACvB,GAAS;;YAGX,kBAAC,OAAD;GACE,OAAM;GACN,QAAO;GACP,SAAQ;GACR,MAAK;GACL,eAAY;aAEZ,kBAAC,QAAD;IACE,GAAE;IACF,QAAO;IACP,aAAY;IACZ,eAAc;IACd,CAAA;GACE,CAAA;EACC,CAAA;CAIb,IAAI,IAAiC;CACrC,IAAI,KAAU,MAAM;EAClB,IAAI,IACF,kBAAC,GAAD;GACE,WAAW;GACX,eAAY;GACZ,CAAA;EAWJ,AATI,MACF,IACE,kBAAC,GAAD;GACE,WAAW;GACX,eAAY;GACZ,CAAA,GAIN,IACE,kBAAC,OAAD;GAAK,WAAW;aAAhB;IACE,kBAAC,UAAD;KACM;KACJ,MAAK;KACL,WAAW;KACX,cAAY;KACZ,oBAAkB;KAClB,gBAAc;KACd,aAAW,KAAe,KAAA;KAChB;KACV,SAAS;eAET,kBAAC,QAAD;MAAM,WAAW;gBAAjB,CACE,kBAAC,QAAD;OAAM,WAAW;iBAAmB;OAAa,CAAA,EAChD,EACI;;KACA,CAAA;IACT,kBAAC,UAAD;KACE,MAAK;KACL,WAAW;KACX,cAAY;KACZ,OAAO;KACG;KACV,SAAS;eAER;KACM,CAAA;IACR;IACG;;;CAIV,OACE,kBAAC,OAAD;EAAK,WAAW;YACb,KAAc,kBAAC,OAAD;GAAK,WAAW;aAAkB;GAAkB,CAAA;EAC/D,CAAA"}

package/lib/esm/components/backoffice/filters/backofficeFilterAction.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficeFilterAction.css.js","names":[],"sources":["../../../../../src/components/backoffice/filters/backofficeFilterAction.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles, vars } from '@plumile/ui';\n\nexport const action = style([\n  sprinkles({\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: 7,\n    height: 7,\n    padding: 0,\n    borderRadius: 'md',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'borderSubtle',\n    backgroundColor: 'surfaceMuted',\n    color: 'brandPrimaryRed',\n    cursor: 'pointer',\n    textDecoration: 'none',\n    transitionProperty: 'colors',\n    transitionDuration: 120,\n    transitionTimingFunction: 'ease',\n  }),\n  {\n    selectors: {\n      '&:hover': {\n        color: vars.colors.text,\n        backgroundColor: vars.colors.primaryLight,\n        borderColor: vars.colors.primary,\n      },\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors.primary}`,\n        outlineOffset: '2px',\n      },\n    },\n  },\n]);\n\nexport const icon = sprinkles({\n  width: 4,\n  height: 4,\n});\n"],"mappings":""}
+{"version":3,"file":"backofficeFilterAction.css.js","names":[],"sources":["../../../../../src/components/backoffice/filters/backofficeFilterAction.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.js';\n\nexport const action = style([\n  sprinkles({\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: 7,\n    height: 7,\n    padding: 0,\n    borderRadius: 'md',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'borderSubtle',\n    backgroundColor: 'surfaceMuted',\n    color: 'brandPrimaryRed',\n    cursor: 'pointer',\n    textDecoration: 'none',\n    transitionProperty: 'colors',\n    transitionDuration: 120,\n    transitionTimingFunction: 'ease',\n  }),\n  {\n    selectors: {\n      '&:hover': {\n        color: vars.colors.text,\n        backgroundColor: vars.colors.primaryLight,\n        borderColor: vars.colors.primary,\n      },\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors.primary}`,\n        outlineOffset: '2px',\n      },\n    },\n  },\n]);\n\nexport const icon = sprinkles({\n  width: 4,\n  height: 4,\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/filters/deferredFilterSearchInput.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"deferredFilterSearchInput.css.js","names":[],"sources":["../../../../../src/components/backoffice/filters/deferredFilterSearchInput.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui';\n\nconst MOBILE_MEDIA_QUERY = 'screen and (max-width: 767px)';\n\nexport const container = style([\n  sprinkles({\n    display: 'flex',\n    alignItems: 'center',\n    gap: 2,\n    width: 'full',\n  }),\n  {\n    '@media': {\n      [MOBILE_MEDIA_QUERY]: {\n        alignItems: 'stretch',\n        flexDirection: 'column',\n      },\n    },\n  },\n]);\n\nexport const actions = style([\n  sprinkles({\n    display: 'flex',\n    alignItems: 'center',\n    gap: 1,\n  }),\n  {\n    flexShrink: 0,\n    '@media': {\n      [MOBILE_MEDIA_QUERY]: {\n        justifyContent: 'flex-end',\n      },\n    },\n  },\n]);\n"],"mappings":""}
+{"version":3,"file":"deferredFilterSearchInput.css.js","names":[],"sources":["../../../../../src/components/backoffice/filters/deferredFilterSearchInput.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nconst MOBILE_MEDIA_QUERY = 'screen and (max-width: 767px)';\n\nexport const container = style([\n  sprinkles({\n    display: 'flex',\n    alignItems: 'center',\n    gap: 2,\n    width: 'full',\n  }),\n  {\n    '@media': {\n      [MOBILE_MEDIA_QUERY]: {\n        alignItems: 'stretch',\n        flexDirection: 'column',\n      },\n    },\n  },\n]);\n\nexport const actions = style([\n  sprinkles({\n    display: 'flex',\n    alignItems: 'center',\n    gap: 1,\n  }),\n  {\n    flexShrink: 0,\n    '@media': {\n      [MOBILE_MEDIA_QUERY]: {\n        justifyContent: 'flex-end',\n      },\n    },\n  },\n]);\n"],"mappings":""}

package/lib/esm/components/backoffice/filters/entityIdFilterField.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"entityIdFilterField.css.js","names":[],"sources":["../../../../../src/components/backoffice/filters/entityIdFilterField.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles, vars } from '@plumile/ui';\n\nexport const container = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  width: 72,\n  maxWidth: 'full',\n  minWidth: 0,\n});\n\nexport const pickerControl = style([\n  sprinkles({\n    display: 'grid',\n    alignItems: 'center',\n    flex: 1,\n    minWidth: 0,\n    borderRadius: 'xl',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'border',\n    backgroundColor: 'surface',\n    color: 'text',\n    paddingX: 3,\n    paddingY: 1.5,\n    transitionProperty: 'default',\n    transitionDuration: 150,\n    transitionTimingFunction: 'ease',\n  }),\n  {\n    gridTemplateColumns: 'minmax(0, 1fr) auto auto',\n    gridTemplateAreas: '\"content pickAction clearAction\"',\n    columnGap: vars.spacing[1],\n    minHeight: '2.5rem',\n    width: '100%',\n    selectors: {\n      '&:hover': {\n        backgroundColor: vars.colors.surfaceMuted,\n      },\n    },\n  },\n]);\n\nexport const pickerButton = style([\n  sprinkles({\n    appearance: 'none',\n    display: 'flex',\n    flexDirection: 'column',\n    justifyContent: 'center',\n    minWidth: 0,\n    width: 'full',\n    textAlign: 'left',\n    cursor: 'pointer',\n    borderWidth: 0,\n    backgroundColor: 'transparent',\n    color: 'text',\n    padding: 0,\n  }),\n  {\n    gridArea: 'content',\n    minHeight: '100%',\n    selectors: {\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors.primary}`,\n        outlineOffset: '2px',\n      },\n      '&:disabled': {\n        cursor: 'not-allowed',\n        opacity: 0.65,\n      },\n    },\n  },\n]);\n\nexport const content = style([\n  sprinkles({\n    display: 'flex',\n    flexDirection: 'column',\n    justifyContent: 'center',\n    gap: 0.5,\n    minWidth: 0,\n    width: 'full',\n  }),\n  {\n    maxWidth: '100%',\n  },\n]);\n\nexport const valueBox = sprinkles({\n  flex: 1,\n  minWidth: 0,\n  display: 'flex',\n  alignItems: 'center',\n  overflow: 'hidden',\n});\n\nexport const labelText = style([\n  sprinkles({\n    display: 'block',\n    color: 'textMuted',\n    fontSize: 'xs',\n    fontWeight: 'medium',\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n  }),\n  {\n    minWidth: 0,\n  },\n]);\n\nexport const valueText = sprinkles({\n  display: 'block',\n  minWidth: 0,\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n  fontSize: 'sm',\n  fontWeight: 'semibold',\n});\n\nexport const placeholder = sprinkles({\n  display: 'block',\n  minWidth: 0,\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n  color: 'textMuted',\n  fontSize: 'sm',\n});\n\nconst actionButtonBase = style([\n  sprinkles({\n    appearance: 'none',\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: 7,\n    height: 7,\n    padding: 0,\n    borderRadius: 'lg',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'borderSubtle',\n    backgroundColor: 'surface',\n    color: 'textMuted',\n    cursor: 'pointer',\n    transitionProperty: 'colors',\n    transitionDuration: 120,\n    transitionTimingFunction: 'ease',\n  }),\n  {\n    alignSelf: 'center',\n    selectors: {\n      '&:hover:not(:disabled)': {\n        color: vars.colors.text,\n        backgroundColor: vars.colors.surfaceMuted,\n        borderColor: vars.colors.borderStrong,\n      },\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors.primary}`,\n        outlineOffset: '2px',\n      },\n      '&:disabled': {\n        cursor: 'not-allowed',\n        opacity: 0.65,\n      },\n    },\n  },\n]);\n\nexport const pickActionButton = style([\n  actionButtonBase,\n  {\n    gridArea: 'pickAction',\n  },\n]);\n\nexport const clearButton = style([\n  actionButtonBase,\n  sprinkles({\n    borderRadius: 'full',\n    backgroundColor: 'surfaceMuted',\n  }),\n  {\n    gridArea: 'clearAction',\n  },\n]);\n\nexport const actionIcon = style({\n  width: '1rem',\n  height: '1rem',\n});\n"],"mappings":""}
+{"version":3,"file":"entityIdFilterField.css.js","names":[],"sources":["../../../../../src/components/backoffice/filters/entityIdFilterField.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.js';\n\nexport const container = sprinkles({\n  display: 'flex',\n  alignItems: 'center',\n  width: 72,\n  maxWidth: 'full',\n  minWidth: 0,\n});\n\nexport const pickerControl = style([\n  sprinkles({\n    display: 'grid',\n    alignItems: 'center',\n    flex: 1,\n    minWidth: 0,\n    borderRadius: 'xl',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'border',\n    backgroundColor: 'surface',\n    color: 'text',\n    paddingX: 3,\n    paddingY: 1.5,\n    transitionProperty: 'default',\n    transitionDuration: 150,\n    transitionTimingFunction: 'ease',\n  }),\n  {\n    gridTemplateColumns: 'minmax(0, 1fr) auto auto',\n    gridTemplateAreas: '\"content pickAction clearAction\"',\n    columnGap: vars.spacing[1],\n    minHeight: '2.5rem',\n    width: '100%',\n    selectors: {\n      '&:hover': {\n        backgroundColor: vars.colors.surfaceMuted,\n      },\n    },\n  },\n]);\n\nexport const pickerButton = style([\n  sprinkles({\n    appearance: 'none',\n    display: 'flex',\n    flexDirection: 'column',\n    justifyContent: 'center',\n    minWidth: 0,\n    width: 'full',\n    textAlign: 'left',\n    cursor: 'pointer',\n    borderWidth: 0,\n    backgroundColor: 'transparent',\n    color: 'text',\n    padding: 0,\n  }),\n  {\n    gridArea: 'content',\n    minHeight: '100%',\n    selectors: {\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors.primary}`,\n        outlineOffset: '2px',\n      },\n      '&:disabled': {\n        cursor: 'not-allowed',\n        opacity: 0.65,\n      },\n    },\n  },\n]);\n\nexport const content = style([\n  sprinkles({\n    display: 'flex',\n    flexDirection: 'column',\n    justifyContent: 'center',\n    gap: 0.5,\n    minWidth: 0,\n    width: 'full',\n  }),\n  {\n    maxWidth: '100%',\n  },\n]);\n\nexport const valueBox = sprinkles({\n  flex: 1,\n  minWidth: 0,\n  display: 'flex',\n  alignItems: 'center',\n  overflow: 'hidden',\n});\n\nexport const labelText = style([\n  sprinkles({\n    display: 'block',\n    color: 'textMuted',\n    fontSize: 'xs',\n    fontWeight: 'medium',\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n  }),\n  {\n    minWidth: 0,\n  },\n]);\n\nexport const valueText = sprinkles({\n  display: 'block',\n  minWidth: 0,\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n  fontSize: 'sm',\n  fontWeight: 'semibold',\n});\n\nexport const placeholder = sprinkles({\n  display: 'block',\n  minWidth: 0,\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n  color: 'textMuted',\n  fontSize: 'sm',\n});\n\nconst actionButtonBase = style([\n  sprinkles({\n    appearance: 'none',\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: 7,\n    height: 7,\n    padding: 0,\n    borderRadius: 'lg',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'borderSubtle',\n    backgroundColor: 'surface',\n    color: 'textMuted',\n    cursor: 'pointer',\n    transitionProperty: 'colors',\n    transitionDuration: 120,\n    transitionTimingFunction: 'ease',\n  }),\n  {\n    alignSelf: 'center',\n    selectors: {\n      '&:hover:not(:disabled)': {\n        color: vars.colors.text,\n        backgroundColor: vars.colors.surfaceMuted,\n        borderColor: vars.colors.borderStrong,\n      },\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors.primary}`,\n        outlineOffset: '2px',\n      },\n      '&:disabled': {\n        cursor: 'not-allowed',\n        opacity: 0.65,\n      },\n    },\n  },\n]);\n\nexport const pickActionButton = style([\n  actionButtonBase,\n  {\n    gridArea: 'pickAction',\n  },\n]);\n\nexport const clearButton = style([\n  actionButtonBase,\n  sprinkles({\n    borderRadius: 'full',\n    backgroundColor: 'surfaceMuted',\n  }),\n  {\n    gridArea: 'clearAction',\n  },\n]);\n\nexport const actionIcon = style({\n  width: '1rem',\n  height: '1rem',\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/hub/BackofficeHubTemplate.js

@@ -1,61 +1,63 @@
 import { content as e, grid as t, group as n, groupHeader as r, groupHeading as i, groupTitle as a, groups as o, item as s, itemContent as c, itemIcon as l, itemTitle as u } from "./backofficeHubTemplate.css.js";
-import { BackofficeEmptyState as d, GlobalSearchInput as f, SidebarTasksSvg as p } from "@plumile/ui";
-import { jsx as m, jsxs as h } from "react/jsx-runtime";
-import { Link as g } from "@plumile/router";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+import { BackofficeEmptyState as p } from "@plumile/ui/backoffice/molecules/backoffice_empty_state/BackofficeEmptyState.js";
+import m from "@plumile/router/routing/Link.js";
+import { GlobalSearchInput as h } from "@plumile/ui/backoffice/molecules/global_search_input/GlobalSearchInput.js";
+import { SidebarTasksSvg as g } from "@plumile/ui/icons/SidebarTasksSvg.js";
 //#region src/components/backoffice/hub/BackofficeHubTemplate.tsx
-var _ = /* @__PURE__ */ m(p, {
+var _ = /* @__PURE__ */ d(g, {
 	width: 20,
 	height: 20,
 	"aria-hidden": "true"
-}), v = ({ groups: p, search: v, emptyState: y }) => {
+}), v = ({ groups: g, search: v, emptyState: y }) => {
 	let b;
-	return b = p.length === 0 ? /* @__PURE__ */ m(d, {
+	return b = g.length === 0 ? /* @__PURE__ */ d(p, {
 		title: y.title,
 		description: y.description,
 		icon: y.icon ?? _
-	}) : /* @__PURE__ */ m("div", {
+	}) : /* @__PURE__ */ d("div", {
 		className: o,
-		children: p.map((e) => /* @__PURE__ */ h("section", {
+		children: g.map((e) => /* @__PURE__ */ f("section", {
 			className: n,
-			children: [/* @__PURE__ */ h("div", {
+			children: [/* @__PURE__ */ f("div", {
 				className: r,
-				children: [e.icon != null && /* @__PURE__ */ m("span", {
+				children: [e.icon != null && /* @__PURE__ */ d("span", {
 					className: "u4nszr0 txvbqb9jg txvbqbcp txvbqbdoy txvbqbty7 txvbqbc77 txvbqb1rg txvbqbv45 txvbqb1cp txvbqb1qg txvbqbwp txvbqbva1 txvbqbaj7",
 					"aria-hidden": "true",
 					children: e.icon
-				}), /* @__PURE__ */ h("span", {
+				}), /* @__PURE__ */ f("span", {
 					className: i,
-					children: [/* @__PURE__ */ m("h2", {
+					children: [/* @__PURE__ */ d("h2", {
 						className: a,
 						children: e.title
-					}), e.description != null && /* @__PURE__ */ m("span", {
+					}), e.description != null && /* @__PURE__ */ d("span", {
 						className: "txvbqbva3 txvbqb8y",
 						children: e.description
 					})]
 				})]
-			}), /* @__PURE__ */ m("div", {
+			}), /* @__PURE__ */ d("div", {
 				className: t,
 				children: e.items.map((e) => {
 					let t = e.icon ?? _, n = e.description != null && e.description !== "", r = e.metaLabel != null && e.metaLabel !== "";
-					return /* @__PURE__ */ h(g, {
+					return /* @__PURE__ */ f(m, {
 						to: e.href,
 						className: s,
-						children: [/* @__PURE__ */ m("span", {
+						children: [/* @__PURE__ */ d("span", {
 							className: l,
 							"aria-hidden": "true",
 							children: t
-						}), /* @__PURE__ */ h("span", {
+						}), /* @__PURE__ */ f("span", {
 							className: c,
 							children: [
-								/* @__PURE__ */ m("span", {
+								/* @__PURE__ */ d("span", {
 									className: u,
 									children: e.label
 								}),
-								n && /* @__PURE__ */ m("span", {
+								n && /* @__PURE__ */ d("span", {
 									className: "txvbqbva3 txvbqb8y txvbqbfb7 txvbqbl87",
 									children: e.description
 								}),
-								r && /* @__PURE__ */ m("span", {
+								r && /* @__PURE__ */ d("span", {
 									className: "txvbqbva3 txvbqb8p txvbqbamg txvbqb66 txvbqbeep",
 									children: e.metaLabel
 								})
@@ -65,11 +67,11 @@ var _ = /* @__PURE__ */ m(p, {
 				})
 			})]
 		}, e.id))
-	}), /* @__PURE__ */ h("div", {
+	}), /* @__PURE__ */ f("div", {
 		className: e,
-		children: [v != null && /* @__PURE__ */ m("div", {
+		children: [v != null && /* @__PURE__ */ d("div", {
 			className: "txvbqbjbp",
-			children: /* @__PURE__ */ m(f, {
+			children: /* @__PURE__ */ d(h, {
 				value: v.value,
 				onChange: v.onChange,
 				placeholder: v.placeholder

package/lib/esm/components/backoffice/hub/BackofficeHubTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"BackofficeHubTemplate.js","names":[],"sources":["../../../../../src/components/backoffice/hub/BackofficeHubTemplate.tsx"],"sourcesContent":["import { type JSX, type ReactNode } from 'react';\nimport { Link } from '@plumile/router';\nimport {\n  BackofficeEmptyState,\n  GlobalSearchInput,\n  SidebarTasksSvg,\n} from '@plumile/ui';\n\nimport * as styles from './backofficeHubTemplate.css.js';\n\nexport type BackofficeHubTemplateItemKind = 'entity' | 'tool';\n\nexport type BackofficeHubTemplateItem = {\n  id: string;\n  kind: BackofficeHubTemplateItemKind;\n  label: string;\n  href: string;\n  icon?: ReactNode;\n  description?: string | null;\n  metaLabel?: string | null;\n};\n\nexport type BackofficeHubTemplateGroup = {\n  id: string;\n  title: string;\n  description?: string | null;\n  icon?: ReactNode;\n  items: readonly BackofficeHubTemplateItem[];\n};\n\nexport type BackofficeHubTemplateEmptyState = {\n  title: string;\n  description: string;\n  icon?: ReactNode;\n};\n\nexport type BackofficeHubTemplateSearch = {\n  value: string;\n  onChange: (value: string) => void;\n  placeholder: string;\n};\n\nexport type BackofficeHubTemplateProps = {\n  groups: readonly BackofficeHubTemplateGroup[];\n  search?: BackofficeHubTemplateSearch;\n  emptyState: BackofficeHubTemplateEmptyState;\n};\n\nconst fallbackIcon = (\n  <SidebarTasksSvg width={20} height={20} aria-hidden=\"true\" />\n);\n\nexport const BackofficeHubTemplate = ({\n  groups,\n  search,\n  emptyState,\n}: BackofficeHubTemplateProps): JSX.Element => {\n  let body: JSX.Element;\n\n  if (groups.length === 0) {\n    body = (\n      <BackofficeEmptyState\n        title={emptyState.title}\n        description={emptyState.description}\n        icon={emptyState.icon ?? fallbackIcon}\n      />\n    );\n  } else {\n    body = (\n      <div className={styles.groups}>\n        {groups.map((group) => {\n          return (\n            <section key={group.id} className={styles.group}>\n              <div className={styles.groupHeader}>\n                {group.icon != null && (\n                  <span className={styles.groupIcon} aria-hidden=\"true\">\n                    {group.icon}\n                  </span>\n                )}\n                <span className={styles.groupHeading}>\n                  <h2 className={styles.groupTitle}>{group.title}</h2>\n                  {group.description != null && (\n                    <span className={styles.groupDescription}>\n                      {group.description}\n                    </span>\n                  )}\n                </span>\n              </div>\n              <div className={styles.grid}>\n                {group.items.map((item) => {\n                  const icon = item.icon ?? fallbackIcon;\n                  const hasDescription =\n                    item.description != null && item.description !== '';\n                  const hasMetaLabel =\n                    item.metaLabel != null && item.metaLabel !== '';\n\n                  return (\n                    <Link\n                      key={`${item.kind}-${item.id}`}\n                      to={item.href}\n                      className={styles.item}\n                    >\n                      <span className={styles.itemIcon} aria-hidden=\"true\">\n                        {icon}\n                      </span>\n                      <span className={styles.itemContent}>\n                        <span className={styles.itemTitle}>{item.label}</span>\n                        {hasDescription && (\n                          <span className={styles.itemDescription}>\n                            {item.description}\n                          </span>\n                        )}\n                        {hasMetaLabel && (\n                          <span className={styles.itemMeta}>\n                            {item.metaLabel}\n                          </span>\n                        )}\n                      </span>\n                    </Link>\n                  );\n                })}\n              </div>\n            </section>\n          );\n        })}\n      </div>\n    );\n  }\n\n  return (\n    <div className={styles.content}>\n      {search != null && (\n        <div className={styles.search}>\n          <GlobalSearchInput\n            value={search.value}\n            onChange={search.onChange}\n            placeholder={search.placeholder}\n          />\n        </div>\n      )}\n      {body}\n    </div>\n  );\n};\n\nexport default BackofficeHubTemplate;\n"],"mappings":";;;;;AAgDA,IAAM,IACJ,kBAAC,GAAD;CAAiB,OAAO;CAAI,QAAQ;CAAI,eAAY;CAAS,CAAA,EAGlD,KAAyB,EACpC,QAAA,GACA,QAAA,GACA,oBAC6C;CAC7C,IAAI;CAwEJ,OAtEA,AASE,IATE,EAAO,WAAW,IAElB,kBAAC,GAAD;EACE,OAAO,EAAW;EAClB,aAAa,EAAW;EACxB,MAAM,EAAW,QAAQ;EACzB,CAAA,GAIF,kBAAC,OAAD;EAAK,WAAW;YACb,EAAO,KAAK,MAET,kBAAC,WAAD;GAAwB,WAAW;aAAnC,CACE,kBAAC,OAAD;IAAK,WAAW;cAAhB,CACG,EAAM,QAAQ,QACb,kBAAC,QAAD;KAAM,WAAW;KAAkB,eAAY;eAC5C,EAAM;KACF,CAAA,EAET,kBAAC,QAAD;KAAM,WAAW;eAAjB,CACE,kBAAC,MAAD;MAAI,WAAW;gBAAoB,EAAM;MAAW,CAAA,EACnD,EAAM,eAAe,QACpB,kBAAC,QAAD;MAAM,WAAW;gBACd,EAAM;MACF,CAAA,CAEJ;OACH;OACN,kBAAC,OAAD;IAAK,WAAW;cACb,EAAM,MAAM,KAAK,MAAS;KACzB,IAAM,IAAO,EAAK,QAAQ,GACpB,IACJ,EAAK,eAAe,QAAQ,EAAK,gBAAgB,IAC7C,IACJ,EAAK,aAAa,QAAQ,EAAK,cAAc;KAE/C,OACE,kBAAC,GAAD;MAEE,IAAI,EAAK;MACT,WAAW;gBAHb,CAKE,kBAAC,QAAD;OAAM,WAAW;OAAiB,eAAY;iBAC3C;OACI,CAAA,EACP,kBAAC,QAAD;OAAM,WAAW;iBAAjB;QACE,kBAAC,QAAD;SAAM,WAAW;mBAAmB,EAAK;SAAa,CAAA;QACrD,KACC,kBAAC,QAAD;SAAM,WAAW;mBACd,EAAK;SACD,CAAA;QAER,KACC,kBAAC,QAAD;SAAM,WAAW;mBACd,EAAK;SACD,CAAA;QAEJ;SACF;QApBA,GAAG,EAAK,KAAK,GAAG,EAAK,KAoBrB;MAET;IACE,CAAA,CACE;KAlDI,EAAM,GAkDV,CAEZ;EACE,CAAA,EAKR,kBAAC,OAAD;EAAK,WAAW;YAAhB,CACG,KAAU,QACT,kBAAC,OAAD;GAAK,WAAW;aACd,kBAAC,GAAD;IACE,OAAO,EAAO;IACd,UAAU,EAAO;IACjB,aAAa,EAAO;IACpB,CAAA;GACE,CAAA,EAEP,EACG"}
+{"version":3,"file":"BackofficeHubTemplate.js","names":[],"sources":["../../../../../src/components/backoffice/hub/BackofficeHubTemplate.tsx"],"sourcesContent":["import { type JSX, type ReactNode } from 'react';\nimport Link from '@plumile/router/routing/Link.js';\nimport { BackofficeEmptyState } from '@plumile/ui/backoffice/molecules/backoffice_empty_state/BackofficeEmptyState.js';\nimport { GlobalSearchInput } from '@plumile/ui/backoffice/molecules/global_search_input/GlobalSearchInput.js';\nimport { SidebarTasksSvg } from '@plumile/ui/icons/SidebarTasksSvg.js';\n\nimport * as styles from './backofficeHubTemplate.css.js';\n\nexport type BackofficeHubTemplateItemKind = 'entity' | 'tool';\n\nexport type BackofficeHubTemplateItem = {\n  id: string;\n  kind: BackofficeHubTemplateItemKind;\n  label: string;\n  href: string;\n  icon?: ReactNode;\n  description?: string | null;\n  metaLabel?: string | null;\n};\n\nexport type BackofficeHubTemplateGroup = {\n  id: string;\n  title: string;\n  description?: string | null;\n  icon?: ReactNode;\n  items: readonly BackofficeHubTemplateItem[];\n};\n\nexport type BackofficeHubTemplateEmptyState = {\n  title: string;\n  description: string;\n  icon?: ReactNode;\n};\n\nexport type BackofficeHubTemplateSearch = {\n  value: string;\n  onChange: (value: string) => void;\n  placeholder: string;\n};\n\nexport type BackofficeHubTemplateProps = {\n  groups: readonly BackofficeHubTemplateGroup[];\n  search?: BackofficeHubTemplateSearch;\n  emptyState: BackofficeHubTemplateEmptyState;\n};\n\nconst fallbackIcon = (\n  <SidebarTasksSvg width={20} height={20} aria-hidden=\"true\" />\n);\n\nexport const BackofficeHubTemplate = ({\n  groups,\n  search,\n  emptyState,\n}: BackofficeHubTemplateProps): JSX.Element => {\n  let body: JSX.Element;\n\n  if (groups.length === 0) {\n    body = (\n      <BackofficeEmptyState\n        title={emptyState.title}\n        description={emptyState.description}\n        icon={emptyState.icon ?? fallbackIcon}\n      />\n    );\n  } else {\n    body = (\n      <div className={styles.groups}>\n        {groups.map((group) => {\n          return (\n            <section key={group.id} className={styles.group}>\n              <div className={styles.groupHeader}>\n                {group.icon != null && (\n                  <span className={styles.groupIcon} aria-hidden=\"true\">\n                    {group.icon}\n                  </span>\n                )}\n                <span className={styles.groupHeading}>\n                  <h2 className={styles.groupTitle}>{group.title}</h2>\n                  {group.description != null && (\n                    <span className={styles.groupDescription}>\n                      {group.description}\n                    </span>\n                  )}\n                </span>\n              </div>\n              <div className={styles.grid}>\n                {group.items.map((item) => {\n                  const icon = item.icon ?? fallbackIcon;\n                  const hasDescription =\n                    item.description != null && item.description !== '';\n                  const hasMetaLabel =\n                    item.metaLabel != null && item.metaLabel !== '';\n\n                  return (\n                    <Link\n                      key={`${item.kind}-${item.id}`}\n                      to={item.href}\n                      className={styles.item}\n                    >\n                      <span className={styles.itemIcon} aria-hidden=\"true\">\n                        {icon}\n                      </span>\n                      <span className={styles.itemContent}>\n                        <span className={styles.itemTitle}>{item.label}</span>\n                        {hasDescription && (\n                          <span className={styles.itemDescription}>\n                            {item.description}\n                          </span>\n                        )}\n                        {hasMetaLabel && (\n                          <span className={styles.itemMeta}>\n                            {item.metaLabel}\n                          </span>\n                        )}\n                      </span>\n                    </Link>\n                  );\n                })}\n              </div>\n            </section>\n          );\n        })}\n      </div>\n    );\n  }\n\n  return (\n    <div className={styles.content}>\n      {search != null && (\n        <div className={styles.search}>\n          <GlobalSearchInput\n            value={search.value}\n            onChange={search.onChange}\n            placeholder={search.placeholder}\n          />\n        </div>\n      )}\n      {body}\n    </div>\n  );\n};\n\nexport default BackofficeHubTemplate;\n"],"mappings":";;;;;;;AA8CA,IAAM,IACJ,kBAAC,GAAD;CAAiB,OAAO;CAAI,QAAQ;CAAI,eAAY;CAAS,CAAA,EAGlD,KAAyB,EACpC,QAAA,GACA,QAAA,GACA,oBAC6C;CAC7C,IAAI;CAwEJ,OAtEA,AASE,IATE,EAAO,WAAW,IAElB,kBAAC,GAAD;EACE,OAAO,EAAW;EAClB,aAAa,EAAW;EACxB,MAAM,EAAW,QAAQ;EACzB,CAAA,GAIF,kBAAC,OAAD;EAAK,WAAW;YACb,EAAO,KAAK,MAET,kBAAC,WAAD;GAAwB,WAAW;aAAnC,CACE,kBAAC,OAAD;IAAK,WAAW;cAAhB,CACG,EAAM,QAAQ,QACb,kBAAC,QAAD;KAAM,WAAW;KAAkB,eAAY;eAC5C,EAAM;KACF,CAAA,EAET,kBAAC,QAAD;KAAM,WAAW;eAAjB,CACE,kBAAC,MAAD;MAAI,WAAW;gBAAoB,EAAM;MAAW,CAAA,EACnD,EAAM,eAAe,QACpB,kBAAC,QAAD;MAAM,WAAW;gBACd,EAAM;MACF,CAAA,CAEJ;OACH;OACN,kBAAC,OAAD;IAAK,WAAW;cACb,EAAM,MAAM,KAAK,MAAS;KACzB,IAAM,IAAO,EAAK,QAAQ,GACpB,IACJ,EAAK,eAAe,QAAQ,EAAK,gBAAgB,IAC7C,IACJ,EAAK,aAAa,QAAQ,EAAK,cAAc;KAE/C,OACE,kBAAC,GAAD;MAEE,IAAI,EAAK;MACT,WAAW;gBAHb,CAKE,kBAAC,QAAD;OAAM,WAAW;OAAiB,eAAY;iBAC3C;OACI,CAAA,EACP,kBAAC,QAAD;OAAM,WAAW;iBAAjB;QACE,kBAAC,QAAD;SAAM,WAAW;mBAAmB,EAAK;SAAa,CAAA;QACrD,KACC,kBAAC,QAAD;SAAM,WAAW;mBACd,EAAK;SACD,CAAA;QAER,KACC,kBAAC,QAAD;SAAM,WAAW;mBACd,EAAK;SACD,CAAA;QAEJ;SACF;QApBA,GAAG,EAAK,KAAK,GAAG,EAAK,KAoBrB;MAET;IACE,CAAA,CACE;KAlDI,EAAM,GAkDV,CAEZ;EACE,CAAA,EAKR,kBAAC,OAAD;EAAK,WAAW;YAAhB,CACG,KAAU,QACT,kBAAC,OAAD;GAAK,WAAW;aACd,kBAAC,GAAD;IACE,OAAO,EAAO;IACd,UAAU,EAAO;IACjB,aAAa,EAAO;IACpB,CAAA;GACE,CAAA,EAEP,EACG"}

package/lib/esm/components/backoffice/hub/backofficeHubTemplate.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficeHubTemplate.css.js","names":[],"sources":["../../../../../src/components/backoffice/hub/backofficeHubTemplate.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles, vars } from '@plumile/ui';\n\nexport const content = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 5,\n});\n\nexport const search = sprinkles({\n  maxWidth: '2xl',\n});\n\nexport const groups = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 6,\n});\n\nexport const group = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n});\n\nexport const groupHeader = sprinkles({\n  display: 'flex',\n  alignItems: 'flex-start',\n  gap: 3,\n});\n\nexport const groupIcon = style([\n  sprinkles({\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: 8,\n    height: 8,\n    borderRadius: 'md',\n    backgroundColor: 'surfaceMuted',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'borderSubtle',\n    color: 'textSecondary',\n    flexShrink: 0,\n  }),\n  {\n    marginTop: '1px',\n  },\n]);\n\nexport const groupHeading = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n  minWidth: 0,\n});\n\nexport const groupTitle = sprinkles({\n  fontSize: 'lg',\n  fontWeight: 'semibold',\n  color: 'text',\n  margin: 0,\n});\n\nexport const groupDescription = sprinkles({\n  color: 'textMuted',\n  fontSize: 'sm',\n});\n\nexport const grid = sprinkles({\n  display: 'grid',\n  gridTemplateColumns: 'autoFitMinmax260',\n  gap: 3,\n});\n\nexport const item = style([\n  sprinkles({\n    display: 'flex',\n    alignItems: 'flex-start',\n    gap: 3,\n    padding: 3,\n    borderRadius: 'md',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'borderSubtle',\n    backgroundColor: 'surface',\n    color: 'text',\n    textDecoration: 'none',\n    minWidth: 0,\n    transitionProperty: 'default',\n    transitionDuration: 150,\n    transitionTimingFunction: 'ease',\n  }),\n  {\n    minHeight: '92px',\n    selectors: {\n      '&:hover': {\n        borderColor: vars.colors.border,\n        backgroundColor: vars.colors.surfaceMuted,\n        transform: 'translateY(-1px)',\n      },\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors.primary}`,\n        outlineOffset: '2px',\n      },\n    },\n  },\n]);\n\nexport const itemIcon = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: 9,\n  height: 9,\n  borderRadius: 'md',\n  backgroundColor: 'surfaceMuted',\n  color: 'textSecondary',\n  flexShrink: 0,\n});\n\nexport const itemContent = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n  minWidth: 0,\n});\n\nexport const itemTitle = sprinkles({\n  fontWeight: 'semibold',\n  color: 'text',\n  overflowWrap: 'anywhere',\n});\n\nexport const itemDescription = sprinkles({\n  color: 'textMuted',\n  fontSize: 'sm',\n  lineHeight: 'normal',\n  overflowWrap: 'anywhere',\n});\n\nexport const itemMeta = sprinkles({\n  color: 'textMuted',\n  fontSize: 'xs',\n  fontWeight: 'medium',\n  textTransform: 'uppercase',\n  letterSpacing: 'wide',\n});\n"],"mappings":""}
+{"version":3,"file":"backofficeHubTemplate.css.js","names":[],"sources":["../../../../../src/components/backoffice/hub/backofficeHubTemplate.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.js';\n\nexport const content = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 5,\n});\n\nexport const search = sprinkles({\n  maxWidth: '2xl',\n});\n\nexport const groups = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 6,\n});\n\nexport const group = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n});\n\nexport const groupHeader = sprinkles({\n  display: 'flex',\n  alignItems: 'flex-start',\n  gap: 3,\n});\n\nexport const groupIcon = style([\n  sprinkles({\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: 8,\n    height: 8,\n    borderRadius: 'md',\n    backgroundColor: 'surfaceMuted',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'borderSubtle',\n    color: 'textSecondary',\n    flexShrink: 0,\n  }),\n  {\n    marginTop: '1px',\n  },\n]);\n\nexport const groupHeading = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n  minWidth: 0,\n});\n\nexport const groupTitle = sprinkles({\n  fontSize: 'lg',\n  fontWeight: 'semibold',\n  color: 'text',\n  margin: 0,\n});\n\nexport const groupDescription = sprinkles({\n  color: 'textMuted',\n  fontSize: 'sm',\n});\n\nexport const grid = sprinkles({\n  display: 'grid',\n  gridTemplateColumns: 'autoFitMinmax260',\n  gap: 3,\n});\n\nexport const item = style([\n  sprinkles({\n    display: 'flex',\n    alignItems: 'flex-start',\n    gap: 3,\n    padding: 3,\n    borderRadius: 'md',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'borderSubtle',\n    backgroundColor: 'surface',\n    color: 'text',\n    textDecoration: 'none',\n    minWidth: 0,\n    transitionProperty: 'default',\n    transitionDuration: 150,\n    transitionTimingFunction: 'ease',\n  }),\n  {\n    minHeight: '92px',\n    selectors: {\n      '&:hover': {\n        borderColor: vars.colors.border,\n        backgroundColor: vars.colors.surfaceMuted,\n        transform: 'translateY(-1px)',\n      },\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors.primary}`,\n        outlineOffset: '2px',\n      },\n    },\n  },\n]);\n\nexport const itemIcon = sprinkles({\n  display: 'inline-flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: 9,\n  height: 9,\n  borderRadius: 'md',\n  backgroundColor: 'surfaceMuted',\n  color: 'textSecondary',\n  flexShrink: 0,\n});\n\nexport const itemContent = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n  minWidth: 0,\n});\n\nexport const itemTitle = sprinkles({\n  fontWeight: 'semibold',\n  color: 'text',\n  overflowWrap: 'anywhere',\n});\n\nexport const itemDescription = sprinkles({\n  color: 'textMuted',\n  fontSize: 'sm',\n  lineHeight: 'normal',\n  overflowWrap: 'anywhere',\n});\n\nexport const itemMeta = sprinkles({\n  color: 'textMuted',\n  fontSize: 'xs',\n  fontWeight: 'medium',\n  textTransform: 'uppercase',\n  letterSpacing: 'wide',\n});\n"],"mappings":""}

package/lib/esm/components/backoffice/layout/backofficeSidebarActions.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"backofficeSidebarActions.css.js","names":[],"sources":["../../../../../src/components/backoffice/layout/backofficeSidebarActions.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles, vars } from '@plumile/ui';\n\nexport const actionButton = style([\n  sprinkles({\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: 6,\n    height: 6,\n    borderRadius: 'md',\n    borderWidth: 0,\n    borderStyle: 'none',\n    padding: 0,\n    backgroundColor: 'transparent',\n    color: 'textSecondary',\n    cursor: 'pointer',\n    transitionProperty: 'colors',\n    transitionDuration: 150,\n    transitionTimingFunction: 'ease',\n  }),\n  {\n    selectors: {\n      '&:hover': {\n        backgroundColor: vars.colors.surfaceMuted,\n        color: vars.colors.text,\n      },\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors['blue-500']}`,\n        outlineOffset: 2,\n      },\n    },\n  },\n]);\n"],"mappings":""}
+{"version":3,"file":"backofficeSidebarActions.css.js","names":[],"sources":["../../../../../src/components/backoffice/layout/backofficeSidebarActions.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.js';\n\nexport const actionButton = style([\n  sprinkles({\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: 6,\n    height: 6,\n    borderRadius: 'md',\n    borderWidth: 0,\n    borderStyle: 'none',\n    padding: 0,\n    backgroundColor: 'transparent',\n    color: 'textSecondary',\n    cursor: 'pointer',\n    transitionProperty: 'colors',\n    transitionDuration: 150,\n    transitionTimingFunction: 'ease',\n  }),\n  {\n    selectors: {\n      '&:hover': {\n        backgroundColor: vars.colors.surfaceMuted,\n        color: vars.colors.text,\n      },\n      '&:focus-visible': {\n        outline: `2px solid ${vars.colors['blue-500']}`,\n        outlineOffset: 2,\n      },\n    },\n  },\n]);\n"],"mappings":""}