@jant/core 0.6.1 → 0.6.3

package/src/ui/layouts/__tests__/BaseLayout.test.tsx

@@ -12,6 +12,7 @@ function createContext(
     assetBasePath?: string;
     sitePathPrefix?: string;
     siteUrl?: string;
+    siteAvatarUrl?: string;
     themeMode?: "auto" | "light" | "dark";
     themeId?: string;
     defaultThemeId?: string;
@@ -22,6 +23,7 @@ function createContext(
       mainRssFeed,
       sitePathPrefix: overrides?.sitePathPrefix ?? "",
       siteUrl: overrides?.siteUrl ?? "https://example.com",
+      siteAvatarUrl: overrides?.siteAvatarUrl,
       siteLanguage: "en",
       noindex: false,
       customCSS: "",
@@ -101,6 +103,27 @@ describe("BaseLayout", () => {
     );
   });
 
+  it("falls back to the bundled social image when appConfig.siteAvatarUrl is an empty string", async () => {
+    // resolve-config initializes siteAvatarUrl to "" (not undefined) when no
+    // avatar is configured. Regression test: the fallback chain must skip
+    // empty strings so og:image / twitter:image are never blank.
+    const { BaseLayout } = await loadBaseLayout();
+    const html = renderToString(
+      BaseLayout({
+        title: "Jant",
+        c: createContext("featured", { siteAvatarUrl: "" }),
+        children: "Test",
+      }),
+    );
+
+    expect(html).toContain(
+      'meta property="og:image" content="https://example.com/_/brand/assets/jant-social-preview.png"',
+    );
+    expect(html).toContain(
+      'meta name="twitter:image" content="https://example.com/_/brand/assets/jant-social-preview.png"',
+    );
+  });
+
   it("uses an explicit social image when provided", async () => {
     const { BaseLayout } = await loadBaseLayout();
     const html = renderToString(
@@ -119,6 +142,129 @@ describe("BaseLayout", () => {
     );
   });
 
+  it("defaults og:type to website without article timestamps", async () => {
+    const { BaseLayout } = await loadBaseLayout();
+    const html = renderToString(
+      BaseLayout({
+        title: "Jant",
+        children: "Test",
+      }),
+    );
+
+    expect(html).toContain('meta property="og:type" content="website"');
+    expect(html).not.toContain("article:published_time");
+    expect(html).not.toContain("article:modified_time");
+  });
+
+  it("renders article og:type with published and modified timestamps", async () => {
+    const { BaseLayout } = await loadBaseLayout();
+    const html = renderToString(
+      BaseLayout({
+        title: "A post",
+        ogType: "article",
+        articlePublishedTime: "2026-01-02T03:04:05.000Z",
+        articleModifiedTime: "2026-03-04T05:06:07.000Z",
+        children: "Test",
+      }),
+    );
+
+    expect(html).toContain('meta property="og:type" content="article"');
+    expect(html).toContain(
+      'meta property="article:published_time" content="2026-01-02T03:04:05.000Z"',
+    );
+    expect(html).toContain(
+      'meta property="article:modified_time" content="2026-03-04T05:06:07.000Z"',
+    );
+  });
+
+  it("keeps the small twitter card and omits dimensions for the default social image", async () => {
+    const { BaseLayout } = await loadBaseLayout();
+    const html = renderToString(
+      BaseLayout({
+        title: "Jant",
+        children: "Test",
+      }),
+    );
+
+    expect(html).toContain('meta name="twitter:card" content="summary"');
+    expect(html).not.toContain('content="summary_large_image"');
+    expect(html).not.toContain("og:image:width");
+  });
+
+  it("renders dimensions, alt, and a large twitter card for a landscape post image", async () => {
+    const { BaseLayout } = await loadBaseLayout();
+    const html = renderToString(
+      BaseLayout({
+        title: "A post",
+        socialImageUrl: "https://cdn.example.com/photo.jpg",
+        socialImageWidth: 1600,
+        socialImageHeight: 900,
+        socialImageAlt: "A wide landscape photo",
+        children: "Test",
+      }),
+    );
+
+    expect(html).toContain('meta property="og:image:width" content="1600"');
+    expect(html).toContain('meta property="og:image:height" content="900"');
+    expect(html).toContain(
+      'meta property="og:image:alt" content="A wide landscape photo"',
+    );
+    expect(html).toContain(
+      'meta name="twitter:image:alt" content="A wide landscape photo"',
+    );
+    expect(html).toContain(
+      'meta name="twitter:card" content="summary_large_image"',
+    );
+  });
+
+  it("keeps the small twitter card for a portrait post image", async () => {
+    const { BaseLayout } = await loadBaseLayout();
+    const html = renderToString(
+      BaseLayout({
+        title: "A post",
+        socialImageUrl: "https://cdn.example.com/tall.jpg",
+        socialImageWidth: 600,
+        socialImageHeight: 900,
+        children: "Test",
+      }),
+    );
+
+    expect(html).toContain('meta name="twitter:card" content="summary"');
+    expect(html).not.toContain('content="summary_large_image"');
+  });
+
+  it("renders JSON-LD structured data and escapes script-breaking characters", async () => {
+    const { BaseLayout } = await loadBaseLayout();
+    const html = renderToString(
+      BaseLayout({
+        title: "A post",
+        jsonLd: {
+          "@type": "BlogPosting",
+          headline: "Mind the </script> gap",
+        },
+        children: "Test",
+      }),
+    );
+
+    expect(html).toContain('<script type="application/ld+json">');
+    expect(html).toContain("\\u003c/script\\u003e");
+    expect(html).not.toContain("</script> gap");
+  });
+
+  it("skips JSON-LD when the page is noindex", async () => {
+    const { BaseLayout } = await loadBaseLayout();
+    const html = renderToString(
+      BaseLayout({
+        title: "A post",
+        noindex: true,
+        jsonLd: { "@type": "WebSite" },
+        children: "Test",
+      }),
+    );
+
+    expect(html).not.toContain("application/ld+json");
+  });
+
   it("exposes the main and alternate feed links without duplicating featured", async () => {
     const { BaseLayout } = await loadBaseLayout();
     const html = renderToString(

package/src/ui/pages/CollectionsPage.tsx

@@ -11,37 +11,18 @@ import type { CollectionsPageProps } from "../../types.js";
 import { CollectionDirectory } from "../shared/CollectionDirectory.js";
 import { CollectionsManager } from "../shared/CollectionsManager.js";
 
-const countCollections = (items: CollectionsPageProps["items"]) =>
-  items.filter((item) => item.type === "collection" && item.collection).length;
-
 export const CollectionsPage: FC<CollectionsPageProps> = ({
   items,
   isAuthenticated,
   sitePathPrefix = "",
 }) => {
   const { i18n } = useLingui();
-  const collectionCount = countCollections(items);
   const emptyMessage = i18n._(
     msg({
       message: "No collections yet. Start one to organize posts by topic.",
       comment: "@context: Empty state message on collections page",
     }),
   );
-  const collectionCountLabel = `${collectionCount} ${
-    collectionCount === 1
-      ? i18n._(
-          msg({
-            message: "collection",
-            comment: "@context: Singular collection count label",
-          }),
-        )
-      : i18n._(
-          msg({
-            message: "collections",
-            comment: "@context: Plural collection count label",
-          }),
-        )
-  }`;
 
   if (isAuthenticated) {
     return (
@@ -66,9 +47,6 @@ export const CollectionsPage: FC<CollectionsPageProps> = ({
                 )}
               </h1>
             </div>
-            <div class="page-intro-meta-row">
-              <p class="page-intro-meta">{collectionCountLabel}</p>
-            </div>
           </div>
         </header>
 

package/src/ui/shared/CollectionsManager.tsx

@@ -13,9 +13,6 @@ import { getCollectionMutationLabels } from "./collection-management-labels.js";
 const escapeJson = (data: unknown) =>
   JSON.stringify(data).replace(/</g, "\\u003c");
 
-const countCollections = (items: CollectionDirectoryItem[]) =>
-  items.filter((item) => item.type === "collection" && item.collection).length;
-
 export interface CollectionsManagerProps {
   items: CollectionDirectoryItem[];
   sitePathPrefix?: string;
@@ -34,22 +31,6 @@ export const CollectionsManager: FC<CollectionsManagerProps> = ({
     `${getNewCollectionPath()}?returnTo=${encodeURIComponent(collectionsHref)}`,
     sitePathPrefix,
   );
-  const collectionCount = countCollections(items);
-  const collectionCountLabel = `${collectionCount} ${
-    collectionCount === 1
-      ? i18n._(
-          msg({
-            message: "collection",
-            comment: "@context: Singular collection count label",
-          }),
-        )
-      : i18n._(
-          msg({
-            message: "collections",
-            comment: "@context: Plural collection count label",
-          }),
-        )
-  }`;
   const mutationLabels = getCollectionMutationLabels(i18n);
 
   const labels = {
@@ -59,18 +40,6 @@ export const CollectionsManager: FC<CollectionsManagerProps> = ({
         comment: "@context: Collections page heading",
       }),
     ),
-    collectionSingular: i18n._(
-      msg({
-        message: "collection",
-        comment: "@context: Singular collection count label",
-      }),
-    ),
-    collectionPlural: i18n._(
-      msg({
-        message: "collections",
-        comment: "@context: Plural collection count label",
-      }),
-    ),
     organize: i18n._(
       msg({
         message: "Organize",
@@ -164,11 +133,6 @@ export const CollectionsManager: FC<CollectionsManagerProps> = ({
         <div class="collections-page-heading page-intro">
           <div class="page-intro-title-row">
             <h1 class="page-intro-title">{labels.collectionsTitle}</h1>
-          </div>
-          <div class="page-intro-meta-row">
-            <p class="page-intro-meta" data-collections-count>
-              {collectionCountLabel}
-            </p>
             <div class="collections-page-actions">
               <div
                 class="collections-page-action-group"
@@ -202,14 +166,15 @@ export const CollectionsManager: FC<CollectionsManagerProps> = ({
                 >
                   <svg
                     xmlns="http://www.w3.org/2000/svg"
-                    width="16"
-                    height="16"
+                    width="18"
+                    height="18"
                     viewBox="0 0 24 24"
                     fill="none"
                     stroke="currentColor"
                     stroke-width="2"
                     stroke-linecap="round"
                     stroke-linejoin="round"
+                    aria-hidden="true"
                   >
                     <path d="M12 5v14" />
                     <path d="M5 12h14" />
@@ -218,7 +183,7 @@ export const CollectionsManager: FC<CollectionsManagerProps> = ({
                 <div class="relative">
                   <button
                     type="button"
-                    class="collections-page-toolbar-button collections-page-more-btn"
+                    class="collections-page-toolbar-button"
                     aria-label={labels.moreActions}
                     aria-expanded="false"
                     aria-haspopup="menu"
@@ -227,8 +192,8 @@ export const CollectionsManager: FC<CollectionsManagerProps> = ({
                   >
                     <svg
                       xmlns="http://www.w3.org/2000/svg"
-                      width="16"
-                      height="16"
+                      width="18"
+                      height="18"
                       viewBox="0 0 24 24"
                       fill="currentColor"
                     >

package/src/ui/shared/MediaGallery.tsx

@@ -289,12 +289,15 @@ export const MediaGallery: FC<MediaGalleryProps> = ({
                 ? JSON.stringify(lightboxItems)
                 : undefined
             }
-            class={`flex gap-2 ${singleVisual ? "" : "overflow-x-auto scroll-smooth snap-x snap-mandatory"}`}
+            class={`flex gap-2 ${singleVisual ? "" : "overflow-x-auto scroll-smooth"}`}
             style={
               singleVisual
                 ? undefined
                 : "scrollbar-width: none; -ms-overflow-style: none;"
             }
+            tabindex={singleVisual ? undefined : 0}
+            role={singleVisual ? undefined : "group"}
+            aria-label={singleVisual ? undefined : "Media gallery"}
           >
             {galleryItems.map((item) => {
               if (item._kind === "image") {
@@ -329,7 +332,7 @@ export const MediaGallery: FC<MediaGalleryProps> = ({
                     key={item.id}
                     href={item.url}
                     data-lightbox-index={item._lbIdx}
-                    class={`${singleVisual ? "" : "shrink-0 snap-start"} media-visual-frame`}
+                    class={`${singleVisual ? "" : "shrink-0"} media-visual-frame`}
                     style={{
                       ...(singleVisual
                         ? {
@@ -391,7 +394,7 @@ export const MediaGallery: FC<MediaGalleryProps> = ({
                   return (
                     <div
                       key={item.id}
-                      class={`${singleVisual ? "" : "shrink-0 snap-start"} media-video-wrap media-video-wrap-short`}
+                      class={`${singleVisual ? "" : "shrink-0"} media-video-wrap media-video-wrap-short`}
                       style={
                         singleVisual
                           ? {
@@ -464,7 +467,7 @@ export const MediaGallery: FC<MediaGalleryProps> = ({
                     key={item.id}
                     href={item.url}
                     data-lightbox-index={item._lbIdx}
-                    class={`${singleVisual ? "" : "shrink-0 snap-start"} media-video-wrap media-visual-frame`}
+                    class={`${singleVisual ? "" : "shrink-0"} media-video-wrap media-visual-frame`}
                     style={
                       singleVisual
                         ? {
@@ -502,7 +505,7 @@ export const MediaGallery: FC<MediaGalleryProps> = ({
                 return (
                   <div
                     key={item.id}
-                    class={`media-gallery-card media-audio-card shrink-0 snap-start${item.waveform ? " has-waveform" : ""}`}
+                    class={`media-gallery-card media-audio-card shrink-0${item.waveform ? " has-waveform" : ""}`}
                     style={{
                       width: `${docCardWidth}px`,
                       height: `${rowHeight}px`,
@@ -593,7 +596,7 @@ export const MediaGallery: FC<MediaGalleryProps> = ({
                     href={item.url}
                     target="_blank"
                     rel="noopener noreferrer"
-                    class="media-gallery-card shrink-0 snap-start"
+                    class="media-gallery-card shrink-0"
                     style={{
                       width: `${docCardWidth}px`,
                       height: `${rowHeight}px`,
@@ -627,7 +630,7 @@ export const MediaGallery: FC<MediaGalleryProps> = ({
                       ? `${postPermalink}/text/${item.id}`
                       : undefined
                   }
-                  class="media-gallery-card shrink-0 snap-start"
+                  class="media-gallery-card shrink-0"
                   style={{
                     width: `${docCardWidth}px`,
                     height: `${rowHeight}px`,
@@ -650,6 +653,46 @@ export const MediaGallery: FC<MediaGalleryProps> = ({
               );
             })}
           </div>
+          {!singleVisual && (
+            <>
+              <button
+                type="button"
+                class="media-gallery-nav media-gallery-nav-prev"
+                tabindex={-1}
+                aria-label="Scroll to previous media"
+              >
+                <svg
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  stroke-width="2.5"
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  aria-hidden="true"
+                >
+                  <path d="M15 18l-6-6 6-6" />
+                </svg>
+              </button>
+              <button
+                type="button"
+                class="media-gallery-nav media-gallery-nav-next"
+                tabindex={-1}
+                aria-label="Scroll to next media"
+              >
+                <svg
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  stroke-width="2.5"
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  aria-hidden="true"
+                >
+                  <path d="M9 18l6-6-6-6" />
+                </svg>
+              </button>
+            </>
+          )}
         </div>
       )}
     </>

package/src/ui/shared/__tests__/media-gallery.test.ts

@@ -108,4 +108,35 @@ describe("MediaGallery", () => {
     expect(html).not.toContain("media-video-play-overlay");
     expect(html).not.toContain("media-short-video-progress");
   });
+
+  it("adds scroll arrows and a focusable strip for multi-item galleries", () => {
+    const html = renderToString(
+      MediaGallery({
+        attachments: [
+          createMediaView({ id: "m-1", width: 1600, height: 900 }),
+          createMediaView({ id: "m-2", width: 1600, height: 900 }),
+          createMediaView({ id: "m-3", width: 1600, height: 900 }),
+        ],
+      }),
+    );
+
+    expect(html).toContain("media-gallery-nav-prev");
+    expect(html).toContain("media-gallery-nav-next");
+    expect(html).toContain('aria-label="Scroll to previous media"');
+    expect(html).toContain('aria-label="Scroll to next media"');
+    // The strip is a keyboard tab stop so Arrow keys can scroll it.
+    expect(html).toContain('tabindex="0"');
+    expect(html).toContain('role="group"');
+  });
+
+  it("omits scroll arrows and the tab stop for a single visual", () => {
+    const html = renderToString(
+      MediaGallery({
+        attachments: [createMediaView({ width: 1600, height: 900 })],
+      }),
+    );
+
+    expect(html).not.toContain("media-gallery-nav");
+    expect(html).not.toContain('tabindex="0"');
+  });
 });

package/dist/app-CMSW_AYG.js

@@ -1,6 +0,0 @@
-import "./url-umUptr5z.js";
-import { t as createApp } from "./app-DYQdDMs8.js";
-import "./export-Bbn86HmS.js";
-import "./env-C7e2Nlnt.js";
-import "./github-sync-CBQPRZ8H.js";
-export { createApp };