seemore 1.10.0 → 1.10.2

package/README.md

@@ -61,7 +61,7 @@ And whichever preview is open, the page is also an editor: **double-click any pa
 ## Who is seemore for?
 
 <p align="center">
-  <video src="https://github.com/user-attachments/assets/8142fcb4-2a1f-4e48-82b5-059a28fc0cf2" width="640" controls muted></video>
+  <video src="https://github.com/user-attachments/assets/248032a6-7e25-4f9f-8d73-089b5302afb0" width="640" controls muted></video>
 </p>
 
 Typical use cases include:
@@ -72,6 +72,7 @@ Typical use cases include:
 - **Project documentation** — READMEs, architecture docs, RFCs, API documentation, specifications and engineering handbooks.
 - **Documentation review** — read rendered pages instead of raw Markdown while making fixes directly from the preview.
 - **Static documentation sites** — publish the same Markdown with `seemore build` instead of maintaining a separate documentation stack.
+- **Sharing a single page** — export one page as a self-contained HTML file to drop in Slack or email, no site or server needed.
 
 ## Features
 
@@ -79,12 +80,12 @@ Typical use cases include:
 - **Live preview** — add, rename, retitle or delete a file and the site updates immediately, navigation and search included
 - **Edit in place** — double-click any block in the preview to fix its Markdown; saves are surgical, so `git diff` shows the sentence you changed and nothing else
 - **Full MDX** — when Markdown isn't enough, `.mdx` pages take real JSX: your own React components, inline SVG, custom classes and CSS; `<Callout>`, `<Card>`, `<CodeBlockTabs>` and friends come built in, with no imports to write
