@flowselections/core 1.0.22 → 1.0.23

package/README.md

@@ -111,3 +111,64 @@ retry-storm veroorzaken.
 De browser-client is env-gedreven en lazy (`VITE_SUPABASE_URL` /
 `VITE_SUPABASE_PUBLISHABLE_KEY`, met `SUPABASE_*` fallback voor SSR). Er staat
 geen projectref of key in de code, ook niet als fallback.
+
+## Rechten in 1.0.23
+
+> **Zichtbaarheid, geen beveiliging.** Alles hieronder verbergt of toont UI. De
+> data wordt afgeschermd door RLS en serverfuncties (`requireModulePermission`).
+
+- **Automatisch via `AuthenticatedLayout` + `requireAuth`** — het gegenereerde
+  `_authenticated.tsx` hoeft niet te veranderen.
+  - Zijbalk: eerst het rechtenfilter, dan extensie-transforms (ordening). Uit met
+    `permissions={false}`. Tijdens het eerste laden een skeleton; na een fout of
+    3 s time-out de volledige lijst (fail-open).
+  - `requireAuth` geeft `{ moduleAccess }` terug uit `beforeLoad` (context wordt
+    niet gemuteerd). Bij `none` toont de layout "Geen toegang". Wacht max. 3 s.
+  - Werkt zonder `QueryClientProvider` (gedeelde store, `useSyncExternalStore`).
+- `useCan(module, feature?, level?)` / `<Can>` — niveaus `none < view < edit`.
+- `NavItem.featureId` (anders `featureKey(href)`); groepen zonder zichtbare
+  kinderen verdwijnen, tenzij de module een eigen link heeft.
+- `SettingsCard.moduleId/featureId`: kaarten erven het recht van hun module.
+- Footer: `ShellExtensionsProvider useFooter` kan Instellingen verbergen;
+  Uitloggen is nooit te verbergen.
+- `useIsSuperadmin()` (claim `user_roles`, terugval tabel); server:
+  `getRoleFlags(claims)`, `isSuperadminServer()`. Nooit voor moduletoegang.
+- `useShell()` / `useShellModules()` — ruwe modulelijst + `shellId`.
+- Admin en superadmin zien altijd alles.
+
+### Gedragswijziging `requireModulePermission`
+
+**Vóór 1.0.23 liet deze functie alles door**: de RPC werd zonder `_user_id`
+aangeroepen, werd niet gevonden, en dat gold als "add-on ontbreekt" →
+toegestaan. Sinds 1.0.23 roept hij de 3-argumentversie aan; `_user_id` komt
+uitsluitend uit het geverifieerde token van het verzoek, moduleniveau is
+`_feature_id ''`. Zonder geldige sessie: 401. Controleer serverfuncties die
+erop leunen: ze kunnen nu echt 403 geven.
+
+### Huisstijl
+
+Tokens staan op één plek: `src/core/styles.css`, ook als
+`@flowselections/core/styles.css`. Logo: `logoSrc`-prop, anders `logo` uit
+`/huisstijl.json`, anders `/logo.png`.
+
+## Systeemroutes (`@flowselections/core/routes`, vanaf 1.0.23)
+
+Shells houden per systeemroute een dun omhulsel; core levert de opties:
+
+```tsx
+// src/routes/login.tsx
+import { createFileRoute } from "@tanstack/react-router";
+import { loginRoute } from "@flowselections/core/routes";
+export const Route = createFileRoute("/login")(loginRoute({ landing: "/voorraad" }));
+```
+
+Ook: `resetPasswordRoute({ landing })` (`/reset-wachtwoord`), `landingRoute({ landing })` (`/`),
+`handoverRoute({ landing })` (`/auth/handover`, `ssr: false`). Bij `loginRoute` wint een veilig `?redirect`
+(same-site pad) van `landing`, ook als je al ingelogd bent. Shells met eigen routebestanden blijven werken.
+
+## Publiceren
+
+`vite build` (preview/hosting) schrijft verplicht naar `dist/` en overschrijft dan het pakket. Daarom:
+`prepublishOnly` draait `build:pkg`, dat `dist/` eerst leegmaakt, opnieuw bouwt en met
+`scripts/check-pkg.mjs` controleert dat `dist/` precies het pakket bevat. `npm publish` publiceert dus nooit
+een preview-build.

package/dist/auth/redirect.d.ts

@@ -1,3 +1,4 @@
+import { type PermissionLevel } from "../permissions/resolve.js";
 /**
  * Accepteert alleen een same-site pad: begint met "/", niet met "//",
  * geen backslash, geen schema en geen stuurtekens. Anders `fallback`.
@@ -12,12 +13,40 @@ export interface RequireAuthArgs {
     context: unknown;
     location: {
         href: string;
+        pathname?: string;
     };
 }
+/** Sinds 1.0.23: wat `requireAuth` aan de routecontext toevoegt. */
+export interface ModuleAccessContext {
+    moduleAccess: PermissionLevel;
+}
+/**
+ * Sinds 1.0.23. Moduletoegang voor een pad. Wacht max. 3 s; fout, time-out,
+ * vrijgesteld pad of geen modulerij → `edit` (fail-open).
+ * Zichtbaarheid, geen beveiliging.
+ */
+export declare function resolveModuleAccess(path: string, opts?: {
+    userId?: string | null;
+    accessToken?: string | null;
+    roles?: string[];
+}): Promise<PermissionLevel>;
+/** Sinds 1.0.23. `true` tenzij het niveau `none` is. Zichtbaarheid, geen beveiliging. */
+export declare function canAccessModule(path: string, opts?: {
+    userId?: string | null;
+    accessToken?: string | null;
+    roles?: string[];
+}): Promise<boolean>;
 /**
- * Guard voor de `_authenticated`-route (gebruik in beforeLoad, met ssr: false).
- * Zolang auth laadt: geen redirect; de root invalideert de router zodra auth
- * geladen is, waarna deze guard opnieuw draait.
+ * Guard voor de `_authenticated`-route (beforeLoad, met ssr: false).
+ *
+ * - Zolang auth laadt: niets (de root invalideert de router daarna).
+ * - Geen sessie: synchrone redirect naar `loginPath` met `?redirect=`.
+ * - Sinds 1.0.23: geeft `{ moduleAccess }` terug (TanStack voegt dat samen in
+ *   de routecontext; de context wordt niet gemuteerd). Bij `none` rendert
+ *   AuthenticatedLayout "Geen toegang". Fail-open na 3 s of bij een fout.
+ *
+ * Zichtbaarheid, geen beveiliging: data wordt afgeschermd door RLS en
+ * serverfuncties.
  */
