@hgdc/ui 0.64.0 → 0.66.0

package/dist/app-shell.d.ts

@@ -1,3 +1,4 @@
+import type { ModuleWord } from "./modules.ts";
 import { type ReactNode } from "react";
 import type { ProductView } from "./addresses.ts";
 import type { FamilyProduct } from "./family-svg.ts";
@@ -20,7 +21,7 @@ export type { AppShellAssistant } from "./shell-assistant.tsx";
  * Le kit ne connaît ni le routeur ni l'authentification : le produit passe ses éléments
  * (`OrgSwitcher`, `SidebarNav`, `AccountMenu`) et ses liens.
  */
-export declare function AppShell({ product, organization, productRail: productRailOption, view: viewOption, accountHref, nav, links, account, sidebarFooter, header, onSearch, searchLabel, assistant, children, contentKey, navigating, mainClassName, statusPage, }: {
+export declare function AppShell({ product, organization, productRail: productRailOption, view: viewOption, accountHref, nav, links, account, sidebarFooter, header, onSearch, searchLabel, assistant, children, contentKey, navigating, mainClassName, statusPage, project, }: {
     /** Le produit affiché (`"host"`) : son nom au-dessus de ses onglets, « vous êtes ici » dans la liste des modules. */
     product: FamilyProduct;
     /**
@@ -101,4 +102,13 @@ export declare function AppShell({ product, organization, productRail: productRa
      * de test), ou `false` pour ne rien lire. L'accès « État du service » y mène.
      */
     statusPage?: string | false | undefined;
+    /**
+     * Le projet choisi en haut de page (`useShellProject`) : la liste des modules se limite aux siens, et
+     * « Réglages du projet » paraît en bas de la barre. Absent : tous les projets.
+     */
+    project?: {
+        name: string;
+        modules: ReadonlyArray<ModuleWord>;
+        settingsHref: string;
+    } | undefined;
 }): React.JSX.Element;

package/dist/app-shell.js

@@ -1,4 +1,6 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Settings02Icon from "@hugeicons/core-free-icons/Settings02Icon";
+import { SIDEBAR_ITEM } from "./sidebar-nav.js";
 import Menu01Icon from "@hugeicons/core-free-icons/Menu01Icon";
 import { HugeiconsIcon } from "@hugeicons/react";
 import { Suspense, useCallback, useContext, useEffect, useId, useRef, useState } from "react";
@@ -38,11 +40,11 @@ export { SidebarNavGroup } from "./sidebar-nav-group.js";
  * Le kit ne connaît ni le routeur ni l'authentification : le produit passe ses éléments
  * (`OrgSwitcher`, `SidebarNav`, `AccountMenu`) et ses liens.
  */
-export function AppShell({ product, organization, productRail: productRailOption, view: viewOption, accountHref, nav, links, account, sidebarFooter, header, onSearch, searchLabel, assistant, children, contentKey, navigating = false, mainClassName, statusPage, }) {
+export function AppShell({ product, organization, productRail: productRailOption, view: viewOption, accountHref, nav, links, account, sidebarFooter, header, onSearch, searchLabel, assistant, children, contentKey, navigating = false, mainClassName, statusPage, project, }) {
     const [menuOpen, setMenuOpen] = useState(false);
     const preference = useProductBarPreference();
     // Relu chez Account seulement par un produit passé aux deux vues (il donne `view`, ADR 0014).
-    useProductBarSync(productRailOption === undefined && viewOption !== undefined);
+    useProductBarSync(productRailOption !== false);
     const productRail = productRailOption ?? (viewOption === undefined || productBarShown(viewOption, preference));
     const [navLevel, setNavLevel] = useState("tabs");
     useToggleShortcut();
@@ -100,7 +102,7 @@ export function AppShell({ product, organization, productRail: productRailOption
     useAssistantShortcut(assistant);
     const otherView = viewOption === undefined ? null : _jsx(OtherViewLink, { product: product, view: viewOption });
     // Dans la barre de Basalte, seul Réglages reste au-dessus du compte : le reste passe dans son menu.
-    const footer = (_jsxs(_Fragment, { children: [account !== undefined ? sidebarFooter : null, _jsx(ShellCommonLinks, { links: productRail ? { ...(links?.settings ? { settings: links.settings } : {}), status: false } : (links ?? {}), statusPageUrl: statusPageUrl, otherView: productRail ? null : otherView }), account ?? sidebarFooter] }));
+    const footer = (_jsxs(_Fragment, { children: [account !== undefined ? sidebarFooter : null, productRail && project ? (_jsx("div", { className: "px-3 pb-1", children: _jsxs("a", { href: project.settingsHref, className: SIDEBAR_ITEM, children: [_jsx(HugeiconsIcon, { icon: Settings02Icon, strokeWidth: 1.8, "aria-hidden": true, className: "size-5 shrink-0 lg:size-[1.125rem]" }), _jsx("span", { className: "truncate lg:rail:sr-only", children: "R\u00E9glages du projet" })] }) })) : null, _jsx(ShellCommonLinks, { links: productRail ? { ...(links?.settings ? { settings: links.settings } : {}), status: false } : (links ?? {}), statusPageUrl: statusPageUrl, otherView: productRail ? null : otherView }), account ?? sidebarFooter] }));
     const menuLinks = productRail
         ? {
             documentation: links?.documentation,
@@ -108,6 +110,6 @@ export function AppShell({ product, organization, productRail: productRailOption
             otherView: viewOption === undefined ? undefined : otherViewMenuLink(product, viewOption),
         }
         : {};
-    const navigation = productRail ? (_jsx(ShellNavigation, { product: product, nav: nav, accountHref: accountHref, level: navLevel, onLevelChange: setNavLevel })) : (nav);
+    const navigation = productRail ? (_jsx(ShellNavigation, { product: product, nav: nav, accountHref: accountHref, level: navLevel, onLevelChange: setNavLevel, projectModules: project?.modules })) : (nav);
     return (_jsx(ShellContext.Provider, { value: { closeMobileNav: () => setMenuOpen(false), product }, children: _jsx(ModuleBarShownContext, { value: productRail, children: _jsx(ShellMenuLinksContext, { value: menuLinks, children: _jsx(ShellLeaveContext, { value: leave, children: _jsx(StatusPageContext, { value: statusPageUrl, children: _jsxs("div", { "data-slot": "app-shell", "data-module-bar": productRail ? "" : undefined, "data-loading": loading ? "" : undefined, "data-hydrated": hydrated ? "" : undefined, "data-assistant": assistantOpen ? "" : undefined, className: "min-h-dvh lg:grid lg:h-dvh lg:grid-cols-[auto_minmax(0,1fr)_auto] lg:bg-shell", children: [_jsx("a", { href: "#contenu", className: "sr-only z-50 rounded-xl bg-background px-4 py-2 text-sm font-medium focus:not-sr-only focus:fixed focus:top-3 focus:left-3 focus:ring-2 focus:ring-ring", children: "Aller au contenu" }), _jsxs("aside", { ref: sidebarRef, "data-slot": "app-shell-sidebar", "aria-label": "Barre lat\u00E9rale", inert: pageBlocked || undefined, className: "group/sidebar hidden overflow-hidden text-shell-foreground transition-[width] duration-(--duration-base) ease-ios motion-reduce:transition-none lg:flex lg:w-64 lg:flex-col lg:rail:w-16", children: [productRail ? (_jsx(ShellOrganizationHead, { organization: organization })) : (_jsxs(_Fragment, { children: [_jsx(SidebarHead, { product: product }), organization ? _jsx("div", { className: "shrink-0 px-3 pb-1", children: organization }) : null] })), navigation, _jsx("div", { "data-slot": "app-shell-footer", className: "grid gap-0.5 px-3 pt-1 pb-3 empty:hidden", children: footer })] }), _jsx("div", { inert: pageBlocked || undefined, className: "flex min-h-dvh flex-col lg:min-h-0 lg:p-2 lg:pl-0", children: _jsxs("div", { ref: contentRef, className: "relative flex flex-1 flex-col lg:min-h-0 lg:overflow-y-auto lg:rounded-xl lg:bg-background lg:[scrollbar-gutter:stable]", children: [_jsxs("header", { "data-slot": "app-shell-header", className: "sticky top-[env(safe-area-inset-top,0px)] z-30 flex min-h-14 shrink-0 flex-wrap items-center gap-x-1 gap-y-1 border-b border-foreground/5 bg-background px-2 py-1.5 sm:px-4 lg:top-0", children: [_jsx("button", { type: "button", onClick: () => setMenuOpen(true), "aria-label": "Ouvrir le menu", className: "touch-target grid size-10 shrink-0 place-items-center rounded-xl text-muted-foreground outline-none hover:bg-muted hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring/50 lg:hidden", children: _jsx(HugeiconsIcon, { icon: Menu01Icon, "aria-hidden": true, className: "size-5" }) }), _jsxs("div", { "data-slot": "app-shell-brand", className: "flex shrink-0 items-center gap-2 pr-1 lg:hidden", children: [_jsx(ProductBadge, { product: product, className: "size-6" }), _jsx("span", { className: "font-heading text-[0.9375rem] font-semibold", children: familyProductName(product) })] }), _jsx("div", { className: cn("flex min-w-0 items-center gap-2", header ? "flex-[1_1_7rem]" : "flex-1"), children: header }), onSearch ? (_jsx(CommandMenuButton, { onClick: onSearch, compact: "mobile", className: "shrink-0 lg:w-96 lg:max-w-none", ...(searchLabel !== undefined ? { label: searchLabel } : {}) })) : null, assistant ? (_jsx(AssistantButton, { assistant: assistant, panelId: assistantPanelId, buttonRef: assistantButtonRef })) : null] }), _jsx("div", { "data-slot": "app-shell-loading", "aria-hidden": !loading, className: CONTENT_LOADING_LAYER, children: loading ? (_jsx("span", { role: "status", className: "sr-only", children: "Chargement\u2026" })) : null }), _jsxs("main", { id: "contenu", tabIndex: -1, "aria-busy": loading ? true : undefined, inert: loading || undefined, className: cn("mx-auto w-full max-w-6xl flex-1 px-4 pt-6 pb-16 outline-none sm:px-6 lg:px-10 lg:pt-8", mainClassName), children: [_jsx(ServiceStatus, { pageUrl: statusPageUrl, className: "mb-6" }), _jsx(ContentLoadingContext, { value: registerPagePending, children: contentKey === undefined ? (children) : (_jsx(Suspense, { fallback: _jsx(PagePending, {}), children: children }, contentKey)) })] })] }) }), assistant && assistantMounted ? (_jsx(AssistantPanel, { assistant: assistant, panelId: assistantPanelId, wide: wide, openAtShellMount: assistantOpenAtMount, buttonRef: assistantButtonRef })) : null, hasRoot ? null : _jsx(FamilyLoaderHost, {}), _jsx(Drawer, { side: "bottom", open: menuOpen, onOpenChange: setMenuOpen, children: _jsxs(DrawerContent, { className: "lg:hidden", children: [_jsx(DrawerTitle, { className: "sr-only", children: "Menu" }), organization ? _jsx("div", { className: "px-3 pt-1", children: organization }) : null, navigation, _jsx("div", { className: "grid gap-0.5 border-t border-foreground/5 px-3 pt-2 pb-[max(env(safe-area-inset-bottom),0.75rem)] empty:hidden", children: footer })] }) })] }) }) }) }) }) }));
 }

package/dist/module-bar-store.d.ts

@@ -1,9 +1,11 @@
 import { type ModuleWord } from "./modules.ts";
 /**
- * L'ordre et le choix des modules de la barre, propres à chaque personne. Sous `app.hgdc.ch`, toutes
- * les consoles partagent la même origine, donc le même réglage.
+ * L'ordre et le choix des modules de la barre, propres à chaque personne : Account les garde
+ * (`product-bar.ts`), et chaque origine en retient la dernière valeur, pour s'afficher sans attendre.
  */
 export declare const MODULE_BAR_KEY = "hgdc-shell:modules";
 export declare function saveModuleBar(order: ReadonlyArray<ModuleWord>): void;
+/** L'ordre retenu dans cette origine, lu hors de React. */
+export declare function storedModuleBar(): ReadonlyArray<ModuleWord>;
 /** L'ordre retenu ; celui par défaut au rendu serveur. */
 export declare function useModuleBar(): ReadonlyArray<ModuleWord>;

package/dist/module-bar-store.js

@@ -1,8 +1,8 @@
 import { useSyncExternalStore } from "react";
 import { DEFAULT_MODULE_BAR, parseModuleBar } from "./modules.js";
 /**
- * L'ordre et le choix des modules de la barre, propres à chaque personne. Sous `app.hgdc.ch`, toutes
- * les consoles partagent la même origine, donc le même réglage.
+ * L'ordre et le choix des modules de la barre, propres à chaque personne : Account les garde
+ * (`product-bar.ts`), et chaque origine en retient la dernière valeur, pour s'afficher sans attendre.
  */
 export const MODULE_BAR_KEY = "hgdc-shell:modules";
 const EVENT = "hgdc-module-bar";
@@ -50,6 +50,10 @@ export function saveModuleBar(order) {
     }
     window.dispatchEvent(new Event(EVENT));
 }
+/** L'ordre retenu dans cette origine, lu hors de React. */
+export function storedModuleBar() {
+    return read();
+}
 /** L'ordre retenu ; celui par défaut au rendu serveur. */
 export function useModuleBar() {
     return useSyncExternalStore(subscribe, read, () => DEFAULT_MODULE_BAR);

package/dist/module-bar.d.ts

@@ -1,5 +1,6 @@
 import { type ReactNode } from "react";
 import type { FamilyProduct } from "./family-svg.ts";
+import { type ModuleWord } from "./modules.ts";
 /** Ce que montre le milieu de la barre : les onglets du module ouvert, la liste des modules, ou son réglage. */
 export type ShellNavLevel = "tabs" | "modules" | "edit";
 /**
@@ -7,10 +8,12 @@ export type ShellNavLevel = "tabs" | "modules" | "edit";
  * ses onglets (`nav`) sous « Retour aux modules » ; un clic y affiche la liste sans rien recharger ;
  * un clic sur un autre module ouvre sa console, préchargée au survol sous la même origine.
  */
-export declare function ShellNavigation({ product, nav, accountHref, level, onLevelChange, }: {
+export declare function ShellNavigation({ product, nav, accountHref, level, onLevelChange, projectModules, }: {
     product: FamilyProduct;
     nav: ReactNode;
     accountHref?: string | undefined;
     level: ShellNavLevel;
     onLevelChange: (level: ShellNavLevel) => void;
+    /** Modules activés sur le projet choisi : la liste s'y limite. Absent : tous les projets. */
+    projectModules?: ReadonlyArray<ModuleWord> | undefined;
 }): React.JSX.Element;

package/dist/module-bar.js

@@ -11,6 +11,7 @@ import { useState, useSyncExternalStore } from "react";
 import { Button } from "./button.js";
 import { cn } from "./cn.js";
 import { saveModuleBar, useModuleBar } from "./module-bar-store.js";
+import { pushModuleBar } from "./product-bar.js";
 import { hiddenModules, moduleByWord, moveModule, shownModules } from "./modules.js";
 import { ProductBadge } from "./product-badge.js";
 import { PRODUCT_PRERENDER_ATTRIBUTE } from "./product-switch.js";
@@ -80,12 +81,13 @@ function ModuleBarEditor({ order, onSave, onCancel, }) {
  * ses onglets (`nav`) sous « Retour aux modules » ; un clic y affiche la liste sans rien recharger ;
  * un clic sur un autre module ouvre sa console, préchargée au survol sous la même origine.
  */
-export function ShellNavigation({ product, nav, accountHref, level, onLevelChange, }) {
+export function ShellNavigation({ product, nav, accountHref, level, onLevelChange, projectModules, }) {
     const pageOrigin = usePageOrigin();
     const order = useModuleBar();
     const { products, account } = shellProductEntries({ current: product, accountHref, pageOrigin });
-    return (_jsxs("div", { "data-slot": "shell-navigation", className: "flex min-h-0 flex-1 flex-col", children: [_jsxs("div", { "data-slot": "shell-manager", className: "shrink-0 px-3 pt-1", children: [_jsx("ul", { children: _jsx(ShellEntryLink, { entry: account, icon: UserGroupIcon }) }), _jsx("div", { "aria-hidden": true, className: "mx-2 mt-2 h-px bg-foreground/8" })] }), level === "modules" ? (_jsx(ModuleList, { entries: products, order: shownModules(order, product), onOpenCurrent: () => onLevelChange("tabs"), onCustomize: () => onLevelChange("edit") })) : level === "edit" ? (_jsx(ModuleBarEditor, { order: order, onSave: (next) => {
+    return (_jsxs("div", { "data-slot": "shell-navigation", className: "flex min-h-0 flex-1 flex-col", children: [_jsxs("div", { "data-slot": "shell-manager", className: "shrink-0 px-3 pt-1", children: [_jsx("ul", { children: _jsx(ShellEntryLink, { entry: account, icon: UserGroupIcon }) }), _jsx("div", { "aria-hidden": true, className: "mx-2 mt-2 h-px bg-foreground/8" })] }), level === "modules" ? (_jsx(ModuleList, { entries: products, order: shownModules(order, product).filter((word) => !projectModules || word === product || projectModules.includes(word)), onOpenCurrent: () => onLevelChange("tabs"), onCustomize: () => onLevelChange("edit") })) : level === "edit" ? (_jsx(ModuleBarEditor, { order: order, onSave: (next) => {
                     saveModuleBar(next);
+                    void pushModuleBar(next);
                     onLevelChange("modules");
                 }, onCancel: () => onLevelChange("modules") })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: "shrink-0 px-3 pt-2", children: [_jsx("ul", { children: _jsx(SidebarNavBack, { label: "Retour aux modules", keepMenuOpen: true, render: _jsx("button", { type: "button", className: "w-full", onClick: () => onLevelChange("modules") }) }) }), _jsxs("div", { "data-slot": "shell-module-title", className: "flex min-h-9 items-center gap-2.5 px-3 text-sm font-semibold lg:text-shell-foreground lg:rail:hidden", children: [_jsx(ProductBadge, { product: product, className: "size-[1.125rem] shrink-0" }), _jsx("span", { className: "truncate font-heading", children: familyProductName(product) })] })] }), nav] }))] }));
 }

package/dist/product-bar.d.ts

@@ -1,4 +1,5 @@
 import type { ProductView } from "./addresses.ts";
+import { type ModuleWord } from "./modules.ts";
 /**
  * Réglage « Barre des produits » (ADR 0014 de la famille), choisi dans Account :
  * - `auto` : la barre sous `app.hgdc.ch`, pas sur `<mot>.hgdc.ch` ;
@@ -13,7 +14,7 @@ export type ProductBarPreference = "auto" | "always" | "never";
 export declare const PRODUCT_BAR_PREFERENCES: ReadonlyArray<ProductBarPreference>;
 /** Libellés du réglage, dans l'ordre d'affichage. */
 export declare const PRODUCT_BAR_LABELS: Readonly<Record<ProductBarPreference, string>>;
-/** Lecture du réglage chez Account : `{ productBar }`, rien d'autre. */
+/** Réglages chez Account : `{ productBar, moduleBar }`, rien d'autre. */
 export declare const ACCOUNT_PREFERENCES_URL = "https://account.hgdc.ch/api/preferences";
 /** Valeur reçue (Account, stockage) : un réglage connu, sinon `auto`. */
 export declare function parseProductBar(value: unknown): ProductBarPreference;
@@ -25,5 +26,11 @@ export declare function rememberProductBar(preference: ProductBarPreference): vo
 export declare function useProductBarPreference(): ProductBarPreference;
 /** Relit le réglage chez Account une fois par chargement de page ; une erreur garde la dernière valeur. */
 export declare function syncProductBar(fetchImpl?: typeof fetch): Promise<void>;
+/**
+ * Enregistre la barre des modules chez Account, pour la retrouver sur un autre appareil. Un échec n'est
+ * pas signalé : la barre reste réglée dans cette origine, et repart au prochain chargement.
+ * `keepalive` : un clic sur un autre module recharge la page, l'envoi doit y survivre.
+ */
+export declare function pushModuleBar(order: ReadonlyArray<ModuleWord>, fetchImpl?: typeof fetch): Promise<void>;
 /** À monter une fois (la coque le fait) : relecture du réglage après l'hydratation. */
 export declare function useProductBarSync(enabled?: boolean): void;

package/dist/product-bar.js

@@ -1,4 +1,6 @@
 import { useEffect, useSyncExternalStore } from "react";
+import { saveModuleBar, storedModuleBar } from "./module-bar-store.js";
+import { parseModuleBar } from "./modules.js";
 export const PRODUCT_BAR_PREFERENCES = ["auto", "always", "never"];
 /** Libellés du réglage, dans l'ordre d'affichage. */
 export const PRODUCT_BAR_LABELS = {
@@ -6,10 +8,12 @@ export const PRODUCT_BAR_LABELS = {
     always: "Toujours",
     never: "Jamais",
 };
-/** Lecture du réglage chez Account : `{ productBar }`, rien d'autre. */
+/** Réglages chez Account : `{ productBar, moduleBar }`, rien d'autre. */
 export const ACCOUNT_PREFERENCES_URL = "https://account.hgdc.ch/api/preferences";
 const STORAGE_KEY = "hgdc-product-bar";
 const EVENT = "hgdc-product-bar";
+/** Présent tant qu'Account n'a pas confirmé la barre des modules réglée ici : elle ne doit pas être écrasée. */
+const MODULE_BAR_UNSENT_KEY = "hgdc-shell:modules-unsent";
 /** Valeur reçue (Account, stockage) : un réglage connu, sinon `auto`. */
 export function parseProductBar(value) {
     return PRODUCT_BAR_PREFERENCES.includes(value) ? value : "auto";
@@ -62,13 +66,69 @@ export async function syncProductBar(fetchImpl = fetch) {
         if (!response.ok)
             return;
         const body = await response.json();
-        if (typeof body === "object" && body !== null && "productBar" in body)
+        if (typeof body !== "object" || body === null)
+            return;
+        if ("productBar" in body)
             rememberProductBar(parseProductBar(body.productBar));
+        if (moduleBarUnsent()) {
+            await pushModuleBar(storedModuleBar(), fetchImpl);
+            return;
+        }
+        // Absente : la personne n'a encore rien réglé, cette origine garde ce qu'elle a.
+        if ("moduleBar" in body) {
+            const order = parseModuleBar(body.moduleBar);
+            if (order)
+                saveModuleBar(order);
+        }
     }
     catch {
         // Account injoignable ou hors ligne : rien ne change.
     }
 }
+function moduleBarUnsent() {
+    try {
+        return window.localStorage.getItem(MODULE_BAR_UNSENT_KEY) !== null;
+    }
+    catch {
+        return false;
+    }
+}
+function markModuleBarUnsent(unsent) {
+    try {
+        if (unsent)
+            window.localStorage.setItem(MODULE_BAR_UNSENT_KEY, "1");
+        else
+            window.localStorage.removeItem(MODULE_BAR_UNSENT_KEY);
+    }
+    catch {
+        // Stockage bloqué : la prochaine relecture reprendra la valeur d'Account.
+    }
+}
+/**
+ * Enregistre la barre des modules chez Account, pour la retrouver sur un autre appareil. Un échec n'est
+ * pas signalé : la barre reste réglée dans cette origine, et repart au prochain chargement.
+ * `keepalive` : un clic sur un autre module recharge la page, l'envoi doit y survivre.
+ */
+export async function pushModuleBar(order, fetchImpl = fetch) {
+    // Account n'accepte que les consoles de `hgdc.ch` : en local, en test, rien à envoyer.
+    if (!window.location.hostname.endsWith(".hgdc.ch"))
+        return;
+    markModuleBarUnsent(true);
+    try {
+        const response = await fetchImpl(ACCOUNT_PREFERENCES_URL, {
+            method: "PUT",
+            credentials: "include",
+            keepalive: true,
+            headers: { "content-type": "application/json" },
+            body: JSON.stringify({ moduleBar: order }),
+        });
+        if (response.ok)
+            markModuleBarUnsent(false);
+    }
+    catch {
+        // Account injoignable ou hors ligne.
+    }
+}
 let synced = false;
 /** À monter une fois (la coque le fait) : relecture du réglage après l'hydratation. */
 export function useProductBarSync(enabled = true) {

package/dist/shell-project.d.ts

@@ -0,0 +1,30 @@
+import type { ModuleWord } from "./modules.ts";
+export declare function saveShellProject(organizationId: string, projectId: string | null): void;
+/** L'identifiant du projet choisi ; `null` : tous les projets, et toujours au rendu serveur. */
+export declare function useShellProject(organizationId: string | null | undefined): string | null;
+/** Un projet commun, tel que le rend `listCoreProjects` de `@hgdc/auth/core`. */
+export type ShellCoreProject = {
+    id: string;
+    name: string;
+    modules: ReadonlyArray<string>;
+};
+/** Le projet choisi, s'il existe encore et si le module y est activé. Sinon : tous les projets. */
+export declare function activeCoreProject<Project extends ShellCoreProject>(projects: ReadonlyArray<Project> | undefined, activeId: string | null): Project | null;
+/** Ce que `project` d'`AppShell` attend pour le projet choisi. */
+export declare function shellProjectFrom(project: ShellCoreProject | null, settingsHref: string): {
+    name: string;
+    modules: ReadonlyArray<ModuleWord>;
+    settingsHref: string;
+} | undefined;
+/**
+ * Le sélecteur de projet de Basalte, dans `header` d'`AppShell`. Le choix vaut pour toutes les consoles.
+ * `onChange` : ce que le module fait en plus, par exemple ouvrir la page du projet. Rien à montrer
+ * tant que l'organisation n'a aucun projet.
+ */
+export declare function CoreProjectSwitcher({ organizationId, projects, createHref, onChange, }: {
+    organizationId: string;
+    projects: ReadonlyArray<ShellCoreProject> | undefined;
+    /** « Nouveau projet » : la page Projets de Manager. */
+    createHref?: string;
+    onChange?: (projectId: string | null) => void;
+}): React.JSX.Element | null;

package/dist/shell-project.js

@@ -0,0 +1,69 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useSyncExternalStore } from "react";
+import { ProjectSwitcher } from "./project-switcher.js";
+/**
+ * Le projet choisi en haut de page, le même dans toutes les consoles de Basalte : sous `app.hgdc.ch`,
+ * elles partagent l'origine, donc ce réglage. Une valeur par organisation : changer d'organisation
+ * ne garde pas le projet d'une autre. Propre à chaque personne et à chaque navigateur.
+ */
+const keyOf = (organizationId) => `hgdc-shell:project:${organizationId}`;
+const EVENT = "hgdc-shell-project";
+function subscribe(onChange) {
+    window.addEventListener(EVENT, onChange);
+    window.addEventListener("storage", onChange);
+    return () => {
+        window.removeEventListener(EVENT, onChange);
+        window.removeEventListener("storage", onChange);
+    };
+}
+export function saveShellProject(organizationId, projectId) {
+    try {
+        if (projectId === null)
+            window.localStorage.removeItem(keyOf(organizationId));
+        else
+            window.localStorage.setItem(keyOf(organizationId), projectId);
+    }
+    catch {
+        // Stockage bloqué : le choix vaut seulement pour cette page.
+    }
+    window.dispatchEvent(new Event(EVENT));
+}
+/** L'identifiant du projet choisi ; `null` : tous les projets, et toujours au rendu serveur. */
+export function useShellProject(organizationId) {
+    return useSyncExternalStore(subscribe, () => {
+        if (!organizationId)
+            return null;
+        try {
+            return window.localStorage.getItem(keyOf(organizationId));
+        }
+        catch {
+            return null;
+        }
+    }, () => null);
+}
+/** Le projet choisi, s'il existe encore et si le module y est activé. Sinon : tous les projets. */
+export function activeCoreProject(projects, activeId) {
+    return projects?.find((project) => project.id === activeId) ?? null;
+}
+/** Ce que `project` d'`AppShell` attend pour le projet choisi. */
+export function shellProjectFrom(project, settingsHref) {
+    if (!project)
+        return undefined;
+    return { name: project.name, modules: project.modules, settingsHref };
+}
+/**
+ * Le sélecteur de projet de Basalte, dans `header` d'`AppShell`. Le choix vaut pour toutes les consoles.
+ * `onChange` : ce que le module fait en plus, par exemple ouvrir la page du projet. Rien à montrer
+ * tant que l'organisation n'a aucun projet.
+ */
+export function CoreProjectSwitcher({ organizationId, projects, createHref, onChange, }) {
+    const activeId = useShellProject(organizationId);
+    if (projects !== undefined && projects.length === 0)
+        return null;
+    const known = activeCoreProject(projects, activeId);
+    const entries = projects?.map(({ id, name }) => ({ id, name }));
+    return (_jsx(ProjectSwitcher, { projects: entries, activeId: known?.id ?? null, ...(createHref ? { createHref } : {}), onSelect: (id) => {
+            saveShellProject(organizationId, id);
+            onChange?.(id);
+        } }));
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hgdc/ui",
-  "version": "0.64.0",
+  "version": "0.66.0",
   "description": "Interface de la H Collection : jetons de la DA, thèmes, polices et composants.",
   "license": "UNLICENSED",
   "homepage": "https://github.com/hugogebel-boop/hgdc-kit/tree/main/packages/ui#readme",