-- **Static export** — `seemore build` prerenders every page to its own HTML file, `404.html` included, and adds the conventions individual hosts look for (`_redirects`, `200.html`, `.nojekyll`)
-- **Search built in** — static, zero-setup full-text search out of the box, with shareable highlighted results; [Algolia](https://algolia.com) and [Orama Cloud](https://orama.com) for hosted indexes
-- **Page actions** — an Actions button on every page: copy the page as Markdown, or export it as one self-contained HTML file, with the CLI equivalent in `seemore export <file>`
+- **Static export** — `seemore build` prerenders the whole site to HTML, `404.html` included, ready to deploy anywhere, with the conventions individual hosts look for (`_redirects`, `200.html`, `.nojekyll`)
+- **Page actions** — an Actions button on every page: copy the page as Markdown, or export it as one self-contained HTML file to share on its own — Slack, email, a USB stick, no server needed — with the CLI equivalent in `seemore export <file>`
 - **12 themes** — dark and light follow the system, with a toggle that remembers your choice; your own CSS always wins
 - **Rich Markdown** — GitHub Flavoured Markdown, admonitions, steps, `[[wikilinks]]`, [Mermaid](https://mermaid.js.org) and [D2](https://d2lang.com) diagrams, click-to-zoom images, embedded PDFs
 - **Editor integration** — one extension covers VS Code, Cursor, Antigravity and other VS Code-compatible editors, remote workspaces included
+- **Search built in** — static, zero-setup full-text search out of the box, with shareable highlighted results; [Algolia](https://algolia.com) and [Orama Cloud](https://orama.com) for hosted indexes
 
 ## View in your browser
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "seemore",
-  "version": "1.10.0",
+  "version": "1.10.2",
   "description": "Let AI write the Markdown. Let seemore show it better — zero config documentation framework.",
   "license": "MIT",
   "type": "module",

package/src/app/export/exportPage.ts

@@ -237,11 +237,14 @@ function escapeHtml(text: string): string {
 }
 
 /**
- * The exported file's runtime: theme toggle, code copy, click-to-zoom — the three behaviors
- * kept, at roughly a kilobyte instead of the site bundle. Handed to React in hydration on
- * the live page; here each is three lines against the static DOM.
+ * The exported file's runtime: theme toggle, code copy, heading anchor copy, click-to-zoom —
+ * the behaviors kept, at roughly a kilobyte instead of the site bundle. Handed to React in
+ * hydration on the live page; here each is a few lines against the static DOM.
  *
  * Kept free of `</script>`-shaped sequences by construction: it is inlined verbatim.
+ *
+ * `standalone.ts`'s `bindBehaviors` is a hand-written twin of this string (see its file
+ * header) — any behavior added or changed here needs the same change made there.
  */
 const RUNTIME = `(function () {
   var root = document.documentElement;
@@ -260,6 +263,23 @@ const RUNTIME = `(function () {
     });
   });
 
+  document.querySelectorAll('button[aria-label="Copy Anchor Link"]').forEach(function (button) {
+    var heading = button.closest('h1, h2, h3, h4, h5, h6');
+    var svg = button.querySelector('svg');
+    if (!heading || !heading.id || !navigator.clipboard) return;
+    var revert;
+    button.addEventListener('click', function () {
+      var url = new URL(window.location.href);
+      url.hash = heading.id;
+      navigator.clipboard.writeText(url.href);
+      if (!svg) return;
+      clearTimeout(revert);
+      var original = svg.innerHTML;
+      svg.innerHTML = '<polyline points="20 6 9 17 4 12"></polyline>';
+      revert = setTimeout(function () { svg.innerHTML = original; }, 1500);
+    });
+  });
+
   // The live site's TOC follows the reader with fumadocs' own scroll tracking; in the file,
   // the plainest version of the same behaviour — last heading above the fold wins.
   var tocLinks = [].slice.call(document.querySelectorAll('.seemore-export-toc a'));
@@ -285,7 +305,7 @@ const RUNTIME = `(function () {
 
   // Wide enough for the rail: open the collapsible so it reads as a list, not a disclosure.
   var tocDetails = document.querySelector('.seemore-export-toc details');
-  if (tocDetails && window.matchMedia('(min-width: 1400px)').matches) tocDetails.open = true;
+  if (tocDetails && window.matchMedia('(min-width: 1440px)').matches) tocDetails.open = true;
 
   var main = document.querySelector('main');
   var overlay = document.createElement('div');

package/src/app/export/standalone.ts

@@ -10,7 +10,8 @@
  *
  * The browser export ships a hand-written twin of the behavior half (the `RUNTIME` string
  * in `exportPage.ts`): it needs no diagram half, because its diagrams are already SVG when
- * the export runs. Keep the two in sync.
+ * the export runs. Keep the two in sync — adding, removing or changing a behavior in one
+ * `bindBehaviors`/`RUNTIME` requires the identical change in the other.
  */
 
 const isDark = (): boolean => document.documentElement.classList.contains('dark');
@@ -78,6 +79,23 @@ function bindBehaviors(): void {
     });
   }
 
+  for (const button of document.querySelectorAll('button[aria-label="Copy Anchor Link"]')) {
+    const heading = button.closest('h1, h2, h3, h4, h5, h6');
+    const svg = button.querySelector('svg');
+    if (heading === null || heading.id === '' || navigator.clipboard === undefined) continue;
+    let revert: ReturnType<typeof setTimeout> | undefined;
+    button.addEventListener('click', () => {
+      const url = new URL(window.location.href);
+      url.hash = heading.id;
+      void navigator.clipboard.writeText(url.href);
+      if (svg === null) return;
+      clearTimeout(revert);
+      const original = svg.innerHTML;
+      svg.innerHTML = '<polyline points="20 6 9 17 4 12"></polyline>';
+      revert = setTimeout(() => { svg.innerHTML = original; }, 1500);
+    });
+  }
+
   // The live site's TOC follows the reader with fumadocs' own scroll tracking; in the file,
   // the plainest version of the same behaviour — last heading above the fold wins.
   const tocLinks = Array.from(document.querySelectorAll<HTMLAnchorElement>('.seemore-export-toc a'));
@@ -106,7 +124,7 @@ function bindBehaviors(): void {
 
   // Wide enough for the rail: open the collapsible so it reads as a list, not a disclosure.
   const tocDetails = document.querySelector<HTMLDetailsElement>('.seemore-export-toc details');
-  if (tocDetails && window.matchMedia('(min-width: 1400px)').matches) tocDetails.open = true;
+  if (tocDetails && window.matchMedia('(min-width: 1440px)').matches) tocDetails.open = true;
 
   const overlay = document.createElement('div');
   overlay.className = 'seemore-export-overlay';

package/src/app/styles/globals.css

@@ -622,11 +622,17 @@
   color: var(--color-fd-foreground, #111827);
 }
 
-/* From 1400px up there is room for both the reading column and the rail side by side;
-   below that the rail would ride over the text, so the collapsible stays in flow. */
-@media (min-width: 1400px) {
+/* From 1440px up there is room for both the reading column and the rail side by side;
+   below that the rail would ride over the text, so the collapsible stays in flow.
+
+   The rail's `inset-inline-end` is pinned to the article's own centring math (its
+   56rem/2 half-width) rather than a flat viewport offset, so the gap between the
+   article's right edge and the rail stays a fixed 2rem at any width above the
+   breakpoint — matching the live page's `md:px-8` column padding — instead of shrinking
+   toward zero as the viewport narrows toward the breakpoint. */
+@media (min-width: 1440px) {
   .seemore-export-toc {
-    inset-inline-end: 2rem;
+    inset-inline-end: calc((100vw - 56rem) / 2 - 14rem - 2rem);
     margin-block: 0;
     max-height: calc(100vh - 8rem);
     overflow-y: auto;