-export declare function requireAuth({ context, location }: RequireAuthArgs, loginPath?: string): void;
+export declare function requireAuth({ context, location }: RequireAuthArgs, loginPath?: string): void | ModuleAccessContext | Promise<ModuleAccessContext>;
 //# sourceMappingURL=redirect.d.ts.map

package/dist/auth/redirect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"redirect.d.ts","sourceRoot":"","sources":["../../src/core/auth/redirect.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAezE;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAG1D;AAED,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;CAC5B;AAED;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,eAAe,EAAE,SAAS,SAAW,GAAG,IAAI,CAI9F"}
+{"version":3,"file":"redirect.d.ts","sourceRoot":"","sources":["../../src/core/auth/redirect.ts"],"names":[],"mappings":"AAEA,OAAO,EAA6B,KAAK,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAG5F;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAazE;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAG1D;AAED,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC/C;AAED,oEAAoE;AACpE,MAAM,WAAW,mBAAmB;IAClC,YAAY,EAAE,eAAe,CAAC;CAC/B;AAUD;;;;GAIG;AACH,wBAAsB,mBAAmB,CACvC,IAAI,EAAE,MAAM,EACZ,IAAI,GAAE;IAAE,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;CAAO,GACnF,OAAO,CAAC,eAAe,CAAC,CAM1B;AAED,yFAAyF;AACzF,wBAAsB,eAAe,CACnC,IAAI,EAAE,MAAM,EACZ,IAAI,CAAC,EAAE;IAAE,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;CAAE,GAC/E,OAAO,CAAC,OAAO,CAAC,CAElB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,WAAW,CACzB,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,eAAe,EACtC,SAAS,SAAW,GACnB,IAAI,GAAG,mBAAmB,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAuB3D"}

package/dist/auth/redirect.js

@@ -1,4 +1,7 @@
 import { redirect } from "@tanstack/react-router";
+import { navKey } from "../types/module.js";
+import { EXEMPT_KEYS, resolveLevel } from "../permissions/resolve.js";
+import { getPermissionSnapshot, waitForPermissions } from "../permissions/store.js";
 /**
  * Accepteert alleen een same-site pad: begint met "/", niet met "//",
  * geen backslash, geen schema en geen stuurtekens. Anders `fallback`.
@@ -13,8 +16,6 @@ export function safeRedirectPath(value, fallback) {
     // eslint-disable-next-line no-control-regex
     if (/[\u0000-\u001f\u007f]/.test(value))
         return fallback;
-    // Schema vóór het eerste "/", "?" of "#" (bijv. "/javascript:..." is ok, "javascript:" niet;
-    // dat laatste valt al af op de "/"-regel, dit vangt varianten als "/\t//").
     try {
         const url = new URL(value, "http://same.invalid");
         if (url.origin !== "http://same.invalid")
@@ -34,14 +35,64 @@ export function readRedirectParam(fallback) {
         return fallback;
     return safeRedirectPath(new URLSearchParams(window.location.search).get("redirect"), fallback);
 }
+function pathOf(location) {
+    return location.pathname ?? location.href.split("?")[0].split("#")[0];
+}
+function isAdminRoles(roles) {
+    return Array.isArray(roles) && (roles.includes("admin") || roles.includes("superadmin"));
+}
+/**
+ * Sinds 1.0.23. Moduletoegang voor een pad. Wacht max. 3 s; fout, time-out,
+ * vrijgesteld pad of geen modulerij → `edit` (fail-open).
+ * Zichtbaarheid, geen beveiliging.
+ */
+export async function resolveModuleAccess(path, opts = {}) {
+    const key = navKey(path);
+    if (EXEMPT_KEYS.has(key) || isAdminRoles(opts.roles))
+        return "edit";
+    const snap = await waitForPermissions(opts.userId ?? null, opts.accessToken);
+    if (snap.status !== "ready" || isAdminRoles(snap.roles))
+        return "edit";
+    return resolveLevel(snap.rows, key);
+}
+/** Sinds 1.0.23. `true` tenzij het niveau `none` is. Zichtbaarheid, geen beveiliging. */
+export async function canAccessModule(path, opts) {
+    return (await resolveModuleAccess(path, opts)) !== "none";
+}
 /**
- * Guard voor de `_authenticated`-route (gebruik in beforeLoad, met ssr: false).
- * Zolang auth laadt: geen redirect; de root invalideert de router zodra auth
- * geladen is, waarna deze guard opnieuw draait.
+ * Guard voor de `_authenticated`-route (beforeLoad, met ssr: false).
+ *
+ * - Zolang auth laadt: niets (de root invalideert de router daarna).
+ * - Geen sessie: synchrone redirect naar `loginPath` met `?redirect=`.
+ * - Sinds 1.0.23: geeft `{ moduleAccess }` terug (TanStack voegt dat samen in
+ *   de routecontext; de context wordt niet gemuteerd). Bij `none` rendert
+ *   AuthenticatedLayout "Geen toegang". Fail-open na 3 s of bij een fout.
+ *
+ * Zichtbaarheid, geen beveiliging: data wordt afgeschermd door RLS en
+ * serverfuncties.
  */
 export function requireAuth({ context, location }, loginPath = "/login") {
     const auth = context?.auth;
-    if (!auth || auth.loading || auth.isAuthenticated)
+    if (!auth || auth.loading)
         return;
-    throw redirect({ to: loginPath, search: { redirect: location.href } });
+    if (!auth.isAuthenticated) {
+        throw redirect({ to: loginPath, search: { redirect: location.href } });
+    }
+    const path = pathOf(location);
+    const key = navKey(path);
+    const roles = Array.isArray(auth.roles) ? auth.roles : [];
+    if (EXEMPT_KEYS.has(key) || isAdminRoles(roles))
+        return { moduleAccess: "edit" };
+    const userId = auth.user?.id ?? null;
+    const snap = getPermissionSnapshot();
+    if (snap.userId === userId && snap.status !== "loading") {
+        // Synchroon antwoord als de cache al bekend is (geen wachttijd bij navigatie).
+        const level = snap.status === "ready" && !isAdminRoles(snap.roles) ? resolveLevel(snap.rows, key) : "edit";
+        return { moduleAccess: level };
+    }
+    return resolveModuleAccess(path, {
+        userId,
+        accessToken: auth.session?.access_token ?? null,
+        roles,
+    }).then((moduleAccess) => ({ moduleAccess }));
 }

