@jant/core 0.2.2 → 0.2.4

package/dist/client.d.ts

@@ -1,7 +1,10 @@
 /**
  * Client-side JavaScript entry point
  *
- * Pure JS/TS exports only. CSS is handled via preset.css.
+ * Bundles all interactive components:
+ * - Datastar (reactivity)
+ * - BaseCoat (dialogs, dropdowns, etc.)
  */
+import "@sudodevnull/datastar";
 import "basecoat-css/all";
 //# sourceMappingURL=client.d.ts.map

package/dist/client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../src/client.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,kBAAkB,CAAC"}
+{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../src/client.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,uBAAuB,CAAC;AAG/B,OAAO,kBAAkB,CAAC"}

package/dist/client.js

@@ -1,6 +1,10 @@
 /**
  * Client-side JavaScript entry point
  *
- * Pure JS/TS exports only. CSS is handled via preset.css.
- */ // BaseCoat interactive components (dialogs, dropdowns, etc.)
+ * Bundles all interactive components:
+ * - Datastar (reactivity)
+ * - BaseCoat (dialogs, dropdowns, etc.)
+ */ // Datastar for reactivity (data-* attributes)
+import "@sudodevnull/datastar";
+// BaseCoat interactive components
 import "basecoat-css/all";

package/dist/lib/assets.d.ts

@@ -2,13 +2,14 @@
  * Asset paths for SSR
  *
  * Development: Paths injected via vite.config.ts `define`
- * Production: Paths replaced at build time with hashed filenames from manifest
+ * Production: Paths replaced at build time with hashed filenames
  */
 interface Assets {
-    /** CSS path (prevents FOUC in dev, hashed in prod) */
+    /** CSS path */
     styles: string;
+    /** Main client bundle (includes Datastar + BaseCoat) */
     client: string;
-    datastar: string;
+    /** Image processor script (lazy-loaded on media page) */
     imageProcessor: string;
 }
 /**

package/dist/lib/assets.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"assets.d.ts","sourceRoot":"","sources":["../../src/lib/assets.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,UAAU,MAAM;IACd,sDAAsD;IACtD,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,cAAc,EAAE,MAAM,CAAC;CACxB;AAgBD;;GAEG;AACH,wBAAgB,SAAS,IAAI,MAAM,CAelC;AAGD,eAAO,MAAM,MAAM,QAAc,CAAC"}
+{"version":3,"file":"assets.d.ts","sourceRoot":"","sources":["../../src/lib/assets.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,UAAU,MAAM;IACd,eAAe;IACf,MAAM,EAAE,MAAM,CAAC;IACf,wDAAwD;IACxD,MAAM,EAAE,MAAM,CAAC;IACf,yDAAyD;IACzD,cAAc,EAAE,MAAM,CAAC;CACxB;AAcD;;GAEG;AACH,wBAAgB,SAAS,IAAI,MAAM,CAclC;AAGD,eAAO,MAAM,MAAM,QAAc,CAAC"}

package/dist/lib/assets.js

@@ -2,12 +2,11 @@
  * Asset paths for SSR
  *
  * Development: Paths injected via vite.config.ts `define`
- * Production: Paths replaced at build time with hashed filenames from manifest
+ * Production: Paths replaced at build time with hashed filenames
  */ // Production paths - replaced at build time
 const PROD_ASSETS = {
     styles: "__JANT_ASSET_STYLES__",
     client: "__JANT_ASSET_CLIENT__",
-    datastar: "__JANT_ASSET_DATASTAR__",
     imageProcessor: "__JANT_ASSET_IMAGE_PROCESSOR__"
 };
 /**
@@ -18,7 +17,6 @@ const PROD_ASSETS = {
             return {
                 styles: __JANT_DEV_STYLES__,
                 client: __JANT_DEV_CLIENT__,
-                datastar: __JANT_DEV_DATASTAR__,
                 imageProcessor: __JANT_DEV_IMAGE_PROCESSOR__
             };
         }

package/dist/theme/layouts/BaseLayout.js

@@ -41,11 +41,6 @@ export const BaseLayout = ({ title, description, lang = "en", c, children })=>{
                         type: "module",
                         src: assets.client,
                         defer: true
-                    }),
-                    /*#__PURE__*/ _jsx("script", {
-                        type: "module",
-                        src: assets.datastar,
-                        defer: true
                     })
                 ]
             }),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jant/core",
