@jant/core 0.3.22 → 0.3.23

package/dist/themes/minimal/timeline/ImageCard.js

@@ -0,0 +1,67 @@
+/**
+ * Minimal Theme - Image Card
+ *
+ * Inline images with no card frame for type="image" posts.
+ */ import { jsx as _jsx, jsxs as _jsxs } from "hono/jsx/jsx-runtime";
+import { MediaGallery } from "../../../theme/components/MediaGallery.js";
+export const ImageCard = ({ post, compact })=>{
+    if (compact) {
+        return /*#__PURE__*/ _jsxs("article", {
+            class: "h-entry text-sm",
+            children: [
+                post.title && /*#__PURE__*/ _jsx("h2", {
+                    class: "p-name font-medium text-sm",
+                    children: /*#__PURE__*/ _jsx("a", {
+                        href: post.permalink,
+                        class: "u-url hover:underline",
+                        children: post.title
+                    })
+                }),
+                post.contentHtml && /*#__PURE__*/ _jsx("div", {
+                    class: "e-content prose prose-sm text-muted-foreground",
+                    dangerouslySetInnerHTML: {
+                        __html: post.contentHtml
+                    }
+                }),
+                /*#__PURE__*/ _jsx("footer", {
+                    class: "mt-1",
+                    children: /*#__PURE__*/ _jsx("a", {
+                        href: post.permalink,
+                        class: "u-url text-xs text-muted-foreground hover:text-foreground",
+                        children: /*#__PURE__*/ _jsx("time", {
+                            class: "dt-published",
+                            datetime: post.publishedAt,
+                            children: post.publishedAtFormatted
+                        })
+                    })
+                })
+            ]
+        });
+    }
+    return /*#__PURE__*/ _jsxs("article", {
+        class: "h-entry",
+        children: [
+            post.contentHtml && /*#__PURE__*/ _jsx("div", {
+                class: "e-content prose prose-sm",
+                dangerouslySetInnerHTML: {
+                    __html: post.contentHtml
+                }
+            }),
+            post.media.length > 0 && /*#__PURE__*/ _jsx(MediaGallery, {
+                attachments: post.media
+            }),
+            /*#__PURE__*/ _jsx("footer", {
+                class: "mt-2",
+                children: /*#__PURE__*/ _jsx("a", {
+                    href: post.permalink,
+                    class: "u-url text-xs text-muted-foreground hover:text-foreground",
+                    children: /*#__PURE__*/ _jsx("time", {
+                        class: "dt-published",
+                        datetime: post.publishedAt,
+                        children: post.publishedAtFormatted
+                    })
+                })
+            })
+        ]
+    });
+};

package/dist/{theme/components → themes/minimal}/timeline/LinkCard.js