package/dist/auth/useAuth.d.ts

@@ -1,5 +1,5 @@
 import { User, Session } from "@supabase/supabase-js";
-export type AppRole = "admin" | "manager" | "warehouse" | "sales" | "developer";
+export type AppRole = "admin" | "manager" | "warehouse" | "sales" | "developer" | "superadmin" | "administratie" | "ai_admin" | "monteur" | "planner" | "receptie";
 export interface AuthState {
     user: User | null;
     session: Session | null;

package/dist/auth/useAuth.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAuth.d.ts","sourceRoot":"","sources":["../../src/core/auth/useAuth.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAGtD,MAAM,MAAM,OAAO,GAAG,OAAO,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,WAAW,CAAC;AAEhF,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;IAClB,OAAO,EAAE,OAAO,GAAG,IAAI,CAAC;IACxB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,OAAO,EAAE,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,eAAe,EAAE,OAAO,CAAC;IACzB,OAAO,EAAE;QAAE,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;QAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;KAAE,GAAG,IAAI,CAAC;CACvE;AAED,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC;QAAE,KAAK,EAAE,KAAK,GAAG,IAAI,CAAA;KAAE,CAAC,CAAC;IAC9E,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC7B,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC;QAAE,KAAK,EAAE,KAAK,GAAG,IAAI,CAAA;KAAE,CAAC,CAAC;IACnE,YAAY,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACnC;AAED,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,WAAW,CAAC;AAElD,wBAAgB,YAAY,IAAI,WAAW,CAsE1C;AACD,wBAAgB,OAAO,IAAI,WAAW,CAErC"}
+{"version":3,"file":"useAuth.d.ts","sourceRoot":"","sources":["../../src/core/auth/useAuth.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAGtD,MAAM,MAAM,OAAO,GACf,OAAO,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,WAAW,GACzD,YAAY,GAAG,eAAe,GAAG,UAAU,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;AAErF,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;IAClB,OAAO,EAAE,OAAO,GAAG,IAAI,CAAC;IACxB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,OAAO,EAAE,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,eAAe,EAAE,OAAO,CAAC;IACzB,OAAO,EAAE;QAAE,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;QAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;KAAE,GAAG,IAAI,CAAC;CACvE;AAED,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC;QAAE,KAAK,EAAE,KAAK,GAAG,IAAI,CAAA;KAAE,CAAC,CAAC;IAC9E,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC7B,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC;QAAE,KAAK,EAAE,KAAK,GAAG,IAAI,CAAA;KAAE,CAAC,CAAC;IACnE,YAAY,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACnC;AAED,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,WAAW,CAAC;AAElD,wBAAgB,YAAY,IAAI,WAAW,CAsE1C;AACD,wBAAgB,OAAO,IAAI,WAAW,CAErC"}

package/dist/auth/useIsSuperadmin.d.ts

@@ -0,0 +1,19 @@
+/** Pure: superadmin ⇒ admin (contract §4). */
+export declare function roleFlags(roles: string[]): {
+    isSuperadmin: boolean;
+    isAdmin: boolean;
+    roles: string[];
+};
+/**
+ * Sinds 1.0.23. Rollen uit de JWT-claim `user_roles`, terugval op tabel
+ * `user_roles`. Nooit gebruiken voor moduletoegang (daarvoor
+ * `my_module_permissions`). Werkt zonder QueryClientProvider.
+ * Zichtbaarheid, geen beveiliging.
+ */
+export declare function useIsSuperadmin(): {
+    isLoading: boolean;
+    isSuperadmin: boolean;
+    isAdmin: boolean;
+    roles: string[];
+};
+//# sourceMappingURL=useIsSuperadmin.d.ts.map

package/dist/auth/useIsSuperadmin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsSuperadmin.d.ts","sourceRoot":"","sources":["../../src/core/auth/useIsSuperadmin.ts"],"names":[],"mappings":"AAEA,8CAA8C;AAC9C,wBAAgB,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE;;;;EAGxC;AAED;;;;;GAKG;AACH,wBAAgB,eAAe;;;;;EAG9B"}

package/dist/auth/useIsSuperadmin.js

@@ -0,0 +1,16 @@
+import { usePermissionSnapshot } from "../permissions/store.js";
+/** Pure: superadmin ⇒ admin (contract §4). */
+export function roleFlags(roles) {
+    const isSuperadmin = roles.includes("superadmin");
+    return { isSuperadmin, isAdmin: isSuperadmin || roles.includes("admin"), roles };
+}
+/**
+ * Sinds 1.0.23. Rollen uit de JWT-claim `user_roles`, terugval op tabel
+ * `user_roles`. Nooit gebruiken voor moduletoegang (daarvoor
+ * `my_module_permissions`). Werkt zonder QueryClientProvider.
+ * Zichtbaarheid, geen beveiliging.
+ */
+export function useIsSuperadmin() {
+    const snap = usePermissionSnapshot();
+    return { ...roleFlags(snap.roles), isLoading: !snap.rolesLoaded };
+}

package/dist/components/layout/AuthenticatedLayout.d.ts

@@ -1,20 +1,29 @@
 import type { ReactNode } from "react";
 import type { SidebarProps } from "./Sidebar";
-/**
- * Alle Sidebar-props (auth, modules, shellId, ...) plus optionele children.
- * Zo verliest een shell bij migratie naar AuthenticatedLayout geen enkele
- * prop die hij voorheen rechtstreeks aan <Sidebar /> gaf.
- */
 export type AuthenticatedLayoutProps = SidebarProps & {
     /** Optioneel; standaard rendert de layout <Outlet />. */
     children?: ReactNode;
     /** Toon de gedeelde paginakop. Standaard ingeschakeld. */
     header?: boolean;
 };
+type MatchLike = {
+    staticData?: unknown;
+    context?: unknown;
+};
+/** Sinds 1.0.23: diepste match met een niet-lege titel. */
+export declare function pickTitle(matches: MatchLike[]): string;
+/** Sinds 1.0.23: `moduleAccess` uit de diepste routecontext die hem heeft. */
+export declare function pickModuleAccess(matches: MatchLike[]): string | undefined;
+export declare function NoAccess(): import("react/jsx-runtime").JSX.Element;
 /**
- * Zijbalk + content-offset + mobiele topbalk. Desktop: ml-64 (gelijk aan de
- * oude shell-layout). Mobiel: geen marge, pt-14 onder de topbalk; de sticky
- * Header schuift via --core-topbar-h onder de topbalk.
+ * Zijbalk + content-offset + mobiele topbalk + paginakop.
+ *
+ * Sinds 1.0.23: filtert de zijbalk standaard op rechten (eerst rechten, dan
+ * extensie-transforms; uit met `permissions={false}`), toont "Geen toegang"
+ * als `requireAuth` `moduleAccess: "none"` teruggaf, en levert `useShell()`.
+ * Zichtbaarheid, geen beveiliging: data wordt afgeschermd door RLS en
+ * serverfuncties.
  */
-export declare function AuthenticatedLayout({ children, header, ...sidebarProps }: AuthenticatedLayoutProps): import("react/jsx-runtime").JSX.Element;
+export declare function AuthenticatedLayout({ children, header, permissions, ...sidebarProps }: AuthenticatedLayoutProps): import("react/jsx-runtime").JSX.Element;
+export {};
 //# sourceMappingURL=AuthenticatedLayout.d.ts.map

package/dist/components/layout/AuthenticatedLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AuthenticatedLayout.d.ts","sourceRoot":"","sources":["../../../src/core/components/layout/AuthenticatedLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAG9C;;;;GAIG;AACH,MAAM,MAAM,wBAAwB,GAAG,YAAY,GAAG;IACpD,yDAAyD;IACzD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,0DAA0D;IAC1D,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,mBAAmB,CAAC,EAAE,QAAQ,EAAE,MAAa,EAAE,GAAG,YAAY,EAAE,EAAE,wBAAwB,2CAkBzG"}
+{"version":3,"file":"AuthenticatedLayout.d.ts","sourceRoot":"","sources":["../../../src/core/components/layout/AuthenticatedLayout.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAI9C,MAAM,MAAM,wBAAwB,GAAG,YAAY,GAAG;IACpD,yDAAyD;IACzD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,0DAA0D;IAC1D,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,KAAK,SAAS,GAAG;IAAE,UAAU,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAE7D,2DAA2D;AAC3D,wBAAgB,SAAS,CAAC,OAAO,EAAE,SAAS,EAAE,GAAG,MAAM,CAMtD;AAED,8EAA8E;AAC9E,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,SAAS,EAAE,GAAG,MAAM,GAAG,SAAS,CAMzE;AAED,wBAAgB,QAAQ,4CAWvB;AAED;;;;;;;;GAQG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,QAAQ,EACR,MAAa,EACb,WAAkB,EAClB,GAAG,YAAY,EAChB,EAAE,wBAAwB,2CA6B1B"}

package/dist/components/layout/AuthenticatedLayout.js

@@ -1,15 +1,49 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
 import { Outlet, useMatches } from "@tanstack/react-router";
-import { Sidebar } from "./Sidebar";
+import { Sidebar, useSidebarModules } from "./Sidebar";
 import { Header } from "./Header";
+import { ShellContext } from "../../shell/ShellContext.js";
+/** Sinds 1.0.23: diepste match met een niet-lege titel. */
+export function pickTitle(matches) {
+    for (let i = matches.length - 1; i >= 0; i--) {
+        const t = matches[i].staticData?.title;
+        if (typeof t === "string" && t.trim() !== "")
+            return t;
+    }
+    return "";
+}
+/** Sinds 1.0.23: `moduleAccess` uit de diepste routecontext die hem heeft. */
+export function pickModuleAccess(matches) {
+    for (let i = matches.length - 1; i >= 0; i--) {
+        const v = matches[i].context?.moduleAccess;
+        if (typeof v === "string")
+            return v;
+    }
+    return undefined;
+}
+export function NoAccess() {
+    return (_jsx("div", { className: "flex min-h-[60vh] items-center justify-center p-8", children: _jsxs("div", { className: "max-w-md text-center", children: [_jsx("h1", { className: "text-lg font-semibold text-foreground", children: "Geen toegang" }), _jsx("p", { className: "mt-2 text-sm text-muted-foreground", children: "Je hebt geen rechten voor deze module. Vraag een beheerder om toegang." })] }) }));
+}
 /**
- * Zijbalk + content-offset + mobiele topbalk. Desktop: ml-64 (gelijk aan de
- * oude shell-layout). Mobiel: geen marge, pt-14 onder de topbalk; de sticky
- * Header schuift via --core-topbar-h onder de topbalk.
+ * Zijbalk + content-offset + mobiele topbalk + paginakop.
+ *
+ * Sinds 1.0.23: filtert de zijbalk standaard op rechten (eerst rechten, dan
+ * extensie-transforms; uit met `permissions={false}`), toont "Geen toegang"
+ * als `requireAuth` `moduleAccess: "none"` teruggaf, en levert `useShell()`.
+ * Zichtbaarheid, geen beveiliging: data wordt afgeschermd door RLS en
+ * serverfuncties.
  */
-export function AuthenticatedLayout({ children, header = true, ...sidebarProps }) {
+export function AuthenticatedLayout({ children, header = true, permissions = true, ...sidebarProps }) {
     const matches = useMatches();
-    const titleMatch = [...matches].reverse().find((match) => typeof match.staticData?.title === "string");
-    const title = titleMatch?.staticData?.title ?? "";
-    return (_jsxs("div", { className: "min-h-screen bg-background [--core-topbar-h:3.5rem] md:[--core-topbar-h:0px]", children: [_jsx(Sidebar, { ...sidebarProps }), _jsxs("div", { className: "flex min-h-dvh flex-col pt-14 md:ml-64 md:pt-0", children: [header && _jsx(Header, { title: title }), _jsx("main", { className: "flex-1", children: children ?? _jsx(Outlet, {}) })] })] }));
+    const title = pickTitle(matches);
+    const access = pickModuleAccess(matches);
+    const { visibleModules, loading } = useSidebarModules(sidebarProps.modules, permissions);
+    const shell = useMemo(() => ({
+        shellId: sidebarProps.shellId,
+        modules: sidebarProps.modules,
+        visibleModules,
+        permissionsLoading: loading,
+    }), [sidebarProps.shellId, sidebarProps.modules, visibleModules, loading]);
+    return (_jsx(ShellContext.Provider, { value: shell, children: _jsxs("div", { className: "min-h-screen bg-background [--core-topbar-h:3.5rem] md:[--core-topbar-h:0px]", children: [_jsx(Sidebar, { ...sidebarProps, permissions: permissions, visibleModules: visibleModules, loading: loading }), _jsxs("div", { className: "flex min-h-dvh flex-col pt-14 md:ml-64 md:pt-0", children: [header && _jsx(Header, { title: title }), _jsx("main", { className: "flex-1", children: permissions && access === "none" ? _jsx(NoAccess, {}) : (children ?? _jsx(Outlet, {})) })] })] }) }));
 }

package/dist/components/layout/InstellingenPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InstellingenPage.d.ts","sourceRoot":"","sources":["../../../src/core/components/layout/InstellingenPage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAgB,MAAM,oBAAoB,CAAC;AAqInE,wBAAgB,gBAAgB,CAAC,EAAE,OAAO,EAAE,EAAE;IAAE,OAAO,EAAE,UAAU,EAAE,CAAA;CAAE,2CAWtE"}
+{"version":3,"file":"InstellingenPage.d.ts","sourceRoot":"","sources":["../../../src/core/components/layout/InstellingenPage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAgB,MAAM,oBAAoB,CAAC;AAwInE,wBAAgB,gBAAgB,CAAC,EAAE,OAAO,EAAE,EAAE;IAAE,OAAO,EAAE,UAAU,EAAE,CAAA;CAAE,2CAsBtE"}

package/dist/components/layout/InstellingenPage.js

@@ -1,4 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { moduleKey } from "../../types/module.js";
+import { resolveLevel } from "../../permissions/resolve.js";
+import { usePermissionSnapshot } from "../../permissions/store.js";
 import { useState } from "react";
 import { Button } from "../ui/button";
 import { Input } from "../ui/input";
@@ -72,7 +75,12 @@ const coreCards = [
 ];
 // ─── Main export ──────────────────────────────────────────────────────────────
 export function InstellingenPage({ modules }) {
-    const moduleCards = modules.flatMap((m) => m.settingsCards);
+    // Sinds 1.0.23: modulekaarten erven het recht van hun module (of featureId).
+    // Core-kaarten altijd. Laden/fout/admin → tonen. Zichtbaarheid, geen beveiliging.
+    const snap = usePermissionSnapshot();
+    const filterOn = snap.status === "ready" && !snap.roles.includes("admin") && !snap.roles.includes("superadmin");
+    const moduleCards = modules.flatMap((m) => m.settingsCards.filter((card) => !filterOn ||
+        resolveLevel(snap.rows, card.moduleId ?? moduleKey(m), card.featureId ?? null) !== "none"));
     const allCards = [...coreCards, ...moduleCards].sort((a, b) => a.order - b.order);
     return (_jsx("div", { className: "p-6", children: _jsx("div", { className: "grid gap-6 lg:grid-cols-2", children: allCards.map((card, i) => _jsx(card.component, {}, i)) }) }));
 }

package/dist/components/layout/ResetWachtwoordPage.d.ts

@@ -1,6 +1,8 @@
 interface ResetWachtwoordPageProps {
     redirectTo: string;
+    /** Pad van de inlogpagina. Standaard "/login". */
+    loginPath?: string;
 }
-export declare function ResetWachtwoordPage({ redirectTo }: ResetWachtwoordPageProps): import("react/jsx-runtime").JSX.Element;
+export declare function ResetWachtwoordPage({ redirectTo, loginPath }: ResetWachtwoordPageProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=ResetWachtwoordPage.d.ts.map

package/dist/components/layout/ResetWachtwoordPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ResetWachtwoordPage.d.ts","sourceRoot":"","sources":["../../../src/core/components/layout/ResetWachtwoordPage.tsx"],"names":[],"mappings":"AAQA,UAAU,wBAAwB;IAChC,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,mBAAmB,CAAC,EAAE,UAAU,EAAE,EAAE,wBAAwB,2CAuF3E"}
+{"version":3,"file":"ResetWachtwoordPage.d.ts","sourceRoot":"","sources":["../../../src/core/components/layout/ResetWachtwoordPage.tsx"],"names":[],"mappings":"AASA,UAAU,wBAAwB;IAChC,UAAU,EAAE,MAAM,CAAC;IACnB,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,mBAAmB,CAAC,EAAE,UAAU,EAAE,SAAoB,EAAE,EAAE,wBAAwB,2CAwFjG"}

package/dist/components/layout/ResetWachtwoordPage.js

@@ -1,12 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
+import { useRouter } from "@tanstack/react-router";
 import { Button } from "../ui/button";
 import { Input } from "../ui/input";
 import { Label } from "../ui/label";
 import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "../ui/card";
 import { toast } from "sonner";
 import { supabase } from "../../supabase/client";
-export function ResetWachtwoordPage({ redirectTo }) {
+export function ResetWachtwoordPage({ redirectTo, loginPath = "/login" }) {
+    const router = useRouter();
     const [password, setPassword] = useState("");
     const [confirmPassword, setConfirmPassword] = useState("");
     const [isLoading, setIsLoading] = useState(false);
@@ -41,11 +43,11 @@ export function ResetWachtwoordPage({ redirectTo }) {
         }
         else {
             toast.success("Wachtwoord succesvol gewijzigd!");
-            window.location.href = redirectTo;
+            await router.navigate({ href: redirectTo });
         }
     };
     if (!isReady) {
-        return (_jsx("div", { className: "min-h-screen flex items-center justify-center bg-background p-4", children: _jsxs(Card, { className: "w-full max-w-md", children: [_jsxs(CardHeader, { className: "text-center", children: [_jsx(CardTitle, { className: "text-2xl", children: "Ongeldige link" }), _jsx(CardDescription, { children: "Deze reset-link is ongeldig of verlopen. Vraag een nieuwe aan via de inlogpagina." })] }), _jsx(CardFooter, { className: "justify-center", children: _jsx(Button, { onClick: () => window.location.href = "/login", children: "Naar inlogpagina" }) })] }) }));
+        return (_jsx("div", { className: "min-h-screen flex items-center justify-center bg-background p-4", children: _jsxs(Card, { className: "w-full max-w-md", children: [_jsxs(CardHeader, { className: "text-center", children: [_jsx(CardTitle, { className: "text-2xl", children: "Ongeldige link" }), _jsx(CardDescription, { children: "Deze reset-link is ongeldig of verlopen. Vraag een nieuwe aan via de inlogpagina." })] }), _jsx(CardFooter, { className: "justify-center", children: _jsx(Button, { onClick: () => router.navigate({ href: loginPath }), children: "Naar inlogpagina" }) })] }) }));
     }
     return (_jsx("div", { className: "min-h-screen flex items-center justify-center bg-background p-4", children: _jsxs(Card, { className: "w-full max-w-md", children: [_jsxs(CardHeader, { className: "text-center", children: [_jsx(CardTitle, { className: "text-2xl", children: "Nieuw wachtwoord instellen" }), _jsx(CardDescription, { children: "Kies een nieuw wachtwoord voor je account" })] }), _jsxs("form", { onSubmit: handleSubmit, children: [_jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { htmlFor: "password", children: "Nieuw wachtwoord" }), _jsx(Input, { id: "password", type: "password", value: password, onChange: (e) => setPassword(e.target.value), required: true, minLength: 6, maxLength: 128 })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { htmlFor: "confirmPassword", children: "Bevestig wachtwoord" }), _jsx(Input, { id: "confirmPassword", type: "password", value: confirmPassword, onChange: (e) => setConfirmPassword(e.target.value), required: true, minLength: 6, maxLength: 128 })] })] }), _jsx(CardFooter, { children: _jsx(Button, { type: "submit", className: "w-full", disabled: isLoading, children: isLoading ? "Opslaan..." : "Wachtwoord opslaan" }) })] })] }) }));
 }