-  "version": "0.2.2",
+  "version": "0.2.4",
   "description": "A modern, open-source microblogging platform built on Cloudflare Workers",
   "type": "module",
   "bin": {
@@ -24,15 +24,14 @@
     "dist",
     "static",
     "migrations",
-    "src/preset.css",
-    "src/styles",
-    "src/client.ts"
+    "src"
   ],
   "publishConfig": {
     "access": "public"
   },
   "dependencies": {
     "@lingui/core": "^5.9.0",
+    "@sudodevnull/datastar": "^0.19.9",
     "better-auth": "^1.4.18",
     "drizzle-orm": "^0.45.1",
     "hono": "^4.11.7",
@@ -46,7 +45,6 @@
     "tailwindcss": "^4.0.0"
   },
   "devDependencies": {
-    "basecoat-css": "^0.3.10",
     "@cloudflare/vite-plugin": "^1.22.1",
     "@cloudflare/workers-types": "^4.20260131.0",
     "@eslint/js": "^9.39.2",
@@ -60,6 +58,7 @@
     "@typescript-eslint/eslint-plugin": "^8.54.0",
     "@typescript-eslint/parser": "^8.54.0",
     "autoprefixer": "^10.4.24",
+    "basecoat-css": "^0.3.10",
     "drizzle-kit": "^0.31.8",
     "eslint": "^9.39.2",
     "eslint-plugin-react": "^7.37.5",

package/src/app.tsx

@@ -0,0 +1,377 @@
+/**
+ * Jant App Factory
+ */
+
+import { Hono } from "hono";
+import type { FC } from "hono/jsx";
+import { createDatabase } from "./db/index.js";
+import { createServices, type Services } from "./services/index.js";
+import { createAuth, type Auth } from "./auth.js";
+import { i18nMiddleware, useLingui } from "./i18n/index.js";
+import type { Bindings, JantConfig } from "./types.js";
+
+// Routes - Pages
+import { homeRoutes } from "./routes/pages/home.js";
+import { postRoutes } from "./routes/pages/post.js";
+import { pageRoutes } from "./routes/pages/page.js";
+import { collectionRoutes } from "./routes/pages/collection.js";
+import { archiveRoutes } from "./routes/pages/archive.js";
+import { searchRoutes } from "./routes/pages/search.js";
+
+// Routes - Dashboard
+import { dashIndexRoutes } from "./routes/dash/index.js";
+import { postsRoutes as dashPostsRoutes } from "./routes/dash/posts.js";
+import { pagesRoutes as dashPagesRoutes } from "./routes/dash/pages.js";
+import { mediaRoutes as dashMediaRoutes } from "./routes/dash/media.js";
+import { settingsRoutes as dashSettingsRoutes } from "./routes/dash/settings.js";
+import { redirectsRoutes as dashRedirectsRoutes } from "./routes/dash/redirects.js";
+import { collectionsRoutes as dashCollectionsRoutes } from "./routes/dash/collections.js";
+
+// Routes - API
+import { postsApiRoutes } from "./routes/api/posts.js";
+import { uploadApiRoutes } from "./routes/api/upload.js";
+import { searchApiRoutes } from "./routes/api/search.js";
+
+// Routes - Feed
+import { rssRoutes } from "./routes/feed/rss.js";
+import { sitemapRoutes } from "./routes/feed/sitemap.js";
+
+// Middleware
+import { requireAuth } from "./middleware/auth.js";
+
+// Layouts for auth pages
+import { BaseLayout } from "./theme/layouts/index.js";
+
+// Extend Hono's context variables
+export interface AppVariables {
+  services: Services;
+  auth: Auth;
+  config: JantConfig;
+}
+
+export type App = Hono<{ Bindings: Bindings; Variables: AppVariables }>;
+
+/**
+ * Create a Jant application
+ *
+ * @param config - Optional configuration
+ * @returns Hono app instance
+ *
+ * @example
+ * ```typescript
+ * import { createApp } from "@jant/core";
+ *
+ * export default createApp({
+ *   site: { name: "My Blog" },
+ *   theme: { components: { PostCard: MyPostCard } },
+ * });
+ * ```
+ */
+export function createApp(config: JantConfig = {}): App {
+  const app = new Hono<{ Bindings: Bindings; Variables: AppVariables }>();
+
+  // Initialize services, auth, and config middleware
+  app.use("*", async (c, next) => {
+    const db = createDatabase(c.env.DB);
+    const services = createServices(db, c.env.DB);
+    c.set("services", services);
+    c.set("config", config);
+
+    if (c.env.AUTH_SECRET) {
+      const auth = createAuth(c.env.DB, {
+        secret: c.env.AUTH_SECRET,
+        baseURL: c.env.SITE_URL,
+      });
+      c.set("auth", auth);
+    }
+
+    await next();
+  });
+
+  // i18n middleware
+  app.use("*", i18nMiddleware());
+
+  // Trailing slash redirect (redirect /foo/ to /foo)
+  app.use("*", async (c, next) => {
+    const url = new URL(c.req.url);
+    if (url.pathname !== "/" && url.pathname.endsWith("/")) {
+      const newUrl = url.pathname.slice(0, -1) + url.search;
+      return c.redirect(newUrl, 301);
+    }
+    await next();
+  });
+
+  // Redirect middleware
+  app.use("*", async (c, next) => {
+    const path = new URL(c.req.url).pathname;
+    // Skip redirect check for API routes and static assets
+    if (path.startsWith("/api/") || path.startsWith("/assets/")) {
+      return next();
+    }
+
+    const redirect = await c.var.services.redirects.getByPath(path);
+    if (redirect) {
+      return c.redirect(redirect.toPath, redirect.type);
+    }
+
+    await next();
+  });
+
+  // Health check
+  app.get("/health", (c) =>
+    c.json({
+      status: "ok",
+      auth: c.env.AUTH_SECRET ? "configured" : "missing",
+      authSecretLength: c.env.AUTH_SECRET?.length ?? 0,
+    })
+  );
+
+  // better-auth handler
+  app.all("/api/auth/*", async (c) => {
+    if (!c.var.auth) {
+      return c.json({ error: "Auth not configured. Set AUTH_SECRET." }, 500);
+    }
+    return c.var.auth.handler(c.req.raw);
+  });
+
+  // API Routes
+  app.route("/api/posts", postsApiRoutes);
+
+  // Setup page component
+  const SetupContent: FC<{ error?: string }> = ({ error }) => {
+    const { t } = useLingui();
+
+    return (
+      <div class="min-h-screen flex items-center justify-center">
+        <div class="card max-w-md w-full">
+          <header>
+            <h2>{t({ message: "Welcome to Jant", comment: "@context: Setup page welcome heading" })}</h2>
+            <p>{t({ message: "Let's set up your site.", comment: "@context: Setup page description" })}</p>
+          </header>
+          <section>
+            {error && <p class="text-destructive text-sm mb-4">{error}</p>}
+            <form method="post" action="/setup" class="flex flex-col gap-4">
+              <div class="field">
+                <label class="label">{t({ message: "Site Name", comment: "@context: Setup form field - site name" })}</label>
+                <input type="text" name="siteName" class="input" required placeholder={t({ message: "My Blog", comment: "@context: Setup site name placeholder" })} />
+              </div>
+              <div class="field">
+                <label class="label">{t({ message: "Your Name", comment: "@context: Setup form field - user name" })}</label>
+                <input type="text" name="name" class="input" required placeholder="John Doe" />
+              </div>
+              <div class="field">
+                <label class="label">{t({ message: "Email", comment: "@context: Setup/signin form field - email" })}</label>
+                <input type="email" name="email" class="input" required placeholder="you@example.com" />
+              </div>
+              <div class="field">
+                <label class="label">{t({ message: "Password", comment: "@context: Setup/signin form field - password" })}</label>
+                <input type="password" name="password" class="input" required minLength={8} />
+              </div>
+              <button type="submit" class="btn">{t({ message: "Complete Setup", comment: "@context: Setup form submit button" })}</button>
+            </form>
+          </section>
+        </div>
+      </div>
+    );
+  };
+
+  // Setup page
+  app.get("/setup", async (c) => {
+    const isComplete = await c.var.services.settings.isOnboardingComplete();
+    if (isComplete) return c.redirect("/");
+
+    const error = c.req.query("error");
+
+    return c.html(
+      <BaseLayout title="Setup - Jant" c={c}>
+        <SetupContent error={error} />
+      </BaseLayout>
+    );
+  });
+
+  app.post("/setup", async (c) => {
+    const isComplete = await c.var.services.settings.isOnboardingComplete();
+    if (isComplete) return c.redirect("/");
+
+    const formData = await c.req.formData();
+    const siteName = formData.get("siteName") as string;
+    const name = formData.get("name") as string;
+    const email = formData.get("email") as string;
+    const password = formData.get("password") as string;
+
+    if (!siteName || !name || !email || !password) {
+      return c.redirect("/setup?error=All fields are required");
+    }
+
+    if (password.length < 8) {
+      return c.redirect("/setup?error=Password must be at least 8 characters");
+    }
+
+    if (!c.var.auth) {
+      return c.redirect("/setup?error=AUTH_SECRET not configured");
+    }
+
+    try {
+      const signUpResponse = await c.var.auth.api.signUpEmail({
+        body: { name, email, password },
+      });
+
+      if (!signUpResponse || "error" in signUpResponse) {
+        return c.redirect("/setup?error=Failed to create account");
+      }
+
+      await c.var.services.settings.setMany({
+        SITE_NAME: siteName,
+        SITE_LANGUAGE: "en",
+      });
+      await c.var.services.settings.completeOnboarding();
+
+      return c.redirect("/signin");
+    } catch (err) {
+      // eslint-disable-next-line no-console -- Error logging is intentional
+      console.error("Setup error:", err);
+      return c.redirect("/setup?error=Failed to create account");
+    }
+  });
+
+  // Signin page component
+  const SigninContent: FC<{ error?: string }> = ({ error }) => {
+    const { t } = useLingui();
+
+    return (
+      <div class="min-h-screen flex items-center justify-center">
+        <div class="card max-w-md w-full">
+          <header>
+            <h2>{t({ message: "Sign In", comment: "@context: Sign in page heading" })}</h2>
+          </header>
+          <section>
+            {error && <p class="text-destructive text-sm mb-4">{error}</p>}
+            <form method="post" action="/signin" class="flex flex-col gap-4">
+              <div class="field">
+                <label class="label">{t({ message: "Email", comment: "@context: Setup/signin form field - email" })}</label>
+                <input type="email" name="email" class="input" required />
+              </div>
+              <div class="field">
+                <label class="label">{t({ message: "Password", comment: "@context: Setup/signin form field - password" })}</label>
+                <input type="password" name="password" class="input" required />
+              </div>
+              <button type="submit" class="btn">{t({ message: "Sign In", comment: "@context: Sign in form submit button" })}</button>
+            </form>
+          </section>
+        </div>
+      </div>
+    );
+  };
+
+  // Signin page
+  app.get("/signin", async (c) => {
+    const error = c.req.query("error");
+
+    return c.html(
+      <BaseLayout title="Sign In - Jant" c={c}>
+        <SigninContent error={error} />
+      </BaseLayout>
+    );
+  });
+
+  app.post("/signin", async (c) => {
+    if (!c.var.auth) {
+      return c.redirect("/signin?error=Auth not configured");
+    }
+
+    const formData = await c.req.formData();
+    const email = formData.get("email") as string;
+    const password = formData.get("password") as string;
+
+    try {
+      const signInRequest = new Request(`${c.env.SITE_URL}/api/auth/sign-in/email`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ email, password }),
+      });
+
+      const response = await c.var.auth.handler(signInRequest);
+
+      if (!response.ok) {
+        return c.redirect("/signin?error=Invalid email or password");
+      }
+
+      const headers = new Headers(response.headers);
+      headers.set("Location", "/dash");
+
+      return new Response(null, { status: 302, headers });
+    } catch (err) {
+      // eslint-disable-next-line no-console -- Error logging is intentional
+      console.error("Signin error:", err);
+      return c.redirect("/signin?error=Invalid email or password");
+    }
+  });
+
+  app.get("/signout", async (c) => {
+    if (c.var.auth) {
+      try {
+        await c.var.auth.api.signOut({ headers: c.req.raw.headers });
+      } catch {
+        // Ignore signout errors
+      }
+    }
+    return c.redirect("/");
+  });
+
+  // Dashboard routes (protected)
+  app.use("/dash/*", requireAuth());
+  app.route("/dash", dashIndexRoutes);
+  app.route("/dash/posts", dashPostsRoutes);
+  app.route("/dash/pages", dashPagesRoutes);
+  app.route("/dash/media", dashMediaRoutes);
+  app.route("/dash/settings", dashSettingsRoutes);
+  app.route("/dash/redirects", dashRedirectsRoutes);
+  app.route("/dash/collections", dashCollectionsRoutes);
+
+  // API routes
+  app.route("/api/upload", uploadApiRoutes);
+  app.route("/api/search", searchApiRoutes);
+
+  // Media files from R2 (UUIDv7-based URLs with extension)
+  app.get("/media/:idWithExt", async (c) => {
+    if (!c.env.R2) {
+      return c.notFound();
+    }
+
+    // Extract ID from "uuid.ext" format
+    const idWithExt = c.req.param("idWithExt");
+    const mediaId = idWithExt.replace(/\.[^.]+$/, "");
+
+    const media = await c.var.services.media.getById(mediaId);
+    if (!media) {
+      return c.notFound();
+    }
+
+    const object = await c.env.R2.get(media.r2Key);
+    if (!object) {
+      return c.notFound();
+    }
+
+    const headers = new Headers();
+    headers.set("Content-Type", object.httpMetadata?.contentType || media.mimeType);
+    headers.set("Cache-Control", "public, max-age=31536000, immutable");
+
+    return new Response(object.body, { headers });
+  });
+
+  // Feed routes
+  app.route("/feed", rssRoutes);
+  app.route("/", sitemapRoutes);
+
+  // Frontend routes
+  app.route("/search", searchRoutes);
+  app.route("/archive", archiveRoutes);
+  app.route("/c", collectionRoutes);
+  app.route("/p", postRoutes);
+  app.route("/", homeRoutes);
+
+  // Custom page catch-all (must be last)
+  app.route("/", pageRoutes);
+
+  return app;
+}

