@nubitio/admin 0.5.20 → 0.5.23

package/dist/index.cjs

@@ -389,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$2(apiBaseUrl, path) {
+function joinApiPath$3(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$2(apiBaseUrl, mePath), { credentials: "include" });
+			const response = await fetch(joinApiPath$3(apiBaseUrl, mePath), { credentials: "include" });
 			if (!response.ok) {
 				setSession({ status: "anonymous" });
 				return;
@@ -413,7 +413,7 @@ function SessionProvider({ apiBaseUrl = "/api/", mePath = "me", logoutPath = "au
 		refresh();
 	}, [refresh]);
 	const logout = (0, react.useCallback)(async () => {
-		await fetch(joinApiPath$2(apiBaseUrl, logoutPath), {
+		await fetch(joinApiPath$3(apiBaseUrl, logoutPath), {
 			method: "POST",
 			credentials: "include"
 		});
@@ -440,9 +440,49 @@ function useSession() {
 	if (!context) throw new Error("useSession must be used within a <SessionProvider>.");
 	return context;
 }
+/** Seeds session state from a known profile (e.g. after a custom /api/me fetch). */
+function StaticSessionProvider({ profile, children }) {
+	const value = (0, react.useMemo)(() => ({
+		session: {
+			status: "authenticated",
+			profile
+		},
+		refresh: async () => void 0,
+		logout: async () => void 0,
+		roles: profile.roles,
+		username: profile.username
+	}), [profile]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SessionContext.Provider, {
+		value,
+		children
+	});
+}
+//#endregion
+//#region packages/admin/hooks/useFeature.ts
+function useFeature(featureKey) {
+	const { session } = useSession();
+	if (session.status !== "authenticated") return false;
+	return session.profile.features?.[featureKey]?.enabled ?? false;
+}
+function useFeatureConfig(featureKey) {
+	const { session } = useSession();
+	if (session.status !== "authenticated") return {};
+	const entry = session.profile.features?.[featureKey];
+	if (!entry?.enabled) return {};
+	return entry.config ?? {};
+}
+//#endregion
+//#region packages/admin/features/FeatureGate.tsx
+function FeatureGate({ featureKey, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_nubitio_ui.FeatureGate, {
+		featureKey,
+		enabled: useFeature(featureKey),
+		...props
+	});
+}
 //#endregion
 //#region packages/admin/auth/LoginPage.tsx
-function joinApiPath$1(apiBaseUrl, path) {
+function joinApiPath$2(apiBaseUrl, path) {
 	return `${apiBaseUrl.replace(/\/+$/, "")}/${path.replace(/^\/+/, "")}`;
 }
 function LoginPage({ onLoggedIn, apiBaseUrl = "/api/", loginPath = "auth/login", title = "Nubit Admin", hint, defaultUsername = "" }) {
@@ -455,7 +495,7 @@ function LoginPage({ onLoggedIn, apiBaseUrl = "/api/", loginPath = "auth/login",
 		setBusy(true);
 		setError(null);
 		try {
-			const response = await fetch(joinApiPath$1(apiBaseUrl, loginPath), {
+			const response = await fetch(joinApiPath$2(apiBaseUrl, loginPath), {
 				method: "POST",
 				headers: { "Content-Type": "application/json" },
 				credentials: "include",
@@ -533,6 +573,125 @@ function LoginPage({ onLoggedIn, apiBaseUrl = "/api/", loginPath = "auth/login",
 	});
 }
 //#endregion
+//#region packages/admin/auth/RegisterPage.tsx
+function joinApiPath$1(apiBaseUrl, path) {
+	return `${apiBaseUrl.replace(/\/+$/, "")}/${path.replace(/^\/+/, "")}`;
+}
+function initialValues(fields) {
+	return Object.fromEntries(fields.map((field) => [field.name, field.defaultValue ?? ""]));
+}
+function RegisterPage({ fields, onRegistered, apiBaseUrl = "/api/", registerPath = "auth/register", title = "Create account", hint, submitLabel = "Create account", busyLabel = "Creating…", loginLink, loginPrompt = "Already have an account?" }) {
+	const [values, setValues] = (0, react.useState)((0, react.useMemo)(() => initialValues(fields), [fields]));
+	const [error, setError] = (0, react.useState)(null);
+	const [busy, setBusy] = (0, react.useState)(false);
+	const setValue = (name, value) => {
+		setValues((current) => ({
+			...current,
+			[name]: value
+		}));
+	};
+	const submit = async (event) => {
+		event.preventDefault();
+		setBusy(true);
+		setError(null);
+		try {
+			const response = await fetch(joinApiPath$1(apiBaseUrl, registerPath), {
+				method: "POST",
+				headers: { "Content-Type": "application/json" },
+				credentials: "include",
+				body: JSON.stringify(values)
+			});
+			const body = await response.json().catch(() => null);
+			if (!response.ok) {
+				setError(body?.error ?? body?.message ?? "Registration failed");
+				return;
+			}
+			onRegistered();
+		} catch {
+			setError("Network error");
+		} finally {
+			setBusy(false);
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		style: {
+			display: "grid",
+			placeItems: "center",
+			minHeight: "100vh"
+		},
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_nubitio_ui.Card, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("form", {
+			onSubmit: submit,
+			style: {
+				display: "flex",
+				flexDirection: "column",
+				gap: 12,
+				width: 360,
+				padding: 8
+			},
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
+					style: { margin: 0 },
+					children: title
+				}),
+				hint && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					style: {
+						margin: 0,
+						color: "var(--text-secondary)"
+					},
+					children: hint
+				}),
+				fields.map((field) => {
+					const type = field.type ?? "text";
+					if (type === "select") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("select", {
+						value: values[field.name] ?? "",
+						onChange: (e) => setValue(field.name, e.target.value),
+						style: { width: "100%" },
+						"aria-label": field.placeholder ?? field.name,
+						children: (field.options ?? []).map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+							value: option.value,
+							children: option.label
+						}, option.value))
+					}, field.name);
+					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_nubitio_ui.TextField, {
+						placeholder: field.placeholder,
+						type: type === "password" ? "password" : type === "email" ? "email" : "text",
+						value: values[field.name] ?? "",
+						autoComplete: field.autoComplete,
+						onChange: (e) => setValue(field.name, e.target.value)
+					}, field.name);
+				}),
+				error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					style: {
+						margin: 0,
+						color: "var(--error-color, #dc2626)"
+					},
+					children: error
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_nubitio_ui.Button, {
+					variant: "primary",
+					type: "submit",
+					disabled: busy,
+					children: busy ? busyLabel : submitLabel
+				}),
+				loginLink && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+					style: {
+						margin: 0,
+						color: "var(--text-secondary)"
+					},
+					children: [
+						loginPrompt,
+						" ",
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_router_dom.Link, {
+							to: loginLink.to,
+							children: loginLink.label
+						})
+					]
+				})
+			]
+		}) })
+	});
+}
+//#endregion
 //#region packages/admin/runtime/useAppRuntime.ts
 function useAppRuntime() {
 	const [toasts, setToasts] = (0, react.useState)([]);
@@ -800,13 +959,18 @@ function createNubitApp(config) {
 exports.AdminHeader = AdminHeader;
 exports.AdminShell = AdminShell;
 exports.AdminSidebarMenu = AdminSidebarMenu;
+exports.FeatureGate = FeatureGate;
 exports.LoginPage = LoginPage;
+exports.RegisterPage = RegisterPage;
 exports.SessionProvider = SessionProvider;
+exports.StaticSessionProvider = StaticSessionProvider;
 exports.ToastHost = ToastHost;
 exports.createNubitApp = createNubitApp;
 exports.filterMenuByRoles = filterMenuByRoles;
 exports.hasAnyRole = hasAnyRole;
 exports.useAppRuntime = useAppRuntime;
+exports.useFeature = useFeature;
+exports.useFeatureConfig = useFeatureConfig;
 exports.useRuntimeConfig = useRuntimeConfig;
 exports.useScreenSize = useScreenSize;
 exports.useScreenSizeClass = useScreenSizeClass;

package/dist/index.d.cts

@@ -1,4 +1,5 @@
 import React$1, { ReactNode } from "react";
+import { FeatureGateProps as FeatureGateProps$1 } from "@nubitio/ui";
 import { CoreRuntime } from "@nubitio/core";
 import { QueryClient } from "@tanstack/react-query";
 
@@ -147,6 +148,25 @@ declare function SessionProvider({
   children: React$1.ReactNode;
 }): React$1.JSX.Element;
 declare function useSession(): SessionContextValue;
+/** Seeds session state from a known profile (e.g. after a custom /api/me fetch). */
+declare function StaticSessionProvider({
+  profile,
+  children
+}: {
+  profile: SessionProfile;
+  children: React$1.ReactNode;
+}): React$1.JSX.Element;
+//#endregion
+//#region packages/admin/hooks/useFeature.d.ts
+declare function useFeature(featureKey: string): boolean;
+declare function useFeatureConfig(featureKey: string): Record<string, unknown>;
+//#endregion
+//#region packages/admin/features/FeatureGate.d.ts
+type FeatureGateProps = Omit<FeatureGateProps$1, 'enabled'>;
+declare function FeatureGate({
+  featureKey,
+  ...props
+}: FeatureGateProps): React$1.JSX.Element;
 //#endregion
 //#region packages/admin/auth/LoginPage.d.ts
 interface LoginPageProps {
@@ -166,6 +186,49 @@ declare function LoginPage({
   defaultUsername
 }: LoginPageProps): import("react").JSX.Element;
 //#endregion
+//#region packages/admin/auth/RegisterPage.d.ts
+type RegisterFieldType = 'text' | 'email' | 'password' | 'select';
+interface RegisterSelectOption {
+  value: string;
+  label: string;
+}
+interface RegisterField {
+  /** JSON body key sent to the register endpoint. */
+  name: string;
+  placeholder?: string;
+  type?: RegisterFieldType;
+  defaultValue?: string;
+  autoComplete?: string;
+  options?: RegisterSelectOption[];
+}
+interface RegisterPageProps {
+  fields: RegisterField[];
+  onRegistered: () => void;
+  apiBaseUrl?: string;
+  registerPath?: string;
+  title?: string;
+  hint?: string;
+  submitLabel?: string;
+  busyLabel?: string;
+  loginLink?: {
+    to: string;
+    label: string;
+  };
+  loginPrompt?: string;
+}
+declare function RegisterPage({
+  fields,
+  onRegistered,
+  apiBaseUrl,
+  registerPath,
+  title,
+  hint,
+  submitLabel,
+  busyLabel,
+  loginLink,
+  loginPrompt
+}: RegisterPageProps): import("react").JSX.Element;
+//#endregion
 //#region packages/admin/runtime/useAppRuntime.d.ts
 type NotificationType = 'success' | 'error' | 'warning' | 'info';
 type ToastItem = {
@@ -287,4 +350,4 @@ declare function hasAnyRole(required: string | string[] | undefined, roles: stri
  */
 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 };
+export { AdminHeader, type AdminHeaderAction, type AdminHeaderProps, type AdminMenuItem, type AdminMenuSubItem, AdminShell, type AdminShellProps, AdminSidebarMenu, type AdminSidebarMenuProps, type AdminSidebarMenuSelectEvent, type AppProfile, type CreateNubitAppConfig, FeatureGate, type FeatureGateProps, LoginPage, type LoginPageProps, type NotificationType, type NubitApp, type NubitAppMenuContext, type NubitAppMenuItem, type NubitAppMenuSubItem, type NubitAppRoute, type NubitAppUserMenuContext, type RegisterField, type RegisterFieldType, RegisterPage, type RegisterPageProps, type RegisterSelectOption, type RuntimeConfig, type RuntimeConfigState, type SessionContextValue, type SessionFeatureEntitlement, type SessionProfile, SessionProvider, type SessionProviderConfig, type SessionState, type SessionTenant, StaticSessionProvider, ToastHost, type ToastHostProps, type ToastItem, type UseRuntimeConfigOptions, createNubitApp, filterMenuByRoles, hasAnyRole, useAppRuntime, useFeature, useFeatureConfig, useRuntimeConfig, useScreenSize, useScreenSizeClass, useSession };

package/dist/index.d.mts

@@ -1,4 +1,5 @@
 import React$1, { ReactNode } from "react";
+import { FeatureGateProps as FeatureGateProps$1 } from "@nubitio/ui";
 import { QueryClient } from "@tanstack/react-query";
 import { CoreRuntime } from "@nubitio/core";
 
@@ -147,6 +148,25 @@ declare function SessionProvider({
   children: React$1.ReactNode;
 }): React$1.JSX.Element;
 declare function useSession(): SessionContextValue;
+/** Seeds session state from a known profile (e.g. after a custom /api/me fetch). */
+declare function StaticSessionProvider({
+  profile,
+  children
+}: {
+  profile: SessionProfile;
+  children: React$1.ReactNode;
+}): React$1.JSX.Element;
+//#endregion
+//#region packages/admin/hooks/useFeature.d.ts
+declare function useFeature(featureKey: string): boolean;
+declare function useFeatureConfig(featureKey: string): Record<string, unknown>;
+//#endregion
+//#region packages/admin/features/FeatureGate.d.ts
+type FeatureGateProps = Omit<FeatureGateProps$1, 'enabled'>;
+declare function FeatureGate({
+  featureKey,
+  ...props
+}: FeatureGateProps): React$1.JSX.Element;
 //#endregion
 //#region packages/admin/auth/LoginPage.d.ts
 interface LoginPageProps {
@@ -166,6 +186,49 @@ declare function LoginPage({
   defaultUsername
 }: LoginPageProps): import("react").JSX.Element;
 //#endregion
+//#region packages/admin/auth/RegisterPage.d.ts
+type RegisterFieldType = 'text' | 'email' | 'password' | 'select';
+interface RegisterSelectOption {
+  value: string;
+  label: string;
+}
+interface RegisterField {
+  /** JSON body key sent to the register endpoint. */
+  name: string;
+  placeholder?: string;
+  type?: RegisterFieldType;
+  defaultValue?: string;
+  autoComplete?: string;
+  options?: RegisterSelectOption[];
+}
+interface RegisterPageProps {
+  fields: RegisterField[];
+  onRegistered: () => void;
+  apiBaseUrl?: string;
+  registerPath?: string;
+  title?: string;
+  hint?: string;
+  submitLabel?: string;
+  busyLabel?: string;
+  loginLink?: {
+    to: string;
+    label: string;
+  };
+  loginPrompt?: string;
+}
+declare function RegisterPage({
+  fields,
+  onRegistered,
+  apiBaseUrl,
+  registerPath,
+  title,
+  hint,
+  submitLabel,
+  busyLabel,
+  loginLink,
+  loginPrompt
+}: RegisterPageProps): import("react").JSX.Element;
+//#endregion
 //#region packages/admin/runtime/useAppRuntime.d.ts
 type NotificationType = 'success' | 'error' | 'warning' | 'info';
 type ToastItem = {
@@ -287,4 +350,4 @@ declare function hasAnyRole(required: string | string[] | undefined, roles: stri
  */
 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 };
+export { AdminHeader, type AdminHeaderAction, type AdminHeaderProps, type AdminMenuItem, type AdminMenuSubItem, AdminShell, type AdminShellProps, AdminSidebarMenu, type AdminSidebarMenuProps, type AdminSidebarMenuSelectEvent, type AppProfile, type CreateNubitAppConfig, FeatureGate, type FeatureGateProps, LoginPage, type LoginPageProps, type NotificationType, type NubitApp, type NubitAppMenuContext, type NubitAppMenuItem, type NubitAppMenuSubItem, type NubitAppRoute, type NubitAppUserMenuContext, type RegisterField, type RegisterFieldType, RegisterPage, type RegisterPageProps, type RegisterSelectOption, type RuntimeConfig, type RuntimeConfigState, type SessionContextValue, type SessionFeatureEntitlement, type SessionProfile, SessionProvider, type SessionProviderConfig, type SessionState, type SessionTenant, StaticSessionProvider, ToastHost, type ToastHostProps, type ToastItem, type UseRuntimeConfigOptions, createNubitApp, filterMenuByRoles, hasAnyRole, useAppRuntime, useFeature, useFeatureConfig, useRuntimeConfig, useScreenSize, useScreenSizeClass, useSession };

package/dist/index.mjs

@@ -1,6 +1,6 @@
 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 { BrowserRouter, Link, Navigate, Route, Routes, useLocation, useNavigate } from "react-router-dom";
+import { Badge, Button, Card, FeatureGate as FeatureGate$1, 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";
@@ -365,14 +365,14 @@ const AdminShell = ({ title, menuItems, headerActions, renderUserMenu, renderThe
 //#endregion
 //#region packages/admin/auth/SessionContext.tsx
 const SessionContext = createContext(null);
-function joinApiPath$2(apiBaseUrl, path) {
+function joinApiPath$3(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$2(apiBaseUrl, mePath), { credentials: "include" });
+			const response = await fetch(joinApiPath$3(apiBaseUrl, mePath), { credentials: "include" });
 			if (!response.ok) {
 				setSession({ status: "anonymous" });
 				return;
@@ -389,7 +389,7 @@ function SessionProvider({ apiBaseUrl = "/api/", mePath = "me", logoutPath = "au
 		refresh();
 	}, [refresh]);
 	const logout = useCallback(async () => {
-		await fetch(joinApiPath$2(apiBaseUrl, logoutPath), {
+		await fetch(joinApiPath$3(apiBaseUrl, logoutPath), {
 			method: "POST",
 			credentials: "include"
 		});
@@ -416,9 +416,49 @@ function useSession() {
 	if (!context) throw new Error("useSession must be used within a <SessionProvider>.");
 	return context;
 }
+/** Seeds session state from a known profile (e.g. after a custom /api/me fetch). */
+function StaticSessionProvider({ profile, children }) {
+	const value = useMemo(() => ({
+		session: {
+			status: "authenticated",
+			profile
+		},
+		refresh: async () => void 0,
+		logout: async () => void 0,
+		roles: profile.roles,
+		username: profile.username
+	}), [profile]);
+	return /* @__PURE__ */ jsx(SessionContext.Provider, {
+		value,
+		children
+	});
+}
+//#endregion
+//#region packages/admin/hooks/useFeature.ts
+function useFeature(featureKey) {
+	const { session } = useSession();
+	if (session.status !== "authenticated") return false;
+	return session.profile.features?.[featureKey]?.enabled ?? false;
+}
+function useFeatureConfig(featureKey) {
+	const { session } = useSession();
+	if (session.status !== "authenticated") return {};
+	const entry = session.profile.features?.[featureKey];
+	if (!entry?.enabled) return {};
+	return entry.config ?? {};
+}
+//#endregion
+//#region packages/admin/features/FeatureGate.tsx
+function FeatureGate({ featureKey, ...props }) {
+	return /* @__PURE__ */ jsx(FeatureGate$1, {
+		featureKey,
+		enabled: useFeature(featureKey),
+		...props
+	});
+}
 //#endregion
 //#region packages/admin/auth/LoginPage.tsx
-function joinApiPath$1(apiBaseUrl, path) {
+function joinApiPath$2(apiBaseUrl, path) {
 	return `${apiBaseUrl.replace(/\/+$/, "")}/${path.replace(/^\/+/, "")}`;
 }
 function LoginPage({ onLoggedIn, apiBaseUrl = "/api/", loginPath = "auth/login", title = "Nubit Admin", hint, defaultUsername = "" }) {
@@ -431,7 +471,7 @@ function LoginPage({ onLoggedIn, apiBaseUrl = "/api/", loginPath = "auth/login",
 		setBusy(true);
 		setError(null);
 		try {
-			const response = await fetch(joinApiPath$1(apiBaseUrl, loginPath), {
+			const response = await fetch(joinApiPath$2(apiBaseUrl, loginPath), {
 				method: "POST",
 				headers: { "Content-Type": "application/json" },
 				credentials: "include",
@@ -509,6 +549,125 @@ function LoginPage({ onLoggedIn, apiBaseUrl = "/api/", loginPath = "auth/login",
 	});
 }
 //#endregion
+//#region packages/admin/auth/RegisterPage.tsx
+function joinApiPath$1(apiBaseUrl, path) {
+	return `${apiBaseUrl.replace(/\/+$/, "")}/${path.replace(/^\/+/, "")}`;
+}
+function initialValues(fields) {
+	return Object.fromEntries(fields.map((field) => [field.name, field.defaultValue ?? ""]));
+}
+function RegisterPage({ fields, onRegistered, apiBaseUrl = "/api/", registerPath = "auth/register", title = "Create account", hint, submitLabel = "Create account", busyLabel = "Creating…", loginLink, loginPrompt = "Already have an account?" }) {
+	const [values, setValues] = useState(useMemo(() => initialValues(fields), [fields]));
+	const [error, setError] = useState(null);
+	const [busy, setBusy] = useState(false);
+	const setValue = (name, value) => {
+		setValues((current) => ({
+			...current,
+			[name]: value
+		}));
+	};
+	const submit = async (event) => {
+		event.preventDefault();
+		setBusy(true);
+		setError(null);
+		try {
+			const response = await fetch(joinApiPath$1(apiBaseUrl, registerPath), {
+				method: "POST",
+				headers: { "Content-Type": "application/json" },
+				credentials: "include",
+				body: JSON.stringify(values)
+			});
+			const body = await response.json().catch(() => null);
+			if (!response.ok) {
+				setError(body?.error ?? body?.message ?? "Registration failed");
+				return;
+			}
+			onRegistered();
+		} catch {
+			setError("Network error");
+		} finally {
+			setBusy(false);
+		}
+	};
+	return /* @__PURE__ */ jsx("div", {
+		style: {
+			display: "grid",
+			placeItems: "center",
+			minHeight: "100vh"
+		},
+		children: /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs("form", {
+			onSubmit: submit,
+			style: {
+				display: "flex",
+				flexDirection: "column",
+				gap: 12,
+				width: 360,
+				padding: 8
+			},
+			children: [
+				/* @__PURE__ */ jsx("h2", {
+					style: { margin: 0 },
+					children: title
+				}),
+				hint && /* @__PURE__ */ jsx("p", {
+					style: {
+						margin: 0,
+						color: "var(--text-secondary)"
+					},
+					children: hint
+				}),
+				fields.map((field) => {
+					const type = field.type ?? "text";
+					if (type === "select") return /* @__PURE__ */ jsx("select", {
+						value: values[field.name] ?? "",
+						onChange: (e) => setValue(field.name, e.target.value),
+						style: { width: "100%" },
+						"aria-label": field.placeholder ?? field.name,
+						children: (field.options ?? []).map((option) => /* @__PURE__ */ jsx("option", {
+							value: option.value,
+							children: option.label
+						}, option.value))
+					}, field.name);
+					return /* @__PURE__ */ jsx(TextField, {
+						placeholder: field.placeholder,
+						type: type === "password" ? "password" : type === "email" ? "email" : "text",
+						value: values[field.name] ?? "",
+						autoComplete: field.autoComplete,
+						onChange: (e) => setValue(field.name, e.target.value)
+					}, field.name);
+				}),
+				error && /* @__PURE__ */ jsx("p", {
+					style: {
+						margin: 0,
+						color: "var(--error-color, #dc2626)"
+					},
+					children: error
+				}),
+				/* @__PURE__ */ jsx(Button, {
+					variant: "primary",
+					type: "submit",
+					disabled: busy,
+					children: busy ? busyLabel : submitLabel
+				}),
+				loginLink && /* @__PURE__ */ jsxs("p", {
+					style: {
+						margin: 0,
+						color: "var(--text-secondary)"
+					},
+					children: [
+						loginPrompt,
+						" ",
+						/* @__PURE__ */ jsx(Link, {
+							to: loginLink.to,
+							children: loginLink.label
+						})
+					]
+				})
+			]
+		}) })
+	});
+}
+//#endregion
 //#region packages/admin/runtime/useAppRuntime.ts
 function useAppRuntime() {
 	const [toasts, setToasts] = useState([]);
@@ -773,4 +932,4 @@ function createNubitApp(config) {
 	return { App };
 }
 //#endregion
-export { AdminHeader, AdminShell, AdminSidebarMenu, LoginPage, SessionProvider, ToastHost, createNubitApp, filterMenuByRoles, hasAnyRole, useAppRuntime, useRuntimeConfig, useScreenSize, useScreenSizeClass, useSession };
+export { AdminHeader, AdminShell, AdminSidebarMenu, FeatureGate, LoginPage, RegisterPage, SessionProvider, StaticSessionProvider, ToastHost, createNubitApp, filterMenuByRoles, hasAnyRole, useAppRuntime, useFeature, useFeatureConfig, useRuntimeConfig, useScreenSize, useScreenSizeClass, useSession };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nubitio/admin",
-  "version": "0.5.20",
+  "version": "0.5.23",
   "type": "module",
   "description": "Admin shell layout components: responsive sidebar, header, and screen size utilities for Nubit apps.",
   "license": "MIT",
@@ -53,9 +53,9 @@
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "react-router-dom": "^6.0.0",
-    "@nubitio/core": "^0.5.20",
-    "@nubitio/hydra": "^0.5.20",
-    "@nubitio/ui": "^0.5.20",
-    "@nubitio/crud": "^0.5.20"
+    "@nubitio/crud": "^0.5.23",
+    "@nubitio/core": "^0.5.23",
+    "@nubitio/hydra": "^0.5.23",
+    "@nubitio/ui": "^0.5.23"
   }
 }