@alepha/ui 0.13.1 → 0.13.3

package/dist/admin/{AdminSessions-CmDVneE2.js → AdminSessions-CMmBtbSw.js}

@@ -1,16 +1,19 @@
-import { DataTable, Flex, Text } from "@alepha/ui";
+import { ActionButton, DataTable, Flex, Text } from "@alepha/ui";
 import { t } from "alepha";
-import { useClient } from "@alepha/react";
+import { useClient, useRouter } from "@alepha/react";
+import { IconDeviceDesktop, IconDeviceMobile, IconDeviceTablet, IconTrash } from "@tabler/icons-react";
 import { useI18n } from "@alepha/react/i18n";
 import { Badge, Group } from "@mantine/core";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { IconDeviceDesktop, IconDeviceMobile, IconDeviceTablet } from "@tabler/icons-react";
+import { useState } from "react";
 import { sessions } from "alepha/api/users";
 
 //#region src/admin/components/AdminSessions.tsx
 const AdminSessions = (props) => {
 	const client = useClient();
+	const router = useRouter();
 	const { l } = useI18n();
+	const [refreshKey, setRefreshKey] = useState(0);
 	const filters = t.object({ userId: t.optional(t.uuid({ $control: { query: t.pick(sessions.schema, ["userId"]) } })) });
 	const getDeviceIcon = (device) => {
 		switch (device) {
@@ -22,8 +25,16 @@ const AdminSessions = (props) => {
 	const isExpired = (expiresAt) => {
 		return new Date(expiresAt) < /* @__PURE__ */ new Date();
 	};
+	const handleDelete = async (sessionId) => {
+		await client.deleteSession({
+			params: { id: sessionId },
+			query: { userRealmName: props.userRealmName }
+		});
+		setRefreshKey((k) => k + 1);
+	};
 	return /* @__PURE__ */ jsx(Flex, {
 		flex: 1,
+		direction: "column",
 		children: /* @__PURE__ */ jsx(DataTable, {
 			submitOnInit: true,
 			defaultSize: 10,
@@ -51,11 +62,16 @@ const AdminSessions = (props) => {
 			},
 			columns: {
 				userId: {
-					label: "User ID",
-					value: (item) => /* @__PURE__ */ jsxs(Text, {
+					label: "User",
+					value: (item) => /* @__PURE__ */ jsx(ActionButton, {
+						variant: "subtle",
 						size: "xs",
-						ff: "monospace",
-						children: [item.userId.slice(0, 8), "..."]
+						href: router.path("adminUserDetails", { params: { userId: item.userId } }),
+						children: /* @__PURE__ */ jsxs(Text, {
+							size: "xs",
+							ff: "monospace",
+							children: [item.userId.slice(0, 8), "..."]
+						})
 					})
 				},
 				userAgent: {
@@ -111,13 +127,24 @@ const AdminSessions = (props) => {
 						c: "dimmed",
 						children: l(item.createdAt, { date: "fromNow" })
 					})
+				},
+				actions: {
+					label: "",
+					fit: true,
+					value: (item) => /* @__PURE__ */ jsx(ActionButton, {
+						size: "xs",
+						variant: "subtle",
+						color: "red",
+						onClick: () => handleDelete(item.id),
+						children: /* @__PURE__ */ jsx(IconTrash, { size: 14 })
+					})
 				}
 			}
-		})
+		}, refreshKey)
 	});
 };
 var AdminSessions_default = AdminSessions;
 
 //#endregion
 export { AdminSessions_default as t };
-//# sourceMappingURL=AdminSessions-CmDVneE2.js.map
+//# sourceMappingURL=AdminSessions-CMmBtbSw.js.map

package/dist/admin/AdminSessions-CMmBtbSw.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdminSessions-CMmBtbSw.js","names":["filters"],"sources":["../../src/admin/components/AdminSessions.tsx"],"sourcesContent":["import { useClient, useRouter } from \"@alepha/react\";\nimport { useI18n } from \"@alepha/react/i18n\";\nimport { ActionButton, DataTable, Flex, Text } from \"@alepha/ui\";\nimport { Badge, Group } from \"@mantine/core\";\nimport {\n  IconDeviceDesktop,\n  IconDeviceMobile,\n  IconDeviceTablet,\n  IconTrash,\n} from \"@tabler/icons-react\";\nimport { type Page, t } from \"alepha\";\nimport {\n  type SessionController,\n  type SessionEntity,\n  sessions,\n} from \"alepha/api/users\";\nimport { useState } from \"react\";\nimport type { AdminRouter } from \"../AdminRouter.ts\";\n\nexport interface AdminSessionsProps {\n  userRealmName?: string;\n}\n\nconst AdminSessions = (props: AdminSessionsProps) => {\n  const client = useClient<SessionController>();\n  const router = useRouter<AdminRouter>();\n  const { l } = useI18n();\n  const [refreshKey, setRefreshKey] = useState(0);\n\n  const filters = t.object({\n    userId: t.optional(\n      t.uuid({\n        $control: {\n          query: t.pick(sessions.schema, [\"userId\"]),\n        },\n      }),\n    ),\n  });\n\n  const getDeviceIcon = (device?: string) => {\n    switch (device) {\n      case \"MOBILE\":\n        return <IconDeviceMobile size={14} />;\n      case \"TABLET\":\n        return <IconDeviceTablet size={14} />;\n      default:\n        return <IconDeviceDesktop size={14} />;\n    }\n  };\n\n  const isExpired = (expiresAt: Date | string) => {\n    return new Date(expiresAt) < new Date();\n  };\n\n  const handleDelete = async (sessionId: string) => {\n    await client.deleteSession({\n      params: { id: sessionId },\n      query: { userRealmName: props.userRealmName },\n    });\n    setRefreshKey((k) => k + 1);\n  };\n\n  return (\n    <Flex flex={1} direction=\"column\">\n      <DataTable<SessionEntity, typeof filters>\n        key={refreshKey}\n        submitOnInit\n        defaultSize={10}\n        typeFormProps={{\n          skipSubmitButton: true,\n          columns: 3,\n        }}\n        tableProps={{\n          horizontalSpacing: \"xs\",\n          verticalSpacing: \"xs\",\n        }}\n        onFilterChange={(key, _value, form) => {\n          if (key === \"userId\") {\n            return form.submit();\n          }\n        }}\n        filters={filters}\n        tableTrProps={(item) => {\n          if (isExpired(item.expiresAt)) {\n            return {\n              opacity: 0.5,\n            };\n          }\n          return {};\n        }}\n        items={async (filters) => {\n          const response = await client.findSessions({\n            query: {\n              ...filters,\n              userRealmName: props.userRealmName,\n            },\n          });\n\n          return response as Page<SessionEntity>;\n        }}\n        columns={{\n          userId: {\n            label: \"User\",\n            value: (item) => (\n              <ActionButton\n                variant=\"subtle\"\n                size=\"xs\"\n                href={router.path(\"adminUserDetails\", {\n                  params: { userId: item.userId },\n                })}\n              >\n                <Text size=\"xs\" ff=\"monospace\">\n                  {item.userId.slice(0, 8)}...\n                </Text>\n              </ActionButton>\n            ),\n          },\n          userAgent: {\n            label: \"Device\",\n            fit: true,\n            value: (item) => (\n              <Group gap={4}>\n                {item.userAgent ? (\n                  <>\n                    <Badge\n                      size=\"xs\"\n                      variant=\"light\"\n                      leftSection={getDeviceIcon(item.userAgent.device)}\n                    >\n                      {item.userAgent.device}\n                    </Badge>\n                    <Text size=\"xs\" c=\"dimmed\">\n                      {item.userAgent.browser} / {item.userAgent.os}\n                    </Text>\n                  </>\n                ) : (\n                  <Text size=\"xs\" c=\"dimmed\">\n                    -\n                  </Text>\n                )}\n              </Group>\n            ),\n          },\n          ip: {\n            label: \"IP\",\n            fit: true,\n            value: (item) => (\n              <Text size=\"xs\" ff=\"monospace\" c=\"dimmed\">\n                {item.ip || \"-\"}\n              </Text>\n            ),\n          },\n          expiresAt: {\n            label: \"Status\",\n            fit: true,\n            value: (item) => (\n              <Badge\n                size=\"sm\"\n                variant=\"light\"\n                color={isExpired(item.expiresAt) ? \"red\" : \"green\"}\n              >\n                {isExpired(item.expiresAt) ? \"Expired\" : \"Active\"}\n              </Badge>\n            ),\n          },\n          createdAt: {\n            label: \"Created\",\n            fit: true,\n            value: (item) => (\n              <Text size=\"xs\" c=\"dimmed\">\n                {l(item.createdAt, { date: \"fromNow\" })}\n              </Text>\n            ),\n          },\n          actions: {\n            label: \"\",\n            fit: true,\n            value: (item) => (\n              <ActionButton\n                size=\"xs\"\n                variant=\"subtle\"\n                color=\"red\"\n                onClick={() => handleDelete(item.id)}\n              >\n                <IconTrash size={14} />\n              </ActionButton>\n            ),\n          },\n        }}\n      />\n    </Flex>\n  );\n};\n\nexport default AdminSessions;\n"],"mappings":"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"}

