@morphemecms/cms 0.1.0 → 0.2.0-next-20261104150211

package/theme/templates/Blog.astro

@@ -1,38 +1,38 @@
----
-// The blog (/blog/): the page chosen as the blog page under "Indstillinger" › "Udseende" › "Standardsider"
-// (packages/editor/site/standardPages.ts), which the owner edits as a page in the editor: its heading and introduction at the top
-// with the tags, then its sections: a text, and each block by its type (PageBlock.astro), among them its posts (the
-// standard block "Blogindlæg", across the page as the front page's blocks; the first close to the tags).
-import BlogIndex from '@theme/components/BlogIndex.astro';
-import TextSection from '@theme/components/TextSection.astro';
-import PageBlock from '@theme/components/home/PageBlock.astro';
-import { space } from '@morphemecms/cms/site/sections';
-import type { StandardPageView } from '@morphemecms/cms/site/standardPages';
-
-type Props = StandardPageView;
-const { page, heading, intro, sections } = Astro.props;
----
-
-<BlogIndex
-  title={heading}
-  intro={intro ?? ''}
-  seo={{
-    description: page.data.description,
-    seoTitle: page.data.seoTitle,
-    seoDescription: page.data.seoDescription,
-    canonical: page.data.canonical,
-    noindex: page.data.noindex,
-    shareImage: page.data.shareImage,
-    shareTitle: page.data.shareTitle,
-    shareDescription: page.data.shareDescription,
-  }}
->
-  {sections.map((s, i) => {
-    switch (s.type) {
-      case 'text':
-        return <TextSection heading={s.heading} body={s.body ?? ''} class={space(i)} />;
-      default:
-        return <PageBlock section={s} class={i === 0 ? 'theme-blog-first' : undefined} />;
-    }
-  })}
-</BlogIndex>
+---
+// The blog (/blog/): the page chosen as the blog page under "Indstillinger" › "Udseende" › "Standardsider"
+// (packages/editor/site/standardPages.ts), which the owner edits as a page in the editor: its heading and introduction at the top
+// with the tags, then its sections: a text, and each block by its type (PageBlock.astro), among them its posts (the
+// standard block "Blogindlæg", across the page as the front page's blocks; the first close to the tags).
+import BlogIndex from '@theme/components/BlogIndex.astro';
+import TextSection from '@theme/components/TextSection.astro';
+import PageBlock from '@theme/components/home/PageBlock.astro';
+import { space } from '@morphemecms/cms/site/sections';
+import type { StandardPageView } from '@morphemecms/cms/site/standardPages';
+
+type Props = StandardPageView;
+const { page, heading, intro, sections } = Astro.props;
+---
+
+<BlogIndex
+  title={heading}
+  intro={intro ?? ''}
+  seo={{
+    description: page.data.description,
+    seoTitle: page.data.seoTitle,
+    seoDescription: page.data.seoDescription,
+    canonical: page.data.canonical,
+    noindex: page.data.noindex,
+    shareImage: page.data.shareImage,
+    shareTitle: page.data.shareTitle,
+    shareDescription: page.data.shareDescription,
+  }}
+>
+  {sections.map((s, i) => {
+    switch (s.type) {
+      case 'text':
+        return <TextSection heading={s.heading} body={s.body ?? ''} class={space(i)} />;
+      default:
+        return <PageBlock section={s} class={i === 0 ? 'theme-blog-first' : undefined} />;
+    }
+  })}
+</BlogIndex>

package/theme/templates/Category.astro

