@nubitio/admin 0.5.16 → 0.5.20

package/dist/index.cjs

@@ -26,6 +26,10 @@ react = __toESM(react, 1);
 let react_router_dom = require("react-router-dom");
 let _nubitio_ui = require("@nubitio/ui");
 let react_jsx_runtime = require("react/jsx-runtime");
+let _tanstack_react_query = require("@tanstack/react-query");
+let _nubitio_core = require("@nubitio/core");
+let _nubitio_crud = require("@nubitio/crud");
+let _nubitio_hydra = require("@nubitio/hydra");
 //#region packages/admin/AdminHeader.tsx
 function ActionPopover({ action }) {
 	const { open, toggle, setOpen, containerRef } = (0, _nubitio_ui.useFloatingPanel)();
@@ -385,14 +389,14 @@ const AdminShell = ({ title, menuItems, headerActions, renderUserMenu, renderThe
 //#endregion
 //#region packages/admin/auth/SessionContext.tsx
 const SessionContext = (0, react.createContext)(null);
-function joinApiPath$1(apiBaseUrl, path) {
+function joinApiPath$2(apiBaseUrl, path) {
 	return `${apiBaseUrl.replace(/\/+$/, "")}/${path.replace(/^\/+/, "")}`;
 }
 function SessionProvider({ apiBaseUrl = "/api/", mePath = "me", logoutPath = "auth/logout", children }) {
 	const [session, setSession] = (0, react.useState)({ status: "loading" });
 	const refresh = (0, react.useCallback)(async () => {
 		try {
-			const response = await fetch(joinApiPath$1(apiBaseUrl, mePath), { credentials: "include" });
+			const response = await fetch(joinApiPath$2(apiBaseUrl, mePath), { credentials: "include" });
 			if (!response.ok) {
 				setSession({ status: "anonymous" });
 				return;
@@ -409,7 +413,7 @@ function SessionProvider({ apiBaseUrl = "/api/", mePath = "me", logoutPath = "au
 		refresh();
 	}, [refresh]);
 	const logout = (0, react.useCallback)(async () => {
-		await fetch(joinApiPath$1(apiBaseUrl, logoutPath), {
+		await fetch(joinApiPath$2(apiBaseUrl, logoutPath), {
 			method: "POST",
 			credentials: "include"
 		});
@@ -438,7 +442,7 @@ function useSession() {
 }
 //#endregion
 //#region packages/admin/auth/LoginPage.tsx
-function joinApiPath(apiBaseUrl, path) {
+function joinApiPath$1(apiBaseUrl, path) {
 	return `${apiBaseUrl.replace(/\/+$/, "")}/${path.replace(/^\/+/, "")}`;
 }
 function LoginPage({ onLoggedIn, apiBaseUrl = "/api/", loginPath = "auth/login", title = "Nubit Admin", hint, defaultUsername = "" }) {
@@ -451,7 +455,7 @@ function LoginPage({ onLoggedIn, apiBaseUrl = "/api/", loginPath = "auth/login",
 		setBusy(true);
 		setError(null);
 		try {
-			const response = await fetch(joinApiPath(apiBaseUrl, loginPath), {
+			const response = await fetch(joinApiPath$1(apiBaseUrl, loginPath), {
 				method: "POST",
 				headers: { "Content-Type": "application/json" },
 				credentials: "include",
@@ -558,6 +562,48 @@ function useAppRuntime() {
 	};
 }
 //#endregion
+//#region packages/admin/runtime/useRuntimeConfig.ts
+function joinApiPath(apiBaseUrl, path) {
+	return `${apiBaseUrl.replace(/\/+$/, "")}/${path.replace(/^\/+/, "")}`;
+}
+function useRuntimeConfig({ apiBaseUrl = "/api/", path = "runtime-config", enabled = true } = {}) {
+	const [state, setState] = (0, react.useState)({ status: "idle" });
+	const refresh = (0, react.useCallback)(async () => {
+		if (!enabled) {
+			setState({ status: "idle" });
+			return;
+		}
+		setState({ status: "loading" });
+		try {
+			const response = await fetch(joinApiPath(apiBaseUrl, path), { credentials: "include" });
+			if (!response.ok) {
+				setState({ status: "error" });
+				return;
+			}
+			setState({
+				status: "ready",
+				config: await response.json()
+			});
+		} catch {
+			setState({ status: "error" });
+		}
+	}, [
+		apiBaseUrl,
+		enabled,
+		path
+	]);
+	(0, react.useEffect)(() => {
+		refresh();
+	}, [refresh]);
+	return {
+		state,
+		config: state.status === "ready" ? state.config : null,
+		loading: state.status === "loading",
+		error: state.status === "error",
+		refresh
+	};
+}
+//#endregion
 //#region packages/admin/runtime/ToastHost.tsx
 const TYPE_CLASS = {
 	success: "nb-toast--success",
@@ -583,13 +629,185 @@ function ToastHost({ toasts, onDismiss }) {
 	});
 }
 //#endregion
+//#region packages/admin/app/filterMenuByRoles.ts
+function hasAnyRole(required, roles) {
+	if (required === void 0) return true;
+	return (Array.isArray(required) ? required : [required]).some((role) => roles.includes(role));
+}
+/**
+* Removes menu entries whose `roles` constraint is not satisfied. Sub-items with
+* `roles` are filtered; empty parent groups are dropped.
+*/
+function filterMenuByRoles(items, roles) {
+	const filtered = [];
+	for (const item of items) {
+		if (!hasAnyRole(item.roles, roles)) continue;
+		if (!item.items) {
+			filtered.push({
+				text: item.text,
+				path: item.path,
+				icon: item.icon
+			});
+			continue;
+		}
+		const subItems = item.items.filter((subItem) => hasAnyRole(subItem.roles, roles)).map(({ text, path }) => ({
+			text,
+			path
+		}));
+		if (subItems.length === 0) continue;
+		filtered.push({
+			text: item.text,
+			icon: item.icon,
+			path: item.path,
+			items: subItems
+		});
+	}
+	return filtered;
+}
+function resolveAppMenu(menu, ctx) {
+	return typeof menu === "function" ? menu(ctx) : menu;
+}
+//#endregion
+//#region packages/admin/app/createNubitApp.tsx
+function defaultUserMenu({ username, close, logout }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		style: {
+			display: "flex",
+			flexDirection: "column",
+			gap: 8,
+			minWidth: 180
+		},
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			style: {
+				color: "var(--text-secondary)",
+				fontSize: "0.875rem"
+			},
+			children: username ?? "User"
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			onClick: () => {
+				close();
+				logout();
+			},
+			children: "Sign out"
+		})]
+	});
+}
+function buildMenuContext(session) {
+	const profile = session.session.status === "authenticated" ? session.session.profile : void 0;
+	return {
+		roles: session.roles,
+		username: session.username,
+		session: session.session,
+		appProfile: profile?.appProfile,
+		logout: session.logout
+	};
+}
+function resolveShellMenu(config, ctx) {
+	const declared = resolveAppMenu(config.menu, ctx);
+	const roleScoped = declared.some((item) => item.roles !== void 0 || item.items?.some((sub) => sub.roles !== void 0)) ? filterMenuByRoles(declared, ctx.roles) : declared.map(({ text, path, icon, items }) => ({
+		text,
+		path,
+		icon,
+		items
+	}));
+	return config.filterMenu ? config.filterMenu(roleScoped, ctx) : roleScoped;
+}
+function NubitAuthenticatedApp({ config }) {
+	const session = useSession();
+	const { runtime, toasts, dismiss } = useAppRuntime();
+	const apiBaseUrl = config.apiBaseUrl ?? "/api/";
+	const homePath = config.homePath ?? config.routes[0]?.path ?? "/";
+	const menuContext = (0, react.useMemo)(() => buildMenuContext(session), [session]);
+	const menuItems = (0, react.useMemo)(() => session.session.status === "authenticated" ? resolveShellMenu(config, menuContext) : [], [
+		config,
+		menuContext,
+		session.session.status
+	]);
+	const renderThemeSwitcher = config.renderThemeSwitcher ?? (() => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_nubitio_ui.ThemeSwitcher, {}));
+	const renderUserMenu = config.renderUserMenu ?? defaultUserMenu;
+	const Wrapper = config.Wrapper ?? react.default.Fragment;
+	if (session.session.status === "loading") return null;
+	const shell = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AdminShell, {
+		title: config.title,
+		menuItems,
+		headerActions: config.shell?.headerActions,
+		footer: config.shell?.footer,
+		renderThemeSwitcher,
+		renderUserMenu: ({ close }) => renderUserMenu({
+			...menuContext,
+			close
+		}),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_router_dom.Routes, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_router_dom.Route, {
+			path: "/",
+			element: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_router_dom.Navigate, {
+				to: homePath,
+				replace: true
+			})
+		}), config.routes.map((route) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_router_dom.Route, {
+			path: route.path,
+			element: route.element
+		}, route.path))] })
+	});
+	const authenticated = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_nubitio_core.CoreProvider, {
+		http: {
+			baseUrl: apiBaseUrl,
+			refreshPath: "auth/refresh",
+			loginPath: "auth/login"
+		},
+		runtime,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_nubitio_core.CoreConfigProvider, {
+			apiBaseUrl,
+			locale: config.locale ?? "en",
+			timezone: config.timezone ?? "UTC",
+			currency: config.currency ?? "USD",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_nubitio_crud.SmartCrudRolesProvider, {
+				roles: session.roles,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_router_dom.BrowserRouter, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Wrapper, { children: config.hydra === false ? shell : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_nubitio_core.MercureProvider, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_nubitio_hydra.SchemaProvider, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_nubitio_hydra.HydraResourceSchemaProvider, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_nubitio_hydra.HydraResourceStoreProvider, { children: shell }) }) }) }) }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToastHost, {
+					toasts,
+					onDismiss: dismiss
+				})]
+			})
+		})
+	});
+	if (session.session.status === "authenticated") return authenticated;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_router_dom.BrowserRouter, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoginPage, {
+		apiBaseUrl,
+		title: config.login?.title ?? config.title,
+		hint: config.login?.hint,
+		defaultUsername: config.login?.defaultUsername,
+		onLoggedIn: () => void session.refresh()
+	}) });
+}
+function createNubitApp(config) {
+	const queryClient = config.queryClient ?? new _tanstack_react_query.QueryClient({ defaultOptions: { queries: {
+		retry: 1,
+		staleTime: 3e4
+	} } });
+	const apiBaseUrl = config.apiBaseUrl ?? "/api/";
+	function App() {
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_tanstack_react_query.QueryClientProvider, {
+			client: queryClient,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_nubitio_ui.ThemeProvider, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SessionProvider, {
+				apiBaseUrl,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NubitAuthenticatedApp, { config })
+			}) })
+		});
+	}
+	return { App };
+}
+//#endregion
 exports.AdminHeader = AdminHeader;
 exports.AdminShell = AdminShell;
 exports.AdminSidebarMenu = AdminSidebarMenu;
 exports.LoginPage = LoginPage;
 exports.SessionProvider = SessionProvider;
 exports.ToastHost = ToastHost;
