npm - @jant/core - Versions diffs - 0.6.9 → 0.6.11 - Mend

@jant/core 0.6.9 → 0.6.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (69) hide show

package/dist/{app-C-jxWmAV.js → app-CpmficmQ.js} +912 -423
package/dist/app-DqKkZenB.js +6 -0
package/dist/client/.vite/manifest.json +3 -3
package/dist/client/_assets/client-BhHHVvSY.css +2 -0
package/dist/client/_assets/{client-DWy1LEEk.js → client-Dd9U383b.js} +1 -1
package/dist/client/_assets/{client-auth-Blg-a5Ep.js → client-auth-DkpSdIDz.js} +101 -99
package/dist/{export-C2DIB7mm.js → export-Ba7NJImL.js} +93 -93
package/dist/{github-sync-7XQ5ZM6z.js → github-sync-BD4w2m8-.js} +2 -2
package/dist/{github-sync-BEFCfLKK.js → github-sync-Cb4_6_i7.js} +1 -1
package/dist/index.js +3 -3
package/dist/node.js +4 -4
package/package.json +1 -1
package/src/client/components/__tests__/jant-compose-editor-rehost-notice.test.ts +62 -0
package/src/client/components/__tests__/jant-settings-avatar.test.ts +3 -0
package/src/client/components/__tests__/jant-settings-general.test.ts +9 -4
package/src/client/components/compose-types.ts +4 -0
package/src/client/components/jant-compose-editor.ts +111 -0
package/src/client/components/jant-settings-general.ts +18 -3
package/src/client/components/settings-types.ts +2 -0
package/src/client/compose-bridge.ts +25 -8
package/src/client/tiptap/__tests__/inline-image-upload.test.ts +143 -0
package/src/client/tiptap/__tests__/link-toolbar.test.ts +41 -0
package/src/client/tiptap/__tests__/paste-rehost-e2e.test.ts +65 -0
package/src/client/tiptap/__tests__/rehost-images.test.ts +139 -0
package/src/client/tiptap/create-editor.ts +3 -0
package/src/client/tiptap/extensions.ts +4 -0
package/src/client/tiptap/inline-image-upload.ts +174 -50
package/src/client/tiptap/link-toolbar.ts +63 -1
package/src/client/tiptap/rehost-images.ts +104 -0
package/src/i18n/locales/public/en.po +10 -0
package/src/i18n/locales/public/en.ts +1 -1
package/src/i18n/locales/public/zh-Hans.po +10 -0
package/src/i18n/locales/public/zh-Hans.ts +1 -1
package/src/i18n/locales/public/zh-Hant.po +10 -0
package/src/i18n/locales/public/zh-Hant.ts +1 -1
package/src/i18n/locales/settings/en.po +258 -18
package/src/i18n/locales/settings/en.ts +1 -1
package/src/i18n/locales/settings/zh-Hans.po +258 -18
package/src/i18n/locales/settings/zh-Hans.ts +1 -1
package/src/i18n/locales/settings/zh-Hant.po +258 -18
package/src/i18n/locales/settings/zh-Hant.ts +1 -1
package/src/lib/__tests__/feed.test.ts +5 -1
package/src/lib/__tests__/upload-sideload.test.ts +78 -0
package/src/lib/__tests__/url-fetch.test.ts +181 -0
package/src/lib/feed.ts +6 -3
package/src/lib/upload.ts +111 -0
package/src/lib/url-fetch.ts +263 -0
package/src/routes/api/__tests__/uploads.test.ts +63 -1
package/src/routes/api/uploads.ts +52 -0
package/src/routes/dash/settings.tsx +7 -2
package/src/routes/feed/__tests__/feed.test.ts +58 -19
package/src/routes/feed/feed.ts +37 -28
package/src/routes/pages/featured.tsx +17 -0
package/src/routes/pages/latest.tsx +25 -0
package/src/services/__tests__/media.test.ts +168 -1
package/src/services/media.ts +111 -0
package/src/services/post.ts +1 -1
package/src/styles/tokens.css +15 -0
package/src/styles/ui.css +45 -2
package/src/ui/__tests__/color-themes.test.ts +2 -2
package/src/ui/color-themes.ts +32 -0
package/src/ui/compose/ComposeDialog.tsx +16 -0
package/src/ui/dash/appearance/ColorThemeContent.tsx +264 -29
package/src/ui/dash/settings/GeneralContent.tsx +16 -0
package/src/ui/dash/settings/__tests__/GeneralContent.test.tsx +3 -2
package/src/ui/layouts/BaseLayout.tsx +14 -2
package/src/ui/layouts/__tests__/BaseLayout.test.tsx +4 -4
package/dist/app-DqHzOwL5.js +0 -6
package/dist/client/_assets/client-CGf2m3qp.css +0 -2

