@alepha/ui 0.18.3 → 0.19.1

package/dist/demo/index.js

@@ -1,15 +1,14 @@
-import { t as AlephaUI } from "./core-DFgB3yU4.js";
+import { t as AlephaUI } from "./core-B4LVHzPn.js";
 import { $context, $module } from "alepha";
 import { IconBell, IconBinaryTree, IconBraces, IconClick, IconForms, IconHeading, IconHome, IconKey, IconLayout, IconLayoutSidebar, IconLetterT, IconLockQuestion, IconLogin, IconMailCheck, IconMessage, IconPackages, IconRowInsertBottom, IconTable, IconUserPlus, IconWall } from "@tabler/icons-react";
 import { $page } from "alepha/react/router";
-
 //#region ../../src/demo/DemoRouter.ts
 var DemoRouter = class {
 	demoLayout = $page({
 		icon: IconPackages,
 		path: "/demo",
 		label: "Demo",
-		lazy: () => import("./DemoLayout-CHU8WTwO.js"),
+		lazy: () => import("./DemoLayout-hh9VmZQP.js"),
 		children: () => [
 			this.demoHome,
 			this.demoCore,
@@ -24,7 +23,7 @@ var DemoRouter = class {
 		icon: IconHome,
 		path: "/",
 		label: "Home",
-		lazy: () => import("./DemoHome-D_De3UiT.js")
+		lazy: () => import("./DemoHome-Cyp29ygy.js")
 	});
 	demoCore = $page({
 		icon: IconWall,
@@ -41,25 +40,25 @@ var DemoRouter = class {
 		icon: IconRowInsertBottom,
 		path: "/flex",
 		label: "Flex",
-		lazy: () => import("./DemoFlex-a8OhMMvq.js")
+		lazy: () => import("./DemoFlex-OEwQt5do.js")
 	});
 	demoText = $page({
 		icon: IconLetterT,
 		path: "/text",
 		label: "Text",
-		lazy: () => import("./DemoText-ubcw-vog.js")
+		lazy: () => import("./DemoText-DYUJ7bY_.js")
 	});
 	demoHeading = $page({
 		icon: IconHeading,
 		path: "/heading",
-		label: "Heading",
-		lazy: () => import("./DemoHeading-C13OVDfS.js")
+		label: "Section",
+		lazy: () => import("./DemoHeading-Db-XkQIK.js")
 	});
 	demoButton = $page({
 		icon: IconClick,
 		path: "/button",
 		label: "Button",
-		lazy: () => import("./DemoButton-wiCxZZ_L.js")
+		lazy: () => import("./DemoButton-wzcqGk4u.js")
 	});
 	demoLayoutSection = $page({
 		icon: IconLayout,
@@ -75,19 +74,19 @@ var DemoRouter = class {
 		icon: IconLayoutSidebar,
 		path: "/sidebar",
 		label: "Sidebar",
-		lazy: () => import("./DemoSidebar-Giy2HRBD.js")
+		lazy: () => import("./DemoSidebar-CGu7DZeM.js")
 	});
 	demoDialog = $page({
 		icon: IconMessage,
 		path: "/dialog",
 		label: "Dialog",
-		lazy: () => import("./DemoDialog-CUWdLHim.js")
+		lazy: () => import("./DemoDialog-Co2IePxX.js")
 	});
 	demoToast = $page({
 		icon: IconBell,
 		path: "/toast",
 		label: "Toast",
-		lazy: () => import("./DemoToast-9die_dYT.js")
+		lazy: () => import("./DemoToast-CgdnZNvx.js")
 	});
 	demoForm = $page({
 		icon: IconForms,
@@ -99,13 +98,13 @@ var DemoRouter = class {
 		icon: IconForms,
 		path: "/type-form",
 		label: "TypeForm",
-		lazy: () => import("./DemoTypeForm-D_d6OVKL.js")
+		lazy: () => import("./DemoTypeForm-Pims-cGa.js")
 	});
 	demoControlSelect = $page({
 		icon: IconForms,
 		path: "/control-select",
 		label: "ControlSelect",
-		lazy: () => import("./DemoControlSelect-D7ILObVg.js")
+		lazy: () => import("./DemoControlSelect-CMWvQ6Gm.js")
 	});
 	demoTable = $page({
 		icon: IconTable,
@@ -117,7 +116,7 @@ var DemoRouter = class {
 		icon: IconTable,
 		path: "/data-table",
 		label: "DataTable",
-		lazy: () => import("./DemoDataTable-DZ5Y8pFX.js")
+		lazy: () => import("./DemoDataTable-CHsAP3e2.js")
 	});
 	demoJson = $page({
 		icon: IconBraces,
@@ -129,7 +128,7 @@ var DemoRouter = class {
 		icon: IconBinaryTree,
 		path: "/viewer",
 		label: "JsonViewer",
-		lazy: () => import("./DemoJsonViewer-B50s9aGM.js")
+		lazy: () => import("./DemoJsonViewer-DXtCeMzH.js")
 	});
 	demoAuth = $page({
 		icon: IconKey,
@@ -146,28 +145,27 @@ var DemoRouter = class {
 		icon: IconLogin,
 		path: "/login",
 		label: "Login",
-		lazy: () => import("./DemoLogin-BBlrWpml.js")
+		lazy: () => import("./DemoLogin-DX7mnmkh.js")
 	});
 	demoRegister = $page({
 		icon: IconUserPlus,
 		path: "/register",
 		label: "Register",
-		lazy: () => import("./DemoRegister-BuNE3_-f.js")
+		lazy: () => import("./DemoRegister-DVcZl04m.js")
 	});
 	demoResetPassword = $page({
 		icon: IconLockQuestion,
 		path: "/reset-password",
 		label: "ResetPassword",
-		lazy: () => import("./DemoResetPassword-D_IjjjOJ.js")
+		lazy: () => import("./DemoResetPassword-CPENlZH5.js")
 	});
 	demoVerifyEmail = $page({
 		icon: IconMailCheck,
 		path: "/verify-email",
 		label: "VerifyEmail",
-		lazy: () => import("./DemoVerifyEmail-B43KlF4F.js")
+		lazy: () => import("./DemoVerifyEmail-C7B3xxch.js")
 	});
 };
-
 //#endregion
 //#region ../../src/demo/primitives/$uiDemo.ts
 /**
@@ -177,7 +175,6 @@ const $uiDemo = () => {
 	const { alepha } = $context();
 	return alepha.inject(DemoRouter);
 };
-
 //#endregion
 //#region ../../src/demo/index.ts
 /**
@@ -195,7 +192,7 @@ const AlephaUIDemo = $module({
 	name: "alepha.ui.demo",
 	services: [AlephaUI, DemoRouter]
 });
-
 //#endregion
 export { $uiDemo, AlephaUIDemo, DemoRouter };
+
 //# sourceMappingURL=index.js.map

package/dist/demo/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/demo/DemoRouter.ts","../../src/demo/primitives/$uiDemo.ts","../../src/demo/index.ts"],"sourcesContent":["import {\n  IconBell,\n  IconBinaryTree,\n  IconBraces,\n  IconClick,\n  IconForms,\n  IconHeading,\n  IconHome,\n  IconKey,\n  IconLayout,\n  IconLayoutSidebar,\n  IconLetterT,\n  IconLockQuestion,\n  IconLogin,\n  IconMailCheck,\n  IconMessage,\n  IconPackages,\n  IconRowInsertBottom,\n  IconTable,\n  IconUserPlus,\n  IconWall,\n} from \"@tabler/icons-react\";\nimport { $page } from \"alepha/react/router\";\n\nexport class DemoRouter {\n  demoLayout = $page({\n    icon: IconPackages,\n    path: \"/demo\",\n    label: \"Demo\",\n    lazy: () => import(\"./components/DemoLayout.tsx\"),\n    children: () => [\n      this.demoHome,\n      this.demoCore,\n      this.demoLayoutSection,\n      this.demoForm,\n      this.demoTable,\n      this.demoJson,\n      this.demoAuth,\n    ],\n  });\n\n  demoHome = $page({\n    icon: IconHome,\n    path: \"/\",\n    label: \"Home\",\n    lazy: () => import(\"./components/DemoHome.tsx\"),\n  });\n\n  // Core Components\n  demoCore = $page({\n    icon: IconWall,\n    path: \"/core\",\n    label: \"Core\",\n    children: () => [\n      this.demoFlex,\n      this.demoText,\n      this.demoButton,\n      this.demoHeading,\n    ],\n  });\n\n  demoFlex = $page({\n    icon: IconRowInsertBottom,\n    path: \"/flex\",\n    label: \"Flex\",\n    lazy: () => import(\"./components/core/DemoFlex.tsx\"),\n  });\n\n  demoText = $page({\n    icon: IconLetterT,\n    path: \"/text\",\n    label: \"Text\",\n    lazy: () => import(\"./components/core/DemoText.tsx\"),\n  });\n\n  demoHeading = $page({\n    icon: IconHeading,\n    path: \"/heading\",\n    label: \"Heading\",\n    lazy: () => import(\"./components/core/DemoHeading.tsx\"),\n  });\n\n  demoButton = $page({\n    icon: IconClick,\n    path: \"/button\",\n    label: \"Button\",\n    lazy: () => import(\"./components/core/DemoButton.tsx\"),\n  });\n\n  // Layout Components\n  demoLayoutSection = $page({\n    icon: IconLayout,\n    path: \"/layout\",\n    label: \"Layout\",\n    children: () => [this.demoSidebar, this.demoDialog, this.demoToast],\n  });\n\n  demoSidebar = $page({\n    icon: IconLayoutSidebar,\n    path: \"/sidebar\",\n    label: \"Sidebar\",\n    lazy: () => import(\"./components/layout/DemoSidebar.tsx\"),\n  });\n\n  demoDialog = $page({\n    icon: IconMessage,\n    path: \"/dialog\",\n    label: \"Dialog\",\n    lazy: () => import(\"./components/layout/DemoDialog.tsx\"),\n  });\n\n  demoToast = $page({\n    icon: IconBell,\n    path: \"/toast\",\n    label: \"Toast\",\n    lazy: () => import(\"./components/layout/DemoToast.tsx\"),\n  });\n\n  // Form Components\n  demoForm = $page({\n    icon: IconForms,\n    path: \"/form\",\n    label: \"Form\",\n    children: () => [this.demoTypeForm, this.demoControlSelect],\n  });\n\n  demoTypeForm = $page({\n    icon: IconForms,\n    path: \"/type-form\",\n    label: \"TypeForm\",\n    lazy: () => import(\"./components/core/DemoTypeForm.tsx\"),\n  });\n\n  demoControlSelect = $page({\n    icon: IconForms,\n    path: \"/control-select\",\n    label: \"ControlSelect\",\n    lazy: () => import(\"./components/core/DemoControlSelect.tsx\"),\n  });\n\n  // Table Components\n  demoTable = $page({\n    icon: IconTable,\n    path: \"/table\",\n    label: \"Table\",\n    children: () => [this.demoDataTable],\n  });\n\n  demoDataTable = $page({\n    icon: IconTable,\n    path: \"/data-table\",\n    label: \"DataTable\",\n    lazy: () => import(\"./components/core/DemoDataTable.tsx\"),\n  });\n\n  // JSON Components\n  demoJson = $page({\n    icon: IconBraces,\n    path: \"/json\",\n    label: \"Json\",\n    children: () => [this.demoJsonViewer],\n  });\n\n  demoJsonViewer = $page({\n    icon: IconBinaryTree,\n    path: \"/viewer\",\n    label: \"JsonViewer\",\n    lazy: () => import(\"./components/json/DemoJsonViewer.tsx\"),\n  });\n\n  // Auth Components\n  demoAuth = $page({\n    icon: IconKey,\n    path: \"/auth\",\n    label: \"Auth\",\n    children: () => [\n      this.demoLogin,\n      this.demoRegister,\n      this.demoResetPassword,\n      this.demoVerifyEmail,\n    ],\n  });\n\n  demoLogin = $page({\n    icon: IconLogin,\n    path: \"/login\",\n    label: \"Login\",\n    lazy: () => import(\"./components/auth/DemoLogin.tsx\"),\n  });\n\n  demoRegister = $page({\n    icon: IconUserPlus,\n    path: \"/register\",\n    label: \"Register\",\n    lazy: () => import(\"./components/auth/DemoRegister.tsx\"),\n  });\n\n  demoResetPassword = $page({\n    icon: IconLockQuestion,\n    path: \"/reset-password\",\n    label: \"ResetPassword\",\n    lazy: () => import(\"./components/auth/DemoResetPassword.tsx\"),\n  });\n\n  demoVerifyEmail = $page({\n    icon: IconMailCheck,\n    path: \"/verify-email\",\n    label: \"VerifyEmail\",\n    lazy: () => import(\"./components/auth/DemoVerifyEmail.tsx\"),\n  });\n}\n","import { $context } from \"alepha\";\nimport { DemoRouter } from \"../DemoRouter.ts\";\n\n/**\n * Register Demo UI components and get the DemoRouter instance.\n */\nexport const $uiDemo = () => {\n  const { alepha } = $context();\n  return alepha.inject(DemoRouter);\n};\n","import { AlephaUI } from \"@alepha/ui\";\nimport { $module } from \"alepha\";\nimport { DemoRouter } from \"./DemoRouter.ts\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\nexport { DemoRouter } from \"./DemoRouter.ts\";\nexport * from \"./primitives/$uiDemo.ts\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\n/**\n * Component showcase and documentation.\n *\n * **Features:**\n * - DemoLayout for demo pages\n * - DemoHome landing page\n * - MacWindow component for showcases\n * - Showcase component for component demos\n *\n * @module alepha.ui.demo\n */\nexport const AlephaUIDemo = $module({\n  name: \"alepha.ui.demo\",\n  services: [AlephaUI, DemoRouter],\n});\n"],"mappings":";;;;;;AAwBA,IAAa,aAAb,MAAwB;CACtB,aAAa,MAAM;EACjB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACnB,gBAAgB;GACd,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACN;EACF,CAAC;CAEF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAGF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,gBAAgB;GACd,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACN;EACF,CAAC;CAEF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,cAAc,MAAM;EAClB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,aAAa,MAAM;EACjB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAGF,oBAAoB,MAAM;EACxB,MAAM;EACN,MAAM;EACN,OAAO;EACP,gBAAgB;GAAC,KAAK;GAAa,KAAK;GAAY,KAAK;GAAU;EACpE,CAAC;CAEF,cAAc,MAAM;EAClB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,aAAa,MAAM;EACjB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,YAAY,MAAM;EAChB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAGF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,gBAAgB,CAAC,KAAK,cAAc,KAAK,kBAAkB;EAC5D,CAAC;CAEF,eAAe,MAAM;EACnB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,oBAAoB,MAAM;EACxB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAGF,YAAY,MAAM;EAChB,MAAM;EACN,MAAM;EACN,OAAO;EACP,gBAAgB,CAAC,KAAK,cAAc;EACrC,CAAC;CAEF,gBAAgB,MAAM;EACpB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAGF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,gBAAgB,CAAC,KAAK,eAAe;EACtC,CAAC;CAEF,iBAAiB,MAAM;EACrB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAGF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,gBAAgB;GACd,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACN;EACF,CAAC;CAEF,YAAY,MAAM;EAChB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,eAAe,MAAM;EACnB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,oBAAoB,MAAM;EACxB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,kBAAkB,MAAM;EACtB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;;;;;;;;AC3MJ,MAAa,gBAAgB;CAC3B,MAAM,EAAE,WAAW,UAAU;AAC7B,QAAO,OAAO,OAAO,WAAW;;;;;;;;;;;;;;;;ACclC,MAAa,eAAe,QAAQ;CAClC,MAAM;CACN,UAAU,CAAC,UAAU,WAAW;CACjC,CAAC"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/demo/DemoRouter.ts","../../src/demo/primitives/$uiDemo.ts","../../src/demo/index.ts"],"sourcesContent":["import {\n  IconBell,\n  IconBinaryTree,\n  IconBraces,\n  IconClick,\n  IconForms,\n  IconHeading,\n  IconHome,\n  IconKey,\n  IconLayout,\n  IconLayoutSidebar,\n  IconLetterT,\n  IconLockQuestion,\n  IconLogin,\n  IconMailCheck,\n  IconMessage,\n  IconPackages,\n  IconRowInsertBottom,\n  IconTable,\n  IconUserPlus,\n  IconWall,\n} from \"@tabler/icons-react\";\nimport { $page } from \"alepha/react/router\";\n\nexport class DemoRouter {\n  demoLayout = $page({\n    icon: IconPackages,\n    path: \"/demo\",\n    label: \"Demo\",\n    lazy: () => import(\"./components/DemoLayout.tsx\"),\n    children: () => [\n      this.demoHome,\n      this.demoCore,\n      this.demoLayoutSection,\n      this.demoForm,\n      this.demoTable,\n      this.demoJson,\n      this.demoAuth,\n    ],\n  });\n\n  demoHome = $page({\n    icon: IconHome,\n    path: \"/\",\n    label: \"Home\",\n    lazy: () => import(\"./components/DemoHome.tsx\"),\n  });\n\n  // Core Components\n  demoCore = $page({\n    icon: IconWall,\n    path: \"/core\",\n    label: \"Core\",\n    children: () => [\n      this.demoFlex,\n      this.demoText,\n      this.demoButton,\n      this.demoHeading,\n    ],\n  });\n\n  demoFlex = $page({\n    icon: IconRowInsertBottom,\n    path: \"/flex\",\n    label: \"Flex\",\n    lazy: () => import(\"./components/core/DemoFlex.tsx\"),\n  });\n\n  demoText = $page({\n    icon: IconLetterT,\n    path: \"/text\",\n    label: \"Text\",\n    lazy: () => import(\"./components/core/DemoText.tsx\"),\n  });\n\n  demoHeading = $page({\n    icon: IconHeading,\n    path: \"/heading\",\n    label: \"Section\",\n    lazy: () => import(\"./components/core/DemoHeading.tsx\"),\n  });\n\n  demoButton = $page({\n    icon: IconClick,\n    path: \"/button\",\n    label: \"Button\",\n    lazy: () => import(\"./components/core/DemoButton.tsx\"),\n  });\n\n  // Layout Components\n  demoLayoutSection = $page({\n    icon: IconLayout,\n    path: \"/layout\",\n    label: \"Layout\",\n    children: () => [this.demoSidebar, this.demoDialog, this.demoToast],\n  });\n\n  demoSidebar = $page({\n    icon: IconLayoutSidebar,\n    path: \"/sidebar\",\n    label: \"Sidebar\",\n    lazy: () => import(\"./components/layout/DemoSidebar.tsx\"),\n  });\n\n  demoDialog = $page({\n    icon: IconMessage,\n    path: \"/dialog\",\n    label: \"Dialog\",\n    lazy: () => import(\"./components/layout/DemoDialog.tsx\"),\n  });\n\n  demoToast = $page({\n    icon: IconBell,\n    path: \"/toast\",\n    label: \"Toast\",\n    lazy: () => import(\"./components/layout/DemoToast.tsx\"),\n  });\n\n  // Form Components\n  demoForm = $page({\n    icon: IconForms,\n    path: \"/form\",\n    label: \"Form\",\n    children: () => [this.demoTypeForm, this.demoControlSelect],\n  });\n\n  demoTypeForm = $page({\n    icon: IconForms,\n    path: \"/type-form\",\n    label: \"TypeForm\",\n    lazy: () => import(\"./components/core/DemoTypeForm.tsx\"),\n  });\n\n  demoControlSelect = $page({\n    icon: IconForms,\n    path: \"/control-select\",\n    label: \"ControlSelect\",\n    lazy: () => import(\"./components/core/DemoControlSelect.tsx\"),\n  });\n\n  // Table Components\n  demoTable = $page({\n    icon: IconTable,\n    path: \"/table\",\n    label: \"Table\",\n    children: () => [this.demoDataTable],\n  });\n\n  demoDataTable = $page({\n    icon: IconTable,\n    path: \"/data-table\",\n    label: \"DataTable\",\n    lazy: () => import(\"./components/core/DemoDataTable.tsx\"),\n  });\n\n  // JSON Components\n  demoJson = $page({\n    icon: IconBraces,\n    path: \"/json\",\n    label: \"Json\",\n    children: () => [this.demoJsonViewer],\n  });\n\n  demoJsonViewer = $page({\n    icon: IconBinaryTree,\n    path: \"/viewer\",\n    label: \"JsonViewer\",\n    lazy: () => import(\"./components/json/DemoJsonViewer.tsx\"),\n  });\n\n  // Auth Components\n  demoAuth = $page({\n    icon: IconKey,\n    path: \"/auth\",\n    label: \"Auth\",\n    children: () => [\n      this.demoLogin,\n      this.demoRegister,\n      this.demoResetPassword,\n      this.demoVerifyEmail,\n    ],\n  });\n\n  demoLogin = $page({\n    icon: IconLogin,\n    path: \"/login\",\n    label: \"Login\",\n    lazy: () => import(\"./components/auth/DemoLogin.tsx\"),\n  });\n\n  demoRegister = $page({\n    icon: IconUserPlus,\n    path: \"/register\",\n    label: \"Register\",\n    lazy: () => import(\"./components/auth/DemoRegister.tsx\"),\n  });\n\n  demoResetPassword = $page({\n    icon: IconLockQuestion,\n    path: \"/reset-password\",\n    label: \"ResetPassword\",\n    lazy: () => import(\"./components/auth/DemoResetPassword.tsx\"),\n  });\n\n  demoVerifyEmail = $page({\n    icon: IconMailCheck,\n    path: \"/verify-email\",\n    label: \"VerifyEmail\",\n    lazy: () => import(\"./components/auth/DemoVerifyEmail.tsx\"),\n  });\n}\n","import { $context } from \"alepha\";\nimport { DemoRouter } from \"../DemoRouter.ts\";\n\n/**\n * Register Demo UI components and get the DemoRouter instance.\n */\nexport const $uiDemo = () => {\n  const { alepha } = $context();\n  return alepha.inject(DemoRouter);\n};\n","import { AlephaUI } from \"@alepha/ui\";\nimport { $module } from \"alepha\";\nimport { DemoRouter } from \"./DemoRouter.ts\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\nexport { DemoRouter } from \"./DemoRouter.ts\";\nexport * from \"./primitives/$uiDemo.ts\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\n/**\n * Component showcase and documentation.\n *\n * **Features:**\n * - DemoLayout for demo pages\n * - DemoHome landing page\n * - MacWindow component for showcases\n * - Showcase component for component demos\n *\n * @module alepha.ui.demo\n */\nexport const AlephaUIDemo = $module({\n  name: \"alepha.ui.demo\",\n  services: [AlephaUI, DemoRouter],\n});\n"],"mappings":";;;;;AAwBA,IAAa,aAAb,MAAwB;CACtB,aAAa,MAAM;EACjB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACnB,gBAAgB;GACd,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACN;EACF,CAAC;CAEF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAGF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,gBAAgB;GACd,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACN;EACF,CAAC;CAEF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,cAAc,MAAM;EAClB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,aAAa,MAAM;EACjB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAGF,oBAAoB,MAAM;EACxB,MAAM;EACN,MAAM;EACN,OAAO;EACP,gBAAgB;GAAC,KAAK;GAAa,KAAK;GAAY,KAAK;GAAU;EACpE,CAAC;CAEF,cAAc,MAAM;EAClB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,aAAa,MAAM;EACjB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,YAAY,MAAM;EAChB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAGF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,gBAAgB,CAAC,KAAK,cAAc,KAAK,kBAAkB;EAC5D,CAAC;CAEF,eAAe,MAAM;EACnB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,oBAAoB,MAAM;EACxB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAGF,YAAY,MAAM;EAChB,MAAM;EACN,MAAM;EACN,OAAO;EACP,gBAAgB,CAAC,KAAK,cAAc;EACrC,CAAC;CAEF,gBAAgB,MAAM;EACpB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAGF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,gBAAgB,CAAC,KAAK,eAAe;EACtC,CAAC;CAEF,iBAAiB,MAAM;EACrB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAGF,WAAW,MAAM;EACf,MAAM;EACN,MAAM;EACN,OAAO;EACP,gBAAgB;GACd,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACN;EACF,CAAC;CAEF,YAAY,MAAM;EAChB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,eAAe,MAAM;EACnB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,oBAAoB,MAAM;EACxB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;CAEF,kBAAkB,MAAM;EACtB,MAAM;EACN,MAAM;EACN,OAAO;EACP,YAAY,OAAO;EACpB,CAAC;;;;;;;AC3MJ,MAAa,gBAAgB;CAC3B,MAAM,EAAE,WAAW,UAAU;AAC7B,QAAO,OAAO,OAAO,WAAW;;;;;;;;;;;;;;;ACclC,MAAa,eAAe,QAAQ;CAClC,MAAM;CACN,UAAU,CAAC,UAAU,WAAW;CACjC,CAAC"}

package/dist/demo/rolldown-runtime-CiIaOW0V.js

@@ -0,0 +1,13 @@
+//#region \0rolldown/runtime.js
+var __defProp = Object.defineProperty;
+var __exportAll = (all, no_symbols) => {
+	let target = {};
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
+	if (!no_symbols) __defProp(target, Symbol.toStringTag, { value: "Module" });
+	return target;
+};
+//#endregion
+export { __exportAll as t };

package/package.json

@@ -7,7 +7,7 @@
     "mantine"
   ],
   "author": "Nicolas Foures",
-  "version": "0.18.3",
+  "version": "0.19.1",
   "type": "module",
   "engines": {
     "node": ">=22.0.0"
@@ -22,33 +22,30 @@
     "styles.css"
   ],
   "dependencies": {
-    "@mantine/charts": "^8.3.15",
-    "@mantine/core": "^8.3.15",
-    "@mantine/dates": "^8.3.15",
-    "@mantine/hooks": "^8.3.15",
-    "@mantine/modals": "^8.3.15",
-    "@mantine/notifications": "^8.3.15",
-    "@mantine/nprogress": "^8.3.15",
-    "@mantine/spotlight": "^8.3.15",
-    "@tabler/icons-react": "^3.38.0",
-    "dayjs": "^1.11.19",
-    "react-is": "^19.2.4",
-    "recharts": "^3.7.0"
+    "@mantine/core": "^8.3.18",
+    "@mantine/dates": "^8.3.18",
+    "@mantine/hooks": "^8.3.18",
+    "@mantine/modals": "^8.3.18",
+    "@mantine/notifications": "^8.3.18",
+    "@mantine/nprogress": "^8.3.18",
+    "@mantine/spotlight": "^8.3.18",
+    "@tabler/icons-react": "^3.40.0",
+    "dayjs": "^1.11.20"
   },
   "devDependencies": {
-    "@biomejs/biome": "^2.4.5",
+    "@biomejs/biome": "^2.4.8",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/react": "^16.3.2",
     "@types/react-is": "^19.2.0",
-    "alepha": "0.18.3",
+    "alepha": "0.19.1",
     "react": "^19.2.4",
     "react-dom": "^19.2.4",
     "typescript": "^5.9.3",
-    "vite": "^7.3.1",
-    "vitest": "^4.0.18"
+    "vite": "^8.0.0",
+    "vitest": "^4.1.0"
   },
   "peerDependencies": {
-    "alepha": "0.18.3",
+    "alepha": "0.19.1",
     "react": "*",
     "react-dom": "*"
   },
@@ -57,8 +54,8 @@
     "lint": "alepha lint && yarn build:check",
     "typecheck": "alepha typecheck",
     "test": "alepha test",
-    "build": "node ../alepha/scripts/build.ts",
-    "build:check": "node ../alepha/scripts/build.ts --check"
+    "build": "node ../../alepha/scripts/build.ts",
+    "build:check": "node ../../alepha/scripts/build.ts --check"
   },
   "repository": {
     "type": "git",

package/src/admin/AdminRouter.tsx

@@ -10,21 +10,18 @@ import {
 import { AuthRouter, UserButton } from "@alepha/ui/auth";
 import {
   IconBell,
-  IconClock,
-  IconDashboard,
   IconDevices,
   IconFile,
   IconHistory,
   IconKey,
   IconLayoutDashboard,
-  IconListDetails,
   IconLockPassword,
   IconSettings,
   IconTerminal2,
   IconUser,
   IconUsers,
 } from "@tabler/icons-react";
-import { $inject } from "alepha";
+import { $inject, t } from "alepha";
 import type { AdminAuditController } from "alepha/api/audits";
 import type { FileController } from "alepha/api/files";
 import type { AdminJobController } from "alepha/api/jobs";
@@ -37,6 +34,7 @@ import type {
 } from "alepha/api/users";
 import { ReactAuth } from "alepha/react/auth";
 import { $page, ReactRouter, Redirection } from "alepha/react/router";
+import { $secure } from "alepha/security";
 import { $cookie } from "alepha/server/cookies";
 import { $client } from "alepha/server/links";
 
@@ -150,16 +148,7 @@ export class AdminRouter {
             can: () => this.fileCtrl.findFiles.can(),
           },
           {
-            label: "Jobs",
-            icon: IconTerminal2,
-            children: [
-              {
-                ...this.router.node(this.adminJobDashboard.name),
-                label: "Dashboard",
-              },
-              { ...this.router.node(this.adminJobRegistry.name) },
-              { ...this.router.node(this.adminJobExecutions.name) },
-            ],
+            ...this.router.node(this.adminJobs.name),
           },
           {
             ...this.router.node(this.adminNotifications.name),
@@ -202,6 +191,11 @@ export class AdminRouter {
       title: "Admin Panel",
       titleSeparator: " | ",
     },
+    use: [
+      $secure({
+        permissions: ["admin:access"],
+      }),
+    ],
     lazy: () => import("./components/AdminLayout.tsx"),
     props: () => ({
       adminShellProps: this.adminShellProps(),
@@ -249,7 +243,18 @@ export class AdminRouter {
     head: {
       title: "Users",
     },
+    schema: {
+      params: t.object({
+        userId: t.text(),
+      }),
+    },
     lazy: () => import("./components/users/AdminUserLayout.tsx"),
+    loader: async ({ params }) => {
+      const user = await this.userCtrl.getUser({
+        params: { id: params.userId },
+      });
+      return { user };
+    },
   });
 
   public readonly adminUserProfile = $page({
@@ -350,36 +355,16 @@ export class AdminRouter {
   // Jobs
   // ─────────────────────────────────────────────────────────────────────────────
 
-  public readonly adminJobDashboard = $page({
-    icon: IconDashboard,
+  public readonly adminJobs = $page({
+    icon: IconTerminal2,
     parent: this.adminLayout,
     path: "/jobs",
     label: "Jobs",
-    description: "Monitor and manage background jobs and scheduled tasks.",
-    lazy: () => import("./components/jobs/AdminJobDashboard.tsx"),
+    description: "Monitor and manage background jobs.",
+    lazy: () => import("./components/jobs/AdminJobs.tsx"),
     can: () => this.jobCtrl.getJobRegistry.can(),
   });
 
-  public readonly adminJobRegistry = $page({
-    icon: IconListDetails,
-    parent: this.adminLayout,
-    path: "/jobs/registry",
-    label: "Registry",
-    description: "View all registered job definitions.",
-    lazy: () => import("./components/jobs/AdminJobRegistry.tsx"),
-    can: () => this.jobCtrl.getJobRegistry.can(),
-  });
-
-  public readonly adminJobExecutions = $page({
-    icon: IconClock,
-    parent: this.adminLayout,
-    path: "/jobs/executions",
-    label: "Executions",
-    description: "Browse and filter job execution history.",
-    lazy: () => import("./components/jobs/AdminJobExecutions.tsx"),
-    can: () => this.jobCtrl.findJobExecutions.can(),
-  });
-
   // ─────────────────────────────────────────────────────────────────────────────
   // API Keys
   // ─────────────────────────────────────────────────────────────────────────────

package/src/admin/atoms/adminUserAtom.ts

@@ -0,0 +1,7 @@
+import { $atom, t } from "alepha";
+import { users } from "alepha/api/users";
+
+export const adminUserAtom = $atom({
+  name: "alepha.admin.user",
+  schema: t.optional(users.schema),
+});

package/src/admin/components/AdminLayout.tsx

@@ -4,10 +4,9 @@ import {
   DashboardShell,
   type DashboardShellProps,
   SidebarCollapseButton,
-  Text,
   ui,
 } from "@alepha/ui";
-import { Flex, Image } from "@mantine/core";
+import { Flex } from "@mantine/core";
 import { IconArrowLeft } from "@tabler/icons-react";
 
 export interface AdminLayoutProps {
@@ -31,7 +30,7 @@ const AdminLayout = (props: AdminLayoutProps) => {
     >
       <DashboardShell
         layout={"alt"}
-        navbarHeader={(props) => (
+        navbarHeader={() => (
           <Flex gap={"md"} flex={1} px={"lg"} align={"center"}>
             <ActionButton
               href={"/"}
@@ -39,17 +38,6 @@ const AdminLayout = (props: AdminLayoutProps) => {
               bd={0}
               icon={IconArrowLeft}
             />
-            {!props.collapsed && (
-              <>
-                <Image pt={4} src={"/favicon.svg"} h={36} w={36} />
-                <Flex direction={"column"}>
-                  <Text bold>Blog</Text>
-                  <Text small muted mt={-4}>
-                    Admin Panel
-                  </Text>
-                </Flex>
-              </>
-            )}
           </Flex>
         )}
         footerHeight={48}

package/src/admin/components/files/AdminFiles.tsx

@@ -1,4 +1,18 @@
-import { DataTable, Flex, Text } from "@alepha/ui";
+import { DataTable, Flex, Text, useDialog, useToast } from "@alepha/ui";
+import { HoverCard } from "@mantine/core";
+import {
+  IconDownload,
+  IconFile,
+  IconFileCode,
+  IconFileMusic,
+  IconFileSpreadsheet,
+  IconFileText,
+  IconFileZip,
+  IconPdf,
+  IconPhoto,
+  IconTrash,
+  IconVideo,
+} from "@tabler/icons-react";
 import { type Page, t } from "alepha";
 import { type FileController, type FileEntity, files } from "alepha/api/files";
 import { useClient } from "alepha/react";
@@ -7,6 +21,8 @@ import { useI18n } from "alepha/react/i18n";
 const AdminFiles = () => {
   const client = useClient<FileController>();
   const { l } = useI18n();
+  const dialog = useDialog();
+  const toast = useToast();
 
   const filters = t.object({
     bucket: t.optional(t.string()),
@@ -19,6 +35,34 @@ const AdminFiles = () => {
     ),
   });
 
+  const isImage = (mime: string) => mime.startsWith("image/");
+
+  const getFileIcon = (mime: string) => {
+    if (isImage(mime)) return IconPhoto;
+    if (mime === "application/pdf") return IconPdf;
+    if (mime.startsWith("video/")) return IconVideo;
+    if (mime.startsWith("audio/")) return IconFileMusic;
+    if (mime.startsWith("text/csv") || mime.includes("spreadsheet"))
+      return IconFileSpreadsheet;
+    if (
+      mime.includes("zip") ||
+      mime.includes("tar") ||
+      mime.includes("gzip") ||
+      mime.includes("compress")
+    )
+      return IconFileZip;
+    if (
+      mime.includes("javascript") ||
+      mime.includes("json") ||
+      mime.includes("xml") ||
+      mime.includes("html") ||
+      mime.includes("css")
+    )
+      return IconFileCode;
+    if (mime.startsWith("text/")) return IconFileText;
+    return IconFile;
+  };
+
   const formatFileSize = (bytes: number) => {
     if (bytes === 0) return "0 B";
     const k = 1024;
@@ -54,6 +98,53 @@ const AdminFiles = () => {
           return response as Page<FileEntity>;
         }}
         columns={{
+          preview: {
+            label: "",
+            fit: true,
+            value: (item) => {
+              const Icon = getFileIcon(item.mimeType);
+              const url = `/api/files/${item.id}`;
+
+              if (isImage(item.mimeType)) {
+                return (
+                  <HoverCard
+                    width={512}
+                    position="right"
+                    shadow="lg"
+                    openDelay={200}
+                  >
+                    <HoverCard.Target>
+                      <img
+                        src={url}
+                        alt={item.name}
+                        style={{
+                          width: 32,
+                          height: 32,
+                          objectFit: "cover",
+                          borderRadius: 4,
+                          display: "block",
+                        }}
+                      />
+                    </HoverCard.Target>
+                    <HoverCard.Dropdown p={4}>
+                      <img
+                        src={url}
+                        alt={item.name}
+                        style={{
+                          width: 512,
+                          height: 512,
+                          objectFit: "contain",
+                          display: "block",
+                        }}
+                      />
+                    </HoverCard.Dropdown>
+                  </HoverCard>
+                );
+              }
+
+              return <Icon size={20} color="var(--mantine-color-dimmed)" />;
+            },
+          },
           name: {
             label: "Name",
             value: (item) => (
@@ -103,6 +194,37 @@ const AdminFiles = () => {
             ),
           },
         }}
+        rowActions={(item) => [
+          {
+            label: "Download",
+            icon: IconDownload,
+            skipRefresh: true,
+            onClick: () => {
+              window.open(`/api/files/${item.id}`, "_blank");
+            },
+          },
+        ]}
+        checkboxActions={[
+          {
+            label: "Delete selected",
+            icon: <IconTrash size={14} />,
+            intent: "danger",
+            onClick: async ({ selectedItems, clearSelection }) => {
+              const confirmed = await dialog.confirm({
+                title: "Delete files",
+                message: `Permanently delete ${selectedItems.length} file(s)? This action cannot be undone.`,
+              });
+              if (!confirmed) return;
+              for (const file of selectedItems) {
+                await client.deleteFile({ params: { id: file.id } });
+              }
+              toast.success({
+                message: `${selectedItems.length} file(s) deleted`,
+              });
+              clearSelection();
+            },
+          },
+        ]}
       />
     </Flex>
   );