package/dist/admin/AdminSessions-Df2VYzlE.js

@@ -0,0 +1,3 @@
+import { t as AdminSessions_default } from "./AdminSessions-CMmBtbSw.js";
+
+export { AdminSessions_default as default };

package/dist/admin/AdminUserCreate-Coa_yi6m.js

@@ -0,0 +1,103 @@
+import { ActionButton, Control, Flex } from "@alepha/ui";
+import { t } from "alepha";
+import { useClient, useRouter } from "@alepha/react";
+import { Card, Stack, Text as Text$1 } from "@mantine/core";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useForm } from "@alepha/react/form";
+
+//#region src/admin/components/AdminUserCreate.tsx
+const AdminUserCreate = (props) => {
+	const client = useClient();
+	const router = useRouter();
+	const form = useForm({
+		schema: t.object({
+			username: t.optional(t.shortText({
+				minLength: 3,
+				maxLength: 50,
+				pattern: "^[a-zA-Z0-9._-]+$"
+			})),
+			email: t.optional(t.email()),
+			phoneNumber: t.optional(t.e164()),
+			firstName: t.optional(t.string()),
+			lastName: t.optional(t.string()),
+			roles: t.optional(t.array(t.string())),
+			enabled: t.optional(t.boolean()),
+			password: t.optional(t.string({ minLength: 8 }))
+		}),
+		handler: async (data) => {
+			const user = await client.createUser({
+				query: { userRealmName: props.userRealmName },
+				body: {
+					...data,
+					enabled: data.enabled ?? true
+				}
+			});
+			await router.go("adminUserDetails", { params: { userId: user.id } });
+		}
+	});
+	return /* @__PURE__ */ jsx(Flex, {
+		flex: 1,
+		p: "md",
+		children: /* @__PURE__ */ jsx(Card, {
+			withBorder: true,
+			p: "lg",
+			maw: 600,
+			w: "100%",
+			children: /* @__PURE__ */ jsx("form", {
+				...form.props,
+				children: /* @__PURE__ */ jsxs(Stack, {
+					gap: "md",
+					children: [
+						/* @__PURE__ */ jsx(Text$1, {
+							size: "lg",
+							fw: 500,
+							children: "Create New User"
+						}),
+						/* @__PURE__ */ jsx(Control, {
+							title: "Username",
+							input: form.input.username
+						}),
+						/* @__PURE__ */ jsx(Control, {
+							title: "Email",
+							input: form.input.email
+						}),
+						/* @__PURE__ */ jsx(Control, {
+							title: "Phone Number",
+							input: form.input.phoneNumber
+						}),
+						/* @__PURE__ */ jsx(Control, {
+							title: "First Name",
+							input: form.input.firstName
+						}),
+						/* @__PURE__ */ jsx(Control, {
+							title: "Last Name",
+							input: form.input.lastName
+						}),
+						/* @__PURE__ */ jsx(Control, {
+							title: "Password",
+							input: form.input.password,
+							password: true
+						}),
+						/* @__PURE__ */ jsx(Control, {
+							title: "Roles",
+							input: form.input.roles
+						}),
+						/* @__PURE__ */ jsx(Control, {
+							title: "Enabled",
+							input: form.input.enabled
+						}),
+						/* @__PURE__ */ jsx(ActionButton, {
+							form,
+							children: "Create User"
+						})
+					]
+				})
+			})
+		})
+	});
+};
+var AdminUserCreate_default = AdminUserCreate;
+
+//#endregion
+export { AdminUserCreate_default as t };
+//# sourceMappingURL=AdminUserCreate-Coa_yi6m.js.map