package/src/services/__tests__/media.test.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-non-null-assertion -- Test assertions use ! for readability */
-import { describe, it, expect, beforeEach, vi } from "vitest";
+import { describe, it, expect, beforeEach, afterEach, vi } from "vitest";
 import { eq } from "drizzle-orm";
 import {
   createTestDatabase,
@@ -1546,3 +1546,170 @@ describe("MediaService", () => {
     });
   });
 });
+/** Minimal valid PNG header (signature + IHDR with width 4, height 6). */
+function createPngBytes(): Uint8Array {
+  return new Uint8Array([
+    0x89,
+    0x50,
+    0x4e,
+    0x47,
+    0x0d,
+    0x0a,
+    0x1a,
+    0x0a, // signature
+    0x00,
+    0x00,
+    0x00,
+    0x0d, // IHDR length (13)
+    0x49,
+    0x48,
+    0x44,
+    0x52, // "IHDR"
+    0x00,
+    0x00,
+    0x00,
+    0x04, // width = 4
+    0x00,
+    0x00,
+    0x00,
+    0x06, // height = 6
+    0x08,
+    0x06,
+    0x00,
+    0x00,
+    0x00, // bit depth, color type, ...
+  ]);
+}
+describe("MediaService.ingestFromUrl", () => {
+  let db: Database;
+  let mediaService: ReturnType<typeof createMediaService>;
+  beforeEach(() => {
+    const testDb = createTestDatabase();
+    db = testDb.db as unknown as Database;
+    mediaService = createMediaService(db, DEFAULT_TEST_SITE_ID);
+  });
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+  const deps = () => ({
+    storage: createMockStorage(),
+    storageDriver: "local",
+    maxFileSizeMB: 25,
+  });
+  it("fetches a remote image, stores it, and creates a media row", async () => {
+    const bytes = createPngBytes();
+    vi.stubGlobal(
+      "fetch",
+      vi.fn(
+        async () =>
+          new Response(bytes, { headers: { "content-type": "image/png" } }),
+      ),
+    );
+    const d = deps();
+    const media = await mediaService.ingestFromUrl(
+      { url: "https://example.com/photo.png", alt: "A photo" },
+      d,
+    );
+    expect(media.mimeType).toBe("image/png");
+    expect(media.mediaKind).toBe("image");
+    expect(media.width).toBe(4);
+    expect(media.height).toBe(6);
+    expect(media.alt).toBe("A photo");
+    expect(media.postId).toBeNull();
+    const stored = d.storage.files.get(media.storageKey);
+    expect(stored).toBeDefined();
+    expect(stored?.contentType).toBe("image/png");
+    expect(stored?.contentDisposition).toBe("inline");
+  });
+  it("stores SVG with attachment disposition (XSS-safe direct navigation)", async () => {
+    const svg = new TextEncoder().encode(
+      '<svg xmlns="http://www.w3.org/2000/svg"></svg>',
+    );
+    vi.stubGlobal(
+      "fetch",
+      vi.fn(
+        async () =>
+          new Response(svg, {
+            headers: { "content-type": "image/svg+xml" },
+          }),
+      ),
+    );
+    const d = deps();
+    const media = await mediaService.ingestFromUrl(
+      { url: "https://example.com/icon.svg" },
+      d,
+    );
+    expect(media.mimeType).toBe("image/svg+xml");
+    const stored = d.storage.files.get(media.storageKey);
+    expect(stored?.contentDisposition).toBe("attachment");
+  });
+  it("rejects content that isn't a real image (content-type spoofing)", async () => {
+    const html = new TextEncoder().encode(
+      "<!doctype html><script>alert(1)</script>",
+    );
+    vi.stubGlobal(
+      "fetch",
+      vi.fn(
+        // Server lies: claims PNG, returns HTML.
+        async () =>
+          new Response(html, { headers: { "content-type": "image/png" } }),
+      ),
+    );
+    await expect(
+      mediaService.ingestFromUrl(
+        { url: "https://example.com/evil.png" },
+        deps(),
+      ),
+    ).rejects.toThrow(/supported image/i);
+  });
+  it("rejects an oversize image", async () => {
+    const stream = new ReadableStream<Uint8Array>({
+      start(controller) {
+        controller.enqueue(new Uint8Array(2 * 1024 * 1024));
+        controller.close();
+      },
+    });
+    vi.stubGlobal(
+      "fetch",
+      vi.fn(
+        async () =>
+          new Response(stream, { headers: { "content-type": "image/png" } }),
+      ),
+    );
+    await expect(
+      mediaService.ingestFromUrl(
+        { url: "https://example.com/huge.png" },
+        { ...deps(), maxFileSizeMB: 1 },
+      ),
+    ).rejects.toThrow(/too large/i);
+  });
+  it("rejects a private/SSRF URL before fetching", async () => {
+    const fetchMock = vi.fn();
+    vi.stubGlobal("fetch", fetchMock);
+    await expect(
+      mediaService.ingestFromUrl(
+        { url: "http://169.254.169.254/latest/meta-data" },
+        deps(),
+      ),
+    ).rejects.toThrow(/private address/i);
+    expect(fetchMock).not.toHaveBeenCalled();
+  });
+});