@@ -1,33 +1,14 @@
 /**
- * Link Card Component
+ * Minimal Theme - Link Card
  *
- * External link emphasis for type="link" posts.
+ * Subtle external link indicator for type="link" posts.
  */ import { jsx as _jsx, jsxs as _jsxs } from "hono/jsx/jsx-runtime";
 export const LinkCard = ({ post, compact })=>{
     return /*#__PURE__*/ _jsxs("article", {
-        class: `h-entry timeline-card timeline-card-link${compact ? " timeline-card-compact" : ""}`,
+        class: `h-entry${compact ? " text-sm" : ""}`,
         children: [
-            post.sourceDomain && /*#__PURE__*/ _jsxs("div", {
-                class: "text-xs text-muted-foreground mb-1 flex items-center gap-1",
-                children: [
-                    /*#__PURE__*/ _jsx("svg", {
-                        class: "size-3",
-                        xmlns: "http://www.w3.org/2000/svg",
-                        fill: "none",
-                        viewBox: "0 0 24 24",
-                        "stroke-width": "2",
-                        stroke: "currentColor",
-                        children: /*#__PURE__*/ _jsx("path", {
-                            d: "M13.5 6H5.25A2.25 2.25 0 0 0 3 8.25v10.5A2.25 2.25 0 0 0 5.25 21h10.5A2.25 2.25 0 0 0 18 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25"
-                        })
-                    }),
-                    /*#__PURE__*/ _jsx("span", {
-                        children: post.sourceDomain
-                    })
-                ]
-            }),
             post.title && /*#__PURE__*/ _jsx("h2", {
-                class: `p-name font-semibold ${compact ? "text-sm" : "text-base"} mb-1`,
+                class: `p-name font-semibold ${compact ? "text-sm" : "text-base"}`,
                 children: /*#__PURE__*/ _jsx("a", {
                     href: post.sourceUrl || post.permalink,
                     class: "u-url hover:underline",
@@ -36,17 +17,24 @@ export const LinkCard = ({ post, compact })=>{
                     children: post.title
                 })
             }),
+            post.sourceDomain && /*#__PURE__*/ _jsxs("div", {
+                class: "text-xs text-muted-foreground mt-0.5",
+                children: [
+                    "↗ ",
+                    post.sourceDomain
+                ]
+            }),
             !compact && post.contentHtml && /*#__PURE__*/ _jsx("div", {
-                class: "e-content prose prose-sm text-muted-foreground",
+                class: "e-content prose prose-sm text-muted-foreground mt-1",
                 dangerouslySetInnerHTML: {
                     __html: post.contentHtml
                 }
             }),
             /*#__PURE__*/ _jsx("footer", {
-                class: "mt-2 text-xs text-muted-foreground",
+                class: "mt-2",
                 children: /*#__PURE__*/ _jsx("a", {
                     href: post.permalink,
-                    class: "hover:underline",
+                    class: "text-xs text-muted-foreground hover:text-foreground",
                     children: /*#__PURE__*/ _jsx("time", {
                         class: "dt-published",
                         datetime: post.publishedAt,

package/dist/{theme/components → themes/minimal}/timeline/NoteCard.js

@@ -1,15 +1,15 @@
 /**
- * Note Card Component
+ * Minimal Theme - Note Card
  *
- * Text-first, minimal card for type="note" posts.
+ * Borderless, content-first card for type="note" posts.
  */ import { jsx as _jsx, jsxs as _jsxs } from "hono/jsx/jsx-runtime";
-import { MediaGallery } from "../MediaGallery.js";
+import { MediaGallery } from "../../../theme/components/MediaGallery.js";
 export const NoteCard = ({ post, compact })=>{
     return /*#__PURE__*/ _jsxs("article", {
-        class: `h-entry timeline-card${compact ? " timeline-card-compact" : ""}`,
+        class: `h-entry${compact ? " text-sm" : ""}`,
         children: [
             post.contentHtml && /*#__PURE__*/ _jsx("div", {
-                class: `e-content prose ${compact ? "prose-sm" : "prose-sm"}`,
+                class: `e-content prose ${compact ? "prose-sm" : ""}`,
                 dangerouslySetInnerHTML: {
                     __html: post.contentHtml
                 }
@@ -18,10 +18,10 @@ export const NoteCard = ({ post, compact })=>{
                 attachments: post.media
             }),
             /*#__PURE__*/ _jsx("footer", {
-                class: "mt-2 text-xs text-muted-foreground",
+                class: "mt-2",
                 children: /*#__PURE__*/ _jsx("a", {
                     href: post.permalink,
-                    class: "u-url hover:underline",
+                    class: "u-url text-xs text-muted-foreground hover:text-foreground",
                     children: /*#__PURE__*/ _jsx("time", {
                         class: "dt-published",
                         datetime: post.publishedAt,

package/dist/{theme/components → themes/minimal}/timeline/QuoteCard.js

@@ -1,14 +1,14 @@
 /**
- * Quote Card Component
+ * Minimal Theme - Quote Card
  *
- * Blockquote + attribution for type="quote" posts.
+ * Subtle blockquote with left border for type="quote" posts.
  */ import { jsx as _jsx, jsxs as _jsxs } from "hono/jsx/jsx-runtime";
 export const QuoteCard = ({ post, compact })=>{
     return /*#__PURE__*/ _jsxs("article", {
-        class: `h-entry timeline-card timeline-card-quote${compact ? " timeline-card-compact" : ""}`,
+        class: `h-entry${compact ? " text-sm" : ""}`,
         children: [
             post.contentHtml && /*#__PURE__*/ _jsx("blockquote", {
-                class: `e-content italic ${compact ? "text-sm" : "text-base"} leading-relaxed`,
+                class: `e-content border-l-2 border-muted-foreground/30 pl-4 italic ${compact ? "text-sm" : ""} leading-relaxed`,
                 children: /*#__PURE__*/ _jsx("div", {
                     dangerouslySetInnerHTML: {
                         __html: post.contentHtml
@@ -32,10 +32,10 @@ export const QuoteCard = ({ post, compact })=>{
                 ]
             }),
             /*#__PURE__*/ _jsx("footer", {
-                class: "mt-2 text-xs text-muted-foreground",
+                class: "mt-2",
                 children: /*#__PURE__*/ _jsx("a", {
                     href: post.permalink,
-                    class: "u-url hover:underline",
+                    class: "u-url text-xs text-muted-foreground hover:text-foreground",
                     children: /*#__PURE__*/ _jsx("time", {
                         class: "dt-published",
                         datetime: post.publishedAt,

package/dist/{theme/components → themes/minimal}/timeline/ThreadPreview.js

@@ -1,7 +1,7 @@
 /**
- * Thread Preview Component
+ * Minimal Theme - Thread Preview
  *
- * Inline thread preview: root card + compact replies + "show more" link.
+ * Minimal thread indicator: root post + compact replies + "show more" link.
  */ import { jsx as _jsx, jsxs as _jsxs } from "hono/jsx/jsx-runtime";
 import { useLingui as $_useLingui } from "@jant/core/i18n";
 import { TimelineItem } from "./TimelineItem.js";
@@ -10,7 +10,6 @@ export const ThreadPreview = ({ rootPost, previewReplies, totalReplyCount, theme
     const { i18n: $__i18n, _: $__ } = $_useLingui();
     const remainingCount = totalReplyCount - previewReplies.length;
     return /*#__PURE__*/ _jsxs("div", {
-        class: "timeline-thread",
         children: [
             /*#__PURE__*/ _jsx(TimelineItem, {
                 item: {
@@ -19,29 +18,25 @@ export const ThreadPreview = ({ rootPost, previewReplies, totalReplyCount, theme
                 theme: theme
             }),
             previewReplies.length > 0 && /*#__PURE__*/ _jsxs("div", {
-                class: "timeline-thread-replies",
+                class: "ml-4 mt-2 border-l border-border pl-4 flex flex-col gap-3",
                 children: [
                     previewReplies.map((reply)=>/*#__PURE__*/ _jsx("div", {
-                            class: "timeline-thread-reply",
                             children: /*#__PURE__*/ _jsx(TimelineItemFromPost, {
                                 post: reply,
                                 compact: true,
                                 theme: theme
                             })
                         }, reply.id)),
-                    remainingCount > 0 && /*#__PURE__*/ _jsx("div", {
-                        class: "timeline-thread-reply",
-                        children: /*#__PURE__*/ _jsx("a", {
-                            href: rootPost.permalink,
-                            class: "text-sm text-muted-foreground hover:text-foreground hover:underline",
-                            children: $__i18n._({
-                                id: "smzF8S",
-                                message: "Show {remainingCount} more {0}",
-                                values: {
-                                    remainingCount: remainingCount,
-                                    0: remainingCount === 1 ? "reply" : "replies"
-                                }
-                            })
+                    remainingCount > 0 && /*#__PURE__*/ _jsx("a", {
+                        href: rootPost.permalink,
+                        class: "text-sm text-muted-foreground hover:text-foreground hover:underline",
+                        children: $__i18n._({
+                            id: "smzF8S",
+                            message: "Show {remainingCount} more {0}",
+                            values: {
+                                remainingCount: remainingCount,
+                                0: remainingCount === 1 ? "reply" : "replies"
+                            }
                         })
                     })
                 ]

package/dist/themes/minimal/timeline/TimelineFeed.js

@@ -0,0 +1,48 @@
+/**
+ * Minimal Theme - Timeline Feed
+ *
+ * Divider-separated stream of posts with load-more button.
+ */ import { jsx as _jsx, jsxs as _jsxs } from "hono/jsx/jsx-runtime";
+import { useLingui as $_useLingui } from "@jant/core/i18n";
+import { TimelineItem } from "./TimelineItem.js";
+import { ThreadPreview as DefaultThreadPreview } from "./ThreadPreview.js";
+export const TimelineFeed = ({ items, hasMore, nextCursor, theme })=>{
+    const { i18n: $__i18n, _: $__ } = $_useLingui();
+    const ResolvedThreadPreview = theme?.ThreadPreview ?? DefaultThreadPreview;
+    return /*#__PURE__*/ _jsxs("div", {
+        children: [
+            /*#__PURE__*/ _jsx("div", {
+                id: "timeline-feed",
+                class: "flex flex-col",
+                children: items.map((item, i)=>/*#__PURE__*/ _jsxs("div", {
+                        children: [
+                            i > 0 && /*#__PURE__*/ _jsx("hr", {
+                                class: "my-6 border-border"
+                            }),
+                            item.threadPreview ? /*#__PURE__*/ _jsx(ResolvedThreadPreview, {
+                                rootPost: item.post,
+                                previewReplies: item.threadPreview.replies,
+                                totalReplyCount: item.threadPreview.totalReplyCount,
+                                theme: theme
+                            }) : /*#__PURE__*/ _jsx(TimelineItem, {
+                                item: item,
+                                theme: theme
+                            })
+                        ]
+                    }, item.post.id))
+            }),
+            hasMore && nextCursor && /*#__PURE__*/ _jsx("div", {
+                id: "load-more-container",
+                class: "mt-8 text-center",
+                children: /*#__PURE__*/ _jsx("button", {
+                    class: "text-sm text-muted-foreground hover:text-foreground hover:underline",
+                    "data-on:click": `@get('/api/timeline?cursor=${nextCursor}')`,
+                    children: $__i18n._({
+                        id: "yQ2kGp",
+                        message: "Load more"
+                    })
+                })
+            })
+        ]
+    });
+};

package/dist/{theme/components → themes/minimal}/timeline/TimelineItem.js

@@ -1,8 +1,7 @@
 /**
- * Timeline Item Component
+ * Minimal Theme - Timeline Item
  *
  * Dispatches to the correct card component based on post type.
- * Resolves card overrides from theme components if provided.
  */ import { jsx as _jsx } from "hono/jsx/jsx-runtime";
 import { NoteCard } from "./NoteCard.js";
 import { ArticleCard } from "./ArticleCard.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jant/core",
-  "version": "0.3.22",
+  "version": "0.3.23",
   "description": "A modern, open-source microblogging platform built on Cloudflare Workers",
   "type": "module",
   "bin": {

package/src/app.tsx

@@ -11,6 +11,7 @@ import { i18nMiddleware } from "./i18n/index.js";
 import { useLingui } from "@lingui/react/macro";
 import type { Bindings, JantConfig } from "./types.js";
 import { SETTINGS_KEYS } from "./lib/constants.js";
+import { theme as minimalTheme } from "./themes/minimal/index.js";
 import { hashPassword } from "better-auth/crypto";
 
 // Routes - Pages
@@ -82,6 +83,25 @@ export type App = Hono<{ Bindings: Bindings; Variables: AppVariables }>;
  * ```
  */
 export function createApp(config: JantConfig = {}): App {
+  // Merge with default minimal theme
+  const defaultTheme = minimalTheme();
+  const resolvedConfig: JantConfig = {
+    ...config,
+    theme: {
+      name: config.theme?.name ?? defaultTheme.name,
+      components: {
+        ...defaultTheme.components,
+        ...config.theme?.components,
+      },
+      cssVariables: {
+        ...defaultTheme.cssVariables,
+        ...config.theme?.cssVariables,
+      },
+      colorThemes: config.theme?.colorThemes ?? defaultTheme.colorThemes,
+      feed: config.theme?.feed,
+    },
+  };
+
   const app = new Hono<{ Bindings: Bindings; Variables: AppVariables }>();
 
   // Initialize services, auth, and config middleware
@@ -96,7 +116,7 @@ export function createApp(config: JantConfig = {}): App {
     const db = createDatabase(session as unknown as D1Database);
     const services = createServices(db, session as unknown as D1Database);
     c.set("services", services);
-    c.set("config", config);
+    c.set("config", resolvedConfig);
     c.set("storage", createStorageDriver(c.env));
 
     if (c.env.AUTH_SECRET) {
@@ -117,11 +137,14 @@ export function createApp(config: JantConfig = {}): App {
   // Theme middleware - resolve active color theme and build CSS
   app.use("*", async (c, next) => {
     const themeId = await c.var.services.settings.get(SETTINGS_KEYS.THEME);
-    const themes = getAvailableThemes(config);
+    const themes = getAvailableThemes(resolvedConfig);
     const activeTheme = themeId
       ? themes.find((t) => t.id === themeId)
       : undefined;
-    const themeStyle = buildThemeStyle(activeTheme, config.theme?.cssVariables);
+    const themeStyle = buildThemeStyle(
+      activeTheme,
+      resolvedConfig.theme?.cssVariables,
+    );
     c.set("themeStyle", themeStyle);
     await next();
   });