@seij/common-ui 0.1.6 → 0.1.8

package/dist/lib/localdate/InputLocalDate.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputLocalDate.js","sources":["../../../src/lib/localdate/InputLocalDate.tsx"],"sourcesContent":["import { Input, makeStyles } from \"@fluentui/react-components\";\nimport { LocalDate } from \"@seij/common-types\";\nimport { forwardRef, InputHTMLAttributes, useCallback, useEffect, useState } from \"react\";\nimport { Rifm } from \"rifm\";\nimport { useI18n } from \"../i18n/i18n.react\";\n\nconst useStyles = makeStyles({\n  root: {\n    width: \"8em\",\n    \"> input\": {\n      textAlign: \"right\",\n    },\n  },\n});\n\nconst parseDigits = (string: string): string => (string.match(/\\d+/g) || []).join(\"\");\nconst formatDate = (string: string): string => {\n  const digits = parseDigits(string);\n  const chars = digits.split(\"\");\n  return chars.reduce((r, v, index) => (index === 2 || index === 4 ? `${r}/${v}` : `${r}${v}`), \"\").substr(0, 10);\n};\n\nconst formatDateWithAppend = (string: string): string => {\n  const res = formatDate(string);\n\n  if (string.endsWith(\"/\")) {\n    if (res.length === 2) {\n      return `${res}/`;\n    }\n\n    if (res.length === 5) {\n      return `${res}/`;\n    }\n  }\n  return res;\n};\nconst appendHyphen = (v: string): string => (v.length === 2 || v.length === 5 ? `${v}/` : v);\n\n/**\n * Input field for local dates with automatic adding of /\n * Values are in ISO8601 date part only\n *\n * Controlled component only\n *\n * @param props same props as an input\n * @return {JSX.Element}\n */\nexport interface InputLocalDateProps extends Omit<InputHTMLAttributes<HTMLInputElement>, \"value\" | \"onChange\"> {\n  value?: string;\n  onValueChange?: (value: LocalDate) => void;\n}\n\nexport const InputLocalDate = forwardRef<HTMLInputElement, InputLocalDateProps>((props, ref) => {\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  const { onValueChange, value = \"\", children, size, defaultValue, type, ...delegatedProps } = props;\n  const classNames = useStyles();\n  const { localDatePlaceholder, localDateFormattedToISO, localDateISOToFormattedInput } = useI18n();\n  const [formattedA, setFormattedA] = useState(localDateISOToFormattedInput(value));\n  const [normalizedValue, setNormalizedValue] = useState(value);\n\n  useEffect(() => {\n    if (value !== normalizedValue) {\n      setNormalizedValue(value);\n      setFormattedA(localDateISOToFormattedInput(value));\n    }\n  });\n\n  const handleChange = useCallback(\n    (inputValue: string) => {\n      setFormattedA(inputValue);\n      const parsed = localDateFormattedToISO(inputValue);\n      if (parsed !== normalizedValue) {\n        setNormalizedValue(parsed);\n        if (onValueChange) onValueChange(parsed);\n      }\n    },\n    [setFormattedA, normalizedValue, setNormalizedValue, onValueChange, localDateFormattedToISO],\n  );\n  return (\n    <Rifm\n      accept={/\\d+/g}\n      mask={10 <= formattedA.length}\n      format={formatDateWithAppend}\n      append={appendHyphen}\n      value={formattedA}\n      onChange={handleChange}\n    >\n      {({ value, onChange }) => (\n        <Input\n          placeholder={localDatePlaceholder()}\n          className={classNames.root}\n          value={value}\n          onChange={onChange}\n          ref={ref}\n          {...delegatedProps}\n        />\n      )}\n    </Rifm>\n  );\n});\n"],"names":["useStyles","makeStyles","parseDigits","string","formatDate","r","v","index","formatDateWithAppend","res","appendHyphen","InputLocalDate","forwardRef","props","ref","onValueChange","value","children","size","defaultValue","type","delegatedProps","classNames","localDatePlaceholder","localDateFormattedToISO","localDateISOToFormattedInput","useI18n","formattedA","setFormattedA","useState","normalizedValue","setNormalizedValue","useEffect","handleChange","useCallback","inputValue","parsed","jsx","Rifm","onChange","Input"],"mappings":";;;;;AAMA,MAAMA,IAAYC,EAAW;AAAA,EAC3B,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,WAAW;AAAA,MACT,WAAW;AAAA,IAAA;AAAA,EACb;AAEJ,CAAC,GAEKC,IAAc,CAACC,OAA4BA,EAAO,MAAM,MAAM,KAAK,CAAA,GAAI,KAAK,EAAE,GAC9EC,IAAa,CAACD,MACHD,EAAYC,CAAM,EACZ,MAAM,EAAE,EAChB,OAAO,CAACE,GAAGC,GAAGC,MAAWA,MAAU,KAAKA,MAAU,IAAI,GAAGF,CAAC,IAAIC,CAAC,KAAK,GAAGD,CAAC,GAAGC,CAAC,IAAK,EAAE,EAAE,OAAO,GAAG,EAAE,GAG1GE,IAAuB,CAACL,MAA2B;AACvD,QAAMM,IAAML,EAAWD,CAAM;AAE7B,MAAIA,EAAO,SAAS,GAAG,GAAG;AACxB,QAAIM,EAAI,WAAW;AACjB,aAAO,GAAGA,CAAG;AAGf,QAAIA,EAAI,WAAW;AACjB,aAAO,GAAGA,CAAG;AAAA,EAEjB;AACA,SAAOA;AACT,GACMC,IAAe,CAACJ,MAAuBA,EAAE,WAAW,KAAKA,EAAE,WAAW,IAAI,GAAGA,CAAC,MAAMA,GAgB7EK,IAAiBC,EAAkD,CAACC,GAAOC,MAAQ;AAE9F,QAAM,EAAE,eAAAC,GAAe,OAAAC,IAAQ,IAAI,UAAAC,GAAU,MAAAC,GAAM,cAAAC,GAAc,MAAAC,GAAM,GAAGC,EAAA,IAAmBR,GACvFS,IAAatB,EAAA,GACb,EAAE,sBAAAuB,GAAsB,yBAAAC,GAAyB,8BAAAC,EAAA,IAAiCC,EAAA,GAClF,CAACC,GAAYC,CAAa,IAAIC,EAASJ,EAA6BT,CAAK,CAAC,GAC1E,CAACc,GAAiBC,CAAkB,IAAIF,EAASb,CAAK;AAE5D,EAAAgB,EAAU,MAAM;AACd,IAAIhB,MAAUc,MACZC,EAAmBf,CAAK,GACxBY,EAAcH,EAA6BT,CAAK,CAAC;AAAA,EAErD,CAAC;AAED,QAAMiB,IAAeC;AAAA,IACnB,CAACC,MAAuB;AACtB,MAAAP,EAAcO,CAAU;AACxB,YAAMC,IAASZ,EAAwBW,CAAU;AACjD,MAAIC,MAAWN,MACbC,EAAmBK,CAAM,GACrBrB,OAA6BqB,CAAM;AAAA,IAE3C;AAAA,IACA,CAACR,GAAeE,GAAiBC,GAAoBhB,GAAeS,CAAuB;AAAA,EAAA;AAE7F,SACE,gBAAAa;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAQ;AAAA,MACR,MAAM,MAAMX,EAAW;AAAA,MACvB,QAAQnB;AAAA,MACR,QAAQE;AAAA,MACR,OAAOiB;AAAA,MACP,UAAUM;AAAA,MAET,UAAA,CAAC,EAAE,OAAAjB,GAAO,UAAAuB,QACT,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,aAAajB,EAAA;AAAA,UACb,WAAWD,EAAW;AAAA,UACtB,OAAON;AAAAA,UACP,UAAAuB;AAAA,UACA,KAAAzB;AAAA,UACC,GAAGO;AAAA,QAAA;AAAA,MAAA;AAAA,IACN;AAAA,EAAA;AAIR,CAAC;"}
+{"version":3,"file":"InputLocalDate.js","sources":["../../../src/lib/localdate/InputLocalDate.tsx"],"sourcesContent":["import { Input, makeStyles } from \"@fluentui/react-components\";\nimport { LocalDate } from \"@seij/common-types\";\nimport { forwardRef, InputHTMLAttributes, useCallback, useEffect, useState } from \"react\";\nimport { Rifm } from \"rifm\";\nimport { useI18n } from \"../i18n\";\n\nconst useStyles = makeStyles({\n  root: {\n    width: \"8em\",\n    \"> input\": {\n      textAlign: \"right\",\n    },\n  },\n});\n\nconst parseDigits = (string: string): string => (string.match(/\\d+/g) || []).join(\"\");\nconst formatDate = (string: string): string => {\n  const digits = parseDigits(string);\n  const chars = digits.split(\"\");\n  return chars.reduce((r, v, index) => (index === 2 || index === 4 ? `${r}/${v}` : `${r}${v}`), \"\").substr(0, 10);\n};\n\nconst formatDateWithAppend = (string: string): string => {\n  const res = formatDate(string);\n\n  if (string.endsWith(\"/\")) {\n    if (res.length === 2) {\n      return `${res}/`;\n    }\n\n    if (res.length === 5) {\n      return `${res}/`;\n    }\n  }\n  return res;\n};\nconst appendHyphen = (v: string): string => (v.length === 2 || v.length === 5 ? `${v}/` : v);\n\n/**\n * Input field for local dates with automatic adding of /\n * Values are in ISO8601 date part only\n *\n * Controlled component only\n *\n * @param props same props as an input\n * @return {JSX.Element}\n */\nexport interface InputLocalDateProps extends Omit<InputHTMLAttributes<HTMLInputElement>, \"value\" | \"onChange\"> {\n  value?: string;\n  onValueChange?: (value: LocalDate) => void;\n}\n\nexport const InputLocalDate = forwardRef<HTMLInputElement, InputLocalDateProps>((props, ref) => {\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  const { onValueChange, value = \"\", children, size, defaultValue, type, ...delegatedProps } = props;\n  const classNames = useStyles();\n  const { localDatePlaceholder, localDateFormattedToISO, localDateISOToFormattedInput } = useI18n();\n  const [formattedA, setFormattedA] = useState(localDateISOToFormattedInput(value));\n  const [normalizedValue, setNormalizedValue] = useState(value);\n\n  useEffect(() => {\n    if (value !== normalizedValue) {\n      setNormalizedValue(value);\n      setFormattedA(localDateISOToFormattedInput(value));\n    }\n  });\n\n  const handleChange = useCallback(\n    (inputValue: string) => {\n      setFormattedA(inputValue);\n      const parsed = localDateFormattedToISO(inputValue);\n      if (parsed !== normalizedValue) {\n        setNormalizedValue(parsed);\n        if (onValueChange) onValueChange(parsed);\n      }\n    },\n    [setFormattedA, normalizedValue, setNormalizedValue, onValueChange, localDateFormattedToISO],\n  );\n  return (\n    <Rifm\n      accept={/\\d+/g}\n      mask={10 <= formattedA.length}\n      format={formatDateWithAppend}\n      append={appendHyphen}\n      value={formattedA}\n      onChange={handleChange}\n    >\n      {({ value, onChange }) => (\n        <Input\n          placeholder={localDatePlaceholder()}\n          className={classNames.root}\n          value={value}\n          onChange={onChange}\n          ref={ref}\n          {...delegatedProps}\n        />\n      )}\n    </Rifm>\n  );\n});\n"],"names":["useStyles","makeStyles","parseDigits","string","formatDate","r","v","index","formatDateWithAppend","res","appendHyphen","InputLocalDate","forwardRef","props","ref","onValueChange","value","children","size","defaultValue","type","delegatedProps","classNames","localDatePlaceholder","localDateFormattedToISO","localDateISOToFormattedInput","useI18n","formattedA","setFormattedA","useState","normalizedValue","setNormalizedValue","useEffect","handleChange","useCallback","inputValue","parsed","jsx","Rifm","onChange","Input"],"mappings":";;;;;;AAMA,MAAMA,IAAYC,EAAW;AAAA,EAC3B,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,WAAW;AAAA,MACT,WAAW;AAAA,IAAA;AAAA,EACb;AAEJ,CAAC,GAEKC,IAAc,CAACC,OAA4BA,EAAO,MAAM,MAAM,KAAK,CAAA,GAAI,KAAK,EAAE,GAC9EC,IAAa,CAACD,MACHD,EAAYC,CAAM,EACZ,MAAM,EAAE,EAChB,OAAO,CAACE,GAAGC,GAAGC,MAAWA,MAAU,KAAKA,MAAU,IAAI,GAAGF,CAAC,IAAIC,CAAC,KAAK,GAAGD,CAAC,GAAGC,CAAC,IAAK,EAAE,EAAE,OAAO,GAAG,EAAE,GAG1GE,IAAuB,CAACL,MAA2B;AACvD,QAAMM,IAAML,EAAWD,CAAM;AAE7B,MAAIA,EAAO,SAAS,GAAG,GAAG;AACxB,QAAIM,EAAI,WAAW;AACjB,aAAO,GAAGA,CAAG;AAGf,QAAIA,EAAI,WAAW;AACjB,aAAO,GAAGA,CAAG;AAAA,EAEjB;AACA,SAAOA;AACT,GACMC,IAAe,CAACJ,MAAuBA,EAAE,WAAW,KAAKA,EAAE,WAAW,IAAI,GAAGA,CAAC,MAAMA,GAgB7EK,IAAiBC,EAAkD,CAACC,GAAOC,MAAQ;AAE9F,QAAM,EAAE,eAAAC,GAAe,OAAAC,IAAQ,IAAI,UAAAC,GAAU,MAAAC,GAAM,cAAAC,GAAc,MAAAC,GAAM,GAAGC,EAAA,IAAmBR,GACvFS,IAAatB,EAAA,GACb,EAAE,sBAAAuB,GAAsB,yBAAAC,GAAyB,8BAAAC,EAAA,IAAiCC,EAAA,GAClF,CAACC,GAAYC,CAAa,IAAIC,EAASJ,EAA6BT,CAAK,CAAC,GAC1E,CAACc,GAAiBC,CAAkB,IAAIF,EAASb,CAAK;AAE5D,EAAAgB,EAAU,MAAM;AACd,IAAIhB,MAAUc,MACZC,EAAmBf,CAAK,GACxBY,EAAcH,EAA6BT,CAAK,CAAC;AAAA,EAErD,CAAC;AAED,QAAMiB,IAAeC;AAAA,IACnB,CAACC,MAAuB;AACtB,MAAAP,EAAcO,CAAU;AACxB,YAAMC,IAASZ,EAAwBW,CAAU;AACjD,MAAIC,MAAWN,MACbC,EAAmBK,CAAM,GACrBrB,OAA6BqB,CAAM;AAAA,IAE3C;AAAA,IACA,CAACR,GAAeE,GAAiBC,GAAoBhB,GAAeS,CAAuB;AAAA,EAAA;AAE7F,SACE,gBAAAa;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAQ;AAAA,MACR,MAAM,MAAMX,EAAW;AAAA,MACvB,QAAQnB;AAAA,MACR,QAAQE;AAAA,MACR,OAAOiB;AAAA,MACP,UAAUM;AAAA,MAET,UAAA,CAAC,EAAE,OAAAjB,GAAO,UAAAuB,QACT,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,aAAajB,EAAA;AAAA,UACb,WAAWD,EAAW;AAAA,UACtB,OAAON;AAAAA,UACP,UAAAuB;AAAA,UACA,KAAAzB;AAAA,UACC,GAAGO;AAAA,QAAA;AAAA,MAAA;AAAA,IACN;AAAA,EAAA;AAIR,CAAC;"}

package/dist/lib/month/InputMonth.js

@@ -1,15 +1,16 @@
-import { jsx as u } from "react/jsx-runtime";
-import { useMemo as a } from "react";
-import { useI18n as p } from "../i18n/i18n.react.js";
-import { InputSelect as h } from "../select/InputSelect.js";
-const b = (l) => {
-  const { value: r, onValueChange: c, required: i, ...m } = l, { monthList: t, t: o } = p(), s = a(() => {
+import { jsx as s } from "react/jsx-runtime";
+import { useMemo as u } from "react";
+import "../i18n/i18n.service.js";
+import { useI18n as a } from "../i18n/i18n.react.js";
+import { InputSelect as i } from "../select/InputSelect.js";
+const g = (r) => {
+  const { value: l, onValueChange: m, required: h, ...c } = r, { monthList: t, t: o } = a(), p = u(() => {
     const e = t().map((n) => ({ code: "" + n.code, label: n.label }));
     return [{ code: "", label: "-- " + o("InputSelect_select") + " --" }, ...e];
   }, [t, o]);
-  return /* @__PURE__ */ u(h, { options: s, value: "" + r, onValueChange: (e) => c(parseInt(e)), ...m });
+  return /* @__PURE__ */ s(i, { options: p, value: "" + l, onValueChange: (e) => m(parseInt(e)), ...c });
 };
 export {
-  b as InputMonth
+  g as InputMonth
 };
 //# sourceMappingURL=InputMonth.js.map

package/dist/lib/month/InputMonth.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputMonth.js","sources":["../../../src/lib/month/InputMonth.tsx"],"sourcesContent":["import { Month } from \"@seij/common-types\";\nimport React, { useMemo } from \"react\";\nimport { useI18n } from \"../i18n/i18n.react\";\nimport { InputSelect } from \"../select/InputSelect\";\n\ntype HTMLInputElementCurated = Omit<\n  React.SelectHTMLAttributes<HTMLSelectElement>,\n  \"value\" | \"defaultValue\" | \"onChange\" | \"children\"\n>;\n\nexport interface InputMonthProps extends HTMLInputElementCurated {\n  value: Month;\n  onValueChange: (value: Month) => unknown;\n}\n\n/**\n * Permet de saisir un mois.\n */\nexport const InputMonth: React.FC<InputMonthProps> = (props) => {\n  const { value, onValueChange, required, ...other } = props;\n  const { monthList, t } = useI18n();\n  const options = useMemo(() => {\n    const months = monthList().map((it) => ({ code: \"\" + it.code, label: it.label }));\n    const emptyValueSelect = t(\"InputSelect_select\");\n    return [{ code: \"\", label: \"-- \" + emptyValueSelect + \" --\" }, ...months];\n  }, [monthList, t]);\n\n  return (\n    <InputSelect options={options} value={\"\" + value} onValueChange={(v) => onValueChange(parseInt(v))} {...other} />\n  );\n};\n"],"names":["InputMonth","props","value","onValueChange","required","other","monthList","t","useI18n","options","useMemo","months","it","jsx","InputSelect","v"],"mappings":";;;;AAkBO,MAAMA,IAAwC,CAACC,MAAU;AAC9D,QAAM,EAAE,OAAAC,GAAO,eAAAC,GAAe,UAAAC,GAAU,GAAGC,MAAUJ,GAC/C,EAAE,WAAAK,GAAW,GAAAC,EAAA,IAAMC,EAAA,GACnBC,IAAUC,EAAQ,MAAM;AAC5B,UAAMC,IAASL,EAAA,EAAY,IAAI,CAACM,OAAQ,EAAE,MAAM,KAAKA,EAAG,MAAM,OAAOA,EAAG,QAAQ;AAEhF,WAAO,CAAC,EAAE,MAAM,IAAI,OAAO,QADFL,EAAE,oBAAoB,IACO,SAAS,GAAGI,CAAM;AAAA,EAC1E,GAAG,CAACL,GAAWC,CAAC,CAAC;AAEjB,SACE,gBAAAM,EAACC,GAAA,EAAY,SAAAL,GAAkB,OAAO,KAAKP,GAAO,eAAe,CAACa,MAAMZ,EAAc,SAASY,CAAC,CAAC,GAAI,GAAGV,GAAO;AAEnH;"}
+{"version":3,"file":"InputMonth.js","sources":["../../../src/lib/month/InputMonth.tsx"],"sourcesContent":["import { Month } from \"@seij/common-types\";\nimport React, { useMemo } from \"react\";\nimport { useI18n } from \"../i18n\";\nimport { InputSelect } from \"../select/InputSelect\";\n\ntype HTMLInputElementCurated = Omit<\n  React.SelectHTMLAttributes<HTMLSelectElement>,\n  \"value\" | \"defaultValue\" | \"onChange\" | \"children\"\n>;\n\nexport interface InputMonthProps extends HTMLInputElementCurated {\n  value: Month;\n  onValueChange: (value: Month) => unknown;\n}\n\n/**\n * Permet de saisir un mois.\n */\nexport const InputMonth: React.FC<InputMonthProps> = (props) => {\n  const { value, onValueChange, required, ...other } = props;\n  const { monthList, t } = useI18n();\n  const options = useMemo(() => {\n    const months = monthList().map((it) => ({ code: \"\" + it.code, label: it.label }));\n    const emptyValueSelect = t(\"InputSelect_select\");\n    return [{ code: \"\", label: \"-- \" + emptyValueSelect + \" --\" }, ...months];\n  }, [monthList, t]);\n\n  return (\n    <InputSelect options={options} value={\"\" + value} onValueChange={(v) => onValueChange(parseInt(v))} {...other} />\n  );\n};\n"],"names":["InputMonth","props","value","onValueChange","required","other","monthList","t","useI18n","options","useMemo","months","it","jsx","InputSelect","v"],"mappings":";;;;;AAkBO,MAAMA,IAAwC,CAACC,MAAU;AAC9D,QAAM,EAAE,OAAAC,GAAO,eAAAC,GAAe,UAAAC,GAAU,GAAGC,MAAUJ,GAC/C,EAAE,WAAAK,GAAW,GAAAC,EAAA,IAAMC,EAAA,GACnBC,IAAUC,EAAQ,MAAM;AAC5B,UAAMC,IAASL,EAAA,EAAY,IAAI,CAACM,OAAQ,EAAE,MAAM,KAAKA,EAAG,MAAM,OAAOA,EAAG,QAAQ;AAEhF,WAAO,CAAC,EAAE,MAAM,IAAI,OAAO,QADFL,EAAE,oBAAoB,IACO,SAAS,GAAGI,CAAM;AAAA,EAC1E,GAAG,CAACL,GAAWC,CAAC,CAAC;AAEjB,SACE,gBAAAM,EAACC,GAAA,EAAY,SAAAL,GAAkB,OAAO,KAAKP,GAAO,eAAe,CAACa,MAAMZ,EAAc,SAASY,CAAC,CAAC,GAAI,GAAGV,GAAO;AAEnH;"}

package/dist/lib/navigation/Navigation.d.ts

@@ -1,6 +1,10 @@
 import { NavigationTreeItem } from './Navigation.types';
 /**
- * Affiche un menu de navigation
+ * Displays a navigation menu.
+ *
+ * Current implementation is limited to 2 hierarchical levels (direct items or group/items).
+ *
+ * This will be improved later.
  */
 export declare function Navigation({ items, }: {
     /** Liste des items du menu */

package/dist/lib/navigation/Navigation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Navigation.d.ts","sourceRoot":"","sources":["../../../src/lib/navigation/Navigation.tsx"],"names":[],"mappings":"AA4BA,OAAO,EAEL,kBAAkB,EAInB,MAAM,oBAAoB,CAAC;AAI5B;;GAEG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,GACN,EAAE;IACD,8BAA8B;IAC9B,KAAK,EAAE,kBAAkB,EAAE,CAAC;CAC7B,2CAYA"}
+{"version":3,"file":"Navigation.d.ts","sourceRoot":"","sources":["../../../src/lib/navigation/Navigation.tsx"],"names":[],"mappings":"AAUA,OAAO,EACL,kBAAkB,EAInB,MAAM,oBAAoB,CAAC;AAK5B;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,GACN,EAAE;IACD,8BAA8B;IAC9B,KAAK,EAAE,kBAAkB,EAAE,CAAC;CAC7B,2CAYA"}

package/dist/lib/navigation/Navigation.js

@@ -1,38 +1,36 @@
-import { jsx as n, jsxs as m } from "react/jsx-runtime";
-import { NavDivider as p, NavItem as v, Text as I, NavCategory as f, NavCategoryItem as C, NavSubItemGroup as B, NavSubItem as b } from "@fluentui/react-components";
-import { bundleIcon as o, Board20Filled as S, Board20Regular as h, People20Filled as x, People20Regular as y, BookContactsFilled as N, BookContactsRegular as F, CalendarEmptyFilled as R, CalendarEmptyRegular as T, SignOutFilled as k, SignOutRegular as P, PersonStarburstFilled as D, PersonStarburstRegular as E, BuildingBankFilled as O, BuildingBankRegular as j } from "@fluentui/react-icons";
-import { createContext as G, useMemo as L, useContext as c } from "react";
-import { createNavigationTreeItemServiceImpl as s } from "./NavigationService.js";
-const u = G(s([]));
-function _({
+import { jsx as t, jsxs as p } from "react/jsx-runtime";
+import { NavDivider as v, NavItem as d, NavCategory as l, NavCategoryItem as s, NavSubItemGroup as f, NavSubItem as I } from "@fluentui/react-components";
+import { createContext as g, useMemo as N, useContext as a } from "react";
+import { createNavigationTreeItemServiceImpl as c } from "./NavigationService.js";
+import { Icon as m } from "@seij/common-ui-icons";
+const o = g(c([]));
+function D({
   items: e
 }) {
-  const r = L(() => s(e), [e]), t = r.findTopLevelItems();
-  return /* @__PURE__ */ n(u.Provider, { value: r, children: t.map((i) => /* @__PURE__ */ n(M, { id: i.id }, i.id)) });
+  const i = N(() => c(e), [e]), n = i.findTopLevelItems();
+  return /* @__PURE__ */ t(o.Provider, { value: i, children: n.map((r) => /* @__PURE__ */ t(C, { id: r.id }, r.id)) });
 }
-function M({ id: e }) {
-  const t = c(u).findById(e);
-  return t.type === "divider" ? /* @__PURE__ */ n(U, { item: t }) : t.type === "page" ? /* @__PURE__ */ n(w, { item: t }) : t.type === "group" ? /* @__PURE__ */ n(q, { item: t }) : null;
+function C({ id: e }) {
+  const n = a(o).findById(e);
+  return n.type === "divider" ? /* @__PURE__ */ t(x, { item: n }) : n.type === "page" ? /* @__PURE__ */ t(h, { item: n }) : n.type === "group" ? /* @__PURE__ */ t(y, { item: n }) : null;
 }
-function U({ item: e }) {
-  return /* @__PURE__ */ n(p, {});
+function x({ item: e }) {
+  return /* @__PURE__ */ t(v, {});
 }
-function q({ item: e }) {
-  const r = c(u), t = d({ iconName: e.icon }), i = r.findChildren(e.id);
-  return /* @__PURE__ */ m(f, { value: e.id, children: [
-    /* @__PURE__ */ n(C, { icon: /* @__PURE__ */ n(t, {}), children: e.label }),
-    /* @__PURE__ */ n(B, { children: i.map((a) => {
-      const g = a;
-      return /* @__PURE__ */ n(b, { value: a.id, children: g.label }, a.id);
+function y({ item: e }) {
+  const n = a(o).findChildren(e.id);
+  return /* @__PURE__ */ p(l, { value: e.id, children: [
+    /* @__PURE__ */ t(s, { icon: /* @__PURE__ */ t(m, { name: e.icon ?? "empty", size: 20 }), children: e.label }),
+    /* @__PURE__ */ t(f, { children: n.map((r) => {
+      const u = r;
+      return /* @__PURE__ */ t(I, { value: r.id, children: u.label }, r.id);
     }) })
   ] });
 }
-function w({ item: e }) {
-  const r = d({ iconName: e.icon });
-  return /* @__PURE__ */ n(v, { value: e.id, icon: /* @__PURE__ */ n(r, {}), children: /* @__PURE__ */ n(I, { children: e.label }) });
+function h({ item: e }) {
+  return /* @__PURE__ */ t(d, { value: e.id, icon: /* @__PURE__ */ t(m, { name: e.icon ?? "empty", size: 20 }), children: e.label });
 }
-const z = o(S, h), A = o(x, y), H = o(N, F), l = o(R, T), J = o(k, P), K = o(D, E), Q = o(O, j), d = ({ iconName: e }) => e ? e === "dashboard" ? z : e === "users" ? A : e === "customers" ? H : e === "signout" ? J : e === "signin" ? K : e === "buildingBank" ? Q : l : l;
 export {
-  _ as Navigation
+  D as Navigation
 };
 //# sourceMappingURL=Navigation.js.map

package/dist/lib/navigation/Navigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"Navigation.js","sources":["../../../src/lib/navigation/Navigation.tsx"],"sourcesContent":["import {\n  NavCategory,\n  NavCategoryItem,\n  NavDivider,\n  NavItem,\n  NavSubItem,\n  NavSubItemGroup,\n  Text,\n} from \"@fluentui/react-components\";\nimport {\n  Board20Filled,\n  Board20Regular,\n  BookContactsFilled,\n  BookContactsRegular,\n  BuildingBankFilled,\n  BuildingBankRegular,\n  bundleIcon,\n  CalendarEmptyFilled,\n  CalendarEmptyRegular,\n  FluentIcon,\n  People20Filled,\n  People20Regular,\n  PersonStarburstFilled,\n  PersonStarburstRegular,\n  SignOutFilled,\n  SignOutRegular,\n} from \"@fluentui/react-icons\";\nimport { createContext, useContext, useMemo } from \"react\";\nimport {\n  NavigationTreeIconName,\n  NavigationTreeItem,\n  NavigationTreeItemDivider,\n  NavigationTreeItemGroup,\n  NavigationTreeItemPage,\n} from \"./Navigation.types\";\nimport { createNavigationTreeItemServiceImpl, NavigationTreeItemService } from \"./NavigationService\";\n\nconst itemsService = createContext<NavigationTreeItemService>(createNavigationTreeItemServiceImpl([]));\n/**\n * Affiche un menu de navigation\n */\nexport function Navigation({\n  items,\n}: {\n  /** Liste des items du menu */\n  items: NavigationTreeItem[];\n}) {\n  const service = useMemo(() => createNavigationTreeItemServiceImpl(items), [items]);\n\n  const topLevelItems = service.findTopLevelItems();\n\n  return (\n    <itemsService.Provider value={service}>\n      {topLevelItems.map((it) => (\n        <NavigationTreeItemComponent key={it.id} id={it.id} />\n      ))}\n    </itemsService.Provider>\n  );\n}\n\nfunction NavigationTreeItemComponent({ id }: { id: string }) {\n  const ctx = useContext(itemsService);\n  const item = ctx.findById(id);\n\n  if (item.type === \"divider\") return <NavigationTreeItemDividerComponent item={item as NavigationTreeItemDivider} />;\n  if (item.type === \"page\") return <NavigationTreeItemPageComponent item={item as NavigationTreeItemPage} />;\n  if (item.type === \"group\") return <NavigationTreeItemGroupComponent item={item as NavigationTreeItemGroup} />;\n  return null;\n}\n\nfunction NavigationTreeItemDividerComponent({ item }: { item: NavigationTreeItemDivider }) {\n  return <NavDivider />;\n}\nfunction NavigationTreeItemGroupComponent({ item }: { item: NavigationTreeItemGroup }) {\n  const ctx = useContext(itemsService);\n  const Icon = NavigationIcon({ iconName: item.icon });\n  const itemChildren = ctx.findChildren(item.id);\n  return (\n    <NavCategory value={item.id}>\n      <NavCategoryItem icon={<Icon />}>{item.label}</NavCategoryItem>\n      <NavSubItemGroup>\n        {itemChildren.map((child) => {\n          const page = child as NavigationTreeItemPage;\n          return (\n            <NavSubItem key={child.id} value={child.id}>\n              {page.label}\n            </NavSubItem>\n          );\n        })}\n      </NavSubItemGroup>\n    </NavCategory>\n  );\n}\nfunction NavigationTreeItemPageComponent({ item }: { item: NavigationTreeItemPage }) {\n  const Icon = NavigationIcon({ iconName: item.icon });\n  return (\n    <NavItem value={item.id} icon={<Icon />}>\n      <Text>{item.label}</Text>\n    </NavItem>\n  );\n}\n\n// -----------------------------------------------------------------------------\n// Gestion des icones\n// -----------------------------------------------------------------------------\n\nconst DashboardIcon = bundleIcon(Board20Filled, Board20Regular);\nconst UsersIcon = bundleIcon(People20Filled, People20Regular);\nconst CustomersIcon = bundleIcon(BookContactsFilled, BookContactsRegular);\nconst EmptyIcon = bundleIcon(CalendarEmptyFilled, CalendarEmptyRegular);\nconst SignOutIcon = bundleIcon(SignOutFilled, SignOutRegular);\nconst SignInIcon = bundleIcon(PersonStarburstFilled, PersonStarburstRegular);\nconst BuildingBankIcon = bundleIcon(BuildingBankFilled, BuildingBankRegular);\nconst NavigationIcon = ({ iconName }: { iconName?: NavigationTreeIconName | null | undefined }): FluentIcon => {\n  if (!iconName) return EmptyIcon;\n  if (iconName === \"dashboard\") return DashboardIcon;\n  if (iconName === \"users\") return UsersIcon;\n  if (iconName === \"customers\") return CustomersIcon;\n  if (iconName === \"signout\") return SignOutIcon;\n  if (iconName === \"signin\") return SignInIcon;\n  if (iconName === \"buildingBank\") return BuildingBankIcon;\n  return EmptyIcon;\n};\n"],"names":["itemsService","createContext","createNavigationTreeItemServiceImpl","Navigation","items","service","useMemo","topLevelItems","it","jsx","NavigationTreeItemComponent","id","item","useContext","NavigationTreeItemDividerComponent","NavigationTreeItemPageComponent","NavigationTreeItemGroupComponent","NavDivider","ctx","Icon","NavigationIcon","itemChildren","jsxs","NavCategory","NavCategoryItem","NavSubItemGroup","child","page","NavSubItem","NavItem","Text","DashboardIcon","bundleIcon","Board20Filled","Board20Regular","UsersIcon","People20Filled","People20Regular","CustomersIcon","BookContactsFilled","BookContactsRegular","EmptyIcon","CalendarEmptyFilled","CalendarEmptyRegular","SignOutIcon","SignOutFilled","SignOutRegular","SignInIcon","PersonStarburstFilled","PersonStarburstRegular","BuildingBankIcon","BuildingBankFilled","BuildingBankRegular","iconName"],"mappings":";;;;;AAqCA,MAAMA,IAAeC,EAAyCC,EAAoC,CAAA,CAAE,CAAC;AAI9F,SAASC,EAAW;AAAA,EACzB,OAAAC;AACF,GAGG;AACD,QAAMC,IAAUC,EAAQ,MAAMJ,EAAoCE,CAAK,GAAG,CAACA,CAAK,CAAC,GAE3EG,IAAgBF,EAAQ,kBAAA;AAE9B,2BACGL,EAAa,UAAb,EAAsB,OAAOK,GAC3B,YAAc,IAAI,CAACG,MAClB,gBAAAC,EAACC,KAAwC,IAAIF,EAAG,MAAdA,EAAG,EAAe,CACrD,GACH;AAEJ;AAEA,SAASE,EAA4B,EAAE,IAAAC,KAAsB;AAE3D,QAAMC,IADMC,EAAWb,CAAY,EAClB,SAASW,CAAE;AAE5B,SAAIC,EAAK,SAAS,YAAkB,gBAAAH,EAACK,KAAmC,MAAAF,GAAyC,IAC7GA,EAAK,SAAS,SAAe,gBAAAH,EAACM,KAAgC,MAAAH,GAAsC,IACpGA,EAAK,SAAS,UAAgB,gBAAAH,EAACO,KAAiC,MAAAJ,GAAuC,IACpG;AACT;AAEA,SAASE,EAAmC,EAAE,MAAAF,KAA6C;AACzF,2BAAQK,GAAA,EAAW;AACrB;AACA,SAASD,EAAiC,EAAE,MAAAJ,KAA2C;AACrF,QAAMM,IAAML,EAAWb,CAAY,GAC7BmB,IAAOC,EAAe,EAAE,UAAUR,EAAK,MAAM,GAC7CS,IAAeH,EAAI,aAAaN,EAAK,EAAE;AAC7C,SACE,gBAAAU,EAACC,GAAA,EAAY,OAAOX,EAAK,IACvB,UAAA;AAAA,IAAA,gBAAAH,EAACe,KAAgB,MAAM,gBAAAf,EAACU,GAAA,CAAA,CAAK,GAAK,YAAK,OAAM;AAAA,IAC7C,gBAAAV,EAACgB,GAAA,EACE,UAAAJ,EAAa,IAAI,CAACK,MAAU;AAC3B,YAAMC,IAAOD;AACb,aACE,gBAAAjB,EAACmB,KAA0B,OAAOF,EAAM,IACrC,UAAAC,EAAK,SADSD,EAAM,EAEvB;AAAA,IAEJ,CAAC,EAAA,CACH;AAAA,EAAA,GACF;AAEJ;AACA,SAASX,EAAgC,EAAE,MAAAH,KAA0C;AACnF,QAAMO,IAAOC,EAAe,EAAE,UAAUR,EAAK,MAAM;AACnD,SACE,gBAAAH,EAACoB,GAAA,EAAQ,OAAOjB,EAAK,IAAI,MAAM,gBAAAH,EAACU,GAAA,CAAA,CAAK,GACnC,UAAA,gBAAAV,EAACqB,GAAA,EAAM,UAAAlB,EAAK,OAAM,GACpB;AAEJ;AAMA,MAAMmB,IAAgBC,EAAWC,GAAeC,CAAc,GACxDC,IAAYH,EAAWI,GAAgBC,CAAe,GACtDC,IAAgBN,EAAWO,GAAoBC,CAAmB,GAClEC,IAAYT,EAAWU,GAAqBC,CAAoB,GAChEC,IAAcZ,EAAWa,GAAeC,CAAc,GACtDC,IAAaf,EAAWgB,GAAuBC,CAAsB,GACrEC,IAAmBlB,EAAWmB,GAAoBC,CAAmB,GACrEhC,IAAiB,CAAC,EAAE,UAAAiC,QACnBA,IACDA,MAAa,cAAoBtB,IACjCsB,MAAa,UAAgBlB,IAC7BkB,MAAa,cAAoBf,IACjCe,MAAa,YAAkBT,IAC/BS,MAAa,WAAiBN,IAC9BM,MAAa,iBAAuBH,IACjCT,IAPeA;"}
+{"version":3,"file":"Navigation.js","sources":["../../../src/lib/navigation/Navigation.tsx"],"sourcesContent":["import {\n  NavCategory,\n  NavCategoryItem,\n  NavDivider,\n  NavItem,\n  NavSubItem,\n  NavSubItemGroup,\n} from \"@fluentui/react-components\";\n\nimport { createContext, useContext, useMemo } from \"react\";\nimport {\n  NavigationTreeItem,\n  NavigationTreeItemDivider,\n  NavigationTreeItemGroup,\n  NavigationTreeItemPage,\n} from \"./Navigation.types\";\nimport { createNavigationTreeItemServiceImpl, NavigationTreeItemService } from \"./NavigationService\";\nimport { Icon } from \"@seij/common-ui-icons\";\n\nconst itemsService = createContext<NavigationTreeItemService>(createNavigationTreeItemServiceImpl([]));\n/**\n * Displays a navigation menu.\n *\n * Current implementation is limited to 2 hierarchical levels (direct items or group/items).\n *\n * This will be improved later.\n */\nexport function Navigation({\n  items,\n}: {\n  /** Liste des items du menu */\n  items: NavigationTreeItem[];\n}) {\n  const service = useMemo(() => createNavigationTreeItemServiceImpl(items), [items]);\n\n  const topLevelItems = service.findTopLevelItems();\n\n  return (\n    <itemsService.Provider value={service}>\n      {topLevelItems.map((it) => (\n        <NavigationTreeItemComponent key={it.id} id={it.id} />\n      ))}\n    </itemsService.Provider>\n  );\n}\n\nfunction NavigationTreeItemComponent({ id }: { id: string }) {\n  const ctx = useContext(itemsService);\n  const item = ctx.findById(id);\n\n  if (item.type === \"divider\") return <NavigationTreeItemDividerComponent item={item as NavigationTreeItemDivider} />;\n  if (item.type === \"page\") return <NavigationTreeItemPageComponent item={item as NavigationTreeItemPage} />;\n  if (item.type === \"group\") return <NavigationTreeItemGroupComponent item={item as NavigationTreeItemGroup} />;\n  return null;\n}\n\nfunction NavigationTreeItemDividerComponent({ item }: { item: NavigationTreeItemDivider }) {\n  return <NavDivider />;\n}\nfunction NavigationTreeItemGroupComponent({ item }: { item: NavigationTreeItemGroup }) {\n  const ctx = useContext(itemsService);\n  const itemChildren = ctx.findChildren(item.id);\n  return (\n    <NavCategory value={item.id}>\n      <NavCategoryItem icon={<Icon name={item.icon ?? \"empty\"} size={20} />}>{item.label}</NavCategoryItem>\n      <NavSubItemGroup>\n        {itemChildren.map((child) => {\n          const page = child as NavigationTreeItemPage;\n          return (\n            <NavSubItem key={child.id} value={child.id}>\n              {page.label}\n            </NavSubItem>\n          );\n        })}\n      </NavSubItemGroup>\n    </NavCategory>\n  );\n}\nfunction NavigationTreeItemPageComponent({ item }: { item: NavigationTreeItemPage }) {\n  return (\n    <NavItem value={item.id} icon={<Icon name={item.icon ?? \"empty\"} size={20} />}>\n      {item.label}\n    </NavItem>\n  );\n}\n"],"names":["itemsService","createContext","createNavigationTreeItemServiceImpl","Navigation","items","service","useMemo","topLevelItems","it","jsx","NavigationTreeItemComponent","id","item","useContext","NavigationTreeItemDividerComponent","NavigationTreeItemPageComponent","NavigationTreeItemGroupComponent","NavDivider","itemChildren","jsxs","NavCategory","NavCategoryItem","Icon","NavSubItemGroup","child","page","NavSubItem","NavItem"],"mappings":";;;;;AAmBA,MAAMA,IAAeC,EAAyCC,EAAoC,CAAA,CAAE,CAAC;AAQ9F,SAASC,EAAW;AAAA,EACzB,OAAAC;AACF,GAGG;AACD,QAAMC,IAAUC,EAAQ,MAAMJ,EAAoCE,CAAK,GAAG,CAACA,CAAK,CAAC,GAE3EG,IAAgBF,EAAQ,kBAAA;AAE9B,2BACGL,EAAa,UAAb,EAAsB,OAAOK,GAC3B,YAAc,IAAI,CAACG,MAClB,gBAAAC,EAACC,KAAwC,IAAIF,EAAG,MAAdA,EAAG,EAAe,CACrD,GACH;AAEJ;AAEA,SAASE,EAA4B,EAAE,IAAAC,KAAsB;AAE3D,QAAMC,IADMC,EAAWb,CAAY,EAClB,SAASW,CAAE;AAE5B,SAAIC,EAAK,SAAS,YAAkB,gBAAAH,EAACK,KAAmC,MAAAF,GAAyC,IAC7GA,EAAK,SAAS,SAAe,gBAAAH,EAACM,KAAgC,MAAAH,GAAsC,IACpGA,EAAK,SAAS,UAAgB,gBAAAH,EAACO,KAAiC,MAAAJ,GAAuC,IACpG;AACT;AAEA,SAASE,EAAmC,EAAE,MAAAF,KAA6C;AACzF,2BAAQK,GAAA,EAAW;AACrB;AACA,SAASD,EAAiC,EAAE,MAAAJ,KAA2C;AAErF,QAAMM,IADML,EAAWb,CAAY,EACV,aAAaY,EAAK,EAAE;AAC7C,SACE,gBAAAO,EAACC,GAAA,EAAY,OAAOR,EAAK,IACvB,UAAA;AAAA,IAAA,gBAAAH,EAACY,GAAA,EAAgB,MAAM,gBAAAZ,EAACa,GAAA,EAAK,MAAMV,EAAK,QAAQ,SAAS,MAAM,GAAA,CAAI,GAAK,UAAAA,EAAK,OAAM;AAAA,IACnF,gBAAAH,EAACc,GAAA,EACE,UAAAL,EAAa,IAAI,CAACM,MAAU;AAC3B,YAAMC,IAAOD;AACb,aACE,gBAAAf,EAACiB,KAA0B,OAAOF,EAAM,IACrC,UAAAC,EAAK,SADSD,EAAM,EAEvB;AAAA,IAEJ,CAAC,EAAA,CACH;AAAA,EAAA,GACF;AAEJ;AACA,SAAST,EAAgC,EAAE,MAAAH,KAA0C;AACnF,2BACGe,GAAA,EAAQ,OAAOf,EAAK,IAAI,MAAM,gBAAAH,EAACa,GAAA,EAAK,MAAMV,EAAK,QAAQ,SAAS,MAAM,GAAA,CAAI,GACxE,YAAK,OACR;AAEJ;"}

package/dist/lib/navigation/Navigation.types.d.ts

@@ -1,48 +1,90 @@
+import { IconName } from '@seij/common-ui-icons';
 /**
- * Liste des toutes les icones supportées par le menu de navigation
+ * All icon names supported by the Navigation menu.
+ *
+ * These are semantic identifiers consumed by the UI layer to render a visual
+ * icon next to a navigation entry. Keep this list in sync with the icon set
+ * actually available in the navigation component.
  */
-export type NavigationTreeIconName = "buildingBank" | "dashboard" | "customers" | "users" | "features" | "permissions" | "signin" | "signout";
+export type NavigationTreeIconName = IconName;
 /**
- * Type d'élément de navigation
+ * Kind of a navigation item.
+ *
+ * - "group": non-clickable category that can contain items
+ * - "page": clickable leaf that may navigate to `path`
+ * - "divider": visual separator between items in the same level
  */
 export type NavigationTreeItemType = "group" | "page" | "divider";
 /**
- * Règles d'affichage
+ * Visibility rule for an item depending on authentication status.
+ *
+ * - "loggedout": show only when the user is NOT authenticated
+ * - "loggedin": show only when the user IS authenticated
  */
 export type NavigationTreeItemRule = "loggedout" | "loggedin";
 /**
- * Element de menu, c'est ce que l'on doit renseigner pour
- * afficher un menu. Il faut les fournir dans une liste.
+ * A navigation tree item definition. Provide a flat list of items — the
+ * component will use `parentId` (for pages) to reconstruct the hierarchy.
+ *
+ * The goal is to be able to get navigation items as serializable DTO from backends and plugins.
+ *
+ * Notes
+ * - Use `NavigationTreeItemGroup` to create non-clickable categories.
+ * - Use `NavigationTreeItemPage` for actual leaf entries that may have a `path`.
+ * - Use `NavigationTreeItemDivider` to insert visual separators within a group.
  */
 export type NavigationTreeItem = NavigationTreeItemPage | NavigationTreeItemGroup | NavigationTreeItemDivider;
 export interface NavigationTreeItemBase {
-    /** Identifiant unique de l'entrée de menu */
+    /** Unique identifier of the navigation entry. Stable across renders. */
     id: string;
-    /** Type */
+    /** Item kind: group, page, or divider. */
     type: NavigationTreeItemType;
-    /** Règles d'affichage */
+    /**
+     * Optional visibility rule based on authentication status.
+     *
+     * The rule is used by security layers when they are availble, it means that, using just "common-ui"
+     * it doesn't do anything, but "@seij/common-auth" uses it to filter out items.
+     *
+     * Participates in the goal of having navigation items coming from a backend or plugins in serializable formats.
+     **/
     rule?: NavigationTreeItemRule;
 }
 export interface NavigationTreeItemPage extends NavigationTreeItemBase {
-    /** Libellé de l'entrée de menu */
+    /** Display label shown in the navigation. */
     label: string;
-    /** Description qui va juste en dessous, n'est pas obligatoire, n'est pas affiché à l'écran */
+    /**
+     * Optional description placed just under the label (not rendered in the UI by default).
+     * Can be used for help text or tooltips depending on the consumer.
+     */
     description?: string;
-    /** Item dans lequel le ranger ou null si c'est à la racine */
+    /**
+     * Parent group id, or null if the page is at the root level.
+     *
+     * Example: parentId = "admin" to place the page under the "Admin" group.
+     */
     parentId: string | null;
-    /** Item path for navigation. If provided, router will be called for this path */
+    /**
+     * Route path to navigate to when the item is selected. If omitted, the item is still
+     * selectable but no automatic navigation will occur; you may handle it manually.
+     */
     path?: string;
-    /** Si on veut mettre une icône */
+    /** Optional icon to render next to the label. */
     icon?: NavigationTreeIconName;
 }
 export interface NavigationTreeItemGroup extends NavigationTreeItemBase {
-    /** Libellé de l'entrée de menu */
+    /** Display label for the group header. */
     label: string;
-    /** Description qui va juste en dessous, n'est pas obligatoire, n'est pas affiché à l'écran */
+    /** Optional description (not rendered in the UI by default). */
     description?: string;
-    /** Si on veut mettre une icône */
+    /** Optional icon to render next to the group label. */
     icon?: NavigationTreeIconName;
 }
+/**
+ * Visual separator between items.
+ *
+ * Only the base fields are used: set `type: "divider"` and a unique `id`.
+ * Other base fields like `rule` may still control visibility.
+ */
 export interface NavigationTreeItemDivider extends NavigationTreeItemBase {
 }
 //# sourceMappingURL=Navigation.types.d.ts.map

package/dist/lib/navigation/Navigation.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Navigation.types.d.ts","sourceRoot":"","sources":["../../../src/lib/navigation/Navigation.types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAC9B,cAAc,GACd,WAAW,GACX,WAAW,GACX,OAAO,GACP,UAAU,GACV,aAAa,GACb,QAAQ,GACR,SAAS,CAAC;AAEd;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;AAClE;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG,WAAW,GAAG,UAAU,CAAC;AAE9D;;;GAGG;AACH,MAAM,MAAM,kBAAkB,GAAG,sBAAsB,GAAG,uBAAuB,GAAG,yBAAyB,CAAC;AAE9G,MAAM,WAAW,sBAAsB;IACrC,6CAA6C;IAC7C,EAAE,EAAE,MAAM,CAAC;IACX,WAAW;IACX,IAAI,EAAE,sBAAsB,CAAC;IAC7B,yBAAyB;IACzB,IAAI,CAAC,EAAE,sBAAsB,CAAC;CAC/B;AAED,MAAM,WAAW,sBAAuB,SAAQ,sBAAsB;IACpE,kCAAkC;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,8FAA8F;IAC9F,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8DAA8D;IAC9D,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,iFAAiF;IACjF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,kCAAkC;IAClC,IAAI,CAAC,EAAE,sBAAsB,CAAC;CAC/B;AACD,MAAM,WAAW,uBAAwB,SAAQ,sBAAsB;IACrE,kCAAkC;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,8FAA8F;IAC9F,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kCAAkC;IAClC,IAAI,CAAC,EAAE,sBAAsB,CAAC;CAC/B;AACD,MAAM,WAAW,yBAA0B,SAAQ,sBAAsB;CAAG"}
+{"version":3,"file":"Navigation.types.d.ts","sourceRoot":"","sources":["../../../src/lib/navigation/Navigation.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEjD;;;;;;GAMG;AACH,MAAM,MAAM,sBAAsB,GAAG,QAAQ,CAAC;AAE9C;;;;;;GAMG;AACH,MAAM,MAAM,sBAAsB,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;AAElE;;;;;GAKG;AACH,MAAM,MAAM,sBAAsB,GAAG,WAAW,GAAG,UAAU,CAAC;AAE9D;;;;;;;;;;GAUG;AACH,MAAM,MAAM,kBAAkB,GAAG,sBAAsB,GAAG,uBAAuB,GAAG,yBAAyB,CAAC;AAE9G,MAAM,WAAW,sBAAsB;IACrC,wEAAwE;IACxE,EAAE,EAAE,MAAM,CAAC;IACX,0CAA0C;IAC1C,IAAI,EAAE,sBAAsB,CAAC;IAC7B;;;;;;;QAOI;IACJ,IAAI,CAAC,EAAE,sBAAsB,CAAC;CAC/B;AAED,MAAM,WAAW,sBAAuB,SAAQ,sBAAsB;IACpE,6CAA6C;IAC7C,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iDAAiD;IACjD,IAAI,CAAC,EAAE,sBAAsB,CAAC;CAC/B;AACD,MAAM,WAAW,uBAAwB,SAAQ,sBAAsB;IACrE,0CAA0C;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,gEAAgE;IAChE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uDAAuD;IACvD,IAAI,CAAC,EAAE,sBAAsB,CAAC;CAC/B;AACD;;;;;GAKG;AACH,MAAM,WAAW,yBAA0B,SAAQ,sBAAsB;CAAG"}

package/dist/lib/responsive/useMobile.d.ts

@@ -0,0 +1,2 @@
+export declare function useIsMobile(breakpoint?: number): boolean;
+//# sourceMappingURL=useMobile.d.ts.map

package/dist/lib/responsive/useMobile.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMobile.d.ts","sourceRoot":"","sources":["../../../src/lib/responsive/useMobile.tsx"],"names":[],"mappings":"AAEA,wBAAgB,WAAW,CAAC,UAAU,SAAM,WAa3C"}

package/dist/lib/responsive/useMobile.js

@@ -0,0 +1,12 @@
+import { useState as r, useEffect as c } from "react";
+function a(e = 768) {
+  const [i, s] = r(() => window.innerWidth < e);
+  return c(() => {
+    const t = window.matchMedia(`(max-width: ${e}px)`), n = (o) => s(o.matches);
+    return t.addEventListener("change", n), () => t.removeEventListener("change", n);
+  }, [e]), i;
+}
+export {
+  a as useIsMobile
+};
+//# sourceMappingURL=useMobile.js.map

package/dist/lib/responsive/useMobile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMobile.js","sources":["../../../src/lib/responsive/useMobile.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\nexport function useIsMobile(breakpoint = 768) {\n  const [isMobile, setIsMobile] = useState(() => window.innerWidth < breakpoint);\n\n  useEffect(() => {\n    const mediaQuery = window.matchMedia(`(max-width: ${breakpoint}px)`);\n\n    const handler = (e: MediaQueryListEvent) => setIsMobile(e.matches);\n    mediaQuery.addEventListener(\"change\", handler);\n\n    return () => mediaQuery.removeEventListener(\"change\", handler);\n  }, [breakpoint]);\n\n  return isMobile;\n}\n"],"names":["useIsMobile","breakpoint","isMobile","setIsMobile","useState","useEffect","mediaQuery","handler","e"],"mappings":";AAEO,SAASA,EAAYC,IAAa,KAAK;AAC5C,QAAM,CAACC,GAAUC,CAAW,IAAIC,EAAS,MAAM,OAAO,aAAaH,CAAU;AAE7E,SAAAI,EAAU,MAAM;AACd,UAAMC,IAAa,OAAO,WAAW,eAAeL,CAAU,KAAK,GAE7DM,IAAU,CAACC,MAA2BL,EAAYK,EAAE,OAAO;AACjE,WAAAF,EAAW,iBAAiB,UAAUC,CAAO,GAEtC,MAAMD,EAAW,oBAAoB,UAAUC,CAAO;AAAA,EAC/D,GAAG,CAACN,CAAU,CAAC,GAERC;AACT;"}

package/dist/lib/view_layout/ViewTitle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ViewTitle.d.ts","sourceRoot":"","sources":["../../../src/lib/view_layout/ViewTitle.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,WAAW,MAAM;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,OAAO,EAAE,MAAM,GAAG,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,SAAS,GAAG,WAAW,GAAG,YAAY,CAAC;CAC9C;AAmCD;;GAEG;AACH,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,MAAM,EACN,OAAO,GACR,EAAE;IACD,0EAA0E;IAC1E,QAAQ,EAAE,SAAS,CAAC;IACpB,uEAAuE;IACvE,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB,2CAuDA"}
+{"version":3,"file":"ViewTitle.d.ts","sourceRoot":"","sources":["../../../src/lib/view_layout/ViewTitle.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlC,MAAM,WAAW,MAAM;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,OAAO,EAAE,MAAM,GAAG,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,SAAS,GAAG,WAAW,GAAG,YAAY,CAAC;CAC9C;AAmCD;;GAEG;AACH,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,MAAM,EACN,OAAO,GACR,EAAE;IACD,0EAA0E;IAC1E,QAAQ,EAAE,SAAS,CAAC;IACpB,uEAAuE;IACvE,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB,2CAuDA"}

package/dist/lib/view_layout/ViewTitle.js

@@ -1,8 +1,8 @@
-import { jsxs as c, jsx as n } from "react/jsx-runtime";
-import { makeStyles as h, Button as r, Title3 as y, Menu as x, MenuTrigger as b, MenuPopover as g, MenuList as C, MenuItem as I } from "@fluentui/react-components";
-import { ArrowLeftFilled as k, MoreVerticalFilled as A, AddSquareRegular as M, DeleteRegular as N } from "@fluentui/react-icons";
-import { isFunction as j } from "lodash-es";
-const v = h({
+import { jsxs as r, jsx as n } from "react/jsx-runtime";
+import { makeStyles as y, Button as c, Title3 as x, Menu as b, MenuTrigger as g, MenuPopover as k, MenuList as C, MenuItem as I } from "@fluentui/react-components";
+import { isFunction as A } from "lodash-es";
+import { Icon as s } from "@seij/common-ui-icons";
+const v = y({
   root: {
     display: "flex",
     align: "center",
@@ -34,37 +34,34 @@ const v = h({
     justifyContent: "flex-end"
   }
 });
-function w({
+function S({
   children: l,
   onBack: t,
   actions: i
 }) {
-  const s = v(), d = j(t), o = (i ?? []).filter((e) => e.type === "ADDITIONAL"), p = (i ?? []).filter((e) => e.type === "SECONDARY"), u = (i ?? []).filter((e) => e.type === "PRIMARY"), f = () => {
-    d && t && t();
-  }, a = async (e) => {
-    (i ?? []).find((m) => m.id === e)?.onClick();
+  const a = v(), o = A(t), m = (i ?? []).filter((e) => e.type === "ADDITIONAL"), p = (i ?? []).filter((e) => e.type === "SECONDARY"), f = (i ?? []).filter((e) => e.type === "PRIMARY"), u = () => {
+    o && t && t();
+  }, d = async (e) => {
+    (i ?? []).find((h) => h.id === e)?.onClick();
   };
-  return /* @__PURE__ */ c("div", { className: s.root, children: [
-    d && /* @__PURE__ */ n("div", { className: s.backButton, children: /* @__PURE__ */ n(r, { icon: /* @__PURE__ */ n(k, {}), appearance: "subtle", onClick: f }) }),
-    /* @__PURE__ */ n("div", { className: s.title, children: /* @__PURE__ */ n(y, { children: l }) }),
-    /* @__PURE__ */ c("div", { className: s.actions, children: [
-      p.length > 0 && p.map((e) => /* @__PURE__ */ n(r, { disabled: e.disabled, appearance: "secondary", onClick: () => a(e.id), children: e.label }, e.id)),
-      u.length > 0 && u.map((e) => /* @__PURE__ */ n(r, { disabled: e.disabled, appearance: "primary", onClick: () => a(e.id), children: e.label }, e.id))
+  return /* @__PURE__ */ r("div", { className: a.root, children: [
+    o && /* @__PURE__ */ n("div", { className: a.backButton, children: /* @__PURE__ */ n(c, { icon: /* @__PURE__ */ n(s, { name: "back" }), appearance: "subtle", onClick: u }) }),
+    /* @__PURE__ */ n("div", { className: a.title, children: /* @__PURE__ */ n(x, { children: l }) }),
+    /* @__PURE__ */ r("div", { className: a.actions, children: [
+      p.length > 0 && p.map((e) => /* @__PURE__ */ n(c, { disabled: e.disabled, appearance: "secondary", onClick: () => d(e.id), children: e.label }, e.id)),
+      f.length > 0 && f.map((e) => /* @__PURE__ */ n(c, { disabled: e.disabled, appearance: "primary", onClick: () => d(e.id), children: e.label }, e.id))
     ] }),
-    /* @__PURE__ */ n("div", { className: s.moreActions, children: o.length > 0 && /* @__PURE__ */ c(x, { positioning: { autoSize: !0 }, children: [
-      /* @__PURE__ */ n(b, { disableButtonEnhancement: !0, children: /* @__PURE__ */ n(r, { icon: /* @__PURE__ */ n(A, {}) }) }),
-      /* @__PURE__ */ n(g, { children: /* @__PURE__ */ n(C, { children: o.map((e) => /* @__PURE__ */ n(L, { action: e, onClick: a }, e.id)) }) })
+    /* @__PURE__ */ n("div", { className: a.moreActions, children: m.length > 0 && /* @__PURE__ */ r(b, { positioning: { autoSize: !0 }, children: [
+      /* @__PURE__ */ n(g, { disableButtonEnhancement: !0, children: /* @__PURE__ */ n(c, { icon: /* @__PURE__ */ n(s, { name: "more_menu_vertical" }) }) }),
+      /* @__PURE__ */ n(k, { children: /* @__PURE__ */ n(C, { children: m.map((e) => /* @__PURE__ */ n(M, { action: e, onClick: d }, e.id)) }) })
     ] }) })
   ] });
 }
-function B() {
-  return /* @__PURE__ */ n("span", {});
-}
-function L({ action: l, onClick: t }) {
+function M({ action: l, onClick: t }) {
   let i;
-  return l.icon === "plus" ? i = M : l.icon === "trash" ? i = N : i = B, /* @__PURE__ */ n(I, { disabled: l.disabled, onClick: () => t(l.id), icon: /* @__PURE__ */ n(i, {}), children: l.label });
+  return l.icon === "plus" ? i = /* @__PURE__ */ n(s, { name: "add" }) : l.icon === "trash" ? i = /* @__PURE__ */ n(s, { name: "delete" }) : i = /* @__PURE__ */ n(s, { name: "empty" }), /* @__PURE__ */ n(I, { disabled: l.disabled, onClick: () => t(l.id), icon: i, children: l.label });
 }
 export {
-  w as ViewTitle
+  S as ViewTitle
 };
 //# sourceMappingURL=ViewTitle.js.map

package/dist/lib/view_layout/ViewTitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"ViewTitle.js","sources":["../../../src/lib/view_layout/ViewTitle.tsx"],"sourcesContent":["import {\n  Button,\n  makeStyles,\n  Menu,\n  MenuItem,\n  MenuList,\n  MenuPopover,\n  MenuTrigger,\n  Title3,\n} from \"@fluentui/react-components\";\nimport { AddSquareRegular, ArrowLeftFilled, DeleteRegular, MoreVerticalFilled } from \"@fluentui/react-icons\";\nimport { isFunction } from \"lodash-es\";\nimport { ReactNode } from \"react\";\n\nexport interface Action {\n  id: string;\n  label: string;\n  icon?: \"plus\" | \"trash\";\n  onClick: () => any;\n  disabled?: boolean;\n  type: \"PRIMARY\" | \"SECONDARY\" | \"ADDITIONAL\";\n}\n\nconst useStyles = makeStyles({\n  root: {\n    display: \"flex\",\n    align: \"center\",\n    justify: \"space-between\",\n    justifyContent: \"center\",\n    height: \"48px\",\n  },\n  title: {\n    flex: 1,\n    display: \"flex\",\n    alignItems: \"center\",\n  },\n  backButton: {\n    flex: 0,\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"flex-start\",\n  },\n  actions: {\n    flex: 0,\n    display: \"flex\",\n    alignItems: \"center\",\n  },\n  moreActions: {\n    flex: 0,\n    display: \"flex\",\n    alignItems: \"center\",\n    minWidth: \"48px\",\n    justifyContent: \"flex-end\",\n  },\n});\n\n/**\n * Zone de titre d'une vue\n */\nexport function ViewTitle({\n  children,\n  onBack,\n  actions,\n}: {\n  /** Titre de la vue (en tout cas ce que l'on met dans la zone de titre) */\n  children: ReactNode;\n  /** Si spécifié, on ajoute une fleche \"back\" pour revenir en arrière */\n  onBack?: () => void;\n  /** Liste d'actions a ajouter à droite dans la zone d'actions */\n  actions?: Action[];\n}) {\n  const styles = useStyles();\n\n  const displayBackButton = isFunction(onBack);\n  const additionalList = (actions ?? []).filter((it) => it.type === \"ADDITIONAL\");\n  const secondaryList = (actions ?? []).filter((it) => it.type === \"SECONDARY\");\n  const primary = (actions ?? []).filter((it) => it.type === \"PRIMARY\");\n  const handleBack = () => {\n    if (displayBackButton && onBack) onBack();\n  };\n  const handleClick = async (id: string) => {\n    (actions ?? []).find((it) => it.id === id)?.onClick();\n  };\n  return (\n    <div className={styles.root}>\n      {displayBackButton && (\n        <div className={styles.backButton}>\n          <Button icon={<ArrowLeftFilled />} appearance=\"subtle\" onClick={handleBack} />\n        </div>\n      )}\n      <div className={styles.title}>\n        <Title3>{children}</Title3>\n      </div>\n      <div className={styles.actions}>\n        {secondaryList.length > 0 &&\n          secondaryList.map((it) => (\n            <Button key={it.id} disabled={it.disabled} appearance=\"secondary\" onClick={() => handleClick(it.id)}>\n              {it.label}\n            </Button>\n          ))}\n        {primary.length > 0 &&\n          primary.map((it) => (\n            <Button key={it.id} disabled={it.disabled} appearance=\"primary\" onClick={() => handleClick(it.id)}>\n              {it.label}\n            </Button>\n          ))}\n      </div>\n      <div className={styles.moreActions}>\n        {additionalList.length > 0 && (\n          <Menu positioning={{ autoSize: true }}>\n            <MenuTrigger disableButtonEnhancement>\n              <Button icon={<MoreVerticalFilled />} />\n            </MenuTrigger>\n            <MenuPopover>\n              <MenuList>\n                {additionalList.map((it) => (\n                  <AdditionalActionMenuItem key={it.id} action={it} onClick={handleClick} />\n                ))}\n              </MenuList>\n            </MenuPopover>\n          </Menu>\n        )}\n      </div>\n    </div>\n  );\n}\n\nfunction EmptyIcon() {\n  return <span />;\n}\n\nfunction AdditionalActionMenuItem({ action, onClick }: { action: Action; onClick: (id: string) => void }) {\n  let Icon: any;\n  if (action.icon === \"plus\") {\n    Icon = AddSquareRegular;\n  } else if (action.icon === \"trash\") {\n    Icon = DeleteRegular;\n  } else {\n    Icon = EmptyIcon;\n  }\n  return (\n    <MenuItem disabled={action.disabled} onClick={() => onClick(action.id)} icon={<Icon />}>\n      {action.label}\n    </MenuItem>\n  );\n}\n"],"names":["useStyles","makeStyles","ViewTitle","children","onBack","actions","styles","displayBackButton","isFunction","additionalList","it","secondaryList","primary","handleBack","handleClick","id","jsxs","jsx","Button","ArrowLeftFilled","Title3","Menu","MenuTrigger","MoreVerticalFilled","MenuPopover","MenuList","AdditionalActionMenuItem","EmptyIcon","action","onClick","Icon","AddSquareRegular","DeleteRegular","MenuItem"],"mappings":"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"}
+{"version":3,"file":"ViewTitle.js","sources":["../../../src/lib/view_layout/ViewTitle.tsx"],"sourcesContent":["import {\n  Button,\n  makeStyles,\n  Menu,\n  MenuItem,\n  MenuList,\n  MenuPopover,\n  MenuTrigger,\n  Title3,\n} from \"@fluentui/react-components\";\n\nimport { isFunction } from \"lodash-es\";\nimport { ReactNode } from \"react\";\nimport { Icon } from \"@seij/common-ui-icons\";\n\nexport interface Action {\n  id: string;\n  label: string;\n  icon?: \"plus\" | \"trash\";\n  onClick: () => any;\n  disabled?: boolean;\n  type: \"PRIMARY\" | \"SECONDARY\" | \"ADDITIONAL\";\n}\n\nconst useStyles = makeStyles({\n  root: {\n    display: \"flex\",\n    align: \"center\",\n    justify: \"space-between\",\n    justifyContent: \"center\",\n    height: \"48px\",\n  },\n  title: {\n    flex: 1,\n    display: \"flex\",\n    alignItems: \"center\",\n  },\n  backButton: {\n    flex: 0,\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"flex-start\",\n  },\n  actions: {\n    flex: 0,\n    display: \"flex\",\n    alignItems: \"center\",\n  },\n  moreActions: {\n    flex: 0,\n    display: \"flex\",\n    alignItems: \"center\",\n    minWidth: \"48px\",\n    justifyContent: \"flex-end\",\n  },\n});\n\n/**\n * Zone de titre d'une vue\n */\nexport function ViewTitle({\n  children,\n  onBack,\n  actions,\n}: {\n  /** Titre de la vue (en tout cas ce que l'on met dans la zone de titre) */\n  children: ReactNode;\n  /** Si spécifié, on ajoute une fleche \"back\" pour revenir en arrière */\n  onBack?: () => void;\n  /** Liste d'actions a ajouter à droite dans la zone d'actions */\n  actions?: Action[];\n}) {\n  const styles = useStyles();\n\n  const displayBackButton = isFunction(onBack);\n  const additionalList = (actions ?? []).filter((it) => it.type === \"ADDITIONAL\");\n  const secondaryList = (actions ?? []).filter((it) => it.type === \"SECONDARY\");\n  const primary = (actions ?? []).filter((it) => it.type === \"PRIMARY\");\n  const handleBack = () => {\n    if (displayBackButton && onBack) onBack();\n  };\n  const handleClick = async (id: string) => {\n    (actions ?? []).find((it) => it.id === id)?.onClick();\n  };\n  return (\n    <div className={styles.root}>\n      {displayBackButton && (\n        <div className={styles.backButton}>\n          <Button icon={<Icon name={\"back\"} />} appearance=\"subtle\" onClick={handleBack} />\n        </div>\n      )}\n      <div className={styles.title}>\n        <Title3>{children}</Title3>\n      </div>\n      <div className={styles.actions}>\n        {secondaryList.length > 0 &&\n          secondaryList.map((it) => (\n            <Button key={it.id} disabled={it.disabled} appearance=\"secondary\" onClick={() => handleClick(it.id)}>\n              {it.label}\n            </Button>\n          ))}\n        {primary.length > 0 &&\n          primary.map((it) => (\n            <Button key={it.id} disabled={it.disabled} appearance=\"primary\" onClick={() => handleClick(it.id)}>\n              {it.label}\n            </Button>\n          ))}\n      </div>\n      <div className={styles.moreActions}>\n        {additionalList.length > 0 && (\n          <Menu positioning={{ autoSize: true }}>\n            <MenuTrigger disableButtonEnhancement>\n              <Button icon={<Icon name=\"more_menu_vertical\" />} />\n            </MenuTrigger>\n            <MenuPopover>\n              <MenuList>\n                {additionalList.map((it) => (\n                  <AdditionalActionMenuItem key={it.id} action={it} onClick={handleClick} />\n                ))}\n              </MenuList>\n            </MenuPopover>\n          </Menu>\n        )}\n      </div>\n    </div>\n  );\n}\n\nfunction AdditionalActionMenuItem({ action, onClick }: { action: Action; onClick: (id: string) => void }) {\n  let icon: any;\n  if (action.icon === \"plus\") {\n    icon = <Icon name=\"add\" />;\n  } else if (action.icon === \"trash\") {\n    icon = <Icon name=\"delete\" />;\n  } else {\n    icon = <Icon name=\"empty\" />;\n  }\n  return (\n    <MenuItem disabled={action.disabled} onClick={() => onClick(action.id)} icon={icon}>\n      {action.label}\n    </MenuItem>\n  );\n}\n"],"names":["useStyles","makeStyles","ViewTitle","children","onBack","actions","styles","displayBackButton","isFunction","additionalList","it","secondaryList","primary","handleBack","handleClick","id","jsxs","Button","jsx","Icon","Title3","Menu","MenuTrigger","MenuPopover","MenuList","AdditionalActionMenuItem","action","onClick","icon","MenuItem"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seij/common-ui",
-  "version": "0.1.6",
+  "version": "0.1.8",
   "type": "module",
   "license": "Apache-2.0",
   "repository": {
@@ -9,13 +9,13 @@
   },
   "dependencies": {
     "@fluentui/react-components": "9.72.9",
-    "@fluentui/react-icons": "2.0.316",
     "i18next-browser-languagedetector": "8.2.0",
     "@seij/common-types": "0.1.3",
-    "i18next": "25.7.3",
-    "i18next-icu": "2.4.1",
+    "@seij/common-ui-icons": "0.1.2",
     "lodash-es": "4.17.22",
+    "i18next": "25.7.3",
     "date-fns": "4.1.0",
+    "i18next-icu": "2.4.1",
     "rifm": "0.12.1"
   },
   "devDependencies": {