package/dist/admin/AdminUserCreate-Coa_yi6m.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdminUserCreate-Coa_yi6m.js","names":["Text"],"sources":["../../src/admin/components/AdminUserCreate.tsx"],"sourcesContent":["import { useClient, useRouter } from \"@alepha/react\";\nimport { useForm } from \"@alepha/react/form\";\nimport { ActionButton, Control, Flex } from \"@alepha/ui\";\nimport { Card, Stack, Text } from \"@mantine/core\";\nimport { t } from \"alepha\";\nimport type { UserController } from \"alepha/api/users\";\nimport type { AdminRouter } from \"../AdminRouter.ts\";\n\nexport interface AdminUserCreateProps {\n  userRealmName?: string;\n}\n\nconst AdminUserCreate = (props: AdminUserCreateProps) => {\n  const client = useClient<UserController>();\n  const router = useRouter<AdminRouter>();\n\n  const form = useForm({\n    schema: t.object({\n      username: t.optional(\n        t.shortText({\n          minLength: 3,\n          maxLength: 50,\n          pattern: \"^[a-zA-Z0-9._-]+$\",\n        }),\n      ),\n      email: t.optional(t.email()),\n      phoneNumber: t.optional(t.e164()),\n      firstName: t.optional(t.string()),\n      lastName: t.optional(t.string()),\n      roles: t.optional(t.array(t.string())),\n      enabled: t.optional(t.boolean()),\n      password: t.optional(t.string({ minLength: 8 })),\n    }),\n    handler: async (data) => {\n      const user = await client.createUser({\n        query: {\n          userRealmName: props.userRealmName,\n        },\n        body: {\n          ...data,\n          enabled: data.enabled ?? true,\n        },\n      });\n\n      await router.go(\"adminUserDetails\", {\n        params: { userId: user.id },\n      });\n    },\n  });\n\n  return (\n    <Flex flex={1} p=\"md\">\n      <Card withBorder p=\"lg\" maw={600} w=\"100%\">\n        <form {...form.props}>\n          <Stack gap=\"md\">\n            <Text size=\"lg\" fw={500}>\n              Create New User\n            </Text>\n\n            <Control title=\"Username\" input={form.input.username} />\n\n            <Control title=\"Email\" input={form.input.email} />\n\n            <Control title=\"Phone Number\" input={form.input.phoneNumber} />\n\n            <Control title=\"First Name\" input={form.input.firstName} />\n\n            <Control title=\"Last Name\" input={form.input.lastName} />\n\n            <Control title=\"Password\" input={form.input.password} password />\n\n            <Control title=\"Roles\" input={form.input.roles} />\n\n            <Control title=\"Enabled\" input={form.input.enabled} />\n\n            <ActionButton form={form}>Create User</ActionButton>\n          </Stack>\n        </form>\n      </Card>\n    </Flex>\n  );\n};\n\nexport default AdminUserCreate;\n"],"mappings":";;;;;;;;AAYA,MAAM,mBAAmB,UAAgC;CACvD,MAAM,SAAS,WAA2B;CAC1C,MAAM,SAAS,WAAwB;CAEvC,MAAM,OAAO,QAAQ;EACnB,QAAQ,EAAE,OAAO;GACf,UAAU,EAAE,SACV,EAAE,UAAU;IACV,WAAW;IACX,WAAW;IACX,SAAS;IACV,CAAC,CACH;GACD,OAAO,EAAE,SAAS,EAAE,OAAO,CAAC;GAC5B,aAAa,EAAE,SAAS,EAAE,MAAM,CAAC;GACjC,WAAW,EAAE,SAAS,EAAE,QAAQ,CAAC;GACjC,UAAU,EAAE,SAAS,EAAE,QAAQ,CAAC;GAChC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC;GACtC,SAAS,EAAE,SAAS,EAAE,SAAS,CAAC;GAChC,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,WAAW,GAAG,CAAC,CAAC;GACjD,CAAC;EACF,SAAS,OAAO,SAAS;GACvB,MAAM,OAAO,MAAM,OAAO,WAAW;IACnC,OAAO,EACL,eAAe,MAAM,eACtB;IACD,MAAM;KACJ,GAAG;KACH,SAAS,KAAK,WAAW;KAC1B;IACF,CAAC;AAEF,SAAM,OAAO,GAAG,oBAAoB,EAClC,QAAQ,EAAE,QAAQ,KAAK,IAAI,EAC5B,CAAC;;EAEL,CAAC;AAEF,QACE,oBAAC;EAAK,MAAM;EAAG,GAAE;YACf,oBAAC;GAAK;GAAW,GAAE;GAAK,KAAK;GAAK,GAAE;aAClC,oBAAC;IAAK,GAAI,KAAK;cACb,qBAAC;KAAM,KAAI;;MACT,oBAACA;OAAK,MAAK;OAAK,IAAI;iBAAK;QAElB;MAEP,oBAAC;OAAQ,OAAM;OAAW,OAAO,KAAK,MAAM;QAAY;MAExD,oBAAC;OAAQ,OAAM;OAAQ,OAAO,KAAK,MAAM;QAAS;MAElD,oBAAC;OAAQ,OAAM;OAAe,OAAO,KAAK,MAAM;QAAe;MAE/D,oBAAC;OAAQ,OAAM;OAAa,OAAO,KAAK,MAAM;QAAa;MAE3D,oBAAC;OAAQ,OAAM;OAAY,OAAO,KAAK,MAAM;QAAY;MAEzD,oBAAC;OAAQ,OAAM;OAAW,OAAO,KAAK,MAAM;OAAU;QAAW;MAEjE,oBAAC;OAAQ,OAAM;OAAQ,OAAO,KAAK,MAAM;QAAS;MAElD,oBAAC;OAAQ,OAAM;OAAU,OAAO,KAAK,MAAM;QAAW;MAEtD,oBAAC;OAAmB;iBAAM;QAA0B;;MAC9C;KACH;IACF;GACF;;AAIX,8BAAe"}