@@ -1,19 +1,19 @@
----
-// A tag's page on the blog (/blog/kategori/<slug>/, packages/editor/pages/blog/kategori/[category].astro): its posts.
-import BlogIndex from '@theme/components/BlogIndex.astro';
-import BlogPosts from '@theme/components/BlogPosts.astro';
-import type { Post } from '@morphemecms/cms/site/content';
-import { siteT } from '@morphemecms/cms/src/i18n';
-
-interface Props {
-  /** The tag's slug, its name, and its posts. */
-  category: string;
-  name: string;
-  posts: Post[];
-}
-const { category, name, posts } = Astro.props;
----
-
-<BlogIndex title={name} intro={siteT.theme.postsAbout(posts.length, name.toLowerCase())} activeCategory={category}>
-  <BlogPosts posts={posts} />
-</BlogIndex>
+---
+// A tag's page on the blog (/blog/kategori/<slug>/, packages/editor/pages/blog/kategori/[category].astro): its posts.
+import BlogIndex from '@theme/components/BlogIndex.astro';
+import BlogPosts from '@theme/components/BlogPosts.astro';
+import type { Post } from '@morphemecms/cms/site/content';
+import { siteT } from '@morphemecms/cms/src/i18n';
+
+interface Props {
+  /** The tag's slug, its name, and its posts. */
+  category: string;
+  name: string;
+  posts: Post[];
+}
+const { category, name, posts } = Astro.props;
+---
+
+<BlogIndex title={name} intro={siteT.theme.postsAbout(posts.length, name.toLowerCase())} activeCategory={category}>
+  <BlogPosts posts={posts} />
+</BlogIndex>

package/theme/templates/Home.astro

@@ -1,36 +1,36 @@
----
-// The front page (the standard theme's): the page chosen under "Indstillinger" › "Udseende" › "Standardsider" (packages/editor/site/home.ts), its
-// heading, then its sections in order: a text, and a block by its type in a section of its own (PageBlock.astro): the
-// standard ones' and the apps', the top ("Hero") among them.
-import Base from '@theme/layouts/Base.astro';
-import Container from '@theme/components/Container.astro';
-import Text from '@theme/components/home/Text.astro';
-import PageBlock from '@theme/components/home/PageBlock.astro';
-import { site } from '@morphemecms/cms/site/site';
-import { picturesOf } from '@morphemecms/cms/site/images.mjs';
-import type { FrontPage } from '@morphemecms/cms/site/home';
-
-type Props = FrontPage;
-const { page, heading, headingHtml, sections } = Astro.props;
----
-
-<Base
-  title={heading}
-  description={page.data.description || site.description}
-  seoTitle={page.data.seoTitle}
-  seoDescription={page.data.seoDescription}
-  canonical={page.data.canonical}
-  noindex={page.data.noindex}
-  shareImage={page.data.shareImage}
-  pictures={picturesOf(page.body)}
-  shareTitle={page.data.shareTitle}
-  shareDescription={page.data.shareDescription}
->
-  <Container class="pt-8 md:pt-16">
-    <h1 class="theme-title max-w-[22ch]">{headingHtml ? <Fragment set:html={headingHtml} /> : heading}</h1>
-  </Container>
-  {sections.map((s, i) => {
-    const first = i === 0 ? 'theme-home-first' : undefined;
-    return s.type === 'text' ? <Text {...s} class={first} /> : <PageBlock section={s} class={first} />;
-  })}
-</Base>
+---
+// The front page (the standard theme's): the page chosen under "Indstillinger" › "Udseende" › "Standardsider" (packages/editor/site/home.ts), its
+// heading, then its sections in order: a text, and a block by its type in a section of its own (PageBlock.astro): the
+// standard ones' and the apps', the top ("Hero") among them.
+import Base from '@theme/layouts/Base.astro';
+import Container from '@theme/components/Container.astro';
+import Text from '@theme/components/home/Text.astro';
+import PageBlock from '@theme/components/home/PageBlock.astro';
+import { site } from '@morphemecms/cms/site/site';
+import { picturesOf } from '@morphemecms/cms/site/images.mjs';
+import type { FrontPage } from '@morphemecms/cms/site/home';
+
+type Props = FrontPage;
+const { page, heading, headingHtml, sections } = Astro.props;
+---
+
+<Base
+  title={heading}
+  description={page.data.description || site.description}
+  seoTitle={page.data.seoTitle}
+  seoDescription={page.data.seoDescription}
+  canonical={page.data.canonical}
+  noindex={page.data.noindex}
+  shareImage={page.data.shareImage}
+  pictures={picturesOf(page.body)}
+  shareTitle={page.data.shareTitle}
+  shareDescription={page.data.shareDescription}
+>
+  <Container class="pt-8 md:pt-16">
+    <h1 class="theme-title max-w-[22ch]">{headingHtml ? <Fragment set:html={headingHtml} /> : heading}</h1>
+  </Container>
+  {sections.map((s, i) => {
+    const first = i === 0 ? 'theme-home-first' : undefined;
+    return s.type === 'text' ? <Text {...s} class={first} /> : <PageBlock section={s} class={first} />;
+  })}
+</Base>