package/dist/components/layout/Sidebar.d.ts

@@ -4,16 +4,40 @@ export interface SidebarProps {
     auth: AuthContext;
     modules: FlowModule[];
     /**
-     * Identificeert de shell (bijv. "floriday-voorraad"). De core gebruikt hem
-     * niet voor logica; hij komt als data-attribuut op de zijbalk, zodat
-     * extensies en shells per-shell zijbalkvolgorde of styling kunnen koppelen.
+     * Identificeert de shell (bijv. "floriday-voorraad"). Komt als data-attribuut
+     * op de zijbalk, zodat extensies en shells per-shell volgorde of styling
+     * kunnen koppelen.
      */
     shellId?: string;
+    /**
+     * Sinds 1.0.23. Rechtenfilter vóór de extensie-transforms. Standaard `false`
+     * bij losse `<Sidebar>` (gedrag 1.0.22); AuthenticatedLayout zet hem aan.
+     * Zichtbaarheid, geen beveiliging.
+     */
+    permissions?: boolean;
+    /** Sinds 1.0.23. Logopad; anders `logo` uit /huisstijl.json, anders /logo.png. */
+    logoSrc?: string;
+    /** Sinds 1.0.23. Instellingen tonen (standaard true). Uitloggen is nooit te verbergen. */
+    showSettings?: boolean;
+    /**
+     * Sinds 1.0.23. Al berekende lijst (AuthenticatedLayout geeft die door);
+     * de Sidebar slaat dan zijn eigen pipeline over.
+     */
+    visibleModules?: FlowModule[];
+    /** Sinds 1.0.23. Toon een skeleton i.p.v. de lijst (eerste laden rechten). */
+    loading?: boolean;
 }
 /**
- * Desktop (md+): vaste zijbalk links, w-64 — ongewijzigd t.o.v. eerdere versies.
+ * Sinds 1.0.23. Pipeline: eerst rechten, dan extensie-transforms (ordening).
+ * Zichtbaarheid, geen beveiliging.
+ */
+export declare function useSidebarModules(modules: FlowModule[], permissions: boolean): {
+    visibleModules: FlowModule[];
+    loading: boolean;
+};
+/**
+ * Desktop (md+): vaste zijbalk links, w-64.
  * Mobiel (<md): vaste topbalk (h-14) met menuknop die de zijbalk als Sheet opent.
- * Shells die AuthenticatedLayout gebruiken krijgen de juiste content-offset.
  */