package/dist/admin/AdminUserCreate-DjiCcAk0.js

@@ -0,0 +1,3 @@
+import { t as AdminUserCreate_default } from "./AdminUserCreate-Coa_yi6m.js";
+
+export { AdminUserCreate_default as default };

package/dist/admin/AdminUserDetails-BCFwOm9w.js

@@ -0,0 +1,221 @@
+import { ActionButton, Control, Flex, Text } from "@alepha/ui";
+import { t } from "alepha";
+import { useClient, useRouterState } from "@alepha/react";
+import { IconCheck, IconX } from "@tabler/icons-react";
+import { useI18n } from "@alepha/react/i18n";
+import { Card, Group, Loader, Stack } from "@mantine/core";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useForm } from "@alepha/react/form";
+import { useEffect, useState } from "react";
+
+//#region src/admin/components/AdminUserDetails.tsx
+const AdminUserDetails = (props) => {
+	const state = useRouterState();
+	const client = useClient();
+	const { l } = useI18n();
+	const userId = state.params.userId;
+	const [user, setUser] = useState(null);
+	const [loading, setLoading] = useState(true);
+	useEffect(() => {
+		const loadUser = async () => {
+			try {
+				setUser(await client.getUser({
+					params: { id: userId },
+					query: { userRealmName: props.userRealmName }
+				}));
+			} finally {
+				setLoading(false);
+			}
+		};
+		loadUser();
+	}, [userId]);
+	const form = useForm({
+		schema: t.object({
+			email: t.optional(t.email()),
+			phoneNumber: t.optional(t.e164()),
+			firstName: t.optional(t.string()),
+			lastName: t.optional(t.string()),
+			roles: t.optional(t.array(t.string())),
+			enabled: t.optional(t.boolean())
+		}),
+		handler: async (data) => {
+			setUser(await client.updateUser({
+				params: { id: userId },
+				query: { userRealmName: props.userRealmName },
+				body: data
+			}));
+		}
+	});
+	useEffect(() => {
+		if (user) {
+			form.input.email?.set(user.email ?? "");
+			form.input.phoneNumber?.set(user.phoneNumber ?? "");
+			form.input.firstName?.set(user.firstName ?? "");
+			form.input.lastName?.set(user.lastName ?? "");
+			form.input.roles?.set(user.roles ?? []);
+			form.input.enabled?.set(user.enabled);
+		}
+	}, [user]);
+	if (loading) return /* @__PURE__ */ jsx(Flex, {
+		flex: 1,
+		justify: "center",
+		align: "center",
+		children: /* @__PURE__ */ jsx(Loader, {})
+	});
+	if (!user) return /* @__PURE__ */ jsx(Flex, {
+		flex: 1,
+		justify: "center",
+		align: "center",
+		children: /* @__PURE__ */ jsx(Text, {
+			c: "dimmed",
+			children: "User not found"
+		})
+	});
+	return /* @__PURE__ */ jsxs(Flex, {
+		flex: 1,
+		direction: "column",
+		gap: "md",
+		children: [/* @__PURE__ */ jsx(Card, {
+			withBorder: true,
+			p: "lg",
+			children: /* @__PURE__ */ jsxs(Stack, {
+				gap: "md",
+				children: [/* @__PURE__ */ jsx(Text, {
+					size: "lg",
+					fw: 500,
+					children: "User Details"
+				}), /* @__PURE__ */ jsxs(Group, {
+					gap: "xl",
+					children: [
+						/* @__PURE__ */ jsxs(Stack, {
+							gap: 4,
+							children: [/* @__PURE__ */ jsx(Text, {
+								size: "xs",
+								c: "dimmed",
+								children: "User ID"
+							}), /* @__PURE__ */ jsx(Text, {
+								size: "sm",
+								ff: "monospace",
+								children: user.id
+							})]
+						}),
+						/* @__PURE__ */ jsxs(Stack, {
+							gap: 4,
+							children: [/* @__PURE__ */ jsx(Text, {
+								size: "xs",
+								c: "dimmed",
+								children: "Username"
+							}), /* @__PURE__ */ jsx(Text, {
+								size: "sm",
+								children: user.username || "-"
+							})]
+						}),
+						/* @__PURE__ */ jsxs(Stack, {
+							gap: 4,
+							children: [/* @__PURE__ */ jsx(Text, {
+								size: "xs",
+								c: "dimmed",
+								children: "Email Verified"
+							}), user.emailVerified ? /* @__PURE__ */ jsxs(Group, {
+								gap: 4,
+								children: [/* @__PURE__ */ jsx(IconCheck, {
+									size: 14,
+									color: "var(--mantine-color-green-6)"
+								}), /* @__PURE__ */ jsx(Text, {
+									size: "sm",
+									c: "green",
+									children: "Verified"
+								})]
+							}) : /* @__PURE__ */ jsxs(Group, {
+								gap: 4,
+								children: [/* @__PURE__ */ jsx(IconX, {
+									size: 14,
+									color: "var(--mantine-color-red-6)"
+								}), /* @__PURE__ */ jsx(Text, {
+									size: "sm",
+									c: "red",
+									children: "Not Verified"
+								})]
+							})]
+						}),
+						/* @__PURE__ */ jsxs(Stack, {
+							gap: 4,
+							children: [/* @__PURE__ */ jsx(Text, {
+								size: "xs",
+								c: "dimmed",
+								children: "Created"
+							}), /* @__PURE__ */ jsx(Text, {
+								size: "sm",
+								children: l(user.createdAt, { date: "medium" })
+							})]
+						}),
+						/* @__PURE__ */ jsxs(Stack, {
+							gap: 4,
+							children: [/* @__PURE__ */ jsx(Text, {
+								size: "xs",
+								c: "dimmed",
+								children: "Updated"
+							}), /* @__PURE__ */ jsx(Text, {
+								size: "sm",
+								children: l(user.updatedAt, { date: "medium" })
+							})]
+						})
+					]
+				})]
+			})
+		}), /* @__PURE__ */ jsx(Card, {
+			withBorder: true,
+			p: "lg",
+			children: /* @__PURE__ */ jsx("form", {
+				...form.props,
+				children: /* @__PURE__ */ jsxs(Stack, {
+					gap: "md",
+					children: [
+						/* @__PURE__ */ jsx(Text, {
+							size: "lg",
+							fw: 500,
+							children: "Edit User"
+						}),
+						/* @__PURE__ */ jsxs(Group, {
+							grow: true,
+							children: [/* @__PURE__ */ jsx(Control, {
+								title: "Email",
+								input: form.input.email
+							}), /* @__PURE__ */ jsx(Control, {
+								title: "Phone Number",
+								input: form.input.phoneNumber
+							})]
+						}),
+						/* @__PURE__ */ jsxs(Group, {
+							grow: true,
+							children: [/* @__PURE__ */ jsx(Control, {
+								title: "First Name",
+								input: form.input.firstName
+							}), /* @__PURE__ */ jsx(Control, {
+								title: "Last Name",
+								input: form.input.lastName
+							})]
+						}),
+						/* @__PURE__ */ jsx(Control, {
+							title: "Roles",
+							input: form.input.roles
+						}),
+						/* @__PURE__ */ jsx(Control, {
+							title: "Enabled",
+							input: form.input.enabled
+						}),
+						/* @__PURE__ */ jsx(Group, { children: /* @__PURE__ */ jsx(ActionButton, {
+							form,
+							children: "Save Changes"
+						}) })
+					]
+				})
+			})
+		})]
+	});
+};
+var AdminUserDetails_default = AdminUserDetails;
+
+//#endregion
+export { AdminUserDetails_default as t };
+//# sourceMappingURL=AdminUserDetails-BCFwOm9w.js.map