package/theme/templates/New.astro

@@ -1,68 +1,68 @@
----
-// /ny/: the new versions of pages (/ny/<the current page's address>, packages/editor/site/noindex.mjs) next to the current ones,
-// to compare before they replace them, with what to look at on each (`review`; the snackbar on a new version links to
-// its row, /ny/#<id>), and below them the blog posts that are hidden until they are approved. Not for search engines
-// (noindex, not in the sitemap).
-import Base from '@theme/layouts/Base.astro';
-import Icon from '@theme/components/Icon.astro';
-import Container from '@theme/components/Container.astro';
-import PageHeader from '@theme/components/PageHeader.astro';
-import { displayTitle, getPages, getPosts, pageHeading, postPath, stateOf } from '@morphemecms/cms/site/content';
-import { isPreview, livePath, previewId } from '@morphemecms/cms/site/noindex.mjs';
-import { siteT } from '@morphemecms/cms/src/i18n';
-
-const pages = await getPages();
-const byPath = new Map(pages.map((p) => [p.data.path, p]));
-const rows = pages
-  .filter((p) => isPreview(p.data.path))
-  .map((p) => ({ page: p, current: byPath.get(livePath(p.data.path)) }))
-  .sort((a, b) => a.page.data.path.localeCompare(b.page.data.path));
-
-const posts = (await getPosts({ unlisted: true })).filter((p) => stateOf(p.data) === 'unlisted');
----
-
-<Base title={siteT.theme.newPages} description={siteT.theme.newPagesDescription}>
-  <PageHeader title={siteT.theme.newPages} intro={siteT.theme.newPagesIntro} />
-
-  {rows.length > 0 && (
-    <Container as="section" class="mt-12 md:mt-16">
-      <ul class="rounded-panel border border-line px-5 md:px-7">
-        {rows.map(({ page, current }, i) => (
-          <li id={previewId(page.data.path)} class:list={['scroll-mt-24 py-5', i > 0 && 'border-t border-line']}>
-            <p class="type-title-medium">{pageHeading(page)}</p>
-            <p class="mt-1.5 flex flex-wrap gap-x-6 gap-y-1">
-              <a href={page.data.path} class="inline-flex items-center gap-1.5 text-accent hover:underline">
-                {siteT.theme.newVersion} <Icon name="arrow-right" size={16} />
-              </a>
-              {current ? (
-                <a href={current.data.path} class="inline-flex items-center gap-1.5 text-muted hover:text-accent">
-                  {siteT.theme.currentPage(displayTitle(current.data.title))}
-                </a>
-              ) : (
-                <span class="text-muted">{siteT.theme.newPage}</span>
-              )}
-            </p>
-            {page.data.review && <p class="mt-2 max-w-[75ch] type-body-medium whitespace-pre-line text-muted">{page.data.review}</p>}
-          </li>
-        ))}
-      </ul>
-    </Container>
-  )}
-
-  {posts.length > 0 && (
-    <Container as="section" class="mt-12 mb-20 md:mt-16 md:mb-28">
-      <h2 class="type-headline-small md:type-headline-medium">{siteT.theme.newPosts}</h2>
-      <p class="mt-2 max-w-[60ch] text-muted">{siteT.theme.newPostsIntro}</p>
-      <ul class="mt-5 rounded-panel border border-line px-5 md:px-7">
-        {posts.map((p, i) => (
-          <li class:list={['py-4', i > 0 && 'border-t border-line']}>
-            <a href={postPath(p)} class="inline-flex items-center gap-1.5 font-medium hover:text-accent">
-              {displayTitle(p.data.title)} <Icon name="arrow-right" size={16} />
-            </a>
-            {p.data.description && <p class="mt-1 max-w-[75ch] type-body-medium text-muted">{p.data.description}</p>}
-          </li>
-        ))}
-      </ul>
-    </Container>
-  )}
-</Base>
+---
+// /ny/: the new versions of pages (/ny/<the current page's address>, packages/editor/site/noindex.mjs) next to the current ones,
+// to compare before they replace them, with what to look at on each (`review`; the snackbar on a new version links to
+// its row, /ny/#<id>), and below them the blog posts that are hidden until they are approved. Not for search engines
+// (noindex, not in the sitemap).
+import Base from '@theme/layouts/Base.astro';
+import Icon from '@theme/components/Icon.astro';
+import Container from '@theme/components/Container.astro';
+import PageHeader from '@theme/components/PageHeader.astro';
+import { displayTitle, getPages, getPosts, pageHeading, postPath, stateOf } from '@morphemecms/cms/site/content';
+import { isPreview, livePath, previewId } from '@morphemecms/cms/site/noindex.mjs';
+import { siteT } from '@morphemecms/cms/src/i18n';
+
+const pages = await getPages();
+const byPath = new Map(pages.map((p) => [p.data.path, p]));
+const rows = pages
+  .filter((p) => isPreview(p.data.path))
+  .map((p) => ({ page: p, current: byPath.get(livePath(p.data.path)) }))
+  .sort((a, b) => a.page.data.path.localeCompare(b.page.data.path));
+
+const posts = (await getPosts({ unlisted: true })).filter((p) => stateOf(p.data) === 'unlisted');
+---
+
+<Base title={siteT.theme.newPages} description={siteT.theme.newPagesDescription}>
+  <PageHeader title={siteT.theme.newPages} intro={siteT.theme.newPagesIntro} />
+
+  {rows.length > 0 && (
+    <Container as="section" class="mt-12 md:mt-16">
+      <ul class="rounded-panel border border-line px-5 md:px-7">
+        {rows.map(({ page, current }, i) => (
+          <li id={previewId(page.data.path)} class:list={['scroll-mt-24 py-5', i > 0 && 'border-t border-line']}>
+            <p class="type-title-medium">{pageHeading(page)}</p>
+            <p class="mt-1.5 flex flex-wrap gap-x-6 gap-y-1">
+              <a href={page.data.path} class="inline-flex items-center gap-1.5 text-accent hover:underline">
+                {siteT.theme.newVersion} <Icon name="arrow-right" size={16} />
+              </a>
+              {current ? (
+                <a href={current.data.path} class="inline-flex items-center gap-1.5 text-muted hover:text-accent">
+                  {siteT.theme.currentPage(displayTitle(current.data.title))}
+                </a>
+              ) : (
+                <span class="text-muted">{siteT.theme.newPage}</span>
+              )}
+            </p>
+            {page.data.review && <p class="mt-2 max-w-[75ch] type-body-medium whitespace-pre-line text-muted">{page.data.review}</p>}
+          </li>
+        ))}
+      </ul>
+    </Container>
+  )}
+
+  {posts.length > 0 && (
+    <Container as="section" class="mt-12 mb-20 md:mt-16 md:mb-28">
+      <h2 class="type-headline-small md:type-headline-medium">{siteT.theme.newPosts}</h2>
+      <p class="mt-2 max-w-[60ch] text-muted">{siteT.theme.newPostsIntro}</p>
+      <ul class="mt-5 rounded-panel border border-line px-5 md:px-7">
+        {posts.map((p, i) => (
+          <li class:list={['py-4', i > 0 && 'border-t border-line']}>
+            <a href={postPath(p)} class="inline-flex items-center gap-1.5 font-medium hover:text-accent">
+              {displayTitle(p.data.title)} <Icon name="arrow-right" size={16} />
+            </a>
+            {p.data.description && <p class="mt-1 max-w-[75ch] type-body-medium text-muted">{p.data.description}</p>}
+          </li>
+        ))}
+      </ul>
+    </Container>
+  )}
+</Base>

