alepha 0.13.0 → 0.13.2

package/src/api-notifications/services/NotificationSenderService.ts

@@ -3,12 +3,12 @@ import { DateTimeProvider } from "alepha/datetime";
 import { EmailProvider } from "alepha/email";
 import { $logger } from "alepha/logger";
 import { $repository } from "alepha/orm";
-import { $notification } from "../descriptors/$notification.ts";
+import { SmsProvider } from "alepha/sms";
 import {
   type NotificationEntity,
   notifications,
 } from "../entities/notifications.ts";
-import { SmsProvider } from "../providers/SmsProvider.ts";
+import { $notification } from "../primitives/$notification.ts";
 
 export class NotificationSenderService {
   protected readonly alepha = $inject(Alepha);
@@ -161,7 +161,7 @@ export class NotificationSenderService {
     const variables = notification.variables || {};
     const contact = notification.contact;
     const template = this.alepha
-      .descriptors($notification)
+      .primitives($notification)
       .find((it) => it.name === notification.template);
 
     if (!template) {

package/src/api-parameters/index.ts

@@ -2,8 +2,8 @@ import { $module } from "alepha";
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export * from "./descriptors/$config.ts";
 export * from "./entities/parameters.ts";
+export * from "./primitives/$config.ts";
 
 // ---------------------------------------------------------------------------------------------------------------------
 

package/src/api-parameters/{descriptors → primitives}/$config.ts

@@ -1,13 +1,8 @@
-import {
-  createDescriptor,
-  Descriptor,
-  type Static,
-  type TObject,
-} from "alepha";
+import { createPrimitive, Primitive, type Static, type TObject } from "alepha";
 import type { UserAccount } from "alepha/security";
 
 /**
- * Creates a configuration parameter descriptor for managing application settings.
+ * Creates a configuration parameter primitive for managing application settings.
  *
  * Provides type-safe, versioned configuration with schema validation, default values,
  * and scheduled activation. Useful for feature flags, system parameters, and runtime settings.
@@ -33,15 +28,15 @@ import type { UserAccount } from "alepha/security";
  * }
  * ```
  */
-export interface ConfigDescriptorOptions<T extends TObject> {
+export interface ConfigPrimitiveOptions<T extends TObject> {
   name?: string;
   description?: string;
   schema: T;
   default: Static<T>;
 }
 
-export class ConfigDescriptor<T extends TObject> extends Descriptor<
-  ConfigDescriptorOptions<T>
+export class ConfigPrimitive<T extends TObject> extends Primitive<
+  ConfigPrimitiveOptions<T>
 > {
   public get name() {
     return this.options.name || this.config.propertyKey;
@@ -78,7 +73,7 @@ export class ConfigDescriptor<T extends TObject> extends Descriptor<
 }
 
 export const $config = <T extends TObject>(
-  options: ConfigDescriptorOptions<T>,
+  options: ConfigPrimitiveOptions<T>,
 ) => {
-  return createDescriptor(ConfigDescriptor<T>, options);
+  return createPrimitive(ConfigPrimitive<T>, options);
 };

package/src/api-users/index.ts

@@ -21,10 +21,10 @@ export * from "./controllers/IdentityController.ts";
 export * from "./controllers/SessionController.ts";
 export * from "./controllers/UserController.ts";
 export * from "./controllers/UserRealmController.ts";
-export * from "./descriptors/$userRealm.ts";
 export * from "./entities/identities.ts";
 export * from "./entities/sessions.ts";
 export * from "./entities/users.ts";
+export * from "./primitives/$userRealm.ts";
 export * from "./providers/UserRealmProvider.ts";
 export * from "./schemas/completePasswordResetRequestSchema.ts";
 export * from "./schemas/completeRegistrationRequestSchema.ts";

package/src/api-users/{descriptors → primitives}/$userRealm.ts

@@ -2,15 +2,15 @@ import { $context } from "alepha";
 import type { Repository } from "alepha/orm";
 import {
   $realm,
-  type RealmDescriptor,
-  type RealmDescriptorOptions,
+  type RealmPrimitive,
+  type RealmPrimitiveOptions,
   SecurityProvider,
 } from "alepha/security";
 import {
   $authCredentials,
   $authGithub,
   $authGoogle,
-  type AuthDescriptor,
+  type AuthPrimitive,
   type Credentials,
   type LinkAccountOptions,
   type WithLinkFn,
@@ -23,7 +23,7 @@ import { DEFAULT_USER_REALM_NAME, type users } from "../entities/users.ts";
 import { UserRealmProvider } from "../providers/UserRealmProvider.ts";
 import { SessionService } from "../services/SessionService.ts";
 
-export type UserRealmDescriptor = RealmDescriptor & WithLinkFn & WithLoginFn;
+export type UserRealmPrimitive = RealmPrimitive & WithLinkFn & WithLoginFn;
 
 /**
  * Already configured realm for user management.
@@ -41,7 +41,7 @@ export type UserRealmDescriptor = RealmDescriptor & WithLinkFn & WithLoginFn;
 
 export const $userRealm = (
   options: UserRealmOptions = {},
-): UserRealmDescriptor => {
+): UserRealmPrimitive => {
   const { alepha } = $context();
   const sessionService = alepha.inject(SessionService);
   const securityProvider = alepha.inject(SecurityProvider);
@@ -50,7 +50,7 @@ export const $userRealm = (
 
   userRealmProvider.register(name, options);
 
-  const realm: UserRealmDescriptor = $realm({
+  const realm: UserRealmPrimitive = $realm({
     ...options.realm,
     name,
     secret: options.secret ?? securityProvider.secretKey,
@@ -104,7 +104,7 @@ export const $userRealm = (
   };
 
   if (options.identities) {
-    const identities: Record<string, AuthDescriptor> = {};
+    const identities: Record<string, AuthPrimitive> = {};
     if (options.identities?.credentials) {
       identities.credentials = $authCredentials(realm);
     }
@@ -135,7 +135,7 @@ export interface UserRealmOptions {
    *
    * It's already pre-configured for user management with admin and user roles.
    */
-  realm?: Partial<RealmDescriptorOptions>;
+  realm?: Partial<RealmPrimitiveOptions>;
 
   /**
    * Override entities.

package/src/api-users/providers/UserRealmProvider.ts

@@ -40,7 +40,7 @@ export class UserRealmProvider {
   protected readonly onConfigure = $hook({
     on: "configure",
     handler: () => {
-      this.alepha.state.set("alepha.server.security.system.user", {
+      this.alepha.store.set("alepha.server.security.system.user", {
         id: "00000000-0000-0000-0000-000000000000",
         name: "system",
         roles: ["admin"], // TODO: use realm config

package/src/batch/index.ts

@@ -1,10 +1,10 @@
 import { $module } from "alepha";
-import { $batch } from "./descriptors/$batch.ts";
+import { $batch } from "./primitives/$batch.ts";
 import { BatchProvider } from "./providers/BatchProvider.ts";
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export * from "./descriptors/$batch.ts";
+export * from "./primitives/$batch.ts";
 export * from "./providers/BatchProvider.ts";
 
 // ---------------------------------------------------------------------------------------------------------------------
@@ -53,6 +53,6 @@ export * from "./providers/BatchProvider.ts";
  */
 export const AlephaBatch = $module({
   name: "alepha.batch",
-  descriptors: [$batch],
+  primitives: [$batch],
   services: [BatchProvider],
 });

package/src/batch/{descriptors → primitives}/$batch.ts

@@ -1,14 +1,14 @@
 import {
   $hook,
   $inject,
-  createDescriptor,
-  Descriptor,
+  createPrimitive,
   KIND,
+  Primitive,
   type Static,
   type TSchema,
 } from "alepha";
 import type { DurationLike } from "alepha/datetime";
-import type { RetryDescriptorOptions } from "alepha/retry";
+import type { RetryPrimitiveOptions } from "alepha/retry";
 import {
   type BatchContext,
   type BatchItemState,
@@ -17,19 +17,16 @@ import {
 } from "../providers/BatchProvider.ts";
 
 /**
- * Creates a batch processing descriptor for efficient grouping and processing of multiple operations.
+ * Creates a batch processing primitive for efficient grouping and processing of multiple operations.
  */
 export const $batch = <TItem extends TSchema, TResponse>(
-  options: BatchDescriptorOptions<TItem, TResponse>,
-): BatchDescriptor<TItem, TResponse> =>
-  createDescriptor(BatchDescriptor<TItem, TResponse>, options);
+  options: BatchPrimitiveOptions<TItem, TResponse>,
+): BatchPrimitive<TItem, TResponse> =>
+  createPrimitive(BatchPrimitive<TItem, TResponse>, options);
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export interface BatchDescriptorOptions<
-  TItem extends TSchema,
-  TResponse = any,
-> {
+export interface BatchPrimitiveOptions<TItem extends TSchema, TResponse = any> {
   /**
    * TypeBox schema for validating each item added to the batch.
    */
@@ -69,7 +66,7 @@ export interface BatchDescriptorOptions<
   /**
    * Retry configuration for failed batch processing operations.
    */
-  retry?: Omit<RetryDescriptorOptions<() => Array<Static<TItem>>>, "handler">;
+  retry?: Omit<RetryPrimitiveOptions<() => Array<Static<TItem>>>, "handler">;
 }
 
 // ---------------------------------------------------------------------------------------------------------------------
@@ -78,16 +75,16 @@ export type { BatchItemState, BatchItemStatus };
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export class BatchDescriptor<
+export class BatchPrimitive<
   TItem extends TSchema,
   TResponse = any,
-> extends Descriptor<BatchDescriptorOptions<TItem, TResponse>> {
+> extends Primitive<BatchPrimitiveOptions<TItem, TResponse>> {
   protected readonly batchProvider = $inject(BatchProvider);
   protected readonly context: BatchContext<Static<TItem>, TResponse>;
 
   constructor(
     ...args: ConstructorParameters<
-      typeof Descriptor<BatchDescriptorOptions<TItem, TResponse>>
+      typeof Primitive<BatchPrimitiveOptions<TItem, TResponse>>
     >
   ) {
     super(...args);
@@ -172,4 +169,4 @@ export class BatchDescriptor<
   });
 }
 
-$batch[KIND] = BatchDescriptor;
+$batch[KIND] = BatchPrimitive;

package/src/bucket/index.ts

@@ -1,17 +1,17 @@
 import { $module, type FileLike } from "alepha";
 import {
   $bucket,
-  type BucketDescriptor,
   type BucketFileOptions,
-} from "./descriptors/$bucket.ts";
+  type BucketPrimitive,
+} from "./primitives/$bucket.ts";
 import { FileStorageProvider } from "./providers/FileStorageProvider.ts";
 import { LocalFileStorageProvider } from "./providers/LocalFileStorageProvider.ts";
 import { MemoryFileStorageProvider } from "./providers/MemoryFileStorageProvider.ts";
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export * from "./descriptors/$bucket.ts";
 export * from "./errors/FileNotFoundError.ts";
+export * from "./primitives/$bucket.ts";
 export * from "./providers/FileStorageProvider.ts";
 export * from "./providers/LocalFileStorageProvider.ts";
 export * from "./providers/MemoryFileStorageProvider.ts";
@@ -27,7 +27,7 @@ declare module "alepha" {
     "bucket:file:uploaded": {
       id: string;
       file: FileLike;
-      bucket: BucketDescriptor;
+      bucket: BucketPrimitive;
       options: BucketFileOptions;
     };
     /**
@@ -35,7 +35,7 @@ declare module "alepha" {
      */
     "bucket:file:deleted": {
       id: string;
-      bucket: BucketDescriptor;
+      bucket: BucketPrimitive;
     };
   }
 }
@@ -43,9 +43,9 @@ declare module "alepha" {
 // ---------------------------------------------------------------------------------------------------------------------
 
 /**
- * Provides file storage capabilities through declarative bucket descriptors with support for multiple storage backends.
+ * Provides file storage capabilities through declarative bucket primitives with support for multiple storage backends.
  *
- * The bucket module enables unified file operations across different storage systems using the `$bucket` descriptor
+ * The bucket module enables unified file operations across different storage systems using the `$bucket` primitive
  * on class properties. It abstracts storage provider differences, offering consistent APIs for local filesystem,
  * cloud storage, or in-memory storage for testing environments.
  *
@@ -55,7 +55,7 @@ declare module "alepha" {
  */
 export const AlephaBucket = $module({
   name: "alepha.bucket",
-  descriptors: [$bucket],
+  primitives: [$bucket],
   services: [
     FileStorageProvider,
     MemoryFileStorageProvider,

package/src/bucket/{descriptors → primitives}/$bucket.ts

@@ -1,9 +1,9 @@
 import {
   $inject,
-  createDescriptor,
-  Descriptor,
+  createPrimitive,
   type FileLike,
   KIND,
+  Primitive,
   type Service,
 } from "alepha";
 import { FileSystemProvider } from "alepha/file";
@@ -12,7 +12,7 @@ import { FileStorageProvider } from "../providers/FileStorageProvider.ts";
 import { MemoryFileStorageProvider } from "../providers/MemoryFileStorageProvider.ts";
 
 /**
- * Creates a bucket descriptor for file storage and management with configurable validation.
+ * Creates a bucket primitive for file storage and management with configurable validation.
  *
  * Provides a comprehensive file storage system that handles uploads, downloads, validation,
  * and management across multiple storage backends with MIME type and size limit controls.
@@ -60,10 +60,10 @@ import { MemoryFileStorageProvider } from "../providers/MemoryFileStorageProvide
  * }
  * ```
  */
-export const $bucket = (options: BucketDescriptorOptions) =>
-  createDescriptor(BucketDescriptor, options);
+export const $bucket = (options: BucketPrimitiveOptions) =>
+  createPrimitive(BucketPrimitive, options);
 
-export interface BucketDescriptorOptions extends BucketFileOptions {
+export interface BucketPrimitiveOptions extends BucketFileOptions {
   /**
    * File storage provider configuration for the bucket.
    *
@@ -204,7 +204,7 @@ export interface BucketFileOptions {
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export class BucketDescriptor extends Descriptor<BucketDescriptorOptions> {
+export class BucketPrimitive extends Primitive<BucketPrimitiveOptions> {
   public readonly provider = this.$provider();
   private readonly fileSystem = $inject(FileSystemProvider);
 
@@ -302,7 +302,7 @@ export class BucketDescriptor extends Descriptor<BucketDescriptorOptions> {
   }
 }
 
-$bucket[KIND] = BucketDescriptor;
+$bucket[KIND] = BucketPrimitive;
 
 // ---------------------------------------------------------------------------------------------------------------------
 

package/src/bucket/providers/LocalFileStorageProvider.ts

@@ -17,8 +17,8 @@ import {
 } from "alepha";
 import { FileDetector, FileSystemProvider } from "alepha/file";
 import { $logger } from "alepha/logger";
-import { $bucket } from "../descriptors/$bucket.ts";
 import { FileNotFoundError } from "../errors/FileNotFoundError.ts";
+import { $bucket } from "../primitives/$bucket.ts";
 import type { FileStorageProvider } from "./FileStorageProvider.ts";
 
 // ---------------------------------------------------------------------------------------------------------------------
@@ -68,7 +68,7 @@ export class LocalFileStorageProvider implements FileStorageProvider {
         this.alepha.isTest() &&
         this.storagePath === localFileStorageOptions.options.default.storagePath
       ) {
-        this.alepha.state.set(localFileStorageOptions, {
+        this.alepha.store.set(localFileStorageOptions, {
           storagePath: join(tmpdir(), `alepha-test-${Date.now()}`),
         });
       }
@@ -82,7 +82,7 @@ export class LocalFileStorageProvider implements FileStorageProvider {
         await mkdir(this.storagePath, { recursive: true });
       } catch {}
 
-      for (const bucket of this.alepha.descriptors($bucket)) {
+      for (const bucket of this.alepha.primitives($bucket)) {
         if (bucket.provider !== this) {
           continue;
         }

package/src/cache/index.ts

@@ -1,11 +1,11 @@
 import { $module } from "alepha";
-import { $cache } from "./descriptors/$cache.ts";
+import { $cache } from "./primitives/$cache.ts";
 import { CacheProvider } from "./providers/CacheProvider.ts";
 import { MemoryCacheProvider } from "./providers/MemoryCacheProvider.ts";
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export * from "./descriptors/$cache.ts";
+export * from "./primitives/$cache.ts";
 export * from "./providers/CacheProvider.ts";
 export * from "./providers/MemoryCacheProvider.ts";
 
@@ -14,7 +14,7 @@ export * from "./providers/MemoryCacheProvider.ts";
 /**
  * Provides high-performance caching capabilities for Alepha applications with configurable TTL and multiple storage backends.
  *
- * The cache module enables declarative caching through the `$cache` descriptor, allowing you to cache method results,
+ * The cache module enables declarative caching through the `$cache` primitive, allowing you to cache method results,
  * API responses, or computed values with automatic invalidation and type safety. It supports both in-memory and
  * persistent storage backends for different performance and durability requirements.
  *
@@ -24,7 +24,7 @@ export * from "./providers/MemoryCacheProvider.ts";
  */
 export const AlephaCache = $module({
   name: "alepha.cache",
-  descriptors: [$cache],
+  primitives: [$cache],
   services: [CacheProvider, MemoryCacheProvider],
   register: (alepha) =>
     alepha.with({

package/src/cache/{descriptors → primitives}/$cache.ts

@@ -1,10 +1,10 @@
 import {
   $env,
   $inject,
-  createDescriptor,
-  Descriptor,
+  createPrimitive,
   type InstantiableClass,
   KIND,
+  Primitive,
   t,
 } from "alepha";
 import { DateTimeProvider, type DurationLike } from "alepha/datetime";
@@ -13,7 +13,7 @@ import { CacheProvider } from "../providers/CacheProvider.ts";
 import { MemoryCacheProvider } from "../providers/MemoryCacheProvider.ts";
 
 /**
- * Creates a cache descriptor for high-performance data caching with automatic management.
+ * Creates a cache primitive for high-performance data caching with automatic management.
  *
  * Provides a caching layer that improves application performance by storing frequently accessed
  * data in memory or external stores like Redis, with support for both function result caching
@@ -61,14 +61,14 @@ import { MemoryCacheProvider } from "../providers/MemoryCacheProvider.ts";
  * ```
  */
 export const $cache = <TReturn = string, TParameter extends any[] = any[]>(
-  options: CacheDescriptorOptions<TReturn, TParameter> = {},
-): CacheDescriptorFn<TReturn, TParameter> => {
-  const instance = createDescriptor(
-    CacheDescriptor<TReturn, TParameter>,
+  options: CachePrimitiveOptions<TReturn, TParameter> = {},
+): CachePrimitiveFn<TReturn, TParameter> => {
+  const instance = createPrimitive(
+    CachePrimitive<TReturn, TParameter>,
     options,
   );
   const fn = (...args: TParameter): Promise<TReturn> => instance.run(...args);
-  return Object.setPrototypeOf(fn, instance) as CacheDescriptorFn<
+  return Object.setPrototypeOf(fn, instance) as CachePrimitiveFn<
     TReturn,
     TParameter
   >;
@@ -76,7 +76,7 @@ export const $cache = <TReturn = string, TParameter extends any[] = any[]>(
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export interface CacheDescriptorOptions<
+export interface CachePrimitiveOptions<
   TReturn = any,
   TParameter extends any[] = any[],
 > {
@@ -130,10 +130,10 @@ const envSchema = t.object({
   }),
 });
 
-export class CacheDescriptor<
+export class CachePrimitive<
   TReturn = any,
   TParameter extends any[] = any[],
-> extends Descriptor<CacheDescriptorOptions<TReturn, TParameter>> {
+> extends Primitive<CachePrimitiveOptions<TReturn, TParameter>> {
   protected readonly env = $env(envSchema);
   protected readonly dateTimeProvider = $inject(DateTimeProvider);
   protected readonly provider = this.$provider();
@@ -277,14 +277,14 @@ export class CacheDescriptor<
   }
 }
 
-export interface CacheDescriptorFn<
+export interface CachePrimitiveFn<
   TReturn = any,
   TParameter extends any[] = any[],
-> extends CacheDescriptor<TReturn, TParameter> {
+> extends CachePrimitive<TReturn, TParameter> {
   /**
-   * Run the cache descriptor with the provided arguments.
+   * Run the cache primitive with the provided arguments.
    */
   (...args: TParameter): Promise<TReturn>;
 }
 
-$cache[KIND] = CacheDescriptor;
+$cache[KIND] = CachePrimitive;

package/src/cli/apps/AlephaPackageBuilderCli.ts

@@ -9,6 +9,7 @@ import type { InlineConfig } from "tsdown";
 interface Module {
   name: string;
   dependencies: string[];
+  native?: boolean;
   browser?: boolean;
   node?: boolean;
 }
@@ -34,25 +35,35 @@ export class AlephaPackageBuilderCli {
       });
 
       pkgData.exports = {};
+
       for (const item of modules) {
         const path =
           item.name === "core" ? "." : `./${item.name.replace("-", "/")}`;
         pkgData.exports[path] = {};
         // order is important here for compatibility
         pkgData.exports[path].types = `./src/${item.name}/index.ts`;
+        if (item.native) {
+          pkgData.exports[path]["react-native"] =
+            `./src/${item.name}/index.native.ts`;
+        } else if (item.browser) {
+          pkgData.exports[path]["react-native"] =
+            `./src/${item.name}/index.browser.ts`;
+        }
         if (item.browser) {
           pkgData.exports[path].browser = `./src/${item.name}/index.browser.ts`;
         }
         pkgData.exports[path].import = `./src/${item.name}/index.ts`;
-        pkgData.exports[path].require = `./src/${item.name}/index.ts`;
       }
+
       if (packageName === "alepha") {
         pkgData.exports["./tsconfig.base"] = "./tsconfig.base.json";
         pkgData.exports["./package.json"] = "./package.json";
       }
+
       if (packageName === "@alepha/ui") {
         pkgData.exports["./styles"] = "./styles.css";
       }
+
       await this.fs.writeFile("package.json", JSON.stringify(pkgData, null, 2));
 
       const tmpDir = join(root, "node_modules/.alepha");
@@ -65,7 +76,10 @@ export class AlephaPackageBuilderCli {
 
       const external = [
         "alepha",
-        ...modules.map((item) => `alepha/${item.name}`),
+        packageName,
+        ...modules.map(
+          (item) => `${packageName}/${item.name.replace("-", "/")}`,
+        ),
       ];
 
       await run.rm(this.dist);
@@ -78,13 +92,24 @@ export class AlephaPackageBuilderCli {
         entries.push({
           entry: join(src, "index.ts"),
           outDir: dest,
-          format: ["esm", "cjs"],
+          format: ["esm"],
           sourcemap: true,
           fixedExtension: false,
           platform: "node", // TODO: node must be enabled only if index.node.ts exists
           external,
         });
 
+        if (item.native) {
+          entries.push({
+            entry: join(src, "index.native.ts"),
+            outDir: dest,
+            platform: "neutral",
+            sourcemap: true,
+            dts: false,
+            external,
+          });
+        }
+
         if (item.browser) {
           entries.push({
             entry: join(src, "index.browser.ts"),
@@ -239,6 +264,7 @@ export async function analyzeModules(
 
       // Check for browser/node entry points
       const hasBrowser = await fileExists(join(modulePath, "index.browser.ts"));
+      const hasNative = await fileExists(join(modulePath, "index.native.ts"));
       const hasNode = await fileExists(join(modulePath, "index.node.ts"));
 
       // Get all .ts/.tsx files in this module
@@ -271,6 +297,7 @@ export async function analyzeModules(
         dependencies: Array.from(dependencies),
       };
 
+      if (hasNative) module.native = true;
       if (hasBrowser) module.browser = true;
       if (hasNode) module.node = true;
 

package/src/cli/assets/appRouterTs.ts

@@ -0,0 +1,9 @@
+export const appRouterTs = () => `
+import { $page } from "@alepha/react";
+
+export class AppRouter {
+  home = $page({
+    component: () => "Hello World",
+  });
+}
+`.trim()

package/src/cli/assets/indexHtml.ts

@@ -1,5 +1,5 @@
 export const indexHtml = (
-  browserEntry: string = "/src/main.tsx",
+  browserEntry: string,
 ) => `
 <!DOCTYPE html>
 <html lang="en">
@@ -8,6 +8,7 @@ export const indexHtml = (
   <title>App</title>
 </head>
 <body>
+<div id="root"></div>
 <script type="module" src="${browserEntry}"></script>
 </body>
 </html>

package/src/cli/assets/mainBrowserTs.ts

@@ -0,0 +1,10 @@
+export const mainBrowserTs = () => `
+import { Alepha, run } from "alepha";
+import { AppRouter } from "./AppRouter.ts";
+
+const alepha = Alepha.create();
+
+alepha.with(AppRouter);
+
+run(alepha);
+`.trim()