package/src/services/media.ts CHANGED Viewed

@@ -32,10 +32,18 @@ import { renderTiptapJson } from "../lib/tiptap-render.js";
 import { tiptapJsonToMarkdown } from "../lib/tiptap-to-markdown.js";
 import {
   generateStorageKey,
+  imageExtensionForMimeType,
+  isAllowedSideloadImageType,
   SITE_ASSET_STORAGE_KEY_LIKE_PATTERN,
+  sniffImageMimeType,
   toMediaKind,
   validateUploadFileMetadata,
 } from "../lib/upload.js";
+import {
+  IMAGE_DIMENSION_PEEK_BYTES,
+  parseImageDimensions,
+} from "../lib/image-dimensions.js";
+import { assertPublicHttpUrl, fetchImageBytes } from "../lib/url-fetch.js";
 import type {
   Media,
   MediaKind,
@@ -57,6 +65,26 @@ import type { HostedControlPlaneClient } from "../lib/hosted-control-plane.js";
 const DEFAULT_MEDIA_POSITION = "a0";
+/**
+ * Derive a display filename from a remote image URL, falling back to
+ * `image.<ext>` when the path has no usable basename.
+ *
+ * @param url - The remote image URL
+ * @param ext - Extension to use when the URL path lacks one
+ * @returns A sanitized original filename
+ */
+function remoteImageName(url: URL, ext: string): string {
+  let base: string;
+  try {
+    base = decodeURIComponent(url.pathname.split("/").pop() ?? "");
+  } catch {
+    base = url.pathname.split("/").pop() ?? "";
+  }
+  base = base.trim().replace(/[\r\n"\\]+/g, "");
+  if (!base) return `image.${ext}`;
+  return base.includes(".") ? base : `${base}.${ext}`;
+}
 /**
  * Recycle-window length for deleted media storage objects. On delete we
  * hard-remove the DB row but defer deleting the underlying storage object
@@ -187,6 +215,12 @@ export interface TextAttachmentDeps {
   maxFileSizeMB: number;
 }
+export interface IngestFromUrlDeps {
+  storage: StorageDriver;
+  storageDriver: string;
+  maxFileSizeMB: number;
+}
 export interface MediaService {
   assertCanWriteBytes(additionalBytes: number): Promise<void>;
   getById(id: string): Promise<Media | null>;
@@ -195,6 +229,24 @@ export interface MediaService {
   getByPostIds(postIds: string[]): Promise<Map<string, Media[]>>;
   list(filters?: MediaFilters): Promise<Media[]>;
   create(data: CreateMediaData): Promise<Media>;
+  /**
+   * Fetch a remote image URL server-side and store it as the site's own media.
+   *
+   * Used to rehost images pasted from external articles: the server downloads
+   * the bytes (bypassing browser CORS), verifies they are a real image format,
+   * and stores them. The created row has `postId = null` like other compose
+   * uploads (reaped by the orphan sweep if the post is never published).
+   *
+   * @param input.url - The remote http(s) image URL
+   * @param input.alt - Optional alt text
+   * @param deps - Storage driver, provider name, and the max file size
+   * @returns The created media row
+   * @throws {ValidationError} For unsafe URLs, non-image content, or oversize files
+   */
+  ingestFromUrl(
+    input: { url: string; alt?: string },
+    deps: IngestFromUrlDeps,
+  ): Promise<Media>;
   /**
    * Validate media IDs: checks count limit and verifies all IDs exist in the database.
    * No-op when the array is empty.
@@ -788,6 +840,65 @@ export function createMediaService(
       return toMedia(result[0]!);
     },
+    async ingestFromUrl(input, deps) {
+      const url = assertPublicHttpUrl(input.url);
+      const maxBytes = deps.maxFileSizeMB * 1024 * 1024;
+      const { bytes } = await fetchImageBytes(url, {
+        maxBytes,
+        timeoutMs: 15000,
+      });
+      // Trust the bytes, not the server's content-type header: only store data
+      // we can positively identify as a supported image format. This blocks
+      // content-type spoofing (e.g. an HTML/script payload served as an image).
+      const sniffed = sniffImageMimeType(bytes);
+      const mimeType =
+        sniffed && isAllowedSideloadImageType(sniffed) ? sniffed : null;
+      if (!mimeType) {
+        throw new ValidationError(
+          "That URL didn't return a supported image. Try a different image.",
+        );
+      }
+      await assertCanWriteBytes(bytes.byteLength);
+      const dimensions = parseImageDimensions(
+        mimeType,
+        bytes.subarray(0, IMAGE_DIMENSION_PEEK_BYTES),
+      );
+      const ext = imageExtensionForMimeType(mimeType) ?? "bin";
+      const { id, filename, storageKey } = generateStorageKey(
+        siteId,
+        `image.${ext}`,
+      );
+      const originalName = remoteImageName(url, ext);
+      // SVG can carry scripts. Display still works via <img> (browsers disable
+      // scripting there), and attachment disposition makes direct navigation to
+      // the raw object download instead of render — neutralizing the XSS vector.
+      await deps.storage.put(storageKey, bytes, {
+        contentType: mimeType,
+        contentDisposition:
+          mimeType === "image/svg+xml" ? "attachment" : "inline",
+        cacheControl: "public, max-age=31536000, immutable",
+      });
+      return this.create({
+        id,
+        filename,
+        originalName,
+        mimeType,
+        size: bytes.byteLength,
+        storageKey,
+        provider: deps.storageDriver,
+        mediaKind: "image",
+        width: dimensions?.width,
+        height: dimensions?.height,
+        alt: input.alt?.trim() || undefined,
+      });
+    },
     async createTextAttachment(data, deps) {
       if (!deps.storage) {
         throw new ConfigurationError(

package/src/services/post.ts CHANGED Viewed

@@ -2483,7 +2483,7 @@ export function createPostService(
         .select()
         .from(posts)
         .where(and(eq(posts.siteId, siteId), eq(posts.threadId, rootId)))
-        .orderBy(posts.createdAt);
+        .orderBy(posts.createdAt, posts.id);
       return hydratePosts(rows);
     },

package/src/styles/tokens.css CHANGED Viewed

@@ -381,6 +381,21 @@
 @media (max-width: 760px) {
   :root {
     --site-padding: 1.875rem;
+  }
+}
+/* Tufte two-column → single-column collapse.
+ *
+ * Below this width the post column is already narrowed to `min(100%, 35rem)`
+ * (preset.css) and there is no room for a 45% sidenote gutter, so all content
+ * goes full-width. Single images (MediaGallery getSingleVisualWidth) and link
+ * previews (.link-preview) read this token directly, so they collapse here too.
+ *
+ * Keep this breakpoint in sync with the post-column collapse (preset.css /
+ * ui.css feed-divider, both `max-width: 1024px`) and the sidenote float→inline
+ * collapse (ui.css). They are one layout switch; do not let them drift apart. */
+@media (max-width: 1024px) {
+  :root {
     --layout-content-width: 100%;
   }
 }

package/src/styles/ui.css CHANGED Viewed

@@ -2237,7 +2237,7 @@
   }
   .post-header-block {
-    margin-bottom: 1rem;
+    margin-bottom: 1.5rem;
   }
   .post-header-block-detail {
@@ -2433,7 +2433,12 @@
     display: none;
   }
-  @media (max-width: 760px) {
+  /* Collapse sidenotes from floated margin notes to inline tap-to-toggle at the
+     same width the post column drops to `min(100%, 35rem)` (preset.css) and the
+     Tufte gutter disappears — see --layout-content-width in tokens.css. Below
+     1024px a floated `width: 50%; margin-right: -60%` note has no gutter to land
+     in and overflows the right edge, so it must inline instead. */
+  @media (max-width: 1024px) {
     label.margin-toggle:not(.sidenote-number) {
       display: inline;
       cursor: pointer;
@@ -11110,6 +11115,24 @@
     line-height: 1.28;
   }
+  .theme-preview-accent {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.3rem;
+    white-space: nowrap;
+    color: var(--preview-muted-light);
+  }
+  .theme-preview-swatch {
+    flex: none;
+    width: 0.62rem;
+    height: 0.62rem;
+    border-radius: 3px;
+    background: var(--preview-primary-light);
+    box-shadow: 0 0 0 1px
+      color-mix(in srgb, var(--preview-fg-light) 18%, transparent);
+  }
   .theme-preview-meta {
     color: var(--preview-muted-light);
     line-height: 1.55;
@@ -11143,6 +11166,16 @@
     color: var(--preview-muted-dark);
   }
+  .theme-preview-panel[data-theme-preview-mode="dark"] .theme-preview-accent {
+    color: var(--preview-muted-dark);
+  }
+  .theme-preview-panel[data-theme-preview-mode="dark"] .theme-preview-swatch {
+    background: var(--preview-primary-dark);
+    box-shadow: 0 0 0 1px
+      color-mix(in srgb, var(--preview-fg-dark) 18%, transparent);
+  }
   .theme-preview-panel[data-theme-preview-mode="dark"] .theme-preview-divider {
     border-color: var(--preview-border-dark);
   }
@@ -11671,6 +11704,16 @@
       color: var(--preview-muted-dark);
     }
+    .theme-preview-panel[data-theme-preview-mode="auto"] .theme-preview-accent {
+      color: var(--preview-muted-dark);
+    }
+    .theme-preview-panel[data-theme-preview-mode="auto"] .theme-preview-swatch {
+      background: var(--preview-primary-dark);
+      box-shadow: 0 0 0 1px
+        color-mix(in srgb, var(--preview-fg-dark) 18%, transparent);
+    }
     .theme-preview-panel[data-theme-preview-mode="auto"]
       .theme-preview-divider {
       border-color: var(--preview-border-dark);

package/src/ui/__tests__/color-themes.test.ts CHANGED Viewed

@@ -2,8 +2,8 @@ import { describe, expect, it } from "vitest";
 import { BUILTIN_COLOR_THEMES } from "../color-themes.js";
 describe("BUILTIN_COLOR_THEMES", () => {
-  it("contains 13 themes", () => {
-    expect(BUILTIN_COLOR_THEMES).toHaveLength(14);
+  it("contains 15 themes", () => {
+    expect(BUILTIN_COLOR_THEMES).toHaveLength(15);
   });
   it("keeps Tufte as the first theme", () => {

package/src/ui/color-themes.ts CHANGED Viewed

@@ -624,6 +624,38 @@ export const BUILTIN_COLOR_THEMES: ColorTheme[] = [
     },
   }),
+  // Pure white with neutral grays — zero tint, clean and clinical
+  defineTheme({
+    id: "snow",
+    name: "Snow",
+    light: {
+      bg: "oklch(1 0 0)",
+      fg: "oklch(0.205 0 0)",
+      primary: "oklch(0.25 0 0)",
+      primaryFg: "oklch(0.99 0 0)",
+      siteAccent: "oklch(0.37 0 0)",
+      muted: "oklch(0.965 0 0)",
+      mutedFg: "oklch(0.5 0 0)",
+      border: "oklch(0.91 0 0)",
+      readingTitle: "oklch(0.17 0 0)",
+      readingHeading: "oklch(0.205 0 0)",
+      readingBody: "oklch(0.24 0 0)",
+      readingQuote: "oklch(0.4 0 0)",
+      dashBg: "oklch(0.975 0 0)",
+    },
+    dark: {
+      bg: "oklch(0.17 0 0)",
+      fg: "oklch(0.92 0 0)",
+      primary: "oklch(0.85 0 0)",
+      primaryFg: "oklch(0.17 0 0)",
+      siteAccent: "oklch(0.78 0 0)",
+      muted: "oklch(0.235 0 0)",
+      mutedFg: "oklch(0.65 0 0)",
+      border: "oklch(0.3 0 0)",
+      dashBg: "oklch(0.15 0 0)",
+    },
+  }),
   // Deep coffee brown — rich and grounded
   defineTheme({
     id: "espresso",

package/src/ui/compose/ComposeDialog.tsx CHANGED Viewed

@@ -43,6 +43,22 @@ export const ComposeForm: FC<ComposeFormProps> = ({
         comment: "@context: Close compose dialog",
       }),
     ),
+    imageNotRehosted: i18n._(
+      msg({
+        message:
+          "An image couldn't be saved to your library — its original link was kept.",
+        comment:
+          "@context: Toast when a single pasted remote image couldn't be rehosted (e.g. blocked by the source's hotlink protection)",
+      }),
+    ),
+    imagesNotRehosted: i18n._(
+      msg({
+        message:
+          "{count} images couldn't be saved to your library — their original links were kept.",
+        comment:
+          "@context: Toast when several pasted remote images couldn't be rehosted; {count} is the number of images",
+      }),
+    ),
     note: i18n._(
       msg({
         message: "Note",