blume 0.2.0 → 0.4.0

package/src/search/documents.ts

@@ -47,17 +47,35 @@ const MARKDOWN_PUNCT = /[*_~>]+/gu;
 const WHITESPACE = /\s+/gu;
 
 /** Reduce Markdown/MDX to plain, searchable text. */
-const toPlainText = (markdown: string): string =>
-  markdown
+const toPlainText = (markdown: string): string => {
+  const withoutBlocks = markdown
     .replaceAll(CODE_FENCE, " ")
     .replaceAll(IMAGE, " ")
-    .replaceAll(LINK, "$<text>")
-    .replaceAll(HTML_OR_JSX, " ")
-    .replaceAll(INLINE_CODE, "$<code>")
+    .replaceAll(LINK, "$<text>");
+
+  // Strip HTML/JSX from the prose, but keep the contents of inline code — an
+  // angle-bracket span like `<T>` inside `Array<T>` is a type parameter, not a
+  // tag, and stripping it would drop those tokens from the search index. Split
+  // on inline-code spans and only run the HTML strip on the text between them.
+  const pieces: string[] = [];
+  let cursor = 0;
+  for (const match of withoutBlocks.matchAll(INLINE_CODE)) {
+    const start = match.index ?? 0;
+    pieces.push(
+      withoutBlocks.slice(cursor, start).replaceAll(HTML_OR_JSX, " ")
+    );
+    pieces.push(match.groups?.code ?? "");
+    cursor = start + match[0].length;
+  }
+  pieces.push(withoutBlocks.slice(cursor).replaceAll(HTML_OR_JSX, " "));
+
+  return pieces
+    .join("")
     .replaceAll(HEADING_MARK, "")
     .replaceAll(MARKDOWN_PUNCT, " ")
     .replaceAll(WHITESPACE, " ")
     .trim();
+};
 
 interface Crumbs {
   breadcrumb: string[];

package/src/search/sync/algolia.ts

@@ -9,6 +9,10 @@ export interface AlgoliaSyncConfig {
  * Upload the search records to Algolia. Uses the admin key from
  * `ALGOLIA_ADMIN_API_KEY` (never the config, which holds only the public,
  * search-only key). Throws on a missing key/config so the caller can warn.
+ *
+ * Uses `replaceAllObjects`, which atomically replaces the index contents, so
+ * pages deleted or renamed since the last sync don't linger as stale search
+ * hits that 404 when clicked.
  */
 export const syncAlgolia = async (
   records: SearchRecord[],
@@ -23,7 +27,7 @@ export const syncAlgolia = async (
   }
   const { algoliasearch } = await import("algoliasearch");
   const client = algoliasearch(config.appId, adminKey);
-  await client.saveObjects({
+  await client.replaceAllObjects({
     indexName: config.indexName,
     objects: records.map((record) => ({ ...record, objectID: record._id })),
   });

package/src/search/sync/typesense.ts

@@ -8,9 +8,13 @@ export interface TypesenseSyncConfig {
 }
 
 /**
- * Import the search records into a Typesense collection, creating the
- * collection on first run. Uses the admin key from `TYPESENSE_ADMIN_API_KEY`.
- * Throws on a missing key/config so the caller can warn.
+ * Import the search records into a Typesense collection. Uses the admin key
+ * from `TYPESENSE_ADMIN_API_KEY`. Throws on a missing key/config so the caller
+ * can warn.
+ *
+ * The collection is dropped and recreated on each sync so that pages deleted or
+ * renamed since the last sync don't linger as stale search hits that 404 when
+ * clicked (an upsert alone never removes them).
  */
 export const syncTypesense = async (
   records: SearchRecord[],
@@ -35,20 +39,24 @@ export const syncTypesense = async (
     ],
   });
 
-  try {
-    await client.collections(config.collection).retrieve();
-  } catch {
-    await client.collections().create({
-      fields: [
-        { name: "title", type: "string" },
-        { name: "description", optional: true, type: "string" },
-        { name: "content", type: "string" },
-        { name: "url", type: "string" },
-        { facet: true, name: "tag", optional: true, type: "string" },
-      ],
-      name: config.collection,
-    });
+  const collection = client.collections(config.collection);
+  const exists = await collection
+    .retrieve()
+    .then(() => true)
+    .catch(() => false);
+  if (exists) {
+    await collection.delete();
   }
+  await client.collections().create({
+    fields: [
+      { name: "title", type: "string" },
+      { name: "description", optional: true, type: "string" },
+      { name: "content", type: "string" },
+      { name: "url", type: "string" },
+      { facet: true, name: "tag", optional: true, type: "string" },
+    ],
+    name: config.collection,
+  });
 
   const documents = records.map((record) => ({
     content: record.content,

package/src/theme/palette.ts

@@ -1,8 +1,10 @@
 import type { ResolvedConfig } from "../core/schema.ts";
 
+const FALLBACK_ACCENT = "oklch(0.62 0.16 250)";
+
 /** Named accent presets mapped to OKLCH values. */
 const ACCENTS: Record<string, string> = {
-  blue: "oklch(0.62 0.16 250)",
+  blue: FALLBACK_ACCENT,
   green: "oklch(0.6 0.16 150)",
   orange: "oklch(0.68 0.17 50)",
   pink: "oklch(0.65 0.2 350)",
@@ -11,6 +13,19 @@ const ACCENTS: Record<string, string> = {
   teal: "oklch(0.6 0.12 195)",
 };
 
+// Characters valid in a CSS color value (hex, rgb/hsl/oklch functions, named
+// colors). Anything else — notably `;`, `{`, `}` — could break out of the
+// declaration and inject rules, so such a value is rejected.
+const CSS_COLOR = /^[\w\s#%.,()/+-]+$/u;
+
+/** Pass a raw color through only if it can't break out of a CSS declaration. */
+const safeColor = (value: string, fallback: string): string =>
+  CSS_COLOR.test(value.trim()) ? value.trim() : fallback;
+
+/** Like {@link safeColor} but drops an unsafe/absent value to `null`. */
+const safeColorOrNull = (value: string | undefined): string | null =>
+  value && CSS_COLOR.test(value.trim()) ? value.trim() : null;
+
 const RADII: Record<ResolvedConfig["theme"]["radius"], string> = {
   lg: "0.75rem",
   md: "0.5rem",
@@ -66,7 +81,7 @@ const themeRootCss = (
       "--blume-action-foreground",
       options.action ? "oklch(1 0 0)" : null
     ),
-    ...cssToken("--blume-background", theme.background),
+    ...cssToken("--blume-background", safeColorOrNull(theme.background)),
     ...cssToken(
       "--blume-background-image",
       theme.backgroundImage ? backgroundImageCss(theme.backgroundImage) : null
@@ -83,7 +98,7 @@ const themeDarkCss = (
 ): string => {
   const tokens = [
     ...cssToken("--blume-accent", accentDark),
-    ...cssToken("--blume-background", theme.backgroundDark),
+    ...cssToken("--blume-background", safeColorOrNull(theme.backgroundDark)),
     ...cssToken(
       "--blume-background-image",
       theme.backgroundImageDark
@@ -106,7 +121,7 @@ ${tokens.join("\n")}
  * arbitrary colors without a config change.
  */
 export const resolveAccent = (theme: ResolvedConfig["theme"]): string =>
-  ACCENTS[theme.accent] ?? theme.accent;
+  ACCENTS[theme.accent] ?? safeColor(theme.accent, FALLBACK_ACCENT);
 
 /** Resolve the configured radius preset to a CSS length. */
 export const resolveRadius = (theme: ResolvedConfig["theme"]): string =>
@@ -118,11 +133,15 @@ export const resolveRadius = (theme: ResolvedConfig["theme"]): string =>
  * arbitrary colors without a config change.
  */
 export const buildThemeCss = (theme: ResolvedConfig["theme"]): string => {
-  const accent = ACCENTS[theme.accent] ?? theme.accent;
+  const accent =
+    ACCENTS[theme.accent] ?? safeColor(theme.accent, FALLBACK_ACCENT);
   const accentDark = theme.accentDark
-    ? (ACCENTS[theme.accentDark] ?? theme.accentDark)
+    ? (ACCENTS[theme.accentDark] ??
+      safeColor(theme.accentDark, FALLBACK_ACCENT))
+    : null;
+  const action = theme.action
+    ? (ACCENTS[theme.action] ?? safeColor(theme.action, FALLBACK_ACCENT))
     : null;
-  const action = theme.action ? (ACCENTS[theme.action] ?? theme.action) : null;
   const backgroundDecoration = backgroundDecorationCss(
     theme.backgroundDecoration
   );

package/src/vite-env.d.ts

@@ -0,0 +1,14 @@
+// Ambient types for the Vite `import.meta.env` fields Blume's client islands read
+// (`.astro` files aren't typechecked, so only real `.ts`/`.tsx` sources need this).
+interface ImportMetaEnv {
+  /** Deployment base path, always with a trailing slash (e.g. `/` or `/docs/`). */
+  readonly BASE_URL: string;
+  readonly DEV: boolean;
+  readonly MODE: string;
+  readonly PROD: boolean;
+  readonly SSR: boolean;
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv;
+}