package/theme/templates/NotFound.astro

@@ -1,117 +1,117 @@
----
-// 404 (the standard theme's): the page chosen as the 404 page under "Indstillinger" › "Udseende" › "Standardsider"
-// (packages/editor/site/standardPages.ts), which the owner edits as a page in the editor. Its heading and introduction, then the
-// page the visitor most likely meant (matched on the words in the address, in the browser; an outlined card,
-// ui/Card.tsx), and below that its sections: a text and any block by its type (PageBlock.astro).
-import Base from '@theme/layouts/Base.astro';
-import Icon from '@theme/components/Icon.astro';
-import Card from '@theme/ui/Card';
-import PageHeader from '@theme/components/PageHeader.astro';
-import Container from '@theme/components/Container.astro';
-import TextSection from '@theme/components/TextSection.astro';
-import PageBlock from '@theme/components/home/PageBlock.astro';
-import { space } from '@morphemecms/cms/site/sections';
-import { displayTitle, getPages, getPosts, pageHeading } from '@morphemecms/cms/site/content';
-import { standardPaths, type StandardPageView } from '@morphemecms/cms/site/standardPages';
-import { siteT } from '@morphemecms/cms/src/i18n';
-
-type Props = StandardPageView;
-const { heading, intro, sections } = Astro.props;
-// The front page is at / and the blog page at /blog/ (their own addresses send on there); the 404 page is not a page to go to.
-const own = [standardPaths.front, standardPaths.blog, standardPaths.notFound];
-const pages = (await getPages({ previews: false, unlisted: false })).filter((p) => !own.includes(p.data.path));
-const posts = await getPosts();
-// Every page and post the suggestion can point to: [path, title].
-const index: [string, string][] = [
-  ...pages.map((p): [string, string] => [p.data.path, pageHeading(p)]),
-  ...posts.map((p): [string, string] => [`/${p.id}/`, displayTitle(p.data.title)]),
-  ['/blog/', 'Blog'],
-];
-
-// Less space above the first section than on the other pages: the suggestion sits between.
-const spaceOf = (i: number) => (i === 0 ? 'mt-6 md:mt-8' : space(i));
----
-
-<Base title={siteT.theme.notFound} noindex>
-  <PageHeader title={heading} intro={intro} />
-
-  <Container as="div" class="mt-8 md:mt-12">
-    <Card href="" id="suggestion" hidden className="group flex max-w-2xl items-center justify-between gap-6">
-      <span>
-        <span class="type-body-medium block text-muted">{siteT.theme.didYouMean}</span>
-        <span id="suggestion-title" class="type-title-large mt-1 block group-hover:text-accent"></span>
-      </span>
-      <Icon name="arrow-right" size={22} class="shrink-0 text-accent transition-transform group-hover:translate-x-0.5" />
-    </Card>
-  </Container>
-
-  {sections.map((s, i) => {
-    switch (s.type) {
-      case 'text':
-        return <TextSection heading={s.heading} body={s.body ?? ''} class={spaceOf(i)} />;
-      default:
-        // A block: the standard one's or the app's, by its type.
-        return <PageBlock section={s} />;
-    }
-  })}
-
-  <script is:inline type="application/json" id="page-index" set:html={JSON.stringify(index).replace(/</g, '\\u003c')} />
-  <script>
-    // Suggest the page whose address shares the most words with the one that was not found.
-    const decoded = (s: string) => {
-      try {
-        return decodeURIComponent(s);
-      } catch {
-        return s;
-      }
-    };
-    const words = (s: string) =>
-      decoded(s)
-        .toLowerCase()
-        .split(/[^a-z0-9æøå]+/)
-        .filter((w) => w.length > 2 && !/^\d+$/.test(w));
-
-    function distance(a: string, b: string) {
-      const row = Array.from({ length: b.length + 1 }, (_, i) => i);
-      for (let i = 1; i <= a.length; i++) {
-        let prev = row[0];
-        row[0] = i;
-        for (let j = 1; j <= b.length; j++) {
-          const cur = row[j];
-          row[j] = Math.min(row[j] + 1, row[j - 1] + 1, prev + (a[i - 1] === b[j - 1] ? 0 : 1));
-          prev = cur;
-        }
-      }
-      return row[b.length];
-    }
-
-    const likeness = (a: string, b: string) => {
-      if (a === b) return 1;
-      // One word inside the other: "pris" in "priser", "kage" in "pandekage".
-      if (a.length >= 4 && b.length >= 4 && (a.includes(b) || b.includes(a))) return 0.8;
-      const d = 1 - distance(a, b) / Math.max(a.length, b.length);
-      return d >= 0.75 ? d : 0;
-    };
-
-    const wanted = words(location.pathname);
-    const index: [string, string][] = JSON.parse(document.getElementById('page-index')!.textContent!);
-    let best: [string, string] | undefined;
-    let bestScore = 0;
-    if (wanted.length) {
-      for (const entry of index) {
-        const have = words(entry[0]);
-        if (!have.length) continue;
-        const hits = wanted.reduce((sum, w) => sum + Math.max(...have.map((h) => likeness(w, h))), 0);
-        // Mostly how many of the wanted words were found; a little for how close the page is in length.
-        const score = hits / wanted.length - 0.02 * Math.abs(have.length - wanted.length);
-        if (score > bestScore) [best, bestScore] = [entry, score];
-      }
-    }
-    if (best && bestScore >= 0.4) {
-      const link = document.getElementById('suggestion') as HTMLAnchorElement;
-      link.href = best[0];
-      document.getElementById('suggestion-title')!.textContent = best[1];
-      link.hidden = false;
-    }
-  </script>
-</Base>
+---
+// 404 (the standard theme's): the page chosen as the 404 page under "Indstillinger" › "Udseende" › "Standardsider"
+// (packages/editor/site/standardPages.ts), which the owner edits as a page in the editor. Its heading and introduction, then the
+// page the visitor most likely meant (matched on the words in the address, in the browser; an outlined card,
+// ui/Card.tsx), and below that its sections: a text and any block by its type (PageBlock.astro).
+import Base from '@theme/layouts/Base.astro';
+import Icon from '@theme/components/Icon.astro';
+import Card from '@theme/ui/Card';
+import PageHeader from '@theme/components/PageHeader.astro';
+import Container from '@theme/components/Container.astro';
+import TextSection from '@theme/components/TextSection.astro';
+import PageBlock from '@theme/components/home/PageBlock.astro';
+import { space } from '@morphemecms/cms/site/sections';
+import { displayTitle, getPages, getPosts, pageHeading } from '@morphemecms/cms/site/content';
+import { standardPaths, type StandardPageView } from '@morphemecms/cms/site/standardPages';
+import { siteT } from '@morphemecms/cms/src/i18n';
+
+type Props = StandardPageView;
+const { heading, intro, sections } = Astro.props;
+// The front page is at / and the blog page at /blog/ (their own addresses send on there); the 404 page is not a page to go to.
+const own = [standardPaths.front, standardPaths.blog, standardPaths.notFound];
+const pages = (await getPages({ previews: false, unlisted: false })).filter((p) => !own.includes(p.data.path));
+const posts = await getPosts();
+// Every page and post the suggestion can point to: [path, title].
+const index: [string, string][] = [
+  ...pages.map((p): [string, string] => [p.data.path, pageHeading(p)]),
+  ...posts.map((p): [string, string] => [`/${p.id}/`, displayTitle(p.data.title)]),
+  ['/blog/', 'Blog'],
+];
+
+// Less space above the first section than on the other pages: the suggestion sits between.
+const spaceOf = (i: number) => (i === 0 ? 'mt-6 md:mt-8' : space(i));
+---
+
+<Base title={siteT.theme.notFound} noindex>
+  <PageHeader title={heading} intro={intro} />
+
+  <Container as="div" class="mt-8 md:mt-12">
+    <Card href="" id="suggestion" hidden className="group flex max-w-2xl items-center justify-between gap-6">
+      <span>
+        <span class="type-body-medium block text-muted">{siteT.theme.didYouMean}</span>
+        <span id="suggestion-title" class="type-title-large mt-1 block group-hover:text-accent"></span>
+      </span>
+      <Icon name="arrow-right" size={22} class="shrink-0 text-accent transition-transform group-hover:translate-x-0.5" />
+    </Card>
+  </Container>
+
+  {sections.map((s, i) => {
+    switch (s.type) {
+      case 'text':
+        return <TextSection heading={s.heading} body={s.body ?? ''} class={spaceOf(i)} />;
+      default:
+        // A block: the standard one's or the app's, by its type.
+        return <PageBlock section={s} />;
+    }
+  })}
+
+  <script is:inline type="application/json" id="page-index" set:html={JSON.stringify(index).replace(/</g, '\\u003c')} />
+  <script>
+    // Suggest the page whose address shares the most words with the one that was not found.
+    const decoded = (s: string) => {
+      try {
+        return decodeURIComponent(s);
+      } catch {
+        return s;
+      }
+    };
+    const words = (s: string) =>
+      decoded(s)
+        .toLowerCase()
+        .split(/[^a-z0-9æøå]+/)
+        .filter((w) => w.length > 2 && !/^\d+$/.test(w));
+
+    function distance(a: string, b: string) {
+      const row = Array.from({ length: b.length + 1 }, (_, i) => i);
+      for (let i = 1; i <= a.length; i++) {
+        let prev = row[0];
+        row[0] = i;
+        for (let j = 1; j <= b.length; j++) {
+          const cur = row[j];
+          row[j] = Math.min(row[j] + 1, row[j - 1] + 1, prev + (a[i - 1] === b[j - 1] ? 0 : 1));
+          prev = cur;
+        }
+      }
+      return row[b.length];
+    }
+
+    const likeness = (a: string, b: string) => {
+      if (a === b) return 1;
+      // One word inside the other: "pris" in "priser", "kage" in "pandekage".
+      if (a.length >= 4 && b.length >= 4 && (a.includes(b) || b.includes(a))) return 0.8;
+      const d = 1 - distance(a, b) / Math.max(a.length, b.length);
+      return d >= 0.75 ? d : 0;
+    };
+
+    const wanted = words(location.pathname);
+    const index: [string, string][] = JSON.parse(document.getElementById('page-index')!.textContent!);
+    let best: [string, string] | undefined;
+    let bestScore = 0;
+    if (wanted.length) {
+      for (const entry of index) {
+        const have = words(entry[0]);
+        if (!have.length) continue;
+        const hits = wanted.reduce((sum, w) => sum + Math.max(...have.map((h) => likeness(w, h))), 0);
+        // Mostly how many of the wanted words were found; a little for how close the page is in length.
+        const score = hits / wanted.length - 0.02 * Math.abs(have.length - wanted.length);
+        if (score > bestScore) [best, bestScore] = [entry, score];
+      }
+    }
+    if (best && bestScore >= 0.4) {
+      const link = document.getElementById('suggestion') as HTMLAnchorElement;
+      link.href = best[0];
+      document.getElementById('suggestion-title')!.textContent = best[1];
+      link.hidden = false;
+    }
+  </script>
+</Base>