package/src/auth.ts

@@ -0,0 +1,38 @@
+/**
+ * Authentication with better-auth
+ */
+
+import { betterAuth } from "better-auth";
+import { drizzleAdapter } from "better-auth/adapters/drizzle";
+import { drizzle } from "drizzle-orm/d1";
+import * as schema from "./db/schema.js";
+
+export function createAuth(d1: D1Database, options: { secret: string; baseURL: string }) {
+  const db = drizzle(d1, { schema });
+
+  return betterAuth({
+    database: drizzleAdapter(db, {
+      provider: "sqlite",
+      schema: {
+        user: schema.user,
+        session: schema.session,
+        account: schema.account,
+        verification: schema.verification,
+      },
+    }),
+    secret: options.secret,
+    baseURL: options.baseURL,
+    emailAndPassword: {
+      enabled: true,
+      autoSignIn: true,
+    },
+    session: {
+      cookieCache: {
+        enabled: true,
+        maxAge: 60 * 5, // 5 minutes
+      },
+    },
+  });
+}
+
+export type Auth = ReturnType<typeof createAuth>;

package/src/client.ts

@@ -1,8 +1,13 @@
 /**
  * Client-side JavaScript entry point
  *
- * Pure JS/TS exports only. CSS is handled via preset.css.
+ * Bundles all interactive components:
+ * - Datastar (reactivity)
+ * - BaseCoat (dialogs, dropdowns, etc.)
  */
 
-// BaseCoat interactive components (dialogs, dropdowns, etc.)
+// Datastar for reactivity (data-* attributes)
+import "@sudodevnull/datastar";
+
+// BaseCoat interactive components
 import "basecoat-css/all";

package/src/db/index.ts

@@ -0,0 +1,14 @@
+/**
+ * Database utilities
+ */
+
+import { drizzle } from "drizzle-orm/d1";
+import * as schema from "./schema.js";
+
+export type Database = ReturnType<typeof createDatabase>;
+
+export function createDatabase(d1: D1Database) {
+  return drizzle(d1, { schema });
+}
+
+export { schema };