@jant/core 0.3.21 → 0.3.23

package/dist/routes/pages/page.js

@@ -1,29 +1,14 @@
-import { jsx as _jsx, jsxs as _jsxs } from "hono/jsx/jsx-runtime";
+import { jsx as _jsx } from "hono/jsx/jsx-runtime";
 /**
  * Custom Page Route
  *
  * Catch-all route for custom pages accessible via their path field
  */ import { Hono } from "hono";
-import { BaseLayout, SiteLayout } from "../../theme/layouts/index.js";
+import { SinglePage as DefaultSinglePage } from "../../themes/minimal/pages/SinglePage.js";
 import { getNavigationData } from "../../lib/navigation.js";
+import { renderPublicPage } from "../../lib/render.js";
+import { createMediaContext, toPostViewFromPost } from "../../lib/view.js";
 export const pageRoutes = new Hono();
-function PageContent({ page }) {
-    return /*#__PURE__*/ _jsxs("article", {
-        class: "h-entry",
-        children: [
-            page.title && /*#__PURE__*/ _jsx("h1", {
-                class: "p-name text-3xl font-semibold mb-6",
-                children: page.title
-            }),
-            /*#__PURE__*/ _jsx("div", {
-                class: "e-content prose",
-                dangerouslySetInnerHTML: {
-                    __html: page.contentHtml || ""
-                }
-            })
-        ]
-    });
-}
 // Catch-all for custom page paths
 pageRoutes.get("/:path", async (c)=>{
     const path = c.req.param("path");
@@ -38,15 +23,18 @@ pageRoutes.get("/:path", async (c)=>{
         return c.notFound();
     }
     const navData = await getNavigationData(c);
-    return c.html(/*#__PURE__*/ _jsx(BaseLayout, {
+    // Transform to View Model
+    const mediaCtx = createMediaContext(c);
+    const pageView = toPostViewFromPost(page, mediaCtx);
+    const components = c.var.config.theme?.components;
+    const Page = components?.SinglePage ?? DefaultSinglePage;
+    return renderPublicPage(c, {
         title: `${page.title} - ${navData.siteName}`,
         description: page.content?.slice(0, 160),
-        c: c,
-        children: /*#__PURE__*/ _jsx(SiteLayout, {
-            ...navData,
-            children: /*#__PURE__*/ _jsx(PageContent, {
-                page: page
-            })
+        navData,
+        content: /*#__PURE__*/ _jsx(Page, {
+            page: pageView,
+            theme: components
         })
-    }));
+    });
 });

package/dist/routes/pages/post.js

@@ -1,54 +1,14 @@
-import { jsx as _jsx, jsxs as _jsxs } from "hono/jsx/jsx-runtime";
+import { jsx as _jsx } from "hono/jsx/jsx-runtime";
 /**
  * Single Post Page Route
  */ import { Hono } from "hono";
-import { useLingui as $_useLingui } from "@jant/core/i18n";
-import { BaseLayout, SiteLayout } from "../../theme/layouts/index.js";
-import { MediaGallery } from "../../theme/components/index.js";
+import { PostPage as DefaultPostPage } from "../../themes/minimal/pages/PostPage.js";
 import * as sqid from "../../lib/sqid.js";
-import * as time from "../../lib/time.js";
-import { getMediaUrl, getImageUrl, getPublicUrlForProvider } from "../../lib/image.js";
 import { getNavigationData } from "../../lib/navigation.js";
+import { renderPublicPage } from "../../lib/render.js";
+import { buildMediaMap } from "../../lib/media-helpers.js";
+import { createMediaContext, toPostView } from "../../lib/view.js";
 export const postRoutes = new Hono();
-function PostContent({ post, mediaAttachments }) {
-    const { i18n: $__i18n, _: $__ } = $_useLingui();
-    return /*#__PURE__*/ _jsxs("article", {
-        class: "h-entry",
-        children: [
-            post.title && /*#__PURE__*/ _jsx("h1", {
-                class: "p-name text-2xl font-semibold mb-4",
-                children: post.title
-            }),
-            /*#__PURE__*/ _jsx("div", {
-                class: "e-content prose",
-                dangerouslySetInnerHTML: {
-                    __html: post.contentHtml || ""
-                }
-            }),
-            mediaAttachments.length > 0 && /*#__PURE__*/ _jsx(MediaGallery, {
-                attachments: mediaAttachments
-            }),
-            /*#__PURE__*/ _jsxs("footer", {
-                class: "mt-6 pt-4 border-t text-sm text-muted-foreground",
-                children: [
-                    /*#__PURE__*/ _jsx("time", {
-                        class: "dt-published",
-                        datetime: time.toISOString(post.publishedAt),
-                        children: time.formatDate(post.publishedAt)
-                    }),
-                    /*#__PURE__*/ _jsx("a", {
-                        href: `/p/${sqid.encode(post.id)}`,
-                        class: "u-url ml-4",
-                        children: $__i18n._({
-                            id: "D9Oea+",
-                            message: "Permalink"
-                        })
-                    })
-                ]
-            })
-        ]
-    });
-}
 postRoutes.get("/:id", async (c)=>{
     const paramId = c.req.param("id");
     // Try to decode as sqid first
@@ -67,42 +27,28 @@ postRoutes.get("/:id", async (c)=>{
     if (post.visibility === "draft") {
         return c.notFound();
     }
-    // Load media attachments
-    const rawMedia = await c.var.services.media.getByPostId(post.id);
-    const r2PublicUrl = c.env.R2_PUBLIC_URL;
-    const imageTransformUrl = c.env.IMAGE_TRANSFORM_URL;
-    const s3PublicUrl = c.env.S3_PUBLIC_URL;
-    const mediaAttachments = rawMedia.map((m)=>{
-        const publicUrl = getPublicUrlForProvider(m.provider, r2PublicUrl, s3PublicUrl);
-        return {
-            id: m.id,
-            url: getMediaUrl(m.id, m.storageKey, publicUrl),
-            previewUrl: getImageUrl(getMediaUrl(m.id, m.storageKey, publicUrl), imageTransformUrl, {
-                width: 400,
-                quality: 80,
-                format: "auto",
-                fit: "cover"
-            }),
-            alt: m.alt,
-            blurhash: m.blurhash,
-            width: m.width,
-            height: m.height,
-            position: m.position,
-            mimeType: m.mimeType
-        };
-    });
+    // Batch load media attachments
+    const rawMediaMap = await c.var.services.media.getByPostIds([
+        post.id
+    ]);
+    const mediaCtx = createMediaContext(c);
+    const mediaMap = buildMediaMap(rawMediaMap, mediaCtx.r2PublicUrl, mediaCtx.imageTransformUrl, mediaCtx.s3PublicUrl);
+    // Transform to View Model
+    const postView = toPostView({
+        ...post,
+        mediaAttachments: mediaMap.get(post.id) ?? []
+    }, mediaCtx);
     const navData = await getNavigationData(c);
     const title = post.title || navData.siteName;
-    return c.html(/*#__PURE__*/ _jsx(BaseLayout, {
-        title: title,
+    const components = c.var.config.theme?.components;
+    const Page = components?.PostPage ?? DefaultPostPage;
+    return renderPublicPage(c, {
+        title,
         description: post.content?.slice(0, 160),
-        c: c,
-        children: /*#__PURE__*/ _jsx(SiteLayout, {
-            ...navData,
-            children: /*#__PURE__*/ _jsx(PostContent, {
-                post: post,
-                mediaAttachments: mediaAttachments
-            })
+        navData,
+        content: /*#__PURE__*/ _jsx(Page, {
+            post: postView,
+            theme: components
         })
-    }));
+    });
 });

package/dist/routes/pages/search.js

@@ -1,126 +1,13 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "hono/jsx/jsx-runtime";
+import { jsx as _jsx } from "hono/jsx/jsx-runtime";
 /**
  * Search Page Route
  */ import { Hono } from "hono";
-import { useLingui as $_useLingui } from "@jant/core/i18n";
-import { BaseLayout, SiteLayout } from "../../theme/layouts/index.js";
-import { PagePagination } from "../../theme/components/index.js";
-import * as sqid from "../../lib/sqid.js";
-import * as time from "../../lib/time.js";
+import { SearchPage as DefaultSearchPage } from "../../themes/minimal/pages/SearchPage.js";
 import { getNavigationData } from "../../lib/navigation.js";
+import { renderPublicPage } from "../../lib/render.js";
+import { createMediaContext, toSearchResultViews } from "../../lib/view.js";
 const PAGE_SIZE = 10;
 export const searchRoutes = new Hono();
-function SearchContent({ query, results, error, hasMore, page }) {
-    const { i18n: $__i18n, _: $__ } = $_useLingui();
-    const searchTitle = $__i18n._({
-        id: "A1taO8",
-        message: "Search"
-    });
-    return /*#__PURE__*/ _jsxs("div", {
-        children: [
-            /*#__PURE__*/ _jsx("h1", {
-                class: "text-2xl font-semibold mb-6",
-                children: searchTitle
-            }),
-            /*#__PURE__*/ _jsx("form", {
-                method: "get",
-                action: "/search",
-                class: "mb-8",
-                children: /*#__PURE__*/ _jsxs("div", {
-                    class: "flex gap-2",
-                    children: [
-                        /*#__PURE__*/ _jsx("input", {
-                            type: "search",
-                            name: "q",
-                            class: "input flex-1",
-                            placeholder: $__i18n._({
-                                id: "MqghUt",
-                                message: "Search posts..."
-                            }),
-                            value: query,
-                            autofocus: true
-                        }),
-                        /*#__PURE__*/ _jsx("button", {
-                            type: "submit",
-                            class: "btn",
-                            children: $__i18n._({
-                                id: "A1taO8",
-                                message: "Search"
-                            })
-                        })
-                    ]
-                })
-            }),
-            error && /*#__PURE__*/ _jsx("div", {
-                class: "alert-destructive mb-6",
-                children: /*#__PURE__*/ _jsx("h2", {
-                    children: error
-                })
-            }),
-            query && !error && /*#__PURE__*/ _jsxs("div", {
-                children: [
-                    /*#__PURE__*/ _jsx("p", {
-                        class: "text-sm text-muted-foreground mb-4",
-                        children: results.length === 0 ? $__i18n._({
-                            id: "MZbQHL",
-                            message: "No results found."
-                        }) : results.length === 1 ? $__i18n._({
-                            id: "z8ajIE",
-                            message: "Found 1 result"
-                        }) : $__i18n._({
-                            id: "zH6KqE",
-                            message: "Found {count} results"
-                        })
-                    }),
-                    results.length > 0 && /*#__PURE__*/ _jsxs(_Fragment, {
-                        children: [
-                            /*#__PURE__*/ _jsx("div", {
-                                class: "flex flex-col gap-4",
-                                children: results.map((result)=>/*#__PURE__*/ _jsx("article", {
-                                        class: "p-4 rounded-lg border hover:border-primary",
-                                        children: /*#__PURE__*/ _jsxs("a", {
-                                            href: `/p/${sqid.encode(result.post.id)}`,
-                                            class: "block",
-                                            children: [
-                                                /*#__PURE__*/ _jsx("h2", {
-                                                    class: "font-medium hover:underline",
-                                                    children: result.post.title || result.post.content?.slice(0, 60) || `Post #${result.post.id}`
-                                                }),
-                                                result.snippet && /*#__PURE__*/ _jsx("p", {
-                                                    class: "text-sm text-muted-foreground mt-2 line-clamp-2",
-                                                    dangerouslySetInnerHTML: {
-                                                        __html: result.snippet
-                                                    }
-                                                }),
-                                                /*#__PURE__*/ _jsxs("footer", {
-                                                    class: "flex items-center gap-2 mt-2 text-xs text-muted-foreground",
-                                                    children: [
-                                                        /*#__PURE__*/ _jsx("span", {
-                                                            class: "badge-outline",
-                                                            children: result.post.type
-                                                        }),
-                                                        /*#__PURE__*/ _jsx("time", {
-                                                            datetime: time.toISOString(result.post.publishedAt),
-                                                            children: time.formatDate(result.post.publishedAt)
-                                                        })
-                                                    ]
-                                                })
-                                            ]
-                                        })
-                                    }, result.post.id))
-                            }),
-                            /*#__PURE__*/ _jsx(PagePagination, {
-                                baseUrl: `/search?q=${encodeURIComponent(query)}`,
-                                currentPage: page,
-                                hasMore: hasMore
-                            })
-                        ]
-                    })
-                ]
-            })
-        ]
-    });
-}
 searchRoutes.get("/", async (c)=>{
     const query = c.req.query("q") || "";
     const pageParam = c.req.query("page");
@@ -128,7 +15,7 @@ searchRoutes.get("/", async (c)=>{
     const navData = await getNavigationData(c);
     // Only search if there's a query
     let results = [];
-    let error = null;
+    let error;
     let hasMore = false;
     if (query.trim()) {
         try {
@@ -151,18 +38,21 @@ searchRoutes.get("/", async (c)=>{
             error = "Search failed. Please try again.";
         }
     }
-    return c.html(/*#__PURE__*/ _jsx(BaseLayout, {
+    // Transform to View Models
+    const mediaCtx = createMediaContext(c);
+    const resultViews = toSearchResultViews(results, mediaCtx);
+    const components = c.var.config.theme?.components;
+    const Page = components?.SearchPage ?? DefaultSearchPage;
+    return renderPublicPage(c, {
         title: query ? `Search: ${query} - ${navData.siteName}` : `Search - ${navData.siteName}`,
-        c: c,
-        children: /*#__PURE__*/ _jsx(SiteLayout, {
-            ...navData,
-            children: /*#__PURE__*/ _jsx(SearchContent, {
-                query: query,
-                results: results,
-                error: error,
-                hasMore: hasMore,
-                page: page
-            })
+        navData,
+        content: /*#__PURE__*/ _jsx(Page, {
+            query: query,
+            results: resultViews,
+            error: error,
+            hasMore: hasMore,
+            page: page,
+            theme: components
         })
-    }));
+    });
 });

package/dist/theme/components/MediaGallery.js

@@ -17,8 +17,8 @@ export const MediaGallery = ({ attachments })=>{
                 target: "_blank",
                 rel: "noopener noreferrer",
                 children: /*#__PURE__*/ _jsx("img", {
-                    src: img.previewUrl,
-                    alt: img.alt || "",
+                    src: img.thumbnailUrl,
+                    alt: img.altText || "",
                     width: img.width ?? undefined,
                     height: img.height ?? undefined,
                     class: "rounded-lg max-w-full h-auto",
@@ -36,8 +36,8 @@ export const MediaGallery = ({ attachments })=>{
                     rel: "noopener noreferrer",
                     class: "aspect-square",
                     children: /*#__PURE__*/ _jsx("img", {
-                        src: img.previewUrl,
-                        alt: img.alt || "",
+                        src: img.thumbnailUrl,
+                        alt: img.altText || "",
                         class: "w-full h-full object-cover",
                         loading: "lazy"
                     })
@@ -56,8 +56,8 @@ export const MediaGallery = ({ attachments })=>{
                     rel: "noopener noreferrer",
                     class: "row-span-2",
                     children: /*#__PURE__*/ _jsx("img", {
-                        src: first.previewUrl,
-                        alt: first.alt || "",
+                        src: first.thumbnailUrl,
+                        alt: first.altText || "",
                         class: "w-full h-full object-cover",
                         loading: "lazy"
                     })
@@ -68,8 +68,8 @@ export const MediaGallery = ({ attachments })=>{
                         rel: "noopener noreferrer",
                         class: "aspect-square",
                         children: /*#__PURE__*/ _jsx("img", {
-                            src: img.previewUrl,
-                            alt: img.alt || "",
+                            src: img.thumbnailUrl,
+                            alt: img.altText || "",
                             class: "w-full h-full object-cover",
                             loading: "lazy"
                         })
@@ -89,8 +89,8 @@ export const MediaGallery = ({ attachments })=>{
                 class: "relative aspect-square",
                 children: [
                     /*#__PURE__*/ _jsx("img", {
-                        src: img.previewUrl,
-                        alt: img.alt || "",
+                        src: img.thumbnailUrl,
+                        alt: img.altText || "",
                         class: "w-full h-full object-cover",
                         loading: "lazy"
                     }),

package/dist/theme/components/index.js

@@ -11,5 +11,3 @@ export { PostList } from "./PostList.js";
 export { ThreadView } from "./ThreadView.js";
 export { TypeBadge } from "./TypeBadge.js";
 export { VisibilityBadge } from "./VisibilityBadge.js";
-// Timeline components
-export { NoteCard, ArticleCard, LinkCard, QuoteCard, ImageCard, ThreadPreview, TimelineItem, TimelineFeed } from "./timeline/index.js";

package/dist/theme/index.js

@@ -1,21 +1,18 @@
 /**
- * Jant Theme Components
+ * Jant Theme - Shared Infrastructure
  *
- * These components can be imported for wrapping/extending:
+ * Exports shared layouts, components, and color themes used by all themes.
+ * Individual theme packages (minimal, card, etc.) import from here.
  *
  * @example
  * ```typescript
- * import { PostCard } from "@jant/core/theme";
- *
- * export function MyPostCard(props) {
- *   return (
- *     <div class="my-wrapper">
- *       <PostCard {...props} />
- *     </div>
- *   );
- * }
+ * // In a theme package:
+ * import { MediaGallery, Pagination } from "@jant/core/theme";
+ * import type { ColorTheme } from "@jant/core/theme";
  * ```
- */ // Layout components
+ */ // Layout components (BaseLayout, DashLayout)
 export * from "./layouts/index.js";
-// UI components
+// Shared UI components (MediaGallery, Pagination, EmptyState, etc.)
 export * from "./components/index.js";
+// Color themes
+export * from "./color-themes.js";

package/dist/theme/layouts/index.js

@@ -1,3 +1,2 @@
 export { BaseLayout } from "./BaseLayout.js";
 export { DashLayout } from "./DashLayout.js";
-export { SiteLayout } from "./SiteLayout.js";

package/dist/themes/minimal/MinimalSiteLayout.js

@@ -0,0 +1,83 @@
+/**
+ * Minimal Theme - Site Layout
+ *
+ * Single-column, centered layout with horizontal nav.
+ * Inspired by Tufte CSS and Manton.org.
+ */ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "hono/jsx/jsx-runtime";
+function NavLinks({ links }) {
+    return /*#__PURE__*/ _jsx(_Fragment, {
+        children: links.map((link)=>/*#__PURE__*/ _jsxs("a", {
+                href: link.url,
+                class: `text-sm ${link.isActive ? "text-foreground font-medium" : "text-muted-foreground hover:text-foreground"}`,
+                ...link.isExternal ? {
+                    target: "_blank",
+                    rel: "noopener noreferrer"
+                } : {},
+                children: [
+                    link.label,
+                    link.isExternal && /*#__PURE__*/ _jsx("span", {
+                        class: "ml-0.5 text-xs opacity-50",
+                        children: "↗"
+                    })
+                ]
+            }, link.id))
+    });
+}
+export const SiteLayout = ({ siteName, links, children })=>{
+    return /*#__PURE__*/ _jsxs("div", {
+        class: "max-w-2xl mx-auto px-4 py-8",
+        "data-signals": JSON.stringify({
+            _menuOpen: false
+        }),
+        children: [
+            /*#__PURE__*/ _jsxs("header", {
+                class: "mb-12",
+                children: [
+                    /*#__PURE__*/ _jsxs("div", {
+                        class: "flex items-center justify-between",
+                        children: [
+                            /*#__PURE__*/ _jsx("a", {
+                                href: "/",
+                                class: "text-xl font-semibold",
+                                children: siteName
+                            }),
+                            links.length > 0 && /*#__PURE__*/ _jsx("button", {
+                                "data-on:click": "$_menuOpen = !$_menuOpen",
+                                class: "p-2 -mr-2 text-muted-foreground hover:text-foreground sm:hidden",
+                                "aria-label": "Toggle menu",
+                                children: /*#__PURE__*/ _jsx("svg", {
+                                    class: "size-5",
+                                    fill: "none",
+                                    viewBox: "0 0 24 24",
+                                    "stroke-width": "1.5",
+                                    stroke: "currentColor",
+                                    children: /*#__PURE__*/ _jsx("path", {
+                                        "stroke-linecap": "round",
+                                        "stroke-linejoin": "round",
+                                        d: "M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"
+                                    })
+                                })
+                            })
+                        ]
+                    }),
+                    links.length > 0 && /*#__PURE__*/ _jsx("nav", {
+                        class: "hidden sm:flex flex-wrap gap-x-4 gap-y-1 mt-3",
+                        children: /*#__PURE__*/ _jsx(NavLinks, {
+                            links: links
+                        })
+                    }),
+                    links.length > 0 && /*#__PURE__*/ _jsx("nav", {
+                        class: "sm:hidden flex flex-col gap-1 mt-3 overflow-hidden",
+                        "data-show": "$_menuOpen",
+                        children: /*#__PURE__*/ _jsx(NavLinks, {
+                            links: links
+                        })
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsx("main", {
+                children: children
+            })
+        ]
+    });
+};

package/dist/themes/minimal/index.js

@@ -0,0 +1,65 @@
+/**
+ * Minimal Theme
+ *
+ * A content-first, borderless theme inspired by Tufte CSS and Manton.org.
+ * Single-column layout with serif-friendly typography and generous whitespace.
+ *
+ * This is the default theme for Jant.
+ */ // Layout
+import { SiteLayout } from "./MinimalSiteLayout.js";
+// Pages
+import { HomePage } from "./pages/HomePage.js";
+import { PostPage } from "./pages/PostPage.js";
+import { SinglePage } from "./pages/SinglePage.js";
+import { ArchivePage } from "./pages/ArchivePage.js";
+import { SearchPage } from "./pages/SearchPage.js";
+import { CollectionPage } from "./pages/CollectionPage.js";
+// Timeline
+import { NoteCard } from "./timeline/NoteCard.js";
+import { ArticleCard } from "./timeline/ArticleCard.js";
+import { LinkCard } from "./timeline/LinkCard.js";
+import { QuoteCard } from "./timeline/QuoteCard.js";
+import { ImageCard } from "./timeline/ImageCard.js";
+import { ThreadPreview } from "./timeline/ThreadPreview.js";
+import { TimelineFeed } from "./timeline/TimelineFeed.js";
+/**
+ * Create the minimal theme configuration.
+ *
+ * @param options - Optional overrides for components, CSS variables, or color themes
+ * @returns A JantTheme configuration object
+ *
+ * @example
+ * ```typescript
+ * import { createApp } from "@jant/core";
+ * import { minimalTheme } from "@jant/core";
+ *
+ * export default createApp({
+ *   theme: minimalTheme(),  // re-exported as minimalTheme from @jant/core
+ * });
+ * ```
+ */ export function theme(options) {
+    return {
+        name: "minimal",
+        components: {
+            SiteLayout,
+            HomePage,
+            PostPage,
+            SinglePage,
+            ArchivePage,
+            SearchPage,
+            CollectionPage,
+            NoteCard,
+            ArticleCard,
+            LinkCard,
+            QuoteCard,
+            ImageCard,
+            ThreadPreview,
+            TimelineFeed,
+            ...options?.components
+        },
+        cssVariables: {
+            ...options?.cssVariables
+        },
+        colorThemes: options?.colorThemes
+    };
+}