package/dist/admin/AdminUserDetails-BCFwOm9w.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdminUserDetails-BCFwOm9w.js","names":[],"sources":["../../src/admin/components/AdminUserDetails.tsx"],"sourcesContent":["import { useClient, useRouterState } from \"@alepha/react\";\nimport { useForm } from \"@alepha/react/form\";\nimport { useI18n } from \"@alepha/react/i18n\";\nimport { ActionButton, Control, Flex, Text } from \"@alepha/ui\";\nimport { Card, Group, Loader, Stack } from \"@mantine/core\";\nimport { IconCheck, IconX } from \"@tabler/icons-react\";\nimport { t } from \"alepha\";\nimport type { UserController, UserEntity } from \"alepha/api/users\";\nimport { useEffect, useState } from \"react\";\n\nexport interface AdminUserDetailsProps {\n  userRealmName?: string;\n}\n\nconst AdminUserDetails = (props: AdminUserDetailsProps) => {\n  const state = useRouterState();\n  const client = useClient<UserController>();\n  const { l } = useI18n();\n  const userId = state.params.userId as string;\n\n  const [user, setUser] = useState<UserEntity | null>(null);\n  const [loading, setLoading] = useState(true);\n\n  useEffect(() => {\n    const loadUser = async () => {\n      try {\n        const data = await client.getUser({\n          params: { id: userId },\n          query: { userRealmName: props.userRealmName },\n        });\n        setUser(data);\n      } finally {\n        setLoading(false);\n      }\n    };\n\n    loadUser();\n  }, [userId]);\n\n  const form = useForm({\n    schema: t.object({\n      email: t.optional(t.email()),\n      phoneNumber: t.optional(t.e164()),\n      firstName: t.optional(t.string()),\n      lastName: t.optional(t.string()),\n      roles: t.optional(t.array(t.string())),\n      enabled: t.optional(t.boolean()),\n    }),\n    handler: async (data) => {\n      const updated = await client.updateUser({\n        params: { id: userId },\n        query: { userRealmName: props.userRealmName },\n        body: data,\n      });\n      setUser(updated);\n    },\n  });\n\n  useEffect(() => {\n    if (user) {\n      form.input.email?.set(user.email ?? \"\");\n      form.input.phoneNumber?.set(user.phoneNumber ?? \"\");\n      form.input.firstName?.set(user.firstName ?? \"\");\n      form.input.lastName?.set(user.lastName ?? \"\");\n      form.input.roles?.set(user.roles ?? []);\n      form.input.enabled?.set(user.enabled);\n    }\n  }, [user]);\n\n  if (loading) {\n    return (\n      <Flex flex={1} justify=\"center\" align=\"center\">\n        <Loader />\n      </Flex>\n    );\n  }\n\n  if (!user) {\n    return (\n      <Flex flex={1} justify=\"center\" align=\"center\">\n        <Text c=\"dimmed\">User not found</Text>\n      </Flex>\n    );\n  }\n\n  return (\n    <Flex flex={1} direction=\"column\" gap=\"md\">\n      <Card withBorder p=\"lg\">\n        <Stack gap=\"md\">\n          <Text size=\"lg\" fw={500}>\n            User Details\n          </Text>\n\n          <Group gap=\"xl\">\n            <Stack gap={4}>\n              <Text size=\"xs\" c=\"dimmed\">\n                User ID\n              </Text>\n              <Text size=\"sm\" ff=\"monospace\">\n                {user.id}\n              </Text>\n            </Stack>\n\n            <Stack gap={4}>\n              <Text size=\"xs\" c=\"dimmed\">\n                Username\n              </Text>\n              <Text size=\"sm\">{user.username || \"-\"}</Text>\n            </Stack>\n\n            <Stack gap={4}>\n              <Text size=\"xs\" c=\"dimmed\">\n                Email Verified\n              </Text>\n              {user.emailVerified ? (\n                <Group gap={4}>\n                  <IconCheck size={14} color=\"var(--mantine-color-green-6)\" />\n                  <Text size=\"sm\" c=\"green\">\n                    Verified\n                  </Text>\n                </Group>\n              ) : (\n                <Group gap={4}>\n                  <IconX size={14} color=\"var(--mantine-color-red-6)\" />\n                  <Text size=\"sm\" c=\"red\">\n                    Not Verified\n                  </Text>\n                </Group>\n              )}\n            </Stack>\n\n            <Stack gap={4}>\n              <Text size=\"xs\" c=\"dimmed\">\n                Created\n              </Text>\n              <Text size=\"sm\">{l(user.createdAt, { date: \"medium\" })}</Text>\n            </Stack>\n\n            <Stack gap={4}>\n              <Text size=\"xs\" c=\"dimmed\">\n                Updated\n              </Text>\n              <Text size=\"sm\">{l(user.updatedAt, { date: \"medium\" })}</Text>\n            </Stack>\n          </Group>\n        </Stack>\n      </Card>\n\n      <Card withBorder p=\"lg\">\n        <form {...form.props}>\n          <Stack gap=\"md\">\n            <Text size=\"lg\" fw={500}>\n              Edit User\n            </Text>\n\n            <Group grow>\n              <Control title=\"Email\" input={form.input.email} />\n              <Control title=\"Phone Number\" input={form.input.phoneNumber} />\n            </Group>\n\n            <Group grow>\n              <Control title=\"First Name\" input={form.input.firstName} />\n              <Control title=\"Last Name\" input={form.input.lastName} />\n            </Group>\n\n            <Control title=\"Roles\" input={form.input.roles} />\n\n            <Control title=\"Enabled\" input={form.input.enabled} />\n\n            <Group>\n              <ActionButton form={form}>Save Changes</ActionButton>\n            </Group>\n          </Stack>\n        </form>\n      </Card>\n    </Flex>\n  );\n};\n\nexport default AdminUserDetails;\n"],"mappings":"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"}