-export declare function Sidebar({ auth, modules, shellId }: SidebarProps): import("react/jsx-runtime").JSX.Element;
+export declare function Sidebar({ auth, modules, shellId, permissions, logoSrc, showSettings, visibleModules, loading, }: SidebarProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Sidebar.d.ts.map

package/dist/components/layout/Sidebar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Sidebar.d.ts","sourceRoot":"","sources":["../../../src/core/components/layout/Sidebar.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,KAAK,EAAE,UAAU,EAAW,MAAM,uBAAuB,CAAC;AAMjE,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,WAAW,CAAC;IAClB,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AA6ID;;;;GAIG;AACH,wBAAgB,OAAO,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,YAAY,2CA8C/D"}
+{"version":3,"file":"Sidebar.d.ts","sourceRoot":"","sources":["../../../src/core/components/layout/Sidebar.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,KAAK,EAAE,UAAU,EAAW,MAAM,uBAAuB,CAAC;AAOjE,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,WAAW,CAAC;IAClB,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kFAAkF;IAClF,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,0FAA0F;IAC1F,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,cAAc,CAAC,EAAE,UAAU,EAAE,CAAC;IAC9B,8EAA8E;IAC9E,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,UAAU,EAAE,EAAE,WAAW,EAAE,OAAO;;;EAI5E;AAmKD;;;GAGG;AACH,wBAAgB,OAAO,CAAC,EACtB,IAAI,EACJ,OAAO,EACP,OAAO,EACP,WAAmB,EACnB,OAAO,EACP,YAAmB,EACnB,cAAc,EACd,OAAO,GACR,EAAE,YAAY,2CA2Dd"}

package/dist/components/layout/Sidebar.js

@@ -3,8 +3,20 @@ import { useEffect, useState } from "react";
 import { Link, useLocation } from "@tanstack/react-router";
 import { Settings, LogOut, ChevronDown, Menu } from "lucide-react";
 import { Sheet, SheetContent, SheetTitle } from "../ui/sheet";
+import { Skeleton } from "../ui/skeleton";
 import { cn } from "../../lib/utils";
-import { useModuleListTransform } from "../../extensions/ShellExtensions.js";
+import { useFooterItems, useModuleListTransform } from "../../extensions/ShellExtensions.js";
+import { usePermissionFilteredModules } from "../../permissions/useModulePermission.js";
+import { useLogoSrc } from "../../hooks/useLogoSrc.js";
+/**
+ * Sinds 1.0.23. Pipeline: eerst rechten, dan extensie-transforms (ordening).
+ * Zichtbaarheid, geen beveiliging.
+ */
+export function useSidebarModules(modules, permissions) {
+    const filtered = usePermissionFilteredModules(modules, permissions);
+    const visible = useModuleListTransform(filtered.modules);
+    return { visibleModules: visible, loading: filtered.loading };
+}
 // ─── Single flat nav link ─────────────────────────────────────────────────────
 function SidebarLink({ item, pathname, indent = false, onNavigate, }) {
     const isActive = pathname === item.href;
@@ -21,29 +33,39 @@ function SidebarGroup({ item, pathname, onNavigate, }) {
                     : "text-sidebar-muted hover:bg-sidebar-accent hover:text-sidebar-accent-foreground"), children: [_jsx(item.icon, { className: "h-5 w-5" }), _jsx("span", { className: "flex-1 text-left", children: item.label }), _jsx(ChevronDown, { className: cn("h-4 w-4 transition-transform", open && "rotate-180") })] }), open && (_jsx("div", { className: "ml-3 space-y-1", children: item.children.map((child) => (_jsx(SidebarLink, { item: child, pathname: pathname, indent: true, onNavigate: onNavigate }, child.href))) }))] }));
 }
 // ─── Shared content (desktop aside + mobile sheet) ────────────────────────────