+exports.createNubitApp = createNubitApp;
+exports.filterMenuByRoles = filterMenuByRoles;
+exports.hasAnyRole = hasAnyRole;
 exports.useAppRuntime = useAppRuntime;
+exports.useRuntimeConfig = useRuntimeConfig;
 exports.useScreenSize = useScreenSize;
 exports.useScreenSizeClass = useScreenSizeClass;
 exports.useSession = useSession;

package/dist/index.d.cts

@@ -1,5 +1,6 @@
-import React from "react";
+import React$1, { ReactNode } from "react";
 import { CoreRuntime } from "@nubitio/core";
+import { QueryClient } from "@tanstack/react-query";
 
 //#region packages/admin/AdminHeader.d.ts
 interface AdminHeaderAction {
@@ -11,18 +12,18 @@ interface AdminHeaderAction {
   onClick?: () => void;
   renderPanel?: (props: {
     close: () => void;
-  }) => React.ReactNode;
+  }) => React$1.ReactNode;
 }
 interface AdminHeaderProps {
   title?: string;
   menuToggleEnabled?: boolean;
-  toggleMenu?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+  toggleMenu?: (e: React$1.MouseEvent<HTMLButtonElement>) => void;
   className?: string;
   actions?: AdminHeaderAction[];
   renderUserMenu?: (props: {
     close: () => void;
-  }) => React.ReactNode;
-  renderThemeSwitcher?: () => React.ReactNode;
+  }) => React$1.ReactNode;
+  renderThemeSwitcher?: () => React$1.ReactNode;
 }
 declare const AdminHeader: ({
   title,
@@ -32,7 +33,7 @@ declare const AdminHeader: ({
   actions,
   renderUserMenu,
   renderThemeSwitcher
-}: AdminHeaderProps) => React.JSX.Element;
+}: AdminHeaderProps) => React$1.JSX.Element;
 //#endregion
 //#region packages/admin/AdminSidebarMenu.d.ts
 interface AdminMenuSubItem {
@@ -48,14 +49,14 @@ interface AdminMenuItem {
 interface AdminSidebarMenuSelectEvent {
   path?: string;
   selected: boolean;
-  event: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>;
+  event: React$1.MouseEvent<HTMLButtonElement | HTMLAnchorElement>;
 }
 interface AdminSidebarMenuProps {
   items: AdminMenuItem[];
   compactMode?: boolean;
   selectedItemChanged: (e: AdminSidebarMenuSelectEvent) => void;
-  openMenu?: (e: React.PointerEvent) => void;
-  footer?: React.ReactNode;
+  openMenu?: (e: React$1.PointerEvent) => void;
+  footer?: React$1.ReactNode;
 }
 declare const AdminSidebarMenu: ({
   items,
@@ -63,7 +64,7 @@ declare const AdminSidebarMenu: ({
   selectedItemChanged,
   openMenu,
   footer
-}: AdminSidebarMenuProps) => React.JSX.Element;
+}: AdminSidebarMenuProps) => React$1.JSX.Element;
 //#endregion
 //#region packages/admin/AdminShell.d.ts
 interface AdminShellProps {
@@ -72,10 +73,10 @@ interface AdminShellProps {
   headerActions?: AdminHeaderAction[];
   renderUserMenu?: (props: {
     close: () => void;
-  }) => React.ReactNode;
-  renderThemeSwitcher?: () => React.ReactNode;
-  footer?: React.ReactNode;
-  children: React.ReactNode;
+  }) => React$1.ReactNode;
+  renderThemeSwitcher?: () => React$1.ReactNode;
+  footer?: React$1.ReactNode;
+  children: React$1.ReactNode;
 }
 declare const AdminShell: ({
   title,
@@ -85,7 +86,7 @@ declare const AdminShell: ({
   renderThemeSwitcher,
   footer,
   children
-}: AdminShellProps) => React.JSX.Element;
+}: AdminShellProps) => React$1.JSX.Element;
 //#endregion
 //#region packages/admin/useScreenSize.d.ts
 declare const useScreenSize: () => {
@@ -97,9 +98,22 @@ declare const useScreenSize: () => {
 declare const useScreenSizeClass: () => "screen-large" | "screen-medium" | "screen-small" | "screen-x-small";
 //#endregion
 //#region packages/admin/auth/SessionContext.d.ts
+type AppProfile = 'internal' | 'saas' | 'hybrid';
+type SessionTenant = {
+  id?: number;
+  name?: string;
+  domain?: string | null;
+};
+type SessionFeatureEntitlement = {
+  enabled: boolean;
+  config: Record<string, unknown>;
+};
 type SessionProfile = {
   username: string;
-  roles: string[];
+  roles: string[]; /** Present when the backend runs nubitio/admin-bundle ≥ 0.1 session contract. */
+  appProfile?: AppProfile;
+  tenant?: SessionTenant;
+  features?: Record<string, SessionFeatureEntitlement>;
 };
 type SessionState = {
   status: 'loading';
@@ -130,8 +144,8 @@ declare function SessionProvider({
   logoutPath,
   children
 }: SessionProviderConfig & {
-  children: React.ReactNode;
-}): React.JSX.Element;
+  children: React$1.ReactNode;
+}): React$1.JSX.Element;
 declare function useSession(): SessionContextValue;
 //#endregion
 //#region packages/admin/auth/LoginPage.d.ts
@@ -165,6 +179,39 @@ declare function useAppRuntime(): {
   dismiss: (id: number) => void;
 };
 //#endregion
+//#region packages/admin/runtime/useRuntimeConfig.d.ts
+/** Free-form JSON from GET /api/runtime-config — each app defines the shape. */
+type RuntimeConfig = Record<string, unknown>;
+type RuntimeConfigState = {
+  status: 'idle';
+} | {
+  status: 'loading';
+} | {
+  status: 'ready';
+  config: RuntimeConfig;
+} | {
+  status: 'error';
+};
+interface UseRuntimeConfigOptions {
+  /** API base URL, e.g. `/api/`. */
+  apiBaseUrl?: string;
+  /** Endpoint relative to apiBaseUrl. @default `runtime-config` */
+  path?: string;
+  /** When false, skips the fetch (e.g. endpoint not enabled). @default true */
+  enabled?: boolean;
+}
+declare function useRuntimeConfig({
+  apiBaseUrl,
+  path,
+  enabled
+}?: UseRuntimeConfigOptions): {
+  state: RuntimeConfigState;
+  config: RuntimeConfig | null;
+  loading: boolean;
+  error: boolean;
+  refresh: () => Promise<void>;
+};
+//#endregion
 //#region packages/admin/runtime/ToastHost.d.ts
 interface ToastHostProps {
   toasts: ToastItem[];
@@ -175,4 +222,69 @@ declare function ToastHost({
   onDismiss
 }: ToastHostProps): import("react").JSX.Element | null;
 //#endregion
-export { AdminHeader, type AdminHeaderAction, type AdminHeaderProps, type AdminMenuItem, type AdminMenuSubItem, AdminShell, type AdminShellProps, AdminSidebarMenu, type AdminSidebarMenuProps, type AdminSidebarMenuSelectEvent, LoginPage, type LoginPageProps, type NotificationType, type SessionContextValue, type SessionProfile, SessionProvider, type SessionProviderConfig, type SessionState, ToastHost, type ToastHostProps, type ToastItem, useAppRuntime, useScreenSize, useScreenSizeClass, useSession };
+//#region packages/admin/app/types.d.ts
+type NubitAppRoute = {
+  path: string;
+  element: ReactNode;
+};
+type NubitAppMenuSubItem = AdminMenuSubItem & {
+  /** UX-only — hide unless the session has one of these roles. */roles?: string | string[];
+};
+type NubitAppMenuItem = Omit<AdminMenuItem, 'items'> & {
+  /** UX-only — hide unless the session has one of these roles. */roles?: string | string[];
+  items?: NubitAppMenuSubItem[];
+};
+type NubitAppMenuContext = {
+  roles: string[];
+  username: string | null;
+  session: SessionState;
+  appProfile?: AppProfile;
+  logout: () => Promise<void>;
+};
+type NubitAppUserMenuContext = NubitAppMenuContext & {
+  close: () => void;
+};
+type CreateNubitAppConfig = {
+  title: string;
+  apiBaseUrl?: string;
+  homePath?: string;
+  locale?: string;
+  timezone?: string;
+  currency?: string;
+  menu: NubitAppMenuItem[] | ((ctx: NubitAppMenuContext) => NubitAppMenuItem[]);
+  routes: NubitAppRoute[];
+  /**
+   * Final menu filter — runs after optional {@link filterMenuByRoles} when items
+   * declare `roles`. Use for app-specific rules (tenant features, runtime config).
+   */
+  filterMenu?: (items: AdminMenuItem[], ctx: NubitAppMenuContext) => AdminMenuItem[];
+  login?: {
+    title?: string;
+    hint?: string;
+    defaultUsername?: string;
+  };
+  shell?: Pick<AdminShellProps, 'headerActions' | 'footer'>;
+  renderThemeSwitcher?: () => ReactNode;
+  renderUserMenu?: (ctx: NubitAppUserMenuContext) => ReactNode; /** Wraps authenticated shell content (inside Hydra providers). */
+  Wrapper?: React.ComponentType<{
+    children: ReactNode;
+  }>;
+  queryClient?: QueryClient; /** Register Mercure + Hydra schema/store providers. Default true. */
+  hydra?: boolean;
+};
+type NubitApp = {
+  App: React.ComponentType;
+};
+//#endregion
+//#region packages/admin/app/createNubitApp.d.ts
+declare function createNubitApp(config: CreateNubitAppConfig): NubitApp;
+//#endregion
+//#region packages/admin/app/filterMenuByRoles.d.ts
+declare function hasAnyRole(required: string | string[] | undefined, roles: string[]): boolean;
+/**
+ * Removes menu entries whose `roles` constraint is not satisfied. Sub-items with
+ * `roles` are filtered; empty parent groups are dropped.
+ */
+declare function filterMenuByRoles(items: NubitAppMenuItem[], roles: string[]): AdminMenuItem[];
+//#endregion
+export { AdminHeader, type AdminHeaderAction, type AdminHeaderProps, type AdminMenuItem, type AdminMenuSubItem, AdminShell, type AdminShellProps, AdminSidebarMenu, type AdminSidebarMenuProps, type AdminSidebarMenuSelectEvent, type AppProfile, type CreateNubitAppConfig, LoginPage, type LoginPageProps, type NotificationType, type NubitApp, type NubitAppMenuContext, type NubitAppMenuItem, type NubitAppMenuSubItem, type NubitAppRoute, type NubitAppUserMenuContext, type RuntimeConfig, type RuntimeConfigState, type SessionContextValue, type SessionFeatureEntitlement, type SessionProfile, SessionProvider, type SessionProviderConfig, type SessionState, type SessionTenant, ToastHost, type ToastHostProps, type ToastItem, type UseRuntimeConfigOptions, createNubitApp, filterMenuByRoles, hasAnyRole, useAppRuntime, useRuntimeConfig, useScreenSize, useScreenSizeClass, useSession };

package/dist/index.d.mts

@@ -1,4 +1,5 @@
-import React from "react";
+import React$1, { ReactNode } from "react";
+import { QueryClient } from "@tanstack/react-query";
 import { CoreRuntime } from "@nubitio/core";
 
 //#region packages/admin/AdminHeader.d.ts
@@ -11,18 +12,18 @@ interface AdminHeaderAction {
   onClick?: () => void;
   renderPanel?: (props: {
     close: () => void;
-  }) => React.ReactNode;
+  }) => React$1.ReactNode;
 }
 interface AdminHeaderProps {
   title?: string;
   menuToggleEnabled?: boolean;
-  toggleMenu?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+  toggleMenu?: (e: React$1.MouseEvent<HTMLButtonElement>) => void;
   className?: string;
   actions?: AdminHeaderAction[];
   renderUserMenu?: (props: {
     close: () => void;
-  }) => React.ReactNode;
-  renderThemeSwitcher?: () => React.ReactNode;
+  }) => React$1.ReactNode;
+  renderThemeSwitcher?: () => React$1.ReactNode;
 }
 declare const AdminHeader: ({
   title,
@@ -32,7 +33,7 @@ declare const AdminHeader: ({
   actions,
   renderUserMenu,
   renderThemeSwitcher
-}: AdminHeaderProps) => React.JSX.Element;
+}: AdminHeaderProps) => React$1.JSX.Element;
 //#endregion
 //#region packages/admin/AdminSidebarMenu.d.ts
 interface AdminMenuSubItem {
@@ -48,14 +49,14 @@ interface AdminMenuItem {
 interface AdminSidebarMenuSelectEvent {
   path?: string;
   selected: boolean;
-  event: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>;
+  event: React$1.MouseEvent<HTMLButtonElement | HTMLAnchorElement>;
 }
 interface AdminSidebarMenuProps {
   items: AdminMenuItem[];
   compactMode?: boolean;
   selectedItemChanged: (e: AdminSidebarMenuSelectEvent) => void;
-  openMenu?: (e: React.PointerEvent) => void;
-  footer?: React.ReactNode;
+  openMenu?: (e: React$1.PointerEvent) => void;
+  footer?: React$1.ReactNode;
 }
 declare const AdminSidebarMenu: ({
   items,
@@ -63,7 +64,7 @@ declare const AdminSidebarMenu: ({
   selectedItemChanged,
   openMenu,
   footer
-}: AdminSidebarMenuProps) => React.JSX.Element;
+}: AdminSidebarMenuProps) => React$1.JSX.Element;
 //#endregion
 //#region packages/admin/AdminShell.d.ts
 interface AdminShellProps {
@@ -72,10 +73,10 @@ interface AdminShellProps {
   headerActions?: AdminHeaderAction[];
   renderUserMenu?: (props: {
     close: () => void;
-  }) => React.ReactNode;
-  renderThemeSwitcher?: () => React.ReactNode;
-  footer?: React.ReactNode;
-  children: React.ReactNode;
+  }) => React$1.ReactNode;
+  renderThemeSwitcher?: () => React$1.ReactNode;
+  footer?: React$1.ReactNode;
+  children: React$1.ReactNode;
 }
 declare const AdminShell: ({
   title,
@@ -85,7 +86,7 @@ declare const AdminShell: ({
   renderThemeSwitcher,
   footer,
   children
-}: AdminShellProps) => React.JSX.Element;
+}: AdminShellProps) => React$1.JSX.Element;
 //#endregion
 //#region packages/admin/useScreenSize.d.ts
 declare const useScreenSize: () => {
@@ -97,9 +98,22 @@ declare const useScreenSize: () => {
 declare const useScreenSizeClass: () => "screen-large" | "screen-medium" | "screen-small" | "screen-x-small";
 //#endregion
 //#region packages/admin/auth/SessionContext.d.ts
+type AppProfile = 'internal' | 'saas' | 'hybrid';
+type SessionTenant = {
+  id?: number;
+  name?: string;
+  domain?: string | null;
+};
+type SessionFeatureEntitlement = {
+  enabled: boolean;
+  config: Record<string, unknown>;
+};
 type SessionProfile = {
   username: string;
-  roles: string[];
+  roles: string[]; /** Present when the backend runs nubitio/admin-bundle ≥ 0.1 session contract. */
+  appProfile?: AppProfile;
+  tenant?: SessionTenant;
+  features?: Record<string, SessionFeatureEntitlement>;
 };
 type SessionState = {
   status: 'loading';
@@ -130,8 +144,8 @@ declare function SessionProvider({
   logoutPath,
   children
 }: SessionProviderConfig & {
-  children: React.ReactNode;
-}): React.JSX.Element;
+  children: React$1.ReactNode;
+}): React$1.JSX.Element;
 declare function useSession(): SessionContextValue;
 //#endregion
 //#region packages/admin/auth/LoginPage.d.ts
@@ -165,6 +179,39 @@ declare function useAppRuntime(): {
   dismiss: (id: number) => void;
 };
 //#endregion
+//#region packages/admin/runtime/useRuntimeConfig.d.ts
+/** Free-form JSON from GET /api/runtime-config — each app defines the shape. */
+type RuntimeConfig = Record<string, unknown>;
+type RuntimeConfigState = {
+  status: 'idle';
+} | {
+  status: 'loading';
+} | {
+  status: 'ready';
+  config: RuntimeConfig;
+} | {
+  status: 'error';
+};
+interface UseRuntimeConfigOptions {
+  /** API base URL, e.g. `/api/`. */
+  apiBaseUrl?: string;
+  /** Endpoint relative to apiBaseUrl. @default `runtime-config` */
+  path?: string;
+  /** When false, skips the fetch (e.g. endpoint not enabled). @default true */
+  enabled?: boolean;
+}
+declare function useRuntimeConfig({
+  apiBaseUrl,
+  path,
+  enabled
+}?: UseRuntimeConfigOptions): {
+  state: RuntimeConfigState;
+  config: RuntimeConfig | null;
+  loading: boolean;
+  error: boolean;
+  refresh: () => Promise<void>;
+};
+//#endregion
 //#region packages/admin/runtime/ToastHost.d.ts
 interface ToastHostProps {
   toasts: ToastItem[];
@@ -175,4 +222,69 @@ declare function ToastHost({
   onDismiss
 }: ToastHostProps): import("react").JSX.Element | null;
 //#endregion
-export { AdminHeader, type AdminHeaderAction, type AdminHeaderProps, type AdminMenuItem, type AdminMenuSubItem, AdminShell, type AdminShellProps, AdminSidebarMenu, type AdminSidebarMenuProps, type AdminSidebarMenuSelectEvent, LoginPage, type LoginPageProps, type NotificationType, type SessionContextValue, type SessionProfile, SessionProvider, type SessionProviderConfig, type SessionState, ToastHost, type ToastHostProps, type ToastItem, useAppRuntime, useScreenSize, useScreenSizeClass, useSession };
+//#region packages/admin/app/types.d.ts
+type NubitAppRoute = {
+  path: string;
+  element: ReactNode;
+};
+type NubitAppMenuSubItem = AdminMenuSubItem & {
+  /** UX-only — hide unless the session has one of these roles. */roles?: string | string[];
+};
+type NubitAppMenuItem = Omit<AdminMenuItem, 'items'> & {
+  /** UX-only — hide unless the session has one of these roles. */roles?: string | string[];
+  items?: NubitAppMenuSubItem[];
+};
+type NubitAppMenuContext = {
+  roles: string[];
+  username: string | null;
+  session: SessionState;
+  appProfile?: AppProfile;
+  logout: () => Promise<void>;
+};
+type NubitAppUserMenuContext = NubitAppMenuContext & {
+  close: () => void;
+};
+type CreateNubitAppConfig = {
+  title: string;
+  apiBaseUrl?: string;
+  homePath?: string;
+  locale?: string;
+  timezone?: string;
+  currency?: string;
+  menu: NubitAppMenuItem[] | ((ctx: NubitAppMenuContext) => NubitAppMenuItem[]);
+  routes: NubitAppRoute[];
+  /**
+   * Final menu filter — runs after optional {@link filterMenuByRoles} when items
+   * declare `roles`. Use for app-specific rules (tenant features, runtime config).
+   */
+  filterMenu?: (items: AdminMenuItem[], ctx: NubitAppMenuContext) => AdminMenuItem[];
+  login?: {
+    title?: string;
+    hint?: string;
+    defaultUsername?: string;
+  };
+  shell?: Pick<AdminShellProps, 'headerActions' | 'footer'>;
+  renderThemeSwitcher?: () => ReactNode;
+  renderUserMenu?: (ctx: NubitAppUserMenuContext) => ReactNode; /** Wraps authenticated shell content (inside Hydra providers). */
+  Wrapper?: React.ComponentType<{
+    children: ReactNode;
+  }>;
+  queryClient?: QueryClient; /** Register Mercure + Hydra schema/store providers. Default true. */
+  hydra?: boolean;
+};
+type NubitApp = {
+  App: React.ComponentType;
+};
+//#endregion
+//#region packages/admin/app/createNubitApp.d.ts
+declare function createNubitApp(config: CreateNubitAppConfig): NubitApp;
+//#endregion
+//#region packages/admin/app/filterMenuByRoles.d.ts
+declare function hasAnyRole(required: string | string[] | undefined, roles: string[]): boolean;
+/**
+ * Removes menu entries whose `roles` constraint is not satisfied. Sub-items with
+ * `roles` are filtered; empty parent groups are dropped.
+ */
+declare function filterMenuByRoles(items: NubitAppMenuItem[], roles: string[]): AdminMenuItem[];
+//#endregion
+export { AdminHeader, type AdminHeaderAction, type AdminHeaderProps, type AdminMenuItem, type AdminMenuSubItem, AdminShell, type AdminShellProps, AdminSidebarMenu, type AdminSidebarMenuProps, type AdminSidebarMenuSelectEvent, type AppProfile, type CreateNubitAppConfig, LoginPage, type LoginPageProps, type NotificationType, type NubitApp, type NubitAppMenuContext, type NubitAppMenuItem, type NubitAppMenuSubItem, type NubitAppRoute, type NubitAppUserMenuContext, type RuntimeConfig, type RuntimeConfigState, type SessionContextValue, type SessionFeatureEntitlement, type SessionProfile, SessionProvider, type SessionProviderConfig, type SessionState, type SessionTenant, ToastHost, type ToastHostProps, type ToastItem, type UseRuntimeConfigOptions, createNubitApp, filterMenuByRoles, hasAnyRole, useAppRuntime, useRuntimeConfig, useScreenSize, useScreenSizeClass, useSession };

package/dist/index.mjs

@@ -1,7 +1,11 @@
-import { createContext, useCallback, useContext, useEffect, useMemo, useState } from "react";
-import { useLocation, useNavigate } from "react-router-dom";
-import { Badge, Button, Card, IconButton, TextField, useFloatingPanel } from "@nubitio/ui";
+import React, { createContext, useCallback, useContext, useEffect, useMemo, useState } from "react";
+import { BrowserRouter, Navigate, Route, Routes, useLocation, useNavigate } from "react-router-dom";
+import { Badge, Button, Card, IconButton, TextField, ThemeProvider, ThemeSwitcher, useFloatingPanel } from "@nubitio/ui";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { CoreConfigProvider, CoreProvider, MercureProvider } from "@nubitio/core";
+import { SmartCrudRolesProvider } from "@nubitio/crud";
+import { HydraResourceSchemaProvider, HydraResourceStoreProvider, SchemaProvider } from "@nubitio/hydra";
 //#region packages/admin/AdminHeader.tsx
 function ActionPopover({ action }) {
 	const { open, toggle, setOpen, containerRef } = useFloatingPanel();
@@ -361,14 +365,14 @@ const AdminShell = ({ title, menuItems, headerActions, renderUserMenu, renderThe
 //#endregion
 //#region packages/admin/auth/SessionContext.tsx
 const SessionContext = createContext(null);
-function joinApiPath$1(apiBaseUrl, path) {
+function joinApiPath$2(apiBaseUrl, path) {
 	return `${apiBaseUrl.replace(/\/+$/, "")}/${path.replace(/^\/+/, "")}`;
 }
 function SessionProvider({ apiBaseUrl = "/api/", mePath = "me", logoutPath = "auth/logout", children }) {
 	const [session, setSession] = useState({ status: "loading" });
 	const refresh = useCallback(async () => {
 		try {
-			const response = await fetch(joinApiPath$1(apiBaseUrl, mePath), { credentials: "include" });
+			const response = await fetch(joinApiPath$2(apiBaseUrl, mePath), { credentials: "include" });
 			if (!response.ok) {
 				setSession({ status: "anonymous" });
 				return;
@@ -385,7 +389,7 @@ function SessionProvider({ apiBaseUrl = "/api/", mePath = "me", logoutPath = "au
 		refresh();
 	}, [refresh]);
 	const logout = useCallback(async () => {
-		await fetch(joinApiPath$1(apiBaseUrl, logoutPath), {
+		await fetch(joinApiPath$2(apiBaseUrl, logoutPath), {
 			method: "POST",
 			credentials: "include"
 		});
@@ -414,7 +418,7 @@ function useSession() {
 }
 //#endregion
 //#region packages/admin/auth/LoginPage.tsx
-function joinApiPath(apiBaseUrl, path) {
+function joinApiPath$1(apiBaseUrl, path) {
 	return `${apiBaseUrl.replace(/\/+$/, "")}/${path.replace(/^\/+/, "")}`;
 }
 function LoginPage({ onLoggedIn, apiBaseUrl = "/api/", loginPath = "auth/login", title = "Nubit Admin", hint, defaultUsername = "" }) {
@@ -427,7 +431,7 @@ function LoginPage({ onLoggedIn, apiBaseUrl = "/api/", loginPath = "auth/login",
 		setBusy(true);
 		setError(null);
 		try {
-			const response = await fetch(joinApiPath(apiBaseUrl, loginPath), {
+			const response = await fetch(joinApiPath$1(apiBaseUrl, loginPath), {
 				method: "POST",
 				headers: { "Content-Type": "application/json" },
 				credentials: "include",
@@ -534,6 +538,48 @@ function useAppRuntime() {
 	};
 }
 //#endregion
+//#region packages/admin/runtime/useRuntimeConfig.ts
+function joinApiPath(apiBaseUrl, path) {
+	return `${apiBaseUrl.replace(/\/+$/, "")}/${path.replace(/^\/+/, "")}`;
+}
+function useRuntimeConfig({ apiBaseUrl = "/api/", path = "runtime-config", enabled = true } = {}) {
+	const [state, setState] = useState({ status: "idle" });
+	const refresh = useCallback(async () => {
+		if (!enabled) {
+			setState({ status: "idle" });
+			return;
+		}
+		setState({ status: "loading" });
+		try {
+			const response = await fetch(joinApiPath(apiBaseUrl, path), { credentials: "include" });
+			if (!response.ok) {
+				setState({ status: "error" });
+				return;
+			}
+			setState({
+				status: "ready",
+				config: await response.json()
+			});
+		} catch {
+			setState({ status: "error" });
+		}
+	}, [
+		apiBaseUrl,
+		enabled,
+		path
+	]);
+	useEffect(() => {
+		refresh();
+	}, [refresh]);
+	return {
+		state,
+		config: state.status === "ready" ? state.config : null,
+		loading: state.status === "loading",
+		error: state.status === "error",
+		refresh
+	};
+}
+//#endregion
 //#region packages/admin/runtime/ToastHost.tsx
 const TYPE_CLASS = {
 	success: "nb-toast--success",
@@ -559,4 +605,172 @@ function ToastHost({ toasts, onDismiss }) {
 	});
 }
 //#endregion
-export { AdminHeader, AdminShell, AdminSidebarMenu, LoginPage, SessionProvider, ToastHost, useAppRuntime, useScreenSize, useScreenSizeClass, useSession };
+//#region packages/admin/app/filterMenuByRoles.ts
+function hasAnyRole(required, roles) {
+	if (required === void 0) return true;
+	return (Array.isArray(required) ? required : [required]).some((role) => roles.includes(role));
+}
+/**
+* Removes menu entries whose `roles` constraint is not satisfied. Sub-items with
+* `roles` are filtered; empty parent groups are dropped.
+*/
+function filterMenuByRoles(items, roles) {
+	const filtered = [];
+	for (const item of items) {
+		if (!hasAnyRole(item.roles, roles)) continue;
+		if (!item.items) {
+			filtered.push({
+				text: item.text,
+				path: item.path,
+				icon: item.icon
+			});
+			continue;
+		}
+		const subItems = item.items.filter((subItem) => hasAnyRole(subItem.roles, roles)).map(({ text, path }) => ({
+			text,
+			path
+		}));
+		if (subItems.length === 0) continue;
+		filtered.push({
+			text: item.text,
+			icon: item.icon,
+			path: item.path,
+			items: subItems
+		});
+	}
+	return filtered;
+}
+function resolveAppMenu(menu, ctx) {
+	return typeof menu === "function" ? menu(ctx) : menu;
+}
+//#endregion
+//#region packages/admin/app/createNubitApp.tsx
+function defaultUserMenu({ username, close, logout }) {
+	return /* @__PURE__ */ jsxs("div", {
+		style: {
+			display: "flex",
+			flexDirection: "column",
+			gap: 8,
+			minWidth: 180
+		},
+		children: [/* @__PURE__ */ jsx("span", {
+			style: {
+				color: "var(--text-secondary)",
+				fontSize: "0.875rem"
+			},
+			children: username ?? "User"
+		}), /* @__PURE__ */ jsx("button", {
+			type: "button",
+			onClick: () => {
+				close();
+				logout();
+			},
+			children: "Sign out"
+		})]
+	});
+}
+function buildMenuContext(session) {
+	const profile = session.session.status === "authenticated" ? session.session.profile : void 0;
+	return {
+		roles: session.roles,
+		username: session.username,
+		session: session.session,
+		appProfile: profile?.appProfile,
+		logout: session.logout
+	};
+}
+function resolveShellMenu(config, ctx) {
+	const declared = resolveAppMenu(config.menu, ctx);
+	const roleScoped = declared.some((item) => item.roles !== void 0 || item.items?.some((sub) => sub.roles !== void 0)) ? filterMenuByRoles(declared, ctx.roles) : declared.map(({ text, path, icon, items }) => ({
+		text,
+		path,
+		icon,
+		items
+	}));
+	return config.filterMenu ? config.filterMenu(roleScoped, ctx) : roleScoped;
+}
+function NubitAuthenticatedApp({ config }) {
+	const session = useSession();
+	const { runtime, toasts, dismiss } = useAppRuntime();
+	const apiBaseUrl = config.apiBaseUrl ?? "/api/";
+	const homePath = config.homePath ?? config.routes[0]?.path ?? "/";
+	const menuContext = useMemo(() => buildMenuContext(session), [session]);
+	const menuItems = useMemo(() => session.session.status === "authenticated" ? resolveShellMenu(config, menuContext) : [], [
+		config,
+		menuContext,
+		session.session.status
+	]);
+	const renderThemeSwitcher = config.renderThemeSwitcher ?? (() => /* @__PURE__ */ jsx(ThemeSwitcher, {}));
+	const renderUserMenu = config.renderUserMenu ?? defaultUserMenu;
+	const Wrapper = config.Wrapper ?? React.Fragment;
+	if (session.session.status === "loading") return null;
+	const shell = /* @__PURE__ */ jsx(AdminShell, {
+		title: config.title,
+		menuItems,
+		headerActions: config.shell?.headerActions,
+		footer: config.shell?.footer,
+		renderThemeSwitcher,
+		renderUserMenu: ({ close }) => renderUserMenu({
+			...menuContext,
+			close
+		}),
+		children: /* @__PURE__ */ jsxs(Routes, { children: [/* @__PURE__ */ jsx(Route, {
+			path: "/",
+			element: /* @__PURE__ */ jsx(Navigate, {
+				to: homePath,
+				replace: true
+			})
+		}), config.routes.map((route) => /* @__PURE__ */ jsx(Route, {
+			path: route.path,
+			element: route.element
+		}, route.path))] })
+	});
+	const authenticated = /* @__PURE__ */ jsx(CoreProvider, {
+		http: {
+			baseUrl: apiBaseUrl,
+			refreshPath: "auth/refresh",
+			loginPath: "auth/login"
+		},
+		runtime,
+		children: /* @__PURE__ */ jsx(CoreConfigProvider, {
+			apiBaseUrl,
+			locale: config.locale ?? "en",
+			timezone: config.timezone ?? "UTC",
+			currency: config.currency ?? "USD",
+			children: /* @__PURE__ */ jsxs(SmartCrudRolesProvider, {
+				roles: session.roles,
+				children: [/* @__PURE__ */ jsx(BrowserRouter, { children: /* @__PURE__ */ jsx(Wrapper, { children: config.hydra === false ? shell : /* @__PURE__ */ jsx(MercureProvider, { children: /* @__PURE__ */ jsx(SchemaProvider, { children: /* @__PURE__ */ jsx(HydraResourceSchemaProvider, { children: /* @__PURE__ */ jsx(HydraResourceStoreProvider, { children: shell }) }) }) }) }) }), /* @__PURE__ */ jsx(ToastHost, {
+					toasts,
+					onDismiss: dismiss
+				})]
+			})
+		})
+	});
+	if (session.session.status === "authenticated") return authenticated;
+	return /* @__PURE__ */ jsx(BrowserRouter, { children: /* @__PURE__ */ jsx(LoginPage, {
+		apiBaseUrl,
+		title: config.login?.title ?? config.title,
+		hint: config.login?.hint,
+		defaultUsername: config.login?.defaultUsername,
+		onLoggedIn: () => void session.refresh()
+	}) });
+}
+function createNubitApp(config) {
+	const queryClient = config.queryClient ?? new QueryClient({ defaultOptions: { queries: {
+		retry: 1,
+		staleTime: 3e4
+	} } });
+	const apiBaseUrl = config.apiBaseUrl ?? "/api/";
+	function App() {
+		return /* @__PURE__ */ jsx(QueryClientProvider, {
+			client: queryClient,
+			children: /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsx(SessionProvider, {
+				apiBaseUrl,
+				children: /* @__PURE__ */ jsx(NubitAuthenticatedApp, { config })
+			}) })
+		});
+	}
+	return { App };
+}
+//#endregion
+export { AdminHeader, AdminShell, AdminSidebarMenu, LoginPage, SessionProvider, ToastHost, createNubitApp, filterMenuByRoles, hasAnyRole, useAppRuntime, useRuntimeConfig, useScreenSize, useScreenSizeClass, useSession };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nubitio/admin",
-  "version": "0.5.16",
+  "version": "0.5.20",
   "type": "module",
   "description": "Admin shell layout components: responsive sidebar, header, and screen size utilities for Nubit apps.",
   "license": "MIT",
@@ -49,10 +49,13 @@
     "access": "public"
   },
   "peerDependencies": {
+    "@tanstack/react-query": "^5.0.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "react-router-dom": "^6.0.0",
-    "@nubitio/core": "^0.5.16",
-    "@nubitio/ui": "^0.5.16"
+    "@nubitio/core": "^0.5.20",
+    "@nubitio/hydra": "^0.5.20",
+    "@nubitio/ui": "^0.5.20",
+    "@nubitio/crud": "^0.5.20"
   }
 }