package/dist/admin/AdminUserDetails-C5yeJNa3.js

@@ -0,0 +1,3 @@
+import { t as AdminUserDetails_default } from "./AdminUserDetails-BCFwOm9w.js";
+
+export { AdminUserDetails_default as default };

package/dist/admin/AdminUserLayout-B8ga5QvP.js

@@ -0,0 +1,3 @@
+import { t as AdminUserLayout_default } from "./AdminUserLayout-CR2OqV9Z.js";
+
+export { AdminUserLayout_default as default };

package/dist/admin/AdminUserLayout-CR2OqV9Z.js

@@ -0,0 +1,153 @@
+import { ActionButton, Flex, Text } from "@alepha/ui";
+import { NestedView, useClient, useRouter, useRouterState } from "@alepha/react";
+import { IconDevices, IconSettings, IconUser } from "@tabler/icons-react";
+import { Avatar, Badge, Card, Group, Loader, Stack, Tabs } from "@mantine/core";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+
+//#region src/admin/components/AdminUserLayout.tsx
+const AdminUserLayout = (props) => {
+	const router = useRouter();
+	const state = useRouterState();
+	const client = useClient();
+	const userId = state.params.userId;
+	const [user, setUser] = useState(null);
+	const [loading, setLoading] = useState(true);
+	useEffect(() => {
+		const loadUser = async () => {
+			try {
+				setUser(await client.getUser({
+					params: { id: userId },
+					query: { userRealmName: props.userRealmName }
+				}));
+			} finally {
+				setLoading(false);
+			}
+		};
+		loadUser();
+	}, [userId]);
+	if (loading) return /* @__PURE__ */ jsx(Flex, {
+		flex: 1,
+		justify: "center",
+		align: "center",
+		children: /* @__PURE__ */ jsx(Loader, {})
+	});
+	if (!user) return /* @__PURE__ */ jsx(Flex, {
+		flex: 1,
+		justify: "center",
+		align: "center",
+		children: /* @__PURE__ */ jsx(Text, {
+			c: "dimmed",
+			children: "User not found"
+		})
+	});
+	const currentPath = state.url.pathname;
+	const detailsPath = router.path("adminUserDetails", { params: { userId } });
+	const sessionsPath = router.path("adminUserSessions", { params: { userId } });
+	const settingsPath = router.path("adminUserSettings", { params: { userId } });
+	const getActiveTab = () => {
+		if (currentPath.endsWith("/sessions")) return "sessions";
+		if (currentPath.endsWith("/settings")) return "settings";
+		return "details";
+	};
+	const activeTab = getActiveTab();
+	const displayName = user.firstName || user.lastName ? `${user.firstName ?? ""} ${user.lastName ?? ""}`.trim() : user.username || user.email || "User";
+	return /* @__PURE__ */ jsxs(Flex, {
+		flex: 1,
+		direction: "column",
+		gap: "md",
+		p: "md",
+		children: [
+			/* @__PURE__ */ jsx(Card, {
+				withBorder: true,
+				p: "md",
+				children: /* @__PURE__ */ jsxs(Group, { children: [/* @__PURE__ */ jsx(Avatar, {
+					size: "lg",
+					radius: "xl",
+					color: "blue",
+					children: displayName.charAt(0).toUpperCase()
+				}), /* @__PURE__ */ jsxs(Stack, {
+					gap: 4,
+					children: [
+						/* @__PURE__ */ jsxs(Group, {
+							gap: "xs",
+							children: [/* @__PURE__ */ jsx(Text, {
+								size: "lg",
+								fw: 500,
+								children: displayName
+							}), /* @__PURE__ */ jsx(Badge, {
+								size: "sm",
+								variant: "light",
+								color: user.enabled ? "green" : "red",
+								children: user.enabled ? "Active" : "Disabled"
+							})]
+						}),
+						/* @__PURE__ */ jsx(Text, {
+							size: "sm",
+							c: "dimmed",
+							children: user.email || user.username || user.id
+						}),
+						user.roles.length > 0 && /* @__PURE__ */ jsx(Group, {
+							gap: 4,
+							children: user.roles.map((role) => /* @__PURE__ */ jsx(Badge, {
+								size: "xs",
+								variant: "outline",
+								children: role
+							}, role))
+						})
+					]
+				})] })
+			}),
+			/* @__PURE__ */ jsx(Tabs, {
+				value: activeTab,
+				children: /* @__PURE__ */ jsxs(Tabs.List, { children: [
+					/* @__PURE__ */ jsx(ActionButton, {
+						variant: "subtle",
+						href: detailsPath,
+						leftSection: /* @__PURE__ */ jsx(IconUser, { size: 16 }),
+						c: activeTab === "details" ? void 0 : "dimmed",
+						fw: activeTab === "details" ? 500 : 400,
+						style: {
+							borderBottom: activeTab === "details" ? "2px solid var(--mantine-primary-color-filled)" : "2px solid transparent",
+							borderRadius: 0
+						},
+						children: "Details"
+					}),
+					/* @__PURE__ */ jsx(ActionButton, {
+						variant: "subtle",
+						href: sessionsPath,
+						leftSection: /* @__PURE__ */ jsx(IconDevices, { size: 16 }),
+						c: activeTab === "sessions" ? void 0 : "dimmed",
+						fw: activeTab === "sessions" ? 500 : 400,
+						style: {
+							borderBottom: activeTab === "sessions" ? "2px solid var(--mantine-primary-color-filled)" : "2px solid transparent",
+							borderRadius: 0
+						},
+						children: "Sessions"
+					}),
+					/* @__PURE__ */ jsx(ActionButton, {
+						variant: "subtle",
+						href: settingsPath,
+						leftSection: /* @__PURE__ */ jsx(IconSettings, { size: 16 }),
+						c: activeTab === "settings" ? void 0 : "dimmed",
+						fw: activeTab === "settings" ? 500 : 400,
+						style: {
+							borderBottom: activeTab === "settings" ? "2px solid var(--mantine-primary-color-filled)" : "2px solid transparent",
+							borderRadius: 0
+						},
+						children: "Settings"
+					})
+				] })
+			}),
+			/* @__PURE__ */ jsx(Flex, {
+				flex: 1,
+				children: /* @__PURE__ */ jsx(NestedView, {})
+			})
+		]
+	});
+};
+var AdminUserLayout_default = AdminUserLayout;
+
+//#endregion
+export { AdminUserLayout_default as t };
+//# sourceMappingURL=AdminUserLayout-CR2OqV9Z.js.map