-function SidebarContent({ auth, modules, pathname, onNavigate, }) {
-    // Zonder ShellExtensionsProvider komt de lijst ongewijzigd terug (code-volgorde).
-    const visibleModules = useModuleListTransform(modules);
+function SidebarContent({ auth, visibleModules, loading, logoSrc, showSettings, pathname, onNavigate, }) {
     const handleSignOut = async () => {
         onNavigate?.();
         await auth.signOut();
     };
-    return (_jsxs("div", { className: "flex h-full min-h-0 flex-col", children: [_jsx("div", { className: "flex shrink-0 items-center justify-center px-12 py-0 border-b border-sidebar-border", children: _jsx("img", { src: "/logo.png", alt: "Logo", className: "max-h-24 w-auto max-w-full object-contain" }) }), _jsx("nav", { className: "min-h-0 flex-1 space-y-1 px-3 py-4 overflow-y-auto sidebar-scroll", children: visibleModules.map((mod) => mod.nav.children?.length ? (_jsx(SidebarGroup, { item: mod.nav, pathname: pathname, onNavigate: onNavigate }, mod.id)) : (_jsx(SidebarLink, { item: mod.nav, pathname: pathname, onNavigate: onNavigate }, mod.id))) }), _jsxs("div", { className: "shrink-0 border-t border-sidebar-border px-3 py-4", children: [_jsx(SidebarLink, { item: { label: "Instellingen", href: "/instellingen", icon: Settings }, pathname: pathname, onNavigate: onNavigate }), _jsxs("button", { onClick: handleSignOut, className: "flex w-full items-center gap-3 rounded-lg px-3 py-2.5 text-sm font-medium transition-colors text-sidebar-muted hover:bg-sidebar-accent hover:text-sidebar-accent-foreground mt-1 cursor-pointer", children: [_jsx(LogOut, { className: "h-5 w-5" }), "Uitloggen"] })] })] }));
+    return (_jsxs("div", { className: "flex h-full min-h-0 flex-col", children: [_jsx("div", { className: "flex shrink-0 items-center justify-center px-12 py-0 border-b border-sidebar-border", children: _jsx("img", { src: logoSrc, alt: "Logo", className: "max-h-24 w-auto max-w-full object-contain" }) }), _jsx("nav", { className: "min-h-0 flex-1 space-y-1 px-3 py-4 overflow-y-auto sidebar-scroll", "aria-busy": loading || undefined, children: loading ? (_jsx("div", { "data-testid": "sidebar-skeleton", className: "space-y-2", children: [0, 1, 2, 3].map((i) => (_jsx(Skeleton, { className: "h-9 w-full bg-sidebar-accent" }, i))) })) : (visibleModules.map((mod) => mod.nav.children?.length ? (_jsx(SidebarGroup, { item: mod.nav, pathname: pathname, onNavigate: onNavigate }, mod.id)) : (_jsx(SidebarLink, { item: mod.nav, pathname: pathname, onNavigate: onNavigate }, mod.id)))) }), _jsxs("div", { className: "shrink-0 border-t border-sidebar-border px-3 py-4", children: [showSettings && (_jsx(SidebarLink, { item: { label: "Instellingen", href: "/instellingen", icon: Settings }, pathname: pathname, onNavigate: onNavigate })), _jsxs("button", { onClick: handleSignOut, className: "flex w-full items-center gap-3 rounded-lg px-3 py-2.5 text-sm font-medium transition-colors text-sidebar-muted hover:bg-sidebar-accent hover:text-sidebar-accent-foreground mt-1 cursor-pointer", children: [_jsx(LogOut, { className: "h-5 w-5" }), "Uitloggen"] })] })] }));
 }
 // ─── Main Sidebar ─────────────────────────────────────────────────────────────
 /**
- * Desktop (md+): vaste zijbalk links, w-64 — ongewijzigd t.o.v. eerdere versies.
+ * Desktop (md+): vaste zijbalk links, w-64.
  * Mobiel (<md): vaste topbalk (h-14) met menuknop die de zijbalk als Sheet opent.
- * Shells die AuthenticatedLayout gebruiken krijgen de juiste content-offset.
  */
-export function Sidebar({ auth, modules, shellId }) {
+export function Sidebar({ auth, modules, shellId, permissions = false, logoSrc, showSettings = true, visibleModules, loading, }) {
     const location = useLocation();
     const pathname = location.pathname;
     const [mobileOpen, setMobileOpen] = useState(false);
+    const own = useSidebarModules(modules, permissions);
+    const list = visibleModules ?? own.visibleModules;
+    const isLoading = loading ?? (visibleModules ? false : own.loading);
+    const footer = useFooterItems({ settings: showSettings });
+    const logo = useLogoSrc(logoSrc);
     // Sluit het mobiele menu bij elke routewijziging.
     useEffect(() => {
         setMobileOpen(false);
     }, [pathname]);
     const close = () => setMobileOpen(false);
-    return (_jsxs(_Fragment, { children: [_jsx("aside", { "data-shell": shellId, className: "fixed left-0 top-0 z-40 hidden h-screen h-dvh w-64 bg-sidebar md:block", children: _jsx(SidebarContent, { auth: auth, modules: modules, pathname: pathname }) }), _jsxs("div", { className: "fixed inset-x-0 top-0 z-40 flex h-14 items-center gap-3 border-b border-sidebar-border bg-sidebar px-3 md:hidden", children: [_jsx("button", { type: "button", onClick: () => setMobileOpen(true), "aria-label": "Menu openen", className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-lg text-sidebar-muted hover:bg-sidebar-accent hover:text-sidebar-accent-foreground", children: _jsx(Menu, { className: "h-5 w-5" }) }), _jsx("img", { src: "/logo.png", alt: "Logo", className: "h-8 w-auto max-w-[10rem] object-contain" })] }), _jsx(Sheet, { open: mobileOpen, onOpenChange: setMobileOpen, children: _jsxs(SheetContent, { side: "left", "data-shell": shellId, className: "w-64 max-w-[85vw] border-sidebar-border bg-sidebar p-0 md:hidden", children: [_jsx(SheetTitle, { className: "sr-only", children: "Navigatie" }), _jsx(SidebarContent, { auth: auth, modules: modules, pathname: pathname, onNavigate: close })] }) })] }));
+    const contentProps = {
+        auth,
+        visibleModules: list,
+        loading: isLoading,
+        logoSrc: logo,
+        showSettings: footer.settings,
+        pathname,
+    };
+    return (_jsxs(_Fragment, { children: [_jsx("aside", { "data-shell": shellId, className: "fixed left-0 top-0 z-40 hidden h-screen h-dvh w-64 bg-sidebar md:block", children: _jsx(SidebarContent, { ...contentProps }) }), _jsxs("div", { className: "fixed inset-x-0 top-0 z-40 flex h-14 items-center gap-3 border-b border-sidebar-border bg-sidebar px-3 md:hidden", children: [_jsx("button", { type: "button", onClick: () => setMobileOpen(true), "aria-label": "Menu openen", className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-lg text-sidebar-muted hover:bg-sidebar-accent hover:text-sidebar-accent-foreground", children: _jsx(Menu, { className: "h-5 w-5" }) }), _jsx("img", { src: logo, alt: "Logo", className: "h-8 w-auto max-w-[10rem] object-contain" })] }), _jsx(Sheet, { open: mobileOpen, onOpenChange: setMobileOpen, children: _jsxs(SheetContent, { side: "left", "data-shell": shellId, className: "w-64 max-w-[85vw] border-sidebar-border bg-sidebar p-0 md:hidden", children: [_jsx(SheetTitle, { className: "sr-only", children: "Navigatie" }), _jsx(SidebarContent, { ...contentProps, onNavigate: close })] }) })] }));
 }

package/dist/extensions/ShellExtensions.d.ts

@@ -3,6 +3,17 @@ import type { FlowModule } from "../types/module.js";
 /** Transformeert de modulelijst (filteren en/of sorteren). Puur, geen side effects. */
 export type ModuleListTransform = (modules: FlowModule[]) => FlowModule[];
 export type UseModuleListTransform = () => ModuleListTransform;
+/**
+ * Sinds 1.0.23. Footer-items van de zijbalk. Uitloggen staat bewust NIET in dit
+ * type: het is nooit te verbergen. Zichtbaarheid, geen beveiliging.
+ */
+export interface FooterItems {
+    settings: boolean;
+}
+export type FooterTransform = (items: FooterItems) => FooterItems;
+export type UseFooterTransform = () => FooterTransform;
+/** Sinds 1.0.23. Past de footer-transform toe; fout → ongewijzigd. Zichtbaarheid, geen beveiliging. */
+export declare function useFooterItems(base: FooterItems): FooterItems;
 export interface ShellExtensionsProviderProps {
     /**
      * Eén of meer hooks die elk een ModuleListTransform teruggeven.
@@ -16,9 +27,11 @@ export interface ShellExtensionsProviderProps {
     guard?: ComponentType<{
         children: ReactNode;
     }>;
+    /** Sinds 1.0.23. Optionele footer-transform (stabiele referentie). Uitloggen blijft altijd. */
+    useFooter?: UseFooterTransform;
     children: ReactNode;
 }
-export declare function ShellExtensionsProvider({ useModuleList, guard, children, }: ShellExtensionsProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function ShellExtensionsProvider({ useModuleList, guard, useFooter, children, }: ShellExtensionsProviderProps): import("react/jsx-runtime").JSX.Element;
 export declare function useShellGuard(): ComponentType<{
     children: ReactNode;
 }> | undefined;