package/theme/theme.json

@@ -1,28 +1,28 @@
-{
-  "name": "Material",
-  "version": "1.0.0",
-  "author": "Lars Adolfsen",
-  "icon": "/editor/icon-192.png",
-  "license": "MIT",
-  "thirdParty": [],
-  "icons": "material-symbols",
-  "motion": "expressive",
-  "description": {
-    "da-DK": "Hjemmesiden i Googles Material Design 3, som mange kender fra Android: klar, enkel og velkendt.",
-    "en-US": "The website in Google's Material Design 3, which many know from Android: clear, simple and familiar."
-  },
-  "highlights": {
-    "da-DK": [
-      "Roboto og Materials tekststørrelser",
-      "Tonede flader i stedet for streger",
-      "Materials former, knapper og bevægelser",
-      "Materials ikoner"
-    ],
-    "en-US": [
-      "Roboto and Material's type scale",
-      "Tonal surfaces instead of lines",
-      "Material's shapes, buttons and motion",
-      "Material's icons"
-    ]
-  }
-}
+{
+  "name": "Material",
+  "version": "1.0.0",
+  "author": "Lars Adolfsen",
+  "icon": "/editor/icon-192.png",
+  "license": "MIT",
+  "thirdParty": [],
+  "icons": "material-symbols",
+  "motion": "expressive",
+  "description": {
+    "da-DK": "Hjemmesiden i Googles Material Design 3, som mange kender fra Android: klar, enkel og velkendt.",
+    "en-US": "The website in Google's Material Design 3, which many know from Android: clear, simple and familiar."
+  },
+  "highlights": {
+    "da-DK": [
+      "Roboto og Materials tekststørrelser",
+      "Tonede flader i stedet for streger",
+      "Materials former, knapper og bevægelser",
+      "Materials ikoner"
+    ],
+    "en-US": [
+      "Roboto and Material's type scale",
+      "Tonal surfaces instead of lines",
+      "Material's shapes, buttons and motion",
+      "Material's icons"
+    ]
+  }
+}