package/dist/admin/AdminUserLayout-CR2OqV9Z.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdminUserLayout-CR2OqV9Z.js","names":[],"sources":["../../src/admin/components/AdminUserLayout.tsx"],"sourcesContent":["import {\n  NestedView,\n  useClient,\n  useRouter,\n  useRouterState,\n} from \"@alepha/react\";\nimport { ActionButton, Flex, Text } from \"@alepha/ui\";\nimport { Avatar, Badge, Card, Group, Loader, Stack, Tabs } from \"@mantine/core\";\nimport { IconDevices, IconSettings, IconUser } from \"@tabler/icons-react\";\nimport type { UserController, UserEntity } from \"alepha/api/users\";\nimport { useEffect, useState } from \"react\";\nimport type { AdminRouter } from \"../AdminRouter.ts\";\n\nexport interface AdminUserLayoutProps {\n  userRealmName?: string;\n}\n\nconst AdminUserLayout = (props: AdminUserLayoutProps) => {\n  const router = useRouter<AdminRouter>();\n  const state = useRouterState();\n  const client = useClient<UserController>();\n  const userId = state.params.userId as string;\n\n  const [user, setUser] = useState<UserEntity | null>(null);\n  const [loading, setLoading] = useState(true);\n\n  useEffect(() => {\n    const loadUser = async () => {\n      try {\n        const data = await client.getUser({\n          params: { id: userId },\n          query: { userRealmName: props.userRealmName },\n        });\n        setUser(data);\n      } finally {\n        setLoading(false);\n      }\n    };\n\n    loadUser();\n  }, [userId]);\n\n  if (loading) {\n    return (\n      <Flex flex={1} justify=\"center\" align=\"center\">\n        <Loader />\n      </Flex>\n    );\n  }\n\n  if (!user) {\n    return (\n      <Flex flex={1} justify=\"center\" align=\"center\">\n        <Text c=\"dimmed\">User not found</Text>\n      </Flex>\n    );\n  }\n\n  const currentPath = state.url.pathname;\n  const detailsPath = router.path(\"adminUserDetails\", { params: { userId } });\n  const sessionsPath = router.path(\"adminUserSessions\", { params: { userId } });\n  const settingsPath = router.path(\"adminUserSettings\", { params: { userId } });\n\n  const getActiveTab = () => {\n    if (currentPath.endsWith(\"/sessions\")) return \"sessions\";\n    if (currentPath.endsWith(\"/settings\")) return \"settings\";\n    return \"details\";\n  };\n  const activeTab = getActiveTab();\n\n  const displayName =\n    user.firstName || user.lastName\n      ? `${user.firstName ?? \"\"} ${user.lastName ?? \"\"}`.trim()\n      : user.username || user.email || \"User\";\n\n  return (\n    <Flex flex={1} direction=\"column\" gap=\"md\" p=\"md\">\n      <Card withBorder p=\"md\">\n        <Group>\n          <Avatar size=\"lg\" radius=\"xl\" color=\"blue\">\n            {displayName.charAt(0).toUpperCase()}\n          </Avatar>\n          <Stack gap={4}>\n            <Group gap=\"xs\">\n              <Text size=\"lg\" fw={500}>\n                {displayName}\n              </Text>\n              <Badge\n                size=\"sm\"\n                variant=\"light\"\n                color={user.enabled ? \"green\" : \"red\"}\n              >\n                {user.enabled ? \"Active\" : \"Disabled\"}\n              </Badge>\n            </Group>\n            <Text size=\"sm\" c=\"dimmed\">\n              {user.email || user.username || user.id}\n            </Text>\n            {user.roles.length > 0 && (\n              <Group gap={4}>\n                {user.roles.map((role: string) => (\n                  <Badge key={role} size=\"xs\" variant=\"outline\">\n                    {role}\n                  </Badge>\n                ))}\n              </Group>\n            )}\n          </Stack>\n        </Group>\n      </Card>\n\n      <Tabs value={activeTab}>\n        <Tabs.List>\n          <ActionButton\n            variant=\"subtle\"\n            href={detailsPath}\n            leftSection={<IconUser size={16} />}\n            c={activeTab === \"details\" ? undefined : \"dimmed\"}\n            fw={activeTab === \"details\" ? 500 : 400}\n            style={{\n              borderBottom:\n                activeTab === \"details\"\n                  ? \"2px solid var(--mantine-primary-color-filled)\"\n                  : \"2px solid transparent\",\n              borderRadius: 0,\n            }}\n          >\n            Details\n          </ActionButton>\n          <ActionButton\n            variant=\"subtle\"\n            href={sessionsPath}\n            leftSection={<IconDevices size={16} />}\n            c={activeTab === \"sessions\" ? undefined : \"dimmed\"}\n            fw={activeTab === \"sessions\" ? 500 : 400}\n            style={{\n              borderBottom:\n                activeTab === \"sessions\"\n                  ? \"2px solid var(--mantine-primary-color-filled)\"\n                  : \"2px solid transparent\",\n              borderRadius: 0,\n            }}\n          >\n            Sessions\n          </ActionButton>\n          <ActionButton\n            variant=\"subtle\"\n            href={settingsPath}\n            leftSection={<IconSettings size={16} />}\n            c={activeTab === \"settings\" ? undefined : \"dimmed\"}\n            fw={activeTab === \"settings\" ? 500 : 400}\n            style={{\n              borderBottom:\n                activeTab === \"settings\"\n                  ? \"2px solid var(--mantine-primary-color-filled)\"\n                  : \"2px solid transparent\",\n              borderRadius: 0,\n            }}\n          >\n            Settings\n          </ActionButton>\n        </Tabs.List>\n      </Tabs>\n\n      <Flex flex={1}>\n        <NestedView />\n      </Flex>\n    </Flex>\n  );\n};\n\nexport default AdminUserLayout;\n"],"mappings":"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"}

package/dist/admin/AdminUserSessions-A_5KkqTY.js

@@ -0,0 +1,3 @@
+import { t as AdminUserSessions_default } from "./AdminUserSessions-Bcf6-rjG.js";
+
+export { AdminUserSessions_default as default };