@seij/common-ui 0.1.7 → 0.1.8

package/dist/lib/applicationshell/ApplicationShell.d.ts

@@ -14,6 +14,10 @@ export interface ApplicationShellProps {
      * Example: "Orders Console".
      */
     applicationName: string;
+    /**
+     * Icon to display next to the application name
+     */
+    applicationIcon?: ReactNode;
     /**
      * Main content of the page. This is rendered in the scrollable content area on the right
      * of the navigation drawer. Typically the routed page/component for the current URL.
@@ -76,5 +80,5 @@ export interface ApplicationShellProps {
  * Where `navigate`/`match` typically come from your router (e.g., react‑router v6's
  * `useNavigate`/`useMatch`). See `ApplicationShellProps` for details on each prop.
  */
-export declare function ApplicationShell({ applicationName, main, navigationItems, userStatus, onClickHome, navigate, matchPath, }: ApplicationShellProps): import("react/jsx-runtime").JSX.Element;
+export declare function ApplicationShell({ applicationName, applicationIcon, main, navigationItems, userStatus, onClickHome, navigate, matchPath, }: ApplicationShellProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ApplicationShell.d.ts.map

package/dist/lib/applicationshell/ApplicationShell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ApplicationShell.d.ts","sourceRoot":"","sources":["../../../src/lib/applicationshell/ApplicationShell.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,SAAS,EAAqB,MAAM,OAAO,CAAC;AAErD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAEpE,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAqCtD;;;;;;GAMG;AACH,MAAM,WAAW,qBAAqB;IACpC;;;OAGG;IACH,eAAe,EAAE,MAAM,CAAC;IAExB;;;OAGG;IACH,IAAI,EAAE,SAAS,CAAC;IAEhB;;;;OAIG;IACH,eAAe,EAAE,kBAAkB,EAAE,CAAC;IAEtC;;OAEG;IACH,UAAU,EAAE,UAAU,CAAC;IAEvB;;;OAGG;IACH,WAAW,EAAE,MAAM,IAAI,CAAC;IAExB;;;OAGG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAEjC;;;;OAIG;IACH,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,KAAK,OAAO,CAAC;CAClD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,eAAe,EACf,IAAI,EACJ,eAAe,EACf,UAAU,EACV,WAAW,EACX,QAAQ,EACR,SAAS,GACV,EAAE,qBAAqB,2CA2FvB"}
+{"version":3,"file":"ApplicationShell.d.ts","sourceRoot":"","sources":["../../../src/lib/applicationshell/ApplicationShell.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAgC,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAEpE,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAmCtD;;;;;;GAMG;AACH,MAAM,WAAW,qBAAqB;IACpC;;;OAGG;IACH,eAAe,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B;;;OAGG;IACH,IAAI,EAAE,SAAS,CAAC;IAEhB;;;;OAIG;IACH,eAAe,EAAE,kBAAkB,EAAE,CAAC;IAEtC;;OAEG;IACH,UAAU,EAAE,UAAU,CAAC;IAEvB;;;OAGG;IACH,WAAW,EAAE,MAAM,IAAI,CAAC;IAExB;;;OAGG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAEjC;;;;OAIG;IACH,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,KAAK,OAAO,CAAC;CAClD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,eAAe,EACf,eAAe,EACf,IAAI,EACJ,eAAe,EACf,UAAU,EACV,WAAW,EACX,QAAQ,EACR,SAAS,GACV,EAAE,qBAAqB,2CAqHvB"}

package/dist/lib/applicationshell/ApplicationShell.js

@@ -1,10 +1,13 @@
-import { jsxs as h, jsx as n } from "react/jsx-runtime";
-import { makeStyles as j, tokens as m, NavDrawer as M, NavDrawerHeader as A, NavDrawerBody as H, Tooltip as V, Hamburger as U } from "@fluentui/react-components";
-import { useState as u, useMemo as q } from "react";
-import { Navigation as z } from "../navigation/Navigation.js";
-import { createNavigationTreeItemServiceImpl as E } from "../navigation/NavigationService.js";
-import { TitleBar as I } from "./TitleBar.js";
-const y = j({
+import { jsxs as S, jsx as a } from "react/jsx-runtime";
+import { makeStyles as E, tokens as F } from "@fluentui/react-components";
+import { useState as c, useMemo as R, useEffect as T } from "react";
+import { createNavigationTreeItemServiceImpl as P } from "../navigation/NavigationService.js";
+import { TitleBar as U } from "./TitleBar.js";
+import { useIsMobile as q } from "../responsive/useMobile.js";
+import { Rails as z } from "./ApplicationShellRails.js";
+import { Sidebar as G } from "./ApplicationShellSidebar.js";
+import { MenuBurger as H } from "./ApplicationShellHamburger.js";
+const J = E({
   shell: {
     width: "100vw",
     height: "100vh",
@@ -28,83 +31,85 @@ const y = j({
     justifyContent: "flex-start",
     alignItems: "flex-start",
     overflow: "auto",
-    backgroundColor: m.colorNeutralBackground2
-  },
-  bugerIcon: {
-    color: m.colorNeutralForegroundOnBrand,
-    ":hover": {
-      color: m.colorNeutralForegroundOnBrand
-    }
+    backgroundColor: F.colorNeutralBackground2
   }
 });
-function R({
-  applicationName: a,
-  main: d,
-  navigationItems: o,
+function te({
+  applicationName: o,
+  applicationIcon: p,
+  main: M,
+  navigationItems: d,
   userStatus: f,
-  onClickHome: g,
-  navigate: C,
-  matchPath: w
+  onClickHome: m,
+  navigate: k,
+  matchPath: v
 }) {
-  const l = o.find((t) => "path" in t && t.path !== null && w(t.path)), x = l?.id, b = l && "parentId" in l && l.parentId !== null ? [l.parentId] : [], i = y(), [s, B] = u(!0), [S, k] = u(x ?? ""), [r, c] = u(b), _ = q(() => E(o), [o]), v = () => {
-    B(!s);
-  }, D = (t) => {
-    const e = _.findById(t);
-    k(e.id);
-    const p = "parentId" in e ? e.parentId : null;
-    p && (r.find((T) => T === p) || c([...r, p])), "path" in e && e.path && C(e.path);
-  }, O = (t) => {
-    r.find((e) => e === t) ? c(r.filter((e) => e !== t)) : c([...r, t]);
-  }, F = [];
-  return l && "parentId" in l && l.parentId !== null && F.push(l.parentId), /* @__PURE__ */ h("div", { "data-e2e-id": "shell", className: i.shell, children: [
-    /* @__PURE__ */ n("div", { "data-e2e-id": "shell__menu_top", className: i.titleBar, children: s ? null : /* @__PURE__ */ n(
-      I,
+  const t = d.find((n) => "path" in n && n.path !== null && v(n.path)), y = t?.id, w = t && "parentId" in t && t.parentId !== null ? [t.parentId] : [], i = q(), s = J(), [l, g] = c(K), [x, _] = c(!1), [B, N] = c(y ?? ""), [r, h] = c(w), O = R(() => P(d), [d]);
+  T(() => {
+    i || localStorage.setItem("sidebarMode", l);
+  }, [i, l]);
+  const C = () => {
+    _(!x);
+  }, b = () => {
+    l === "expanded" && g("rails"), l === "rails" && g("expanded");
+  }, I = (n) => {
+    const e = O.findById(n);
+    N(e.id);
+    const u = "parentId" in e ? e.parentId : null;
+    u && (r.find((A) => A === u) || h([...r, u])), "path" in e && e.path && k(e.path);
+  }, j = (n) => {
+    r.find((e) => e === n) ? h(r.filter((e) => e !== n)) : h([...r, n]);
+  }, D = [];
+  return t && "parentId" in t && t.parentId !== null && D.push(t.parentId), /* @__PURE__ */ S("div", { "data-e2e-id": "shell", className: s.shell, children: [
+    /* @__PURE__ */ a("div", { "data-e2e-id": "shell__menu_top", className: s.titleBar, children: i ? /* @__PURE__ */ a(
+      U,
       {
-        applicationName: a,
+        applicationName: o,
+        applicationIcon: p,
         userStatus: f,
-        onClickHome: g,
-        hamburger: /* @__PURE__ */ n(N, { onClick: v })
+        onClickHome: m,
+        hamburger: /* @__PURE__ */ a(H, { onClick: C })
       }
-    ) }),
-    /* @__PURE__ */ h("div", { "data-e2e-id": "shell__main", className: i.main, children: [
-      /* @__PURE__ */ h(
-        M,
+    ) : null }),
+    /* @__PURE__ */ S("div", { "data-e2e-id": "shell__main", className: s.main, children: [
+      (!i && l === "expanded" || i) && /* @__PURE__ */ a(
+        G,
+        {
+          selectedItem: B,
+          openedCategories: r,
+          drawerOpen: x,
+          isMobile: i,
+          applicationName: o,
+          applicationIcon: p,
+          userStatus: f,
+          navigationItems: d,
+          onClickHome: m,
+          onClickHamburger: C,
+          onClickMenuItem: I,
+          onClickCategory: j,
+          onClickPanelReduce: b
+        }
+      ),
+      l === "rails" && /* @__PURE__ */ a(
+        z,
         {
-          selectedValue: S,
-          open: s,
-          density: "small",
-          type: "inline",
-          openCategories: r,
-          onNavItemSelect: (t, e) => {
-            D(e.value);
-          },
-          onNavCategoryItemToggle: (t, e) => {
-            O(e.categoryValue ?? "");
-          },
-          children: [
-            /* @__PURE__ */ n(
-              I,
-              {
-                applicationName: a,
-                userStatus: f,
-                onClickHome: g,
-                hamburger: /* @__PURE__ */ n(N, { onClick: v })
-              }
-            ),
-            /* @__PURE__ */ n(A, {}),
-            /* @__PURE__ */ n(H, { children: /* @__PURE__ */ n(z, { items: o }) })
-          ]
+          applicationIcon: p,
+          navigationItems: d,
+          userStatus: f,
+          onClickHome: m,
+          onClickMenuItem: I,
+          onClickSidebarExpand: b
         }
       ),
-      /* @__PURE__ */ n("div", { "data-e2e-id": "shell__content", className: i.content, children: d })
+      /* @__PURE__ */ a("div", { "data-e2e-id": "shell__content", className: s.content, children: M })
     ] })
   ] });
 }
-const N = ({ onClick: a }) => {
-  const d = y();
-  return /* @__PURE__ */ n(V, { content: "Navigation", relationship: "label", children: /* @__PURE__ */ n(U, { className: d.bugerIcon, onClick: a }) });
+const K = () => {
+  const o = localStorage.getItem("sidebarMode");
+  return o === "expanded" ? "expanded" : o === "rails" ? "rails" : "expanded";
 };
 export {
-  R as ApplicationShell
+  te as ApplicationShell
 };
 //# sourceMappingURL=ApplicationShell.js.map

package/dist/lib/applicationshell/ApplicationShell.js.map

@@ -1 +1 @@
-{"version":3,"file":"ApplicationShell.js","sources":["../../../src/lib/applicationshell/ApplicationShell.tsx"],"sourcesContent":["import {\n  Hamburger,\n  makeStyles,\n  NavDrawer,\n  NavDrawerBody,\n  NavDrawerHeader,\n  tokens,\n  Tooltip,\n} from \"@fluentui/react-components\";\nimport { ReactNode, useMemo, useState } from \"react\";\nimport { Navigation } from \"../navigation/Navigation\";\nimport { NavigationTreeItem } from \"../navigation/Navigation.types\";\nimport { createNavigationTreeItemServiceImpl } from \"../navigation/NavigationService\";\nimport { UserStatus } from \"./ApplicationShell.types\";\nimport { TitleBar } from \"./TitleBar\";\n\nconst useApplicationShellStyles = makeStyles({\n  shell: {\n    width: \"100vw\",\n    height: \"100vh\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    overflow: \"hidden\",\n  },\n  titleBar: {\n    width: \"100%\",\n    height: \"48px\",\n    flex: 0,\n  },\n  main: {\n    overflow: \"hidden\",\n    display: \"flex\",\n    height: \"100%\",\n  },\n  content: {\n    flex: \"1\",\n    display: \"bloc\",\n    justifyContent: \"flex-start\",\n    alignItems: \"flex-start\",\n    overflow: \"auto\",\n    backgroundColor: tokens.colorNeutralBackground2,\n  },\n  bugerIcon: {\n    color: tokens.colorNeutralForegroundOnBrand,\n    \":hover\": {\n      color: tokens.colorNeutralForegroundOnBrand,\n    },\n  },\n});\n\n/**\n * Props for the `ApplicationShell` layout component.\n *\n * The shell renders a persistent left navigation (Fluent UI `NavDrawer`), a top `TitleBar`,\n * and your main application content. It also wires navigation events so the currently\n * selected item reflects the browser URL and clicking items triggers navigation.\n */\nexport interface ApplicationShellProps {\n  /**\n   * Human‑readable name of the application displayed in the `TitleBar`.\n   * Example: \"Orders Console\".\n   */\n  applicationName: string;\n\n  /**\n   * Main content of the page. This is rendered in the scrollable content area on the right\n   * of the navigation drawer. Typically the routed page/component for the current URL.\n   */\n  main: ReactNode;\n\n  /**\n   * Tree of navigation items used to render the side navigation and compute selection.\n   * Items may be categories or leaf entries with a `path`. When a leaf item is selected\n   * and has a `path`, `navigate(path)` is invoked.\n   */\n  navigationItems: NavigationTreeItem[];\n\n  /**\n   * Current user status information shown in the `TitleBar` (e.g., username, avatar, roles).\n   */\n  userStatus: UserStatus;\n\n  /**\n   * Called when the home button in the `TitleBar` is clicked.\n   * Use this to navigate to your application home route or perform any related action.\n   */\n  onClickHome: () => void;\n\n  /**\n   * Imperative navigation function called when a navigation leaf item with a `path`\n   * is selected. Provide the function from your router (e.g., react-router navigate).\n   */\n  navigate: (path: string) => void;\n\n  /**\n   * Function used to check whether the current browser location matches a given item `path`.\n   * It is used at render time to preselect the item that corresponds to the current URL.\n   * Return `true` if the provided `path` matches the active route.\n   */\n  matchPath: (path: string | undefined) => boolean;\n}\n\n/**\n * ApplicationShell\n *\n * High‑level layout component that composes the application chrome:\n * - Top `TitleBar` showing the application name and user status\n * - Left `NavDrawer` for hierarchical navigation\n * - Main scrollable content area where your routed page is rendered\n *\n * Behavior\n * - Preselects the navigation item that matches the current URL via `matchPath`\n * - When a leaf item with a `path` is clicked, calls `navigate(path)`\n * - Keeps track of opened navigation categories and the selected item\n * - Displays a hamburger in the TitleBar to toggle the navigation drawer\n *\n * Usage (example)\n *\n * ```tsx\n * <ApplicationShell\n *   applicationName=\"Orders Console\"\n *   navigationItems={items}\n *   userStatus={{ displayName: \"Jane Doe\" }}\n *   onClickHome={() => navigate(\"/\")}\n *   navigate={(path) => navigate(path)}\n *   matchPath={(path) => !!path && !!match(path)}\n *   main={<Outlet />}\n * />\n * ```\n * Where `navigate`/`match` typically come from your router (e.g., react‑router v6's\n * `useNavigate`/`useMatch`). See `ApplicationShellProps` for details on each prop.\n */\nexport function ApplicationShell({\n  applicationName,\n  main,\n  navigationItems,\n  userStatus,\n  onClickHome,\n  navigate,\n  matchPath,\n}: ApplicationShellProps) {\n  // test si le chemin courant du navigateur correspond à cet item\n  // attention, on est obligés de tester tous les items, qu'ils aient\n  // un lien ou pas, d'où le url-inconnue pour ceux qui n'ont pas de lien.\n  // On est obligés car useMatch est un hook que l'on ne peut pas lancer\n  // de manière conditionnelle\n  const navigationItemFound = navigationItems.find((it) => \"path\" in it && it.path !== null && matchPath(it.path));\n  const navigationItemSelectedFromUrl = navigationItemFound?.id;\n  const defaultOpenCategory =\n    navigationItemFound && \"parentId\" in navigationItemFound && navigationItemFound.parentId !== null\n      ? [navigationItemFound.parentId]\n      : [];\n\n  const styles = useApplicationShellStyles();\n  const [navDrawerOpened, setNavDrawerOpened] = useState<boolean>(true);\n  const [selectedItem, setSelectedItem] = useState<string>(navigationItemSelectedFromUrl ?? \"\");\n  const [openedCategories, setOpenCategories] = useState<string[]>(defaultOpenCategory);\n\n  const navigationService = useMemo(() => createNavigationTreeItemServiceImpl(navigationItems), [navigationItems]);\n  const handleClickHamburger = () => {\n    setNavDrawerOpened(!navDrawerOpened);\n  };\n\n  const handleClickMenuItem = (itemId: string) => {\n    const item = navigationService.findById(itemId);\n    setSelectedItem(item.id);\n    const parentId = \"parentId\" in item ? item.parentId : null;\n    if (parentId) {\n      if (!openedCategories.find((cat) => cat === parentId)) {\n        setOpenCategories([...openedCategories, parentId]);\n      }\n    }\n    if (\"path\" in item && item.path) navigate(item.path);\n  };\n\n  const handleClickCategory = (categoryId: string) => {\n    if (!openedCategories.find((cat) => cat === categoryId)) {\n      setOpenCategories([...openedCategories, categoryId]);\n    } else {\n      setOpenCategories(openedCategories.filter((it) => it !== categoryId));\n    }\n  };\n\n  const openCategories: string[] = [];\n  if (navigationItemFound && \"parentId\" in navigationItemFound && navigationItemFound.parentId !== null) {\n    openCategories.push(navigationItemFound.parentId);\n  }\n\n  return (\n    <div data-e2e-id=\"shell\" className={styles.shell}>\n      <div data-e2e-id=\"shell__menu_top\" className={styles.titleBar}>\n        {!navDrawerOpened ? (\n          <TitleBar\n            applicationName={applicationName}\n            userStatus={userStatus}\n            onClickHome={onClickHome}\n            hamburger={<MenuBurger onClick={handleClickHamburger} />}\n          />\n        ) : null}\n      </div>\n      <div data-e2e-id=\"shell__main\" className={styles.main}>\n        <NavDrawer\n          selectedValue={selectedItem}\n          open={navDrawerOpened}\n          density={\"small\"}\n          type={\"inline\"}\n          openCategories={openedCategories}\n          onNavItemSelect={(e, data) => {\n            handleClickMenuItem(data.value);\n          }}\n          onNavCategoryItemToggle={(e, data) => {\n            handleClickCategory(data.categoryValue ?? \"\");\n          }}\n        >\n          <TitleBar\n            applicationName={applicationName}\n            userStatus={userStatus}\n            onClickHome={onClickHome}\n            hamburger={<MenuBurger onClick={handleClickHamburger} />}\n          />\n          <NavDrawerHeader></NavDrawerHeader>\n          <NavDrawerBody>\n            <Navigation items={navigationItems} />\n          </NavDrawerBody>\n        </NavDrawer>\n        <div data-e2e-id=\"shell__content\" className={styles.content}>\n          {main}\n        </div>\n      </div>\n    </div>\n  );\n}\n\nconst MenuBurger = ({ onClick }: { onClick: () => void }) => {\n  const styles = useApplicationShellStyles();\n  return (\n    <Tooltip content=\"Navigation\" relationship=\"label\">\n      <Hamburger className={styles.bugerIcon} onClick={onClick} />\n    </Tooltip>\n  );\n};\n"],"names":["useApplicationShellStyles","makeStyles","tokens","ApplicationShell","applicationName","main","navigationItems","userStatus","onClickHome","navigate","matchPath","navigationItemFound","it","navigationItemSelectedFromUrl","defaultOpenCategory","styles","navDrawerOpened","setNavDrawerOpened","useState","selectedItem","setSelectedItem","openedCategories","setOpenCategories","navigationService","useMemo","createNavigationTreeItemServiceImpl","handleClickHamburger","handleClickMenuItem","itemId","item","parentId","cat","handleClickCategory","categoryId","openCategories","jsx","TitleBar","MenuBurger","jsxs","NavDrawer","e","data","NavDrawerHeader","NavDrawerBody","Navigation","onClick","Tooltip","Hamburger"],"mappings":"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"}
+{"version":3,"file":"ApplicationShell.js","sources":["../../../src/lib/applicationshell/ApplicationShell.tsx"],"sourcesContent":["import { makeStyles, tokens } from \"@fluentui/react-components\";\nimport { ReactNode, useEffect, useMemo, useState } from \"react\";\nimport { NavigationTreeItem } from \"../navigation/Navigation.types\";\nimport { createNavigationTreeItemServiceImpl } from \"../navigation/NavigationService\";\nimport { UserStatus } from \"./ApplicationShell.types\";\nimport { TitleBar } from \"./TitleBar\";\nimport { useIsMobile } from \"../responsive/useMobile\";\nimport { Rails } from \"./ApplicationShellRails\";\nimport { Sidebar } from \"./ApplicationShellSidebar\";\nimport { MenuBurger } from \"./ApplicationShellHamburger\";\n\nconst useApplicationShellStyles = makeStyles({\n  shell: {\n    width: \"100vw\",\n    height: \"100vh\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    overflow: \"hidden\",\n  },\n  titleBar: {\n    width: \"100%\",\n    height: \"48px\",\n    flex: 0,\n  },\n  main: {\n    overflow: \"hidden\",\n    display: \"flex\",\n    height: \"100%\",\n  },\n  content: {\n    flex: \"1\",\n    display: \"bloc\",\n    justifyContent: \"flex-start\",\n    alignItems: \"flex-start\",\n    overflow: \"auto\",\n    backgroundColor: tokens.colorNeutralBackground2,\n  },\n});\n\n/**\n * Props for the `ApplicationShell` layout component.\n *\n * The shell renders a persistent left navigation (Fluent UI `NavDrawer`), a top `TitleBar`,\n * and your main application content. It also wires navigation events so the currently\n * selected item reflects the browser URL and clicking items triggers navigation.\n */\nexport interface ApplicationShellProps {\n  /**\n   * Human‑readable name of the application displayed in the `TitleBar`.\n   * Example: \"Orders Console\".\n   */\n  applicationName: string;\n  /**\n   * Icon to display next to the application name\n   */\n  applicationIcon?: ReactNode;\n  /**\n   * Main content of the page. This is rendered in the scrollable content area on the right\n   * of the navigation drawer. Typically the routed page/component for the current URL.\n   */\n  main: ReactNode;\n\n  /**\n   * Tree of navigation items used to render the side navigation and compute selection.\n   * Items may be categories or leaf entries with a `path`. When a leaf item is selected\n   * and has a `path`, `navigate(path)` is invoked.\n   */\n  navigationItems: NavigationTreeItem[];\n\n  /**\n   * Current user status information shown in the `TitleBar` (e.g., username, avatar, roles).\n   */\n  userStatus: UserStatus;\n\n  /**\n   * Called when the home button in the `TitleBar` is clicked.\n   * Use this to navigate to your application home route or perform any related action.\n   */\n  onClickHome: () => void;\n\n  /**\n   * Imperative navigation function called when a navigation leaf item with a `path`\n   * is selected. Provide the function from your router (e.g., react-router navigate).\n   */\n  navigate: (path: string) => void;\n\n  /**\n   * Function used to check whether the current browser location matches a given item `path`.\n   * It is used at render time to preselect the item that corresponds to the current URL.\n   * Return `true` if the provided `path` matches the active route.\n   */\n  matchPath: (path: string | undefined) => boolean;\n}\n\n/**\n * ApplicationShell\n *\n * High‑level layout component that composes the application chrome:\n * - Top `TitleBar` showing the application name and user status\n * - Left `NavDrawer` for hierarchical navigation\n * - Main scrollable content area where your routed page is rendered\n *\n * Behavior\n * - Preselects the navigation item that matches the current URL via `matchPath`\n * - When a leaf item with a `path` is clicked, calls `navigate(path)`\n * - Keeps track of opened navigation categories and the selected item\n * - Displays a hamburger in the TitleBar to toggle the navigation drawer\n *\n * Usage (example)\n *\n * ```tsx\n * <ApplicationShell\n *   applicationName=\"Orders Console\"\n *   navigationItems={items}\n *   userStatus={{ displayName: \"Jane Doe\" }}\n *   onClickHome={() => navigate(\"/\")}\n *   navigate={(path) => navigate(path)}\n *   matchPath={(path) => !!path && !!match(path)}\n *   main={<Outlet />}\n * />\n * ```\n * Where `navigate`/`match` typically come from your router (e.g., react‑router v6's\n * `useNavigate`/`useMatch`). See `ApplicationShellProps` for details on each prop.\n */\nexport function ApplicationShell({\n  applicationName,\n  applicationIcon,\n  main,\n  navigationItems,\n  userStatus,\n  onClickHome,\n  navigate,\n  matchPath,\n}: ApplicationShellProps) {\n  // test si le chemin courant du navigateur correspond à cet item\n  // attention, on est obligés de tester tous les items, qu'ils aient\n  // un lien ou pas, d'où le url-inconnue pour ceux qui n'ont pas de lien.\n  // On est obligés car useMatch est un hook que l'on ne peut pas lancer\n  // de manière conditionnelle\n  const navigationItemFound = navigationItems.find((it) => \"path\" in it && it.path !== null && matchPath(it.path));\n  const navigationItemSelectedFromUrl = navigationItemFound?.id;\n  const defaultOpenCategory =\n    navigationItemFound && \"parentId\" in navigationItemFound && navigationItemFound.parentId !== null\n      ? [navigationItemFound.parentId]\n      : [];\n\n  // Hooks\n  const isMobile = useIsMobile();\n  const styles = useApplicationShellStyles();\n\n  const [sidebarMode, setSidebarMode] = useState<\"rails\" | \"expanded\">(initialSidebarModeDetect);\n  const [drawerOpen, setDrawerOpen] = useState(false);\n  const [selectedItem, setSelectedItem] = useState<string>(navigationItemSelectedFromUrl ?? \"\");\n  const [openedCategories, setOpenCategories] = useState<string[]>(defaultOpenCategory);\n  const navigationService = useMemo(() => createNavigationTreeItemServiceImpl(navigationItems), [navigationItems]);\n\n  useEffect(() => {\n    // Persist user choice for the rails or sidebar mode\n    if (!isMobile) {\n      localStorage.setItem(\"sidebarMode\", sidebarMode);\n    }\n  }, [isMobile, sidebarMode]);\n\n  // Events\n\n  const handleClickHamburger = () => {\n    setDrawerOpen(!drawerOpen);\n  };\n\n  const handleChangeSidebarMode = () => {\n    if (sidebarMode === \"expanded\") {\n      setSidebarMode(\"rails\");\n    }\n    if (sidebarMode === \"rails\") {\n      setSidebarMode(\"expanded\");\n    }\n  };\n\n  const handleClickMenuItem = (itemId: string) => {\n    const item = navigationService.findById(itemId);\n    setSelectedItem(item.id);\n    const parentId = \"parentId\" in item ? item.parentId : null;\n    if (parentId) {\n      if (!openedCategories.find((cat) => cat === parentId)) {\n        setOpenCategories([...openedCategories, parentId]);\n      }\n    }\n    if (\"path\" in item && item.path) navigate(item.path);\n  };\n\n  const handleClickCategory = (categoryId: string) => {\n    if (!openedCategories.find((cat) => cat === categoryId)) {\n      setOpenCategories([...openedCategories, categoryId]);\n    } else {\n      setOpenCategories(openedCategories.filter((it) => it !== categoryId));\n    }\n  };\n\n  const openCategories: string[] = [];\n  if (navigationItemFound && \"parentId\" in navigationItemFound && navigationItemFound.parentId !== null) {\n    openCategories.push(navigationItemFound.parentId);\n  }\n\n  return (\n    <div data-e2e-id=\"shell\" className={styles.shell}>\n      <div data-e2e-id=\"shell__menu_top\" className={styles.titleBar}>\n        {isMobile ? (\n          <TitleBar\n            applicationName={applicationName}\n            applicationIcon={applicationIcon}\n            userStatus={userStatus}\n            onClickHome={onClickHome}\n            hamburger={<MenuBurger onClick={handleClickHamburger} />}\n          />\n        ) : null}\n      </div>\n      <div data-e2e-id=\"shell__main\" className={styles.main}>\n        {((!isMobile && sidebarMode === \"expanded\") || isMobile) && (\n          <Sidebar\n            selectedItem={selectedItem}\n            openedCategories={openedCategories}\n            drawerOpen={drawerOpen}\n            isMobile={isMobile}\n            applicationName={applicationName}\n            applicationIcon={applicationIcon}\n            userStatus={userStatus}\n            navigationItems={navigationItems}\n            onClickHome={onClickHome}\n            onClickHamburger={handleClickHamburger}\n            onClickMenuItem={handleClickMenuItem}\n            onClickCategory={handleClickCategory}\n            onClickPanelReduce={handleChangeSidebarMode}\n          />\n        )}\n        {sidebarMode === \"rails\" && (\n          <Rails\n            applicationIcon={applicationIcon}\n            navigationItems={navigationItems}\n            userStatus={userStatus}\n            onClickHome={onClickHome}\n            onClickMenuItem={handleClickMenuItem}\n            onClickSidebarExpand={handleChangeSidebarMode}\n          />\n        )}\n        <div data-e2e-id=\"shell__content\" className={styles.content}>\n          {main}\n        </div>\n      </div>\n    </div>\n  );\n}\n\nconst initialSidebarModeDetect = () => {\n  const value = localStorage.getItem(\"sidebarMode\");\n  if (value === \"expanded\") return \"expanded\";\n  if (value === \"rails\") return \"rails\";\n  return \"expanded\";\n};\n"],"names":["useApplicationShellStyles","makeStyles","tokens","ApplicationShell","applicationName","applicationIcon","main","navigationItems","userStatus","onClickHome","navigate","matchPath","navigationItemFound","it","navigationItemSelectedFromUrl","defaultOpenCategory","isMobile","useIsMobile","styles","sidebarMode","setSidebarMode","useState","initialSidebarModeDetect","drawerOpen","setDrawerOpen","selectedItem","setSelectedItem","openedCategories","setOpenCategories","navigationService","useMemo","createNavigationTreeItemServiceImpl","useEffect","handleClickHamburger","handleChangeSidebarMode","handleClickMenuItem","itemId","item","parentId","cat","handleClickCategory","categoryId","openCategories","jsx","TitleBar","MenuBurger","Sidebar","Rails","value"],"mappings":"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"}

package/dist/lib/applicationshell/ApplicationShellHamburger.d.ts

@@ -0,0 +1,4 @@
+export declare const MenuBurger: ({ onClick }: {
+    onClick: () => void;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ApplicationShellHamburger.d.ts.map

package/dist/lib/applicationshell/ApplicationShellHamburger.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApplicationShellHamburger.d.ts","sourceRoot":"","sources":["../../../src/lib/applicationshell/ApplicationShellHamburger.tsx"],"names":[],"mappings":"AASA,eAAO,MAAM,UAAU,GAAI,aAAa;IAAE,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,4CAO9D,CAAC"}

package/dist/lib/applicationshell/ApplicationShellHamburger.js

@@ -0,0 +1,17 @@
+import { jsx as o } from "react/jsx-runtime";
+import { makeStyles as t, tokens as r, Tooltip as l, Hamburger as a } from "@fluentui/react-components";
+const c = t({
+  bugerIcon: {
+    color: r.colorNeutralForegroundOnBrand,
+    ":hover": {
+      color: r.colorNeutralForegroundOnBrand
+    }
+  }
+}), i = ({ onClick: e }) => {
+  const n = c();
+  return /* @__PURE__ */ o(l, { content: "Navigation", relationship: "label", children: /* @__PURE__ */ o(a, { className: n.bugerIcon, onClick: e }) });
+};
+export {
+  i as MenuBurger
+};
+//# sourceMappingURL=ApplicationShellHamburger.js.map

package/dist/lib/applicationshell/ApplicationShellHamburger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApplicationShellHamburger.js","sources":["../../../src/lib/applicationshell/ApplicationShellHamburger.tsx"],"sourcesContent":["import { Hamburger, makeStyles, tokens, Tooltip } from \"@fluentui/react-components\";\nconst useApplicationShellStyles = makeStyles({\n  bugerIcon: {\n    color: tokens.colorNeutralForegroundOnBrand,\n    \":hover\": {\n      color: tokens.colorNeutralForegroundOnBrand,\n    },\n  },\n});\nexport const MenuBurger = ({ onClick }: { onClick: () => void }) => {\n  const styles = useApplicationShellStyles();\n  return (\n    <Tooltip content=\"Navigation\" relationship=\"label\">\n      <Hamburger className={styles.bugerIcon} onClick={onClick} />\n    </Tooltip>\n  );\n};\n"],"names":["useApplicationShellStyles","makeStyles","tokens","MenuBurger","onClick","styles","jsx","Tooltip","Hamburger"],"mappings":";;AACA,MAAMA,IAA4BC,EAAW;AAAA,EAC3C,WAAW;AAAA,IACT,OAAOC,EAAO;AAAA,IACd,UAAU;AAAA,MACR,OAAOA,EAAO;AAAA,IAAA;AAAA,EAChB;AAEJ,CAAC,GACYC,IAAa,CAAC,EAAE,SAAAC,QAAuC;AAClE,QAAMC,IAASL,EAAA;AACf,SACE,gBAAAM,EAACC,GAAA,EAAQ,SAAQ,cAAa,cAAa,SACzC,UAAA,gBAAAD,EAACE,GAAA,EAAU,WAAWH,EAAO,WAAW,SAAAD,EAAA,CAAkB,GAC5D;AAEJ;"}

package/dist/lib/applicationshell/ApplicationShellPanelContract.d.ts

@@ -0,0 +1,5 @@
+export declare const PanelLeftContract: ({ panelState, onClick, }: {
+    panelState: "expanded" | "rails";
+    onClick: () => void;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ApplicationShellPanelContract.d.ts.map

package/dist/lib/applicationshell/ApplicationShellPanelContract.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApplicationShellPanelContract.d.ts","sourceRoot":"","sources":["../../../src/lib/applicationshell/ApplicationShellPanelContract.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,iBAAiB,GAAI,0BAG/B;IACD,UAAU,EAAE,UAAU,GAAG,OAAO,CAAC;IACjC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,4CAWA,CAAC"}

package/dist/lib/applicationshell/ApplicationShellPanelContract.js

@@ -0,0 +1,19 @@
+import { jsx as e } from "react/jsx-runtime";
+import { Tooltip as o, Button as r } from "@fluentui/react-components";
+import { Icon as a } from "@seij/common-ui-icons";
+const c = ({
+  panelState: n,
+  onClick: t
+}) => /* @__PURE__ */ e(o, { content: "Reduce panel", relationship: "label", children: /* @__PURE__ */ e(
+  r,
+  {
+    onClick: t,
+    icon: /* @__PURE__ */ e(a, { name: n === "expanded" ? "panel_left_reduce" : "panel_left_expand" }),
+    size: "medium",
+    appearance: "subtle"
+  }
+) });
+export {
+  c as PanelLeftContract
+};
+//# sourceMappingURL=ApplicationShellPanelContract.js.map

package/dist/lib/applicationshell/ApplicationShellPanelContract.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApplicationShellPanelContract.js","sources":["../../../src/lib/applicationshell/ApplicationShellPanelContract.tsx"],"sourcesContent":["import { Button, Tooltip } from \"@fluentui/react-components\";\nimport { Icon } from \"@seij/common-ui-icons\";\n\nexport const PanelLeftContract = ({\n  panelState,\n  onClick,\n}: {\n  panelState: \"expanded\" | \"rails\";\n  onClick: () => void;\n}) => {\n  return (\n    <Tooltip content=\"Reduce panel\" relationship=\"label\">\n      <Button\n        onClick={onClick}\n        icon={<Icon name={panelState === \"expanded\" ? \"panel_left_reduce\" : \"panel_left_expand\"} />}\n        size=\"medium\"\n        appearance=\"subtle\"\n      />\n    </Tooltip>\n  );\n};\n"],"names":["PanelLeftContract","panelState","onClick","jsx","Tooltip","Button","Icon"],"mappings":";;;AAGO,MAAMA,IAAoB,CAAC;AAAA,EAChC,YAAAC;AAAA,EACA,SAAAC;AACF,MAKI,gBAAAC,EAACC,GAAA,EAAQ,SAAQ,gBAAe,cAAa,SAC3C,UAAA,gBAAAD;AAAA,EAACE;AAAA,EAAA;AAAA,IACC,SAAAH;AAAA,IACA,MAAM,gBAAAC,EAACG,GAAA,EAAK,MAAML,MAAe,aAAa,sBAAsB,qBAAqB;AAAA,IACzF,MAAK;AAAA,IACL,YAAW;AAAA,EAAA;AAAA,GAEf;"}

package/dist/lib/applicationshell/ApplicationShellRails.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+import { NavigationTreeItem, UserStatus } from '@seij/common-ui';
+export declare function Rails({ applicationIcon, navigationItems, userStatus, onClickHome, onClickMenuItem, onClickSidebarExpand, }: {
+    applicationIcon?: ReactNode;
+    navigationItems: NavigationTreeItem[];
+    userStatus: UserStatus;
+    onClickHome: () => void;
+    onClickMenuItem: (id: string) => void;
+    onClickSidebarExpand: () => void;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ApplicationShellRails.d.ts.map

package/dist/lib/applicationshell/ApplicationShellRails.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApplicationShellRails.d.ts","sourceRoot":"","sources":["../../../src/lib/applicationshell/ApplicationShellRails.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,kBAAkB,EAAmD,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAsBlH,wBAAgB,KAAK,CAAC,EACpB,eAAe,EACf,eAAe,EACf,UAAU,EACV,WAAW,EACX,eAAe,EACf,oBAAoB,GACrB,EAAE;IACD,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,eAAe,EAAE,kBAAkB,EAAE,CAAC;IACtC,UAAU,EAAE,UAAU,CAAC;IACvB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,eAAe,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,oBAAoB,EAAE,MAAM,IAAI,CAAC;CAClC,2CAgDA"}

package/dist/lib/applicationshell/ApplicationShellRails.js

@@ -0,0 +1,111 @@
+import { jsxs as d, jsx as n } from "react/jsx-runtime";
+import { makeStyles as f, tokens as m, Tooltip as r } from "@fluentui/react-components";
+import { User as h } from "./TitleBar.js";
+import { PanelLeftContract as x } from "./ApplicationShellPanelContract.js";
+import { Icon as c, parseIconName as p } from "@seij/common-ui-icons";
+const a = f({
+  container: {
+    display: "flex",
+    textAlign: "center",
+    width: "32px",
+    height: "32px",
+    alignItems: "center",
+    alignContent: "center",
+    "& > div": {
+      width: "100%"
+    },
+    "&:hover": {
+      cursor: "pointer",
+      backgroundColor: m.colorNeutralBackground4Hover
+    }
+  }
+});
+function j({
+  applicationIcon: t,
+  navigationItems: i,
+  userStatus: l,
+  onClickHome: e,
+  onClickMenuItem: o,
+  onClickSidebarExpand: u
+}) {
+  return /* @__PURE__ */ d(
+    "div",
+    {
+      style: {
+        backgroundColor: m.colorNeutralBackground4,
+        width: "48px",
+        height: "100%",
+        display: "flex",
+        flexDirection: "column"
+      },
+      children: [
+        /* @__PURE__ */ n(
+          "div",
+          {
+            style: {
+              display: "flex",
+              flexDirection: "column",
+              alignItems: "center",
+              justifyContent: "start",
+              paddingTop: "0.5em"
+            },
+            children: /* @__PURE__ */ n(y, { applicationIcon: t, onClick: e })
+          }
+        ),
+        /* @__PURE__ */ n(
+          "div",
+          {
+            style: {
+              flex: 1,
+              display: "flex",
+              flexDirection: "column",
+              alignItems: "center",
+              justifyContent: "start"
+            },
+            children: i.map((s) => /* @__PURE__ */ n(g, { item: s, onClick: o }, s.id))
+          }
+        ),
+        /* @__PURE__ */ d(
+          "div",
+          {
+            style: {
+              display: "flex",
+              flexDirection: "column",
+              alignItems: "center",
+              justifyContent: "start"
+            },
+            children: [
+              /* @__PURE__ */ n(h, { status: l }),
+              /* @__PURE__ */ n(v, { onClick: u })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+const y = ({ applicationIcon: t, onClick: i }) => {
+  const l = a();
+  return /* @__PURE__ */ n("div", { className: l.container, onClick: () => i(), children: /* @__PURE__ */ n(r, { content: "Home", relationship: "description", children: /* @__PURE__ */ n("span", { children: t || /* @__PURE__ */ n(c, { name: "dashboard" }) }) }) });
+}, v = ({ onClick: t }) => {
+  const i = a();
+  return /* @__PURE__ */ n("div", { className: i.container, onClick: () => t(), children: /* @__PURE__ */ n(x, { panelState: "rails", onClick: t }) });
+}, g = ({ item: t, onClick: i }) => {
+  const l = a();
+  if (t.type === "divider") return null;
+  if (t.type === "group") {
+    const e = t, o = e.icon ? p(e.icon) : void 0;
+    return /* @__PURE__ */ n("div", { className: l.container, onClick: () => i(e.id), children: /* @__PURE__ */ n(r, { content: e.label, relationship: "description", children: o && /* @__PURE__ */ n(c, { name: o }) }) }, e.id);
+  }
+  if (t.type === "page") {
+    const e = t;
+    if (e.parentId !== null) return null;
+    const o = e.icon ? p(e.icon) : void 0;
+    return /* @__PURE__ */ n(r, { content: e.label, relationship: "description", children: /* @__PURE__ */ n("div", { className: l.container, onClick: () => i(e.id), children: /* @__PURE__ */ n("div", { children: o && /* @__PURE__ */ n(c, { name: o }) }) }, e.id) });
+  }
+  return null;
+};
+export {
+  j as Rails
+};
+//# sourceMappingURL=ApplicationShellRails.js.map

package/dist/lib/applicationshell/ApplicationShellRails.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApplicationShellRails.js","sources":["../../../src/lib/applicationshell/ApplicationShellRails.tsx"],"sourcesContent":["import { makeStyles, tokens, Tooltip } from \"@fluentui/react-components\";\nimport { User } from \"./TitleBar\";\nimport { ReactNode } from \"react\";\nimport { NavigationTreeItem, NavigationTreeItemGroup, NavigationTreeItemPage, UserStatus } from \"@seij/common-ui\";\nimport { PanelLeftContract } from \"./ApplicationShellPanelContract\";\nimport { Icon, IconName, parseIconName } from \"@seij/common-ui-icons\";\n\nconst useStylesRailboxItem = makeStyles({\n  container: {\n    display: \"flex\",\n    textAlign: \"center\",\n    width: \"32px\",\n    height: \"32px\",\n    alignItems: \"center\",\n    alignContent: \"center\",\n    \"& > div\": {\n      width: \"100%\",\n    },\n    \"&:hover\": {\n      cursor: \"pointer\",\n      backgroundColor: tokens.colorNeutralBackground4Hover,\n    },\n  },\n});\n\nexport function Rails({\n  applicationIcon,\n  navigationItems,\n  userStatus,\n  onClickHome,\n  onClickMenuItem,\n  onClickSidebarExpand,\n}: {\n  applicationIcon?: ReactNode;\n  navigationItems: NavigationTreeItem[];\n  userStatus: UserStatus;\n  onClickHome: () => void;\n  onClickMenuItem: (id: string) => void;\n  onClickSidebarExpand: () => void;\n}) {\n  return (\n    <div\n      style={{\n        backgroundColor: tokens.colorNeutralBackground4,\n        width: \"48px\",\n        height: \"100%\",\n        display: \"flex\",\n        flexDirection: \"column\",\n      }}\n    >\n      <div\n        style={{\n          display: \"flex\",\n          flexDirection: \"column\",\n          alignItems: \"center\",\n          justifyContent: \"start\",\n          paddingTop: \"0.5em\",\n        }}\n      >\n        <RailBoxApplicationIcon applicationIcon={applicationIcon} onClick={onClickHome} />\n      </div>\n      <div\n        style={{\n          flex: 1,\n          display: \"flex\",\n          flexDirection: \"column\",\n          alignItems: \"center\",\n          justifyContent: \"start\",\n        }}\n      >\n        {navigationItems.map((it) => (\n          <RailBoxNavigationItem key={it.id} item={it} onClick={onClickMenuItem} />\n        ))}\n      </div>\n      <div\n        style={{\n          display: \"flex\",\n          flexDirection: \"column\",\n          alignItems: \"center\",\n          justifyContent: \"start\",\n        }}\n      >\n        <User status={userStatus} />\n        <RailBoxPanelLeftExpand onClick={onClickSidebarExpand} />\n      </div>\n    </div>\n  );\n}\n\nconst RailBoxApplicationIcon = ({ applicationIcon, onClick }: { applicationIcon?: ReactNode; onClick: () => void }) => {\n  const styles = useStylesRailboxItem();\n  return (\n    <div className={styles.container} onClick={() => onClick()}>\n      <Tooltip content={\"Home\"} relationship=\"description\">\n        <span>{applicationIcon ? applicationIcon : <Icon name={\"dashboard\"} />}</span>\n      </Tooltip>\n    </div>\n  );\n};\nconst RailBoxPanelLeftExpand = ({ onClick }: { onClick: () => void }) => {\n  const styles = useStylesRailboxItem();\n  return (\n    <div className={styles.container} onClick={() => onClick()}>\n      <PanelLeftContract panelState={\"rails\"} onClick={onClick} />\n    </div>\n  );\n};\nconst RailBoxNavigationItem = ({ item, onClick }: { item: NavigationTreeItem; onClick: (id: string) => void }) => {\n  const styles = useStylesRailboxItem();\n  if (item.type === \"divider\") return null;\n  if (item.type === \"group\") {\n    const nav = item as NavigationTreeItemGroup;\n    const iconName: IconName | undefined = nav.icon ? parseIconName(nav.icon) : undefined;\n    return (\n      <div key={nav.id} className={styles.container} onClick={() => onClick(nav.id)}>\n        <Tooltip content={nav.label} relationship=\"description\">\n          {iconName && <Icon name={iconName} />}\n        </Tooltip>\n      </div>\n    );\n  }\n  if (item.type === \"page\") {\n    const nav = item as NavigationTreeItemPage;\n    if (nav.parentId !== null) return null;\n    const iconName: IconName | undefined = nav.icon ? parseIconName(nav.icon) : undefined;\n    return (\n      <Tooltip content={nav.label} relationship=\"description\">\n        <div key={nav.id} className={styles.container} onClick={() => onClick(nav.id)}>\n          <div>{iconName && <Icon name={iconName} />}</div>\n        </div>\n      </Tooltip>\n    );\n  }\n  return null;\n};\n"],"names":["useStylesRailboxItem","makeStyles","tokens","Rails","applicationIcon","navigationItems","userStatus","onClickHome","onClickMenuItem","onClickSidebarExpand","jsxs","jsx","RailBoxApplicationIcon","it","RailBoxNavigationItem","User","RailBoxPanelLeftExpand","onClick","styles","Tooltip","Icon","PanelLeftContract","item","nav","iconName","parseIconName"],"mappings":"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"}

package/dist/lib/applicationshell/ApplicationShellSidebar.d.ts

@@ -0,0 +1,18 @@
+import { NavigationTreeItem, UserStatus } from '@seij/common-ui';
+import { ReactNode } from 'react';
+export declare function Sidebar({ selectedItem, isMobile, applicationName, drawerOpen, openedCategories, applicationIcon, userStatus, navigationItems, onClickHome, onClickMenuItem, onClickCategory, onClickHamburger, onClickPanelReduce, }: {
+    isMobile: boolean;
+    drawerOpen: boolean;
+    selectedItem: string;
+    applicationName: string;
+    applicationIcon?: ReactNode;
+    openedCategories: string[];
+    navigationItems: NavigationTreeItem[];
+    userStatus: UserStatus;
+    onClickHome: () => void;
+    onClickMenuItem: (id: string) => void;
+    onClickCategory: (id: string) => void;
+    onClickHamburger: () => void;
+    onClickPanelReduce: () => void;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ApplicationShellSidebar.d.ts.map

package/dist/lib/applicationshell/ApplicationShellSidebar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApplicationShellSidebar.d.ts","sourceRoot":"","sources":["../../../src/lib/applicationshell/ApplicationShellSidebar.tsx"],"names":[],"mappings":"AASA,OAAO,EAAc,kBAAkB,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAG7E,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,wBAAgB,OAAO,CAAC,EACtB,YAAY,EACZ,QAAQ,EACR,eAAe,EACf,UAAU,EACV,gBAAgB,EAChB,eAAe,EACf,UAAU,EACV,eAAe,EACf,WAAW,EACX,eAAe,EACf,eAAe,EACf,gBAAgB,EAChB,kBAAkB,GACnB,EAAE;IACD,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,gBAAgB,EAAE,MAAM,EAAE,CAAC;IAC3B,eAAe,EAAE,kBAAkB,EAAE,CAAC;IACtC,UAAU,EAAE,UAAU,CAAC;IACvB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,eAAe,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,eAAe,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,kBAAkB,EAAE,MAAM,IAAI,CAAC;CAChC,2CAoCA"}

package/dist/lib/applicationshell/ApplicationShellSidebar.js

@@ -0,0 +1,52 @@
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { NavDrawer as g, NavDrawerHeader as y, Tooltip as N, Hamburger as C, AppItem as x, NavDrawerBody as w, NavDrawerFooter as D } from "@fluentui/react-components";
+import { Navigation as k } from "@seij/common-ui";
+import { User as I } from "./TitleBar.js";
+import { PanelLeftContract as S } from "./ApplicationShellPanelContract.js";
+function B({
+  selectedItem: t,
+  isMobile: r,
+  applicationName: o,
+  drawerOpen: l,
+  openedCategories: i,
+  applicationIcon: c,
+  userStatus: d,
+  navigationItems: p,
+  onClickHome: m,
+  onClickMenuItem: s,
+  onClickCategory: v,
+  onClickHamburger: h,
+  onClickPanelReduce: u
+}) {
+  return /* @__PURE__ */ n(
+    g,
+    {
+      selectedValue: t,
+      open: r && l || !r,
+      density: "small",
+      type: r ? "overlay" : "inline",
+      openCategories: i,
+      onNavItemSelect: (f, a) => {
+        s(a.value);
+      },
+      onNavCategoryItemToggle: (f, a) => {
+        v(a.categoryValue ?? "");
+      },
+      children: [
+        /* @__PURE__ */ n(y, { children: [
+          r ? /* @__PURE__ */ e(N, { content: "Navigation", relationship: "label", children: /* @__PURE__ */ e(C, { onClick: h }) }) : null,
+          /* @__PURE__ */ e(x, { onClick: m, icon: /* @__PURE__ */ e("span", { children: c }), children: o })
+        ] }),
+        /* @__PURE__ */ e(w, { children: /* @__PURE__ */ e(k, { items: p }) }),
+        /* @__PURE__ */ e(D, { children: /* @__PURE__ */ n("div", { style: { display: "flex" }, children: [
+          /* @__PURE__ */ e(I, { status: d }),
+          r ? null : /* @__PURE__ */ e(S, { panelState: "expanded", onClick: u })
+        ] }) })
+      ]
+    }
+  );
+}
+export {
+  B as Sidebar
+};
+//# sourceMappingURL=ApplicationShellSidebar.js.map

package/dist/lib/applicationshell/ApplicationShellSidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApplicationShellSidebar.js","sources":["../../../src/lib/applicationshell/ApplicationShellSidebar.tsx"],"sourcesContent":["import {\n  AppItem,\n  Hamburger,\n  NavDrawer,\n  NavDrawerBody,\n  NavDrawerFooter,\n  NavDrawerHeader,\n  Tooltip,\n} from \"@fluentui/react-components\";\nimport { Navigation, NavigationTreeItem, UserStatus } from \"@seij/common-ui\";\nimport { User } from \"./TitleBar\";\nimport { PanelLeftContract } from \"./ApplicationShellPanelContract\";\nimport { ReactNode } from \"react\";\n\nexport function Sidebar({\n  selectedItem,\n  isMobile,\n  applicationName,\n  drawerOpen,\n  openedCategories,\n  applicationIcon,\n  userStatus,\n  navigationItems,\n  onClickHome,\n  onClickMenuItem,\n  onClickCategory,\n  onClickHamburger,\n  onClickPanelReduce,\n}: {\n  isMobile: boolean;\n  drawerOpen: boolean;\n  selectedItem: string;\n  applicationName: string;\n  applicationIcon?: ReactNode;\n  openedCategories: string[];\n  navigationItems: NavigationTreeItem[];\n  userStatus: UserStatus;\n  onClickHome: () => void;\n  onClickMenuItem: (id: string) => void;\n  onClickCategory: (id: string) => void;\n  onClickHamburger: () => void;\n  onClickPanelReduce: () => void;\n}) {\n  return (\n    <NavDrawer\n      selectedValue={selectedItem}\n      open={(isMobile && drawerOpen) || !isMobile}\n      density={\"small\"}\n      type={isMobile ? \"overlay\" : \"inline\"}\n      openCategories={openedCategories}\n      onNavItemSelect={(e, data) => {\n        onClickMenuItem(data.value);\n      }}\n      onNavCategoryItemToggle={(e, data) => {\n        onClickCategory(data.categoryValue ?? \"\");\n      }}\n    >\n      <NavDrawerHeader>\n        {isMobile ? (\n          <Tooltip content=\"Navigation\" relationship=\"label\">\n            <Hamburger onClick={onClickHamburger} />\n          </Tooltip>\n        ) : null}\n        <AppItem onClick={onClickHome} icon={<span>{applicationIcon}</span>}>\n          {applicationName}\n        </AppItem>\n      </NavDrawerHeader>\n      <NavDrawerBody>\n        <Navigation items={navigationItems} />\n      </NavDrawerBody>\n      <NavDrawerFooter>\n        <div style={{ display: \"flex\" }}>\n          <User status={userStatus} />\n          {isMobile ? null : <PanelLeftContract panelState={\"expanded\"} onClick={onClickPanelReduce} />}\n        </div>\n      </NavDrawerFooter>\n    </NavDrawer>\n  );\n}\n"],"names":["Sidebar","selectedItem","isMobile","applicationName","drawerOpen","openedCategories","applicationIcon","userStatus","navigationItems","onClickHome","onClickMenuItem","onClickCategory","onClickHamburger","onClickPanelReduce","jsxs","NavDrawer","e","data","NavDrawerHeader","jsx","Tooltip","Hamburger","AppItem","NavDrawerBody","Navigation","NavDrawerFooter","User","PanelLeftContract"],"mappings":";;;;;AAcO,SAASA,EAAQ;AAAA,EACtB,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,oBAAAC;AACF,GAcG;AACD,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,eAAed;AAAA,MACf,MAAOC,KAAYE,KAAe,CAACF;AAAA,MACnC,SAAS;AAAA,MACT,MAAMA,IAAW,YAAY;AAAA,MAC7B,gBAAgBG;AAAA,MAChB,iBAAiB,CAACW,GAAGC,MAAS;AAC5B,QAAAP,EAAgBO,EAAK,KAAK;AAAA,MAC5B;AAAA,MACA,yBAAyB,CAACD,GAAGC,MAAS;AACpC,QAAAN,EAAgBM,EAAK,iBAAiB,EAAE;AAAA,MAC1C;AAAA,MAEA,UAAA;AAAA,QAAA,gBAAAH,EAACI,GAAA,EACE,UAAA;AAAA,UAAAhB,IACC,gBAAAiB,EAACC,GAAA,EAAQ,SAAQ,cAAa,cAAa,SACzC,UAAA,gBAAAD,EAACE,GAAA,EAAU,SAAST,EAAA,CAAkB,EAAA,CACxC,IACE;AAAA,UACJ,gBAAAO,EAACG,KAAQ,SAASb,GAAa,MAAM,gBAAAU,EAAC,QAAA,EAAM,UAAAb,EAAA,CAAgB,GACzD,UAAAH,EAAA,CACH;AAAA,QAAA,GACF;AAAA,0BACCoB,GAAA,EACC,UAAA,gBAAAJ,EAACK,GAAA,EAAW,OAAOhB,GAAiB,GACtC;AAAA,QACA,gBAAAW,EAACM,KACC,UAAA,gBAAAX,EAAC,OAAA,EAAI,OAAO,EAAE,SAAS,UACrB,UAAA;AAAA,UAAA,gBAAAK,EAACO,GAAA,EAAK,QAAQnB,EAAA,CAAY;AAAA,UACzBL,IAAW,OAAO,gBAAAiB,EAACQ,KAAkB,YAAY,YAAY,SAASd,EAAA,CAAoB;AAAA,QAAA,EAAA,CAC7F,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/lib/applicationshell/TitleBar.d.ts

@@ -1,9 +1,13 @@
 import { ReactNode } from 'react';
 import { UserStatus } from './ApplicationShell.types';
-export declare function TitleBar({ hamburger, onClickHome, userStatus, applicationName: applicationName, }: {
+export declare function TitleBar({ hamburger, onClickHome, userStatus, applicationName, applicationIcon, }: {
     userStatus: UserStatus;
-    applicationName: string;
+    applicationName: ReactNode;
+    applicationIcon?: ReactNode;
     hamburger: ReactNode | null;
     onClickHome: () => void;
 }): import("react/jsx-runtime").JSX.Element;
+export declare function User({ status }: {
+    status: UserStatus;
+}): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=TitleBar.d.ts.map

package/dist/lib/applicationshell/TitleBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TitleBar.d.ts","sourceRoot":"","sources":["../../../src/lib/applicationshell/TitleBar.tsx"],"names":[],"mappings":"AACA,OAAO,EAAwB,SAAS,EAAE,MAAM,OAAO,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAyDtD,wBAAgB,QAAQ,CAAC,EACvB,SAAS,EACT,WAAW,EACX,UAAU,EACV,eAAe,EAAE,eAAe,GACjC,EAAE;IACD,UAAU,EAAE,UAAU,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,SAAS,EAAE,SAAS,GAAG,IAAI,CAAC;IAC5B,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB,2CAkBA"}
+{"version":3,"file":"TitleBar.d.ts","sourceRoot":"","sources":["../../../src/lib/applicationshell/TitleBar.tsx"],"names":[],"mappings":"AACA,OAAO,EAAwB,SAAS,EAAE,MAAM,OAAO,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AA6DtD,wBAAgB,QAAQ,CAAC,EACvB,SAAS,EACT,WAAW,EACX,UAAU,EACV,eAAe,EACf,eAAe,GAChB,EAAE;IACD,UAAU,EAAE,UAAU,CAAC;IACvB,eAAe,EAAE,SAAS,CAAC;IAC3B,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,SAAS,EAAE,SAAS,GAAG,IAAI,CAAC;IAC5B,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB,2CAkBA;AAiBD,wBAAgB,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,UAAU,CAAA;CAAE,2CA4BtD"}

package/dist/lib/applicationshell/TitleBar.js

@@ -1,7 +1,7 @@
-import { jsx as n, jsxs as d } from "react/jsx-runtime";
-import { makeStyles as h, tokens as o, Text as p, useKeyboardNavAttribute as u, Spinner as m, Avatar as s } from "@fluentui/react-components";
-import { Icon as x } from "@seij/common-ui-icons";
-const a = h({
+import { jsx as n, jsxs as h } from "react/jsx-runtime";
+import { makeStyles as p, tokens as c, Text as u, useKeyboardNavAttribute as m, Spinner as x, Avatar as d } from "@fluentui/react-components";
+import { Icon as g } from "@seij/common-ui-icons";
+const s = p({
   root: {
     height: "48px",
     lineHeight: "48px",
@@ -9,8 +9,8 @@ const a = h({
   },
   appBar: {
     display: "flex",
-    color: o.colorNeutralForegroundOnBrand,
-    backgroundColor: o.colorBrandBackground,
+    color: c.colorNeutralForegroundOnBrand,
+    backgroundColor: c.colorBrandBackground,
     width: "100%",
     maxWidth: "100%"
   },
@@ -22,13 +22,17 @@ const a = h({
     flex: 0,
     textAlign: "center",
     ":hover": {
-      background: o.colorBrandBackgroundHover,
+      background: c.colorBrandBackgroundHover,
       cursor: "pointer"
     }
   },
   launcher_icon: {
     fontSize: "24px",
-    verticalAlign: "middle"
+    "& img": {
+      maxWidth: "32px",
+      maxHeight: "32px",
+      verticalAlign: "text-top"
+    }
   },
   title: {
     height: "48px",
@@ -54,47 +58,49 @@ const a = h({
     textAlign: "center"
   }
 });
-function v({
+function b({
   hamburger: e,
   onClickHome: r,
   userStatus: i,
-  applicationName: l
+  applicationName: t,
+  applicationIcon: l
 }) {
-  const t = a();
-  return /* @__PURE__ */ n("div", { className: t.root, children: /* @__PURE__ */ d("div", { className: t.appBar, children: [
-    e ? /* @__PURE__ */ n("div", { className: t.launcher, children: e }) : null,
-    /* @__PURE__ */ n("div", { className: t.launcher, children: /* @__PURE__ */ n(g, { onClick: r }) }),
-    /* @__PURE__ */ n("div", { className: t.title, children: /* @__PURE__ */ n(p, { weight: "semibold", children: l }) }),
-    /* @__PURE__ */ n("div", { className: t.actions, children: /* @__PURE__ */ n(f, { status: i }) })
+  const a = s();
+  return /* @__PURE__ */ n("div", { className: a.root, children: /* @__PURE__ */ h("div", { className: a.appBar, children: [
+    e ? /* @__PURE__ */ n("div", { className: a.launcher, children: e }) : null,
+    /* @__PURE__ */ n("div", { className: a.launcher, children: /* @__PURE__ */ n(f, { applicationIcon: l, onClick: r }) }),
+    /* @__PURE__ */ n("div", { className: a.title, children: /* @__PURE__ */ n(u, { weight: "semibold", children: t }) }),
+    /* @__PURE__ */ n("div", { className: a.actions, children: /* @__PURE__ */ n(k, { status: i }) })
   ] }) });
 }
-function g({ onClick: e }) {
-  const r = a(), i = u(), l = c(e);
-  return /* @__PURE__ */ n("a", { tabIndex: 0, ...l, className: r.home, "aria-label": "Accueil", ref: i, children: /* @__PURE__ */ n(x, { name: "genericapp", className: r.launcher_icon }) });
+function f({ applicationIcon: e, onClick: r }) {
+  const i = s(), t = m(), l = o(r);
+  return /* @__PURE__ */ n("a", { tabIndex: 0, ...l, className: i.home, "aria-label": "Accueil", ref: t, children: e ? /* @__PURE__ */ n("span", { className: i.launcher_icon, children: e }) : /* @__PURE__ */ n(g, { name: "genericapp", className: i.launcher_icon }) });
 }
-function f({ status: e }) {
-  const r = a();
+function k({ status: e }) {
+  const r = s();
   if (e.isLoading)
-    return /* @__PURE__ */ n(m, {});
+    return /* @__PURE__ */ n(x, {});
   if (e.errorMessage)
-    return /* @__PURE__ */ d("div", { children: [
+    return /* @__PURE__ */ h("div", { children: [
       "Oops... ",
       e.errorMessage
     ] });
   if (e.isAuthenticated) {
-    const l = e.userName ?? "", t = c(e.onClickSignIn);
-    return /* @__PURE__ */ n("a", { tabIndex: 0, className: r.userActionButton, ...t, children: /* @__PURE__ */ n(s, { "aria-label": l, name: l }) });
+    const t = e.userName ?? "", l = o(e.onClickSignIn);
+    return /* @__PURE__ */ n("a", { tabIndex: 0, className: r.userActionButton, ...l, children: /* @__PURE__ */ n(d, { "aria-label": t, name: t }) });
   }
-  const i = c(e.onClickSignOut);
-  return /* @__PURE__ */ n("a", { tabIndex: 0, className: r.userActionButton, ...i, children: /* @__PURE__ */ n(s, { "aria-label": "Non connecté" }) });
+  const i = o(e.onClickSignOut);
+  return /* @__PURE__ */ n("a", { tabIndex: 0, className: r.userActionButton, ...i, children: /* @__PURE__ */ n(d, { "aria-label": "Non connecté" }) });
 }
-const c = (e) => ({
+const o = (e) => ({
   onClick: e,
   onKeyUp: (i) => {
     (i.key === "Enter" || i.key === " ") && (e(), i.preventDefault());
   }
 });
 export {
-  v as TitleBar
+  b as TitleBar,
+  k as User
 };
 //# sourceMappingURL=TitleBar.js.map

package/dist/lib/applicationshell/TitleBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"TitleBar.js","sources":["../../../src/lib/applicationshell/TitleBar.tsx"],"sourcesContent":["import { Avatar, makeStyles, Spinner, Text, tokens, useKeyboardNavAttribute } from \"@fluentui/react-components\";\nimport { KeyboardEventHandler, ReactNode } from \"react\";\nimport { UserStatus } from \"./ApplicationShell.types\";\nimport { Icon } from \"@seij/common-ui-icons\";\n\nconst useTitleBarStyles = makeStyles({\n  root: {\n    height: \"48px\",\n    lineHeight: \"48px\",\n    width: \"100%\",\n  },\n  appBar: {\n    display: \"flex\",\n    color: tokens.colorNeutralForegroundOnBrand,\n    backgroundColor: tokens.colorBrandBackground,\n    width: \"100%\",\n    maxWidth: \"100%\",\n  },\n  launcher: {\n    width: \"48px\",\n    minWidth: \"48px\",\n    height: \"48px\",\n    lineHeight: \"48px\",\n    flex: 0,\n    textAlign: \"center\",\n    \":hover\": {\n      background: tokens.colorBrandBackgroundHover,\n      cursor: \"pointer\",\n    },\n  },\n  launcher_icon: {\n    fontSize: \"24px\",\n    verticalAlign: \"middle\",\n  },\n  title: {\n    height: \"48px\",\n    flex: 1,\n    whiteSpace: \"nowrap\",\n  },\n  actions: {\n    height: \"48px\",\n    minWidth: \"48px\",\n    flex: 0,\n    display: \"flex\",\n    justifyContent: \"space-around\",\n  },\n  home: {\n    width: \"100%\",\n    height: \"100%\",\n    display: \"inline-block\",\n  },\n  userActionButton: {\n    width: \"100%\",\n    height: \"100%\",\n    display: \"inline-block\",\n    textAlign: \"center\",\n  },\n});\n\nexport function TitleBar({\n  hamburger,\n  onClickHome,\n  userStatus,\n  applicationName: applicationName,\n}: {\n  userStatus: UserStatus;\n  applicationName: string;\n  hamburger: ReactNode | null;\n  onClickHome: () => void;\n}) {\n  const styles = useTitleBarStyles();\n  return (\n    <div className={styles.root}>\n      <div className={styles.appBar}>\n        {hamburger ? <div className={styles.launcher}>{hamburger}</div> : null}\n        <div className={styles.launcher}>\n          <Home onClick={onClickHome} />\n        </div>\n        <div className={styles.title}>\n          <Text weight=\"semibold\">{applicationName}</Text>\n        </div>\n        <div className={styles.actions}>\n          <User status={userStatus} />\n        </div>\n      </div>\n    </div>\n  );\n}\n\nfunction Home({ onClick }: { onClick: () => void }) {\n  const styles = useTitleBarStyles();\n  const ref = useKeyboardNavAttribute<HTMLAnchorElement>();\n  const onClickHandlers = createClickHandlers(onClick);\n  return (\n    <a tabIndex={0} {...onClickHandlers} className={styles.home} aria-label=\"Accueil\" ref={ref}>\n      <Icon name=\"genericapp\" className={styles.launcher_icon} />\n    </a>\n  );\n}\n\nfunction User({ status }: { status: UserStatus }) {\n  const styles = useTitleBarStyles();\n\n  if (status.isLoading) {\n    return <Spinner />;\n  }\n\n  if (status.errorMessage) {\n    return <div>Oops... {status.errorMessage}</div>;\n  }\n\n  if (status.isAuthenticated) {\n    const name = status.userName ?? \"\";\n    const onClickHandlers = createClickHandlers(status.onClickSignIn);\n    return (\n      <a tabIndex={0} className={styles.userActionButton} {...onClickHandlers}>\n        <Avatar aria-label={name} name={name} />\n      </a>\n    );\n  }\n\n  const onClickHandlers = createClickHandlers(status.onClickSignOut);\n\n  return (\n    <a tabIndex={0} className={styles.userActionButton} {...onClickHandlers}>\n      <Avatar aria-label=\"Non connecté\" />\n    </a>\n  );\n}\n\nconst createClickHandlers = (onClick: () => void) => {\n  const handleKeyUp: KeyboardEventHandler<HTMLAnchorElement> = (e) => {\n    const correct = e.key === \"Enter\" || e.key === \" \";\n    if (correct) {\n      onClick();\n      e.preventDefault();\n    }\n  };\n  return {\n    onClick: onClick,\n    onKeyUp: handleKeyUp,\n  };\n};\n"],"names":["useTitleBarStyles","makeStyles","tokens","TitleBar","hamburger","onClickHome","userStatus","applicationName","styles","jsx","jsxs","Home","Text","User","onClick","ref","useKeyboardNavAttribute","onClickHandlers","createClickHandlers","Icon","status","Spinner","name","Avatar","e"],"mappings":";;;AAKA,MAAMA,IAAoBC,EAAW;AAAA,EACnC,MAAM;AAAA,IACJ,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,OAAO;AAAA,EAAA;AAAA,EAET,QAAQ;AAAA,IACN,SAAS;AAAA,IACT,OAAOC,EAAO;AAAA,IACd,iBAAiBA,EAAO;AAAA,IACxB,OAAO;AAAA,IACP,UAAU;AAAA,EAAA;AAAA,EAEZ,UAAU;AAAA,IACR,OAAO;AAAA,IACP,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,WAAW;AAAA,IACX,UAAU;AAAA,MACR,YAAYA,EAAO;AAAA,MACnB,QAAQ;AAAA,IAAA;AAAA,EACV;AAAA,EAEF,eAAe;AAAA,IACb,UAAU;AAAA,IACV,eAAe;AAAA,EAAA;AAAA,EAEjB,OAAO;AAAA,IACL,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,YAAY;AAAA,EAAA;AAAA,EAEd,SAAS;AAAA,IACP,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,MAAM;AAAA,IACN,SAAS;AAAA,IACT,gBAAgB;AAAA,EAAA;AAAA,EAElB,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,EAAA;AAAA,EAEX,kBAAkB;AAAA,IAChB,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,WAAW;AAAA,EAAA;AAEf,CAAC;AAEM,SAASC,EAAS;AAAA,EACvB,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC;AAAA,EACA,iBAAAC;AACF,GAKG;AACD,QAAMC,IAASR,EAAA;AACf,SACE,gBAAAS,EAAC,SAAI,WAAWD,EAAO,MACrB,UAAA,gBAAAE,EAAC,OAAA,EAAI,WAAWF,EAAO,QACpB,UAAA;AAAA,IAAAJ,sBAAa,OAAA,EAAI,WAAWI,EAAO,UAAW,aAAU,IAAS;AAAA,IAClE,gBAAAC,EAAC,SAAI,WAAWD,EAAO,UACrB,UAAA,gBAAAC,EAACE,GAAA,EAAK,SAASN,EAAA,CAAa,EAAA,CAC9B;AAAA,IACA,gBAAAI,EAAC,OAAA,EAAI,WAAWD,EAAO,OACrB,4BAACI,GAAA,EAAK,QAAO,YAAY,UAAAL,EAAA,CAAgB,EAAA,CAC3C;AAAA,IACA,gBAAAE,EAAC,SAAI,WAAWD,EAAO,SACrB,UAAA,gBAAAC,EAACI,GAAA,EAAK,QAAQP,EAAA,CAAY,EAAA,CAC5B;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;AAEA,SAASK,EAAK,EAAE,SAAAG,KAAoC;AAClD,QAAMN,IAASR,EAAA,GACTe,IAAMC,EAAA,GACNC,IAAkBC,EAAoBJ,CAAO;AACnD,2BACG,KAAA,EAAE,UAAU,GAAI,GAAGG,GAAiB,WAAWT,EAAO,MAAM,cAAW,WAAU,KAAAO,GAChF,4BAACI,GAAA,EAAK,MAAK,cAAa,WAAWX,EAAO,eAAe,GAC3D;AAEJ;AAEA,SAASK,EAAK,EAAE,QAAAO,KAAkC;AAChD,QAAMZ,IAASR,EAAA;AAEf,MAAIoB,EAAO;AACT,6BAAQC,GAAA,EAAQ;AAGlB,MAAID,EAAO;AACT,6BAAQ,OAAA,EAAI,UAAA;AAAA,MAAA;AAAA,MAASA,EAAO;AAAA,IAAA,GAAa;AAG3C,MAAIA,EAAO,iBAAiB;AAC1B,UAAME,IAAOF,EAAO,YAAY,IAC1BH,IAAkBC,EAAoBE,EAAO,aAAa;AAChE,WACE,gBAAAX,EAAC,KAAA,EAAE,UAAU,GAAG,WAAWD,EAAO,kBAAmB,GAAGS,GACtD,UAAA,gBAAAR,EAACc,GAAA,EAAO,cAAYD,GAAM,MAAAA,GAAY,GACxC;AAAA,EAEJ;AAEA,QAAML,IAAkBC,EAAoBE,EAAO,cAAc;AAEjE,SACE,gBAAAX,EAAC,KAAA,EAAE,UAAU,GAAG,WAAWD,EAAO,kBAAmB,GAAGS,GACtD,UAAA,gBAAAR,EAACc,GAAA,EAAO,cAAW,gBAAe,GACpC;AAEJ;AAEA,MAAML,IAAsB,CAACJ,OAQpB;AAAA,EACL,SAAAA;AAAA,EACA,SAT2D,CAACU,MAAM;AAElE,KADgBA,EAAE,QAAQ,WAAWA,EAAE,QAAQ,SAE7CV,EAAA,GACAU,EAAE,eAAA;AAAA,EAEN;AAGW;"}
+{"version":3,"file":"TitleBar.js","sources":["../../../src/lib/applicationshell/TitleBar.tsx"],"sourcesContent":["import { Avatar, makeStyles, Spinner, Text, tokens, useKeyboardNavAttribute } from \"@fluentui/react-components\";\nimport { KeyboardEventHandler, ReactNode } from \"react\";\nimport { UserStatus } from \"./ApplicationShell.types\";\nimport { Icon } from \"@seij/common-ui-icons\";\n\nconst useTitleBarStyles = makeStyles({\n  root: {\n    height: \"48px\",\n    lineHeight: \"48px\",\n    width: \"100%\",\n  },\n  appBar: {\n    display: \"flex\",\n    color: tokens.colorNeutralForegroundOnBrand,\n    backgroundColor: tokens.colorBrandBackground,\n    width: \"100%\",\n    maxWidth: \"100%\",\n  },\n  launcher: {\n    width: \"48px\",\n    minWidth: \"48px\",\n    height: \"48px\",\n    lineHeight: \"48px\",\n    flex: 0,\n    textAlign: \"center\",\n    \":hover\": {\n      background: tokens.colorBrandBackgroundHover,\n      cursor: \"pointer\",\n    },\n  },\n  launcher_icon: {\n    fontSize: \"24px\",\n    \"& img\": {\n      maxWidth: \"32px\",\n      maxHeight: \"32px\",\n      verticalAlign: \"text-top\",\n    },\n  },\n  title: {\n    height: \"48px\",\n    flex: 1,\n    whiteSpace: \"nowrap\",\n  },\n  actions: {\n    height: \"48px\",\n    minWidth: \"48px\",\n    flex: 0,\n    display: \"flex\",\n    justifyContent: \"space-around\",\n  },\n  home: {\n    width: \"100%\",\n    height: \"100%\",\n    display: \"inline-block\",\n  },\n  userActionButton: {\n    width: \"100%\",\n    height: \"100%\",\n    display: \"inline-block\",\n    textAlign: \"center\",\n  },\n});\n\nexport function TitleBar({\n  hamburger,\n  onClickHome,\n  userStatus,\n  applicationName,\n  applicationIcon,\n}: {\n  userStatus: UserStatus;\n  applicationName: ReactNode;\n  applicationIcon?: ReactNode;\n  hamburger: ReactNode | null;\n  onClickHome: () => void;\n}) {\n  const styles = useTitleBarStyles();\n  return (\n    <div className={styles.root}>\n      <div className={styles.appBar}>\n        {hamburger ? <div className={styles.launcher}>{hamburger}</div> : null}\n        <div className={styles.launcher}>\n          <Home applicationIcon={applicationIcon} onClick={onClickHome} />\n        </div>\n        <div className={styles.title}>\n          <Text weight=\"semibold\">{applicationName}</Text>\n        </div>\n        <div className={styles.actions}>\n          <User status={userStatus} />\n        </div>\n      </div>\n    </div>\n  );\n}\n\nfunction Home({ applicationIcon, onClick }: { applicationIcon?: ReactNode; onClick: () => void }) {\n  const styles = useTitleBarStyles();\n  const ref = useKeyboardNavAttribute<HTMLAnchorElement>();\n  const onClickHandlers = createClickHandlers(onClick);\n  return (\n    <a tabIndex={0} {...onClickHandlers} className={styles.home} aria-label=\"Accueil\" ref={ref}>\n      {applicationIcon ? (\n        <span className={styles.launcher_icon}>{applicationIcon}</span>\n      ) : (\n        <Icon name=\"genericapp\" className={styles.launcher_icon} />\n      )}\n    </a>\n  );\n}\n\nexport function User({ status }: { status: UserStatus }) {\n  const styles = useTitleBarStyles();\n\n  if (status.isLoading) {\n    return <Spinner />;\n  }\n\n  if (status.errorMessage) {\n    return <div>Oops... {status.errorMessage}</div>;\n  }\n\n  if (status.isAuthenticated) {\n    const name = status.userName ?? \"\";\n    const onClickHandlers = createClickHandlers(status.onClickSignIn);\n    return (\n      <a tabIndex={0} className={styles.userActionButton} {...onClickHandlers}>\n        <Avatar aria-label={name} name={name} />\n      </a>\n    );\n  }\n\n  const onClickHandlers = createClickHandlers(status.onClickSignOut);\n\n  return (\n    <a tabIndex={0} className={styles.userActionButton} {...onClickHandlers}>\n      <Avatar aria-label=\"Non connecté\" />\n    </a>\n  );\n}\n\nconst createClickHandlers = (onClick: () => void) => {\n  const handleKeyUp: KeyboardEventHandler<HTMLAnchorElement> = (e) => {\n    const correct = e.key === \"Enter\" || e.key === \" \";\n    if (correct) {\n      onClick();\n      e.preventDefault();\n    }\n  };\n  return {\n    onClick: onClick,\n    onKeyUp: handleKeyUp,\n  };\n};\n"],"names":["useTitleBarStyles","makeStyles","tokens","TitleBar","hamburger","onClickHome","userStatus","applicationName","applicationIcon","styles","jsx","jsxs","Home","Text","User","onClick","ref","useKeyboardNavAttribute","onClickHandlers","createClickHandlers","Icon","status","Spinner","name","Avatar","e"],"mappings":"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"}

package/dist/lib/button_bar/ButtonBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonBar.d.ts","sourceRoot":"","sources":["../../../src/lib/button_bar/ButtonBar.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAarD,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,OAAmB,GACpB,EAAE;IACD,OAAO,CAAC,EAAE,SAAS,GAAG,sBAAsB,CAAC;CAC9C,GAAG,iBAAiB,2CAOpB"}
+{"version":3,"file":"ButtonBar.d.ts","sourceRoot":"","sources":["../../../src/lib/button_bar/ButtonBar.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAa1C,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,OAAmB,GACpB,EAAE;IACD,OAAO,CAAC,EAAE,SAAS,GAAG,sBAAsB,CAAC;CAC9C,GAAG,iBAAiB,2CAOpB"}

package/dist/lib/button_bar/ButtonBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonBar.js","sources":["../../../src/lib/button_bar/ButtonBar.tsx"],"sourcesContent":["import { makeStyles, mergeClasses, tokens } from \"@fluentui/react-components\";\nimport { PropsWithChildren, ReactNode } from \"react\";\n\nconst useStyles = makeStyles({\n  root: {\n    display: \"flex\",\n    columnGap: tokens.spacingHorizontalM,\n  },\n  variant_table_bottom_actions: {\n    marginTop: tokens.spacingVerticalL,\n    justifyContent: \"flex-end\",\n  },\n});\n\nexport function ButtonBar({\n  children,\n  variant = \"default\",\n}: {\n  variant?: \"default\" | \"table_bottom_actions\";\n} & PropsWithChildren) {\n  const styles = useStyles();\n  const classNames = mergeClasses(\n    styles.root,\n    variant === \"table_bottom_actions\" ? styles.variant_table_bottom_actions : undefined,\n  );\n  return <div className={classNames}>{children}</div>;\n}\n"],"names":["useStyles","makeStyles","tokens","ButtonBar","children","variant","styles","classNames","mergeClasses","jsx"],"mappings":";;AAGA,MAAMA,IAAYC,EAAW;AAAA,EAC3B,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,WAAWC,EAAO;AAAA,EAAA;AAAA,EAEpB,8BAA8B;AAAA,IAC5B,WAAWA,EAAO;AAAA,IAClB,gBAAgB;AAAA,EAAA;AAEpB,CAAC;AAEM,SAASC,EAAU;AAAA,EACxB,UAAAC;AAAA,EACA,SAAAC,IAAU;AACZ,GAEuB;AACrB,QAAMC,IAASN,EAAA,GACTO,IAAaC;AAAA,IACjBF,EAAO;AAAA,IACPD,MAAY,yBAAyBC,EAAO,+BAA+B;AAAA,EAAA;AAE7E,SAAO,gBAAAG,EAAC,OAAA,EAAI,WAAWF,GAAa,UAAAH,EAAA,CAAS;AAC/C;"}
+{"version":3,"file":"ButtonBar.js","sources":["../../../src/lib/button_bar/ButtonBar.tsx"],"sourcesContent":["import { makeStyles, mergeClasses, tokens } from \"@fluentui/react-components\";\nimport { PropsWithChildren } from \"react\";\n\nconst useStyles = makeStyles({\n  root: {\n    display: \"flex\",\n    columnGap: tokens.spacingHorizontalM,\n  },\n  variant_table_bottom_actions: {\n    marginTop: tokens.spacingVerticalL,\n    justifyContent: \"flex-end\",\n  },\n});\n\nexport function ButtonBar({\n  children,\n  variant = \"default\",\n}: {\n  variant?: \"default\" | \"table_bottom_actions\";\n} & PropsWithChildren) {\n  const styles = useStyles();\n  const classNames = mergeClasses(\n    styles.root,\n    variant === \"table_bottom_actions\" ? styles.variant_table_bottom_actions : undefined,\n  );\n  return <div className={classNames}>{children}</div>;\n}\n"],"names":["useStyles","makeStyles","tokens","ButtonBar","children","variant","styles","classNames","mergeClasses","jsx"],"mappings":";;AAGA,MAAMA,IAAYC,EAAW;AAAA,EAC3B,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,WAAWC,EAAO;AAAA,EAAA;AAAA,EAEpB,8BAA8B;AAAA,IAC5B,WAAWA,EAAO;AAAA,IAClB,gBAAgB;AAAA,EAAA;AAEpB,CAAC;AAEM,SAASC,EAAU;AAAA,EACxB,UAAAC;AAAA,EACA,SAAAC,IAAU;AACZ,GAEuB;AACrB,QAAMC,IAASN,EAAA,GACTO,IAAaC;AAAA,IACjBF,EAAO;AAAA,IACPD,MAAY,yBAAyBC,EAAO,+BAA+B;AAAA,EAAA;AAE7E,SAAO,gBAAAG,EAAC,OAAA,EAAI,WAAWF,GAAa,UAAAH,EAAA,CAAS;AAC/C;"}

package/dist/lib/commons/currencysymbol.js.map

@@ -1 +1 @@
-{"version":3,"file":"currencysymbol.js","sources":["../../../src/lib/commons/currencysymbol.ts"],"sourcesContent":["import { toCurrencySymbol } from \"@seij/common-types\";\n\nexport function toCurrencySymbolSafe(code: string | null | undefined): string | undefined {\n  if (code === null) return undefined;\n  if (code === undefined) return code;\n  if (code.length == 0) return code;\n  if (code.length != 3) return code;\n  try {\n    return toCurrencySymbol(code);\n  } catch (err) {\n    return code;\n  }\n}\n"],"names":["toCurrencySymbolSafe","code","toCurrencySymbol"],"mappings":";AAEO,SAASA,EAAqBC,GAAqD;AACxF,MAAIA,MAAS,MAGb;AAAA,QAFIA,MAAS,UACTA,EAAK,UAAU,KACfA,EAAK,UAAU,EAAG,QAAOA;AAC7B,QAAI;AACF,aAAOC,EAAiBD,CAAI;AAAA,IAC9B,QAAc;AACZ,aAAOA;AAAA,IACT;AAAA;AACF;"}
+{"version":3,"file":"currencysymbol.js","sources":["../../../src/lib/commons/currencysymbol.ts"],"sourcesContent":["import { toCurrencySymbol } from \"@seij/common-types\";\n\nexport function toCurrencySymbolSafe(code: string | null | undefined): string | undefined {\n  if (code === null) return undefined;\n  if (code === undefined) return code;\n  if (code.length == 0) return code;\n  if (code.length != 3) return code;\n  try {\n    return toCurrencySymbol(code);\n  } catch (_) {\n    return code;\n  }\n}\n"],"names":["toCurrencySymbolSafe","code","toCurrencySymbol"],"mappings":";AAEO,SAASA,EAAqBC,GAAqD;AACxF,MAAIA,MAAS,MAGb;AAAA,QAFIA,MAAS,UACTA,EAAK,UAAU,KACfA,EAAK,UAAU,EAAG,QAAOA;AAC7B,QAAI;AACF,aAAOC,EAAiBD,CAAI;AAAA,IAC9B,QAAY;AACV,aAAOA;AAAA,IACT;AAAA;AACF;"}

package/dist/lib/i18n/i18n.detect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"i18n.detect.d.ts","sourceRoot":"","sources":["../../../src/lib/i18n/i18n.detect.ts"],"names":[],"mappings":"AACA,MAAM,MAAM,MAAM,GAAG,MAAM,CAAC;AAK5B,wBAAgB,SAAS,CAAC,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAM9C;AAmBD,wBAAgB,kBAAkB,IAAI,MAAM,CAO3C;AAGD,wBAAgB,kBAAkB,CAAC,IAAI,EAAE;IACvC,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAChC,GAAG,MAAM,CAGT;AAGD,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,UAKxC"}
+{"version":3,"file":"i18n.detect.d.ts","sourceRoot":"","sources":["../../../src/lib/i18n/i18n.detect.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,MAAM,GAAG,MAAM,CAAC;AAK5B,wBAAgB,SAAS,CAAC,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAM9C;AAmBD,wBAAgB,kBAAkB,IAAI,MAAM,CAO3C;AAGD,wBAAgB,kBAAkB,CAAC,IAAI,EAAE;IACvC,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAChC,GAAG,MAAM,CAGT;AAGD,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,UAKxC"}

package/dist/lib/i18n/i18n.react.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"i18n.react.d.ts","sourceRoot":"","sources":["../../../src/lib/i18n/i18n.react.tsx"],"names":[],"mappings":"AACA,OAAO,KAAkE,MAAM,OAAO,CAAC;AAEvF,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAQpC,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,EAAE,iBAAiB,kDAsB3D;AAED,wBAAgB,OAAO,IAAI,IAAI,CAI9B"}
+{"version":3,"file":"i18n.react.d.ts","sourceRoot":"","sources":["../../../src/lib/i18n/i18n.react.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkE,MAAM,OAAO,CAAC;AAEvF,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAQpC,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,EAAE,iBAAiB,kDAsB3D;AAED,wBAAgB,OAAO,IAAI,IAAI,CAI9B"}

package/dist/lib/i18n/i18n.react.js.map

@@ -1 +1 @@
-{"version":3,"file":"i18n.react.js","sources":["../../../src/lib/i18n/i18n.react.tsx"],"sourcesContent":["// i18n/I18nProvider.tsx\nimport React, { createContext, useContext, useEffect, useMemo, useState } from \"react\";\nimport { i18NextInstance, I18nService, I18nServiceInstance } from \"./i18n.service\";\nimport { I18n } from \"./i18n.types\";\n\ntype I18nCtxType = {\n  i18nService: I18nService;\n  lastChange: number;\n};\nconst I18nCtx = createContext<I18nCtxType>({ i18nService: I18nServiceInstance, lastChange: 0 });\n\nexport interface I18nProviderProps {\n  children: React.ReactNode;\n}\n\nexport function I18nProvider({ children }: I18nProviderProps) {\n  // Detects the locale: first used the forced one, then initial, then use autodetection\n\n  const [instanceTs, setInstanceTs] = useState(0);\n  const [ready, setReady] = useState<boolean>(false);\n  const value: I18nCtxType = useMemo(\n    () => ({\n      i18nService: I18nServiceInstance,\n      lastChange: instanceTs,\n    }),\n    [instanceTs],\n  );\n\n  useEffect(() => {\n    I18nServiceInstance.readyPromise.then(() => {\n      setReady(true);\n    });\n  }, []);\n\n  if (!ready) return null;\n\n  return <I18nCtx.Provider value={value}>{children}</I18nCtx.Provider>;\n}\n\nexport function useI18n(): I18n {\n  const v = useContext(I18nCtx);\n  if (!v) throw new Error(\"useI18n must be used within I18nProvider\");\n  return v.i18nService;\n}\n"],"names":["I18nCtx","createContext","I18nServiceInstance","I18nProvider","children","instanceTs","setInstanceTs","useState","ready","setReady","value","useMemo","useEffect","jsx","useI18n","v","useContext"],"mappings":";;;AASA,MAAMA,IAAUC,EAA2B,EAAE,aAAaC,GAAqB,YAAY,GAAG;AAMvF,SAASC,EAAa,EAAE,UAAAC,KAA+B;AAG5D,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAS,CAAC,GACxC,CAACC,GAAOC,CAAQ,IAAIF,EAAkB,EAAK,GAC3CG,IAAqBC;AAAA,IACzB,OAAO;AAAA,MACL,aAAaT;AAAA,MACb,YAAYG;AAAA,IAAA;AAAA,IAEd,CAACA,CAAU;AAAA,EAAA;AASb,SANAO,EAAU,MAAM;AACd,IAAAV,EAAoB,aAAa,KAAK,MAAM;AAC1C,MAAAO,EAAS,EAAI;AAAA,IACf,CAAC;AAAA,EACH,GAAG,CAAA,CAAE,GAEAD,IAEE,gBAAAK,EAACb,EAAQ,UAAR,EAAiB,OAAAU,GAAe,UAAAN,EAAA,CAAS,IAF9B;AAGrB;AAEO,SAASU,IAAgB;AAC9B,QAAMC,IAAIC,EAAWhB,CAAO;AAC5B,MAAI,CAACe,EAAG,OAAM,IAAI,MAAM,0CAA0C;AAClE,SAAOA,EAAE;AACX;"}
+{"version":3,"file":"i18n.react.js","sources":["../../../src/lib/i18n/i18n.react.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useMemo, useState } from \"react\";\nimport { I18nService, I18nServiceInstance } from \"./i18n.service\";\nimport { I18n } from \"./i18n.types\";\n\ntype I18nCtxType = {\n  i18nService: I18nService;\n  lastChange: number;\n};\nconst I18nCtx = createContext<I18nCtxType>({ i18nService: I18nServiceInstance, lastChange: 0 });\n\nexport interface I18nProviderProps {\n  children: React.ReactNode;\n}\n\nexport function I18nProvider({ children }: I18nProviderProps) {\n  // Detects the locale: first used the forced one, then initial, then use autodetection\n\n  const [instanceTs, setInstanceTs] = useState(0);\n  const [ready, setReady] = useState<boolean>(false);\n  const value: I18nCtxType = useMemo(\n    () => ({\n      i18nService: I18nServiceInstance,\n      lastChange: instanceTs,\n    }),\n    [instanceTs],\n  );\n\n  useEffect(() => {\n    I18nServiceInstance.readyPromise.then(() => {\n      setReady(true);\n    });\n  }, []);\n\n  if (!ready) return null;\n\n  return <I18nCtx.Provider value={value}>{children}</I18nCtx.Provider>;\n}\n\nexport function useI18n(): I18n {\n  const v = useContext(I18nCtx);\n  if (!v) throw new Error(\"useI18n must be used within I18nProvider\");\n  return v.i18nService;\n}\n"],"names":["I18nCtx","createContext","I18nServiceInstance","I18nProvider","children","instanceTs","setInstanceTs","useState","ready","setReady","value","useMemo","useEffect","jsx","useI18n","v","useContext"],"mappings":";;;AAQA,MAAMA,IAAUC,EAA2B,EAAE,aAAaC,GAAqB,YAAY,GAAG;AAMvF,SAASC,EAAa,EAAE,UAAAC,KAA+B;AAG5D,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAS,CAAC,GACxC,CAACC,GAAOC,CAAQ,IAAIF,EAAkB,EAAK,GAC3CG,IAAqBC;AAAA,IACzB,OAAO;AAAA,MACL,aAAaT;AAAA,MACb,YAAYG;AAAA,IAAA;AAAA,IAEd,CAACA,CAAU;AAAA,EAAA;AASb,SANAO,EAAU,MAAM;AACd,IAAAV,EAAoB,aAAa,KAAK,MAAM;AAC1C,MAAAO,EAAS,EAAI;AAAA,IACf,CAAC;AAAA,EACH,GAAG,CAAA,CAAE,GAEAD,IAEE,gBAAAK,EAACb,EAAQ,UAAR,EAAiB,OAAAU,GAAe,UAAAN,EAAA,CAAS,IAF9B;AAGrB;AAEO,SAASU,IAAgB;AAC9B,QAAMC,IAAIC,EAAWhB,CAAO;AAC5B,MAAI,CAACe,EAAG,OAAM,IAAI,MAAM,0CAA0C;AAClE,SAAOA,EAAE;AACX;"}

package/dist/lib/listview/ListView.js

@@ -1,6 +1,7 @@
 import { jsxs as b, jsx as e } from "react/jsx-runtime";
 import { makeStyles as h, tokens as d, Input as v, Caption1 as m, List as I, ListItem as L, Card as w, CardHeader as y, Text as C } from "@fluentui/react-components";
 import { isFunction as S } from "lodash-es";
+import "../i18n/i18n.service.js";
 import { useI18n as _ } from "../i18n/i18n.react.js";
 import { Icon as u } from "@seij/common-ui-icons";
 const N = h({
@@ -9,17 +10,17 @@ const N = h({
     padding: "1em"
   }
 });
-function W({
+function z({
   data: i,
   activeId: s,
   searchText: o = "",
-  search: t,
+  search: n,
   pathFactory: r,
-  navigate: n
+  navigate: t
 }) {
   const p = N(), { t: c } = _(), f = (l) => {
-    t && t(l);
-  }, g = S(t), a = c("ListView_search"), x = c("ListView_no_result");
+    n && n(l);
+  }, g = S(n), a = c("ListView_search"), x = c("ListView_no_result");
   return /* @__PURE__ */ b("div", { children: [
     g && /* @__PURE__ */ e(
       v,
@@ -31,7 +32,7 @@ function W({
         onChange: (l) => f(l.target.value)
       }
     ),
-    /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(M, { activeId: s, items: i, pathFactory: r, navigate: n }) }),
+    /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(M, { activeId: s, items: i, pathFactory: r, navigate: t }) }),
     i.length === 0 ? /* @__PURE__ */ e("div", { className: p.noresult, children: /* @__PURE__ */ e(m, { children: x }) }) : null
   ] });
 }
@@ -61,14 +62,14 @@ function M({
   items: i,
   activeId: s,
   pathFactory: o,
-  navigate: t
+  navigate: n
 }) {
   const r = k();
-  return i.length === 0 ? null : /* @__PURE__ */ e(I, { navigationMode: "composite", children: i.map((n) => /* @__PURE__ */ e(
+  return i.length === 0 ? null : /* @__PURE__ */ e(I, { navigationMode: "composite", children: i.map((t) => /* @__PURE__ */ e(
     L,
     {
       onAction: () => {
-        t(o(n));
+        n(o(t));
       },
       children: /* @__PURE__ */ e(
         w,
@@ -78,23 +79,23 @@ function M({
           appearance: "subtle",
           className: r.card,
           onClick: () => {
-            t(o(n));
+            n(o(t));
           },
           children: /* @__PURE__ */ e(
             y,
             {
-              header: /* @__PURE__ */ e(C, { weight: "regular", children: n.label ?? /* @__PURE__ */ e("span", { children: " " }) }),
-              description: /* @__PURE__ */ e(m, { children: n.description ?? /* @__PURE__ */ e("span", { children: " " }) }),
+              header: /* @__PURE__ */ e(C, { weight: "regular", children: t.label ?? /* @__PURE__ */ e("span", { children: " " }) }),
+              description: /* @__PURE__ */ e(m, { children: t.description ?? /* @__PURE__ */ e("span", { children: " " }) }),
               action: /* @__PURE__ */ e(u, { name: "chevron_right_filled" })
             }
           )
         }
       )
     },
-    n.id
+    t.id
   )) });
 }
 export {
-  W as ListView
+  z as ListView
 };
 //# sourceMappingURL=ListView.js.map

package/dist/lib/listview/ListView.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListView.js","sources":["../../../src/lib/listview/ListView.tsx"],"sourcesContent":["import {\n  Caption1,\n  Card,\n  CardHeader,\n  Input,\n  List,\n  ListItem,\n  makeStyles,\n  Text,\n  tokens,\n} from \"@fluentui/react-components\";\n\nimport { isFunction } from \"lodash-es\";\nimport { ReactNode } from \"react\";\nimport { useI18n } from \"../i18n/i18n.react\";\nimport { Icon } from \"@seij/common-ui-icons\";\nexport interface ListItemData {\n  id: string;\n  label: ReactNode;\n  description: ReactNode | null;\n}\n\nconst useStyles = makeStyles({\n  noresult: {\n    textAlign: \"center\",\n    padding: \"1em\",\n  },\n});\nexport interface ListViewProps<T extends ListItemData = ListItemData> {\n  data: T[];\n  activeId: string;\n  searchText?: string;\n  search?: (input: string) => void;\n  pathFactory: (item: T) => string;\n  navigate: (url: string) => void;\n}\nexport function ListView<T extends ListItemData>({\n  data,\n  activeId,\n  searchText = \"\",\n  search,\n  pathFactory,\n  navigate,\n}: ListViewProps<T>) {\n  const styles = useStyles();\n  const { t } = useI18n();\n  const handleChange = (value: string) => {\n    if (search) search(value);\n  };\n  const isSearchEnabled = isFunction(search);\n  const searchMessage = t(\"ListView_search\");\n  const noResultMessage = t(\"ListView_no_result\");\n  return (\n    <div>\n      {isSearchEnabled && (\n        <Input\n          style={{ width: \"100%\" }}\n          contentBefore={<Icon name=\"search\" aria-label={searchMessage} />}\n          value={searchText}\n          placeholder={searchMessage}\n          onChange={(e) => handleChange(e.target.value)}\n        />\n      )}\n      <div>\n        <ItemList activeId={activeId} items={data} pathFactory={pathFactory} navigate={navigate} />\n      </div>\n      {data.length === 0 ? (\n        <div className={styles.noresult}>\n          <Caption1>{noResultMessage}</Caption1>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\nconst useItemListStyles = makeStyles({\n  root: {\n    display: \"flex\",\n  },\n  content: {\n    flex: 1,\n  },\n  title: {\n    fontWeight: \"bold\",\n  },\n  description: {\n    fontWeight: \"normal\",\n  },\n  action: {\n    flex: 0,\n  },\n\n  card: {\n    width: \"100%\",\n    borderBottom: \"1px solid \" + tokens.colorNeutralStencil1,\n    borderRadius: tokens.borderRadiusNone,\n  },\n});\n\nfunction ItemList<T extends ListItemData>({\n  items,\n  activeId,\n  pathFactory,\n  navigate,\n}: {\n  items: T[];\n  activeId: string;\n  pathFactory: (item: T) => string;\n  navigate: (url: string) => void;\n}) {\n  const style = useItemListStyles();\n  if (items.length === 0) return null;\n  return (\n    <List navigationMode=\"composite\">\n      {items.map((it) => (\n        <ListItem\n          key={it.id}\n          onAction={() => {\n            navigate(pathFactory(it));\n          }}\n        >\n          <Card\n            role=\"gridcell\"\n            orientation=\"horizontal\"\n            appearance=\"subtle\"\n            className={style.card}\n            onClick={() => {\n              navigate(pathFactory(it));\n            }}\n          >\n            <CardHeader\n              header={<Text weight=\"regular\">{it.label ?? <span>&nbsp;</span>}</Text>}\n              description={<Caption1>{it.description ?? <span>&nbsp;</span>}</Caption1>}\n              action={<Icon name=\"chevron_right_filled\" />}\n            />\n          </Card>\n        </ListItem>\n      ))}\n    </List>\n  );\n}\n"],"names":["useStyles","makeStyles","ListView","data","activeId","searchText","search","pathFactory","navigate","styles","t","useI18n","handleChange","value","isSearchEnabled","isFunction","searchMessage","noResultMessage","jsx","Input","Icon","e","ItemList","Caption1","useItemListStyles","tokens","items","style","List","it","ListItem","Card","CardHeader","Text"],"mappings":"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"}
+{"version":3,"file":"ListView.js","sources":["../../../src/lib/listview/ListView.tsx"],"sourcesContent":["import {\n  Caption1,\n  Card,\n  CardHeader,\n  Input,\n  List,\n  ListItem,\n  makeStyles,\n  Text,\n  tokens,\n} from \"@fluentui/react-components\";\n\nimport { isFunction } from \"lodash-es\";\nimport { ReactNode } from \"react\";\nimport { useI18n } from \"../i18n\";\nimport { Icon } from \"@seij/common-ui-icons\";\nexport interface ListItemData {\n  id: string;\n  label: ReactNode;\n  description: ReactNode | null;\n}\n\nconst useStyles = makeStyles({\n  noresult: {\n    textAlign: \"center\",\n    padding: \"1em\",\n  },\n});\nexport interface ListViewProps<T extends ListItemData = ListItemData> {\n  data: T[];\n  activeId: string;\n  searchText?: string;\n  search?: (input: string) => void;\n  pathFactory: (item: T) => string;\n  navigate: (url: string) => void;\n}\nexport function ListView<T extends ListItemData>({\n  data,\n  activeId,\n  searchText = \"\",\n  search,\n  pathFactory,\n  navigate,\n}: ListViewProps<T>) {\n  const styles = useStyles();\n  const { t } = useI18n();\n  const handleChange = (value: string) => {\n    if (search) search(value);\n  };\n  const isSearchEnabled = isFunction(search);\n  const searchMessage = t(\"ListView_search\");\n  const noResultMessage = t(\"ListView_no_result\");\n  return (\n    <div>\n      {isSearchEnabled && (\n        <Input\n          style={{ width: \"100%\" }}\n          contentBefore={<Icon name=\"search\" aria-label={searchMessage} />}\n          value={searchText}\n          placeholder={searchMessage}\n          onChange={(e) => handleChange(e.target.value)}\n        />\n      )}\n      <div>\n        <ItemList activeId={activeId} items={data} pathFactory={pathFactory} navigate={navigate} />\n      </div>\n      {data.length === 0 ? (\n        <div className={styles.noresult}>\n          <Caption1>{noResultMessage}</Caption1>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\nconst useItemListStyles = makeStyles({\n  root: {\n    display: \"flex\",\n  },\n  content: {\n    flex: 1,\n  },\n  title: {\n    fontWeight: \"bold\",\n  },\n  description: {\n    fontWeight: \"normal\",\n  },\n  action: {\n    flex: 0,\n  },\n\n  card: {\n    width: \"100%\",\n    borderBottom: \"1px solid \" + tokens.colorNeutralStencil1,\n    borderRadius: tokens.borderRadiusNone,\n  },\n});\n\nfunction ItemList<T extends ListItemData>({\n  items,\n  activeId,\n  pathFactory,\n  navigate,\n}: {\n  items: T[];\n  activeId: string;\n  pathFactory: (item: T) => string;\n  navigate: (url: string) => void;\n}) {\n  const style = useItemListStyles();\n  if (items.length === 0) return null;\n  return (\n    <List navigationMode=\"composite\">\n      {items.map((it) => (\n        <ListItem\n          key={it.id}\n          onAction={() => {\n            navigate(pathFactory(it));\n          }}\n        >\n          <Card\n            role=\"gridcell\"\n            orientation=\"horizontal\"\n            appearance=\"subtle\"\n            className={style.card}\n            onClick={() => {\n              navigate(pathFactory(it));\n            }}\n          >\n            <CardHeader\n              header={<Text weight=\"regular\">{it.label ?? <span>&nbsp;</span>}</Text>}\n              description={<Caption1>{it.description ?? <span>&nbsp;</span>}</Caption1>}\n              action={<Icon name=\"chevron_right_filled\" />}\n            />\n          </Card>\n        </ListItem>\n      ))}\n    </List>\n  );\n}\n"],"names":["useStyles","makeStyles","ListView","data","activeId","searchText","search","pathFactory","navigate","styles","t","useI18n","handleChange","value","isSearchEnabled","isFunction","searchMessage","noResultMessage","jsx","Input","Icon","e","ItemList","Caption1","useItemListStyles","tokens","items","style","List","it","ListItem","Card","CardHeader","Text"],"mappings":"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"}

package/dist/lib/localdate/InputLocalDate.js

@@ -2,6 +2,7 @@ import { jsx as f } from "react/jsx-runtime";
 import { makeStyles as S, Input as y } from "@fluentui/react-components";
 import { forwardRef as A, useState as h, useEffect as C, useCallback as k } from "react";
 import { Rifm as z } from "rifm";
+import "../i18n/i18n.service.js";
 import { useI18n as F } from "../i18n/i18n.react.js";
 const N = S({
   root: {
@@ -19,7 +20,7 @@ const N = S({
       return `${e}/`;
   }
   return e;
-}, w = (t) => t.length === 2 || t.length === 5 ? `${t}/` : t, H = A((t, e) => {
+}, w = (t) => t.length === 2 || t.length === 5 ? `${t}/` : t, L = A((t, e) => {
   const { onValueChange: r, value: o = "", children: n, size: l, defaultValue: x, type: O, ...g } = t, D = N(), { localDatePlaceholder: $, localDateFormattedToISO: d, localDateISOToFormattedInput: p } = F(), [u, c] = h(p(o)), [i, m] = h(o);
   C(() => {
     o !== i && (m(o), c(p(o)));
@@ -56,6 +57,6 @@ const N = S({
   );
 });
 export {
-  H as InputLocalDate
+  L as InputLocalDate
 };
 //# sourceMappingURL=InputLocalDate.js.map

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/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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seij/common-ui",
-  "version": "0.1.7",
+  "version": "0.1.8",
   "type": "module",
   "license": "Apache-2.0",
   "repository": {
@@ -8,15 +8,15 @@
     "url": "https://github.com/seij-net/seij-commons-js.git"
   },
   "dependencies": {
-    "@seij/common-types": "0.1.3",
-    "@seij/common-ui-icons": "0.1.1",
     "@fluentui/react-components": "9.72.9",
-    "i18next": "25.7.3",
     "i18next-browser-languagedetector": "8.2.0",
-    "date-fns": "4.1.0",
+    "@seij/common-types": "0.1.3",
+    "@seij/common-ui-icons": "0.1.2",
     "lodash-es": "4.17.22",
-    "rifm": "0.12.1",
-    "i18next-icu": "2.4.1"
+    "i18next": "25.7.3",
+    "date-fns": "4.1.0",
+    "i18next-icu": "2.4.1",
+    "rifm": "0.12.1"
   },
   "devDependencies": {
     "@types/lodash-es": "4.17.12"