basalt-ui 1.30.2 → 1.31.0

package/dist/common/use-measured-widths.js

@@ -0,0 +1,51 @@
+import { useRef } from "react";
+import { useIsomorphicLayoutEffect } from "./isomorphic-layout-effect.js";
+function useMeasuredWidths(options) {
+  const { resolveRoot, signature, enabled = true, nonce = 0, extra, onMeasure } = options;
+  const boxes = useRef(/* @__PURE__ */ new Map());
+  const signatureRef = useRef(signature);
+  const remeasureRef = useRef(() => {
+  });
+  const resolveRef = useRef(resolveRoot);
+  resolveRef.current = resolveRoot;
+  const extraRef = useRef(extra);
+  extraRef.current = extra;
+  const onMeasureRef = useRef(onMeasure);
+  onMeasureRef.current = onMeasure;
+  useIsomorphicLayoutEffect(() => {
+    if (signatureRef.current !== signature) {
+      signatureRef.current = signature;
+      boxes.current.clear();
+    }
+    if (!enabled) {
+      remeasureRef.current = () => {
+      };
+      return;
+    }
+    const root = resolveRef.current();
+    if (root === null) {
+      remeasureRef.current = () => {
+      };
+      return;
+    }
+    const measure = () => {
+      onMeasureRef.current(root, boxes);
+    };
+    remeasureRef.current = measure;
+    if (typeof ResizeObserver === "undefined") {
+      measure();
+      return;
+    }
+    const observer = new ResizeObserver(measure);
+    observer.observe(root);
+    for (const el of extraRef.current?.(root) ?? []) {
+      if (el !== null) observer.observe(el);
+    }
+    measure();
+    return () => observer.disconnect();
+  }, [enabled, signature, nonce]);
+  return { boxes, remeasure: () => remeasureRef.current() };
+}
+export {
+  useMeasuredWidths
+};

package/dist/common/use-media-query.d.ts

@@ -0,0 +1,6 @@
+/** A one-off, non-reactive read — for a dev-only check that runs once inside an effect/callback
+ * rather than subscribing for the component's lifetime. Prefer `useMediaQuery` for anything that
+ * should re-render on a match change. */
+export declare function readMediaQuery(query: string, fallback: boolean): boolean;
+export declare function useMediaQuery(query: string, serverFallback: boolean): boolean;
+//# sourceMappingURL=use-media-query.d.ts.map

package/dist/common/use-media-query.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-media-query.d.ts","sourceRoot":"","sources":["../../src/common/use-media-query.ts"],"names":[],"mappings":"AAgCA;;yCAEyC;AACzC,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,GAAG,OAAO,CAExE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,cAAc,EAAE,OAAO,GAAG,OAAO,CAgB7E"}

package/dist/common/use-media-query.js

@@ -0,0 +1,40 @@
+import { useCallback, useSyncExternalStore } from "react";
+const cache = /* @__PURE__ */ new WeakMap();
+function mediaQueryList(query) {
+  if (typeof window === "undefined" || typeof window.matchMedia !== "function") return null;
+  let byQuery = cache.get(window.matchMedia);
+  if (byQuery === void 0) {
+    byQuery = /* @__PURE__ */ new Map();
+    cache.set(window.matchMedia, byQuery);
+  }
+  const cached = byQuery.get(query);
+  if (cached !== void 0) return cached;
+  const list = window.matchMedia(query);
+  byQuery.set(query, list);
+  return list;
+}
+function readMediaQuery(query, fallback) {
+  return mediaQueryList(query)?.matches ?? fallback;
+}
+function useMediaQuery(query, serverFallback) {
+  const subscribe = useCallback(
+    (onStoreChange) => {
+      const list = mediaQueryList(query);
+      if (list === null) return () => {
+      };
+      list.addEventListener("change", onStoreChange);
+      return () => list.removeEventListener("change", onStoreChange);
+    },
+    [query]
+  );
+  const getSnapshot = useCallback(
+    () => mediaQueryList(query)?.matches ?? serverFallback,
+    [query, serverFallback]
+  );
+  const getServerSnapshot = useCallback(() => serverFallback, [serverFallback]);
+  return useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+}
+export {
+  readMediaQuery,
+  useMediaQuery
+};

package/dist/common/validate.d.ts

@@ -20,6 +20,15 @@ type CheckResult = string | null | undefined | Array<string | null | undefined>;
  * )
  */
 export declare function useValidateProps(component: string, check: () => CheckResult, deps: unknown[]): void;
+/**
+ * The same once-per-`(component, message)` dev diagnostic {@link useValidateProps} logs, for a
+ * caller that already owns the effect a check would otherwise race — a decision made synchronously
+ * inside a `useLayoutEffect` (e.g. `ChartFrame`'s header-slot claim, P2-9) has no business waiting a
+ * further render for a REACTIVE check on state that effect itself just set: that state update lags
+ * one commit behind the decision, and a passive-effect check racing it warns about instances that
+ * are about to win in the very next render.
+ */
+export declare function reportOnce(component: string, message: string): void;
 /** Test seam. The once-per-message Set is module state, so a suite has to be able to clear it. */
 export declare function resetValidatedProps(): void;
 /**

package/dist/common/validate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"validate.d.ts","sourceRoot":"","sources":["../../src/common/validate.ts"],"names":[],"mappings":"AAYA,iGAAiG;AACjG,KAAK,WAAW,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,GAAG,KAAK,CAAC,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,CAAA;AAU/E;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,gBAAgB,CAC9B,SAAS,EAAE,MAAM,EACjB,KAAK,EAAE,MAAM,WAAW,EACxB,IAAI,EAAE,OAAO,EAAE,GACd,IAAI,CAeN;AAED,kGAAkG;AAClG,wBAAgB,mBAAmB,IAAI,IAAI,CAE1C;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,mBAAmB,CAAC,CAAC,SAAS,MAAM,EAClD,SAAS,EAAE,MAAM,EACjB,KAAK,EAAE,CAAC,EACR,IAAI,EAAE,aAAa,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC,CAAC,EAC7C,KAAK,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC,EAAE,MAAM,CAAC,CAAC,GACxD,IAAI,CASN"}
+{"version":3,"file":"validate.d.ts","sourceRoot":"","sources":["../../src/common/validate.ts"],"names":[],"mappings":"AAYA,iGAAiG;AACjG,KAAK,WAAW,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,GAAG,KAAK,CAAC,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,CAAA;AAU/E;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,gBAAgB,CAC9B,SAAS,EAAE,MAAM,EACjB,KAAK,EAAE,MAAM,WAAW,EACxB,IAAI,EAAE,OAAO,EAAE,GACd,IAAI,CAYN;AAED;;;;;;;GAOG;AACH,wBAAgB,UAAU,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,IAAI,CAMnE;AAED,kGAAkG;AAClG,wBAAgB,mBAAmB,IAAI,IAAI,CAE1C;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,mBAAmB,CAAC,CAAC,SAAS,MAAM,EAClD,SAAS,EAAE,MAAM,EACjB,KAAK,EAAE,CAAC,EACR,IAAI,EAAE,aAAa,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC,CAAC,EAC7C,KAAK,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC,EAAE,MAAM,CAAC,CAAC,GACxD,IAAI,CASN"}

package/dist/common/validate.js

@@ -9,13 +9,17 @@ function useValidateProps(component, check, deps) {
     const messages = Array.isArray(result) ? result : [result];
     for (const raw of messages) {
       if (raw === null || raw === void 0) continue;
-      const key = `${component} ${raw}`;
-      if (reported.has(key)) continue;
-      reported.add(key);
-      console.error(raw);
+      reportOnce(component, raw);
     }
   }, deps);
 }
+function reportOnce(component, message) {
+  if (!isDev()) return;
+  const key = `${component} ${message}`;
+  if (reported.has(key)) return;
+  reported.add(key);
+  console.error(message);
+}
 function resetValidatedProps() {
   reported.clear();
 }
@@ -31,6 +35,7 @@ function assertRequiredProps(component, props, keys, hints) {
 }
 export {
   assertRequiredProps,
+  reportOnce,
   resetValidatedProps,
   useValidateProps
 };

package/dist/content/article-layout.d.ts

@@ -5,8 +5,10 @@
  * `ReadingProgress`) — it does not reimplement them.
  *
  * The header/content/footer all align to the SAME grid column, so the article body reads as one
- * consistent width whether or not the TOC rail is visible (hidden below the 1200px breakpoint,
- * where the content column takes the full centered width instead).
+ * consistent width whether or not the TOC rail is visible. Below the 1200px breakpoint the rail
+ * is replaced, not dropped: a sticky "On this page" trigger opens the same `TableOfContents` in a
+ * `Popover` (docs/CONTENT-SPEC.md §7's originally-documented behavior, `useSizeClass() !==
+ * 'expanded'` — the same numeric threshold, resolved in JS instead of `@media`).
  *
  * @example
  * import { ArticleLayout } from 'basalt-ui/content'

package/dist/content/article-layout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"article-layout.d.ts","sourceRoot":"","sources":["../../src/content/article-layout.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKrD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAK3C,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;IAC7B,4FAA4F;IAC5F,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAA;IACtB,2CAA2C;IAC3C,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;CAC9B,CAAA;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;CAC9B,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC/B,2EAA2E;IAC3E,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,IAAI,CAAC,EAAE,iBAAiB,CAAA;IACjC,wFAAwF;IACxF,QAAQ,CAAC,GAAG,CAAC,EAAE,OAAO,CAAA;IACtB,0FAA0F;IAC1F,QAAQ,CAAC,eAAe,CAAC,EAAE,OAAO,CAAA;IAClC,QAAQ,CAAC,IAAI,CAAC,EAAE,gBAAgB,CAAA;IAChC,QAAQ,CAAC,IAAI,CAAC,EAAE,gBAAgB,CAAA;IAChC,wFAAwF;IACxF,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,gBAAgB,EAAE,IAAI,EAAE,SAAS,KAAK,SAAS,CAAA;IAC9E,wDAAwD;IACxD,QAAQ,CAAC,OAAO,CAAC,EAAE,YAAY,CAAA;IAC/B;0EACsE;IACtE,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;IACxB,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAC/B,CAAA;AAiCD,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,IAAI,EACJ,GAAU,EACV,eAAuB,EACvB,IAAI,EACJ,IAAI,EACJ,UAA8B,EAC9B,OAAmB,EACnB,MAAgB,EAChB,SAAS,EACT,KAAK,GACN,EAAE,kBAAkB,+BAqDpB"}
+{"version":3,"file":"article-layout.d.ts","sourceRoot":"","sources":["../../src/content/article-layout.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAMrD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAK3C,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;IAC7B,4FAA4F;IAC5F,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAA;IACtB,2CAA2C;IAC3C,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;CAC9B,CAAA;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;CAC9B,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC/B,2EAA2E;IAC3E,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,IAAI,CAAC,EAAE,iBAAiB,CAAA;IACjC,wFAAwF;IACxF,QAAQ,CAAC,GAAG,CAAC,EAAE,OAAO,CAAA;IACtB,0FAA0F;IAC1F,QAAQ,CAAC,eAAe,CAAC,EAAE,OAAO,CAAA;IAClC,QAAQ,CAAC,IAAI,CAAC,EAAE,gBAAgB,CAAA;IAChC,QAAQ,CAAC,IAAI,CAAC,EAAE,gBAAgB,CAAA;IAChC,wFAAwF;IACxF,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,gBAAgB,EAAE,IAAI,EAAE,SAAS,KAAK,SAAS,CAAA;IAC9E,wDAAwD;IACxD,QAAQ,CAAC,OAAO,CAAC,EAAE,YAAY,CAAA;IAC/B;0EACsE;IACtE,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;IACxB,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAC/B,CAAA;AAiCD,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,IAAI,EACJ,GAAU,EACV,eAAuB,EACvB,IAAI,EACJ,IAAI,EACJ,UAA8B,EAC9B,OAAmB,EACnB,MAAgB,EAChB,SAAS,EACT,KAAK,GACN,EAAE,kBAAkB,+BAyGpB"}

package/dist/content/article-layout.js

@@ -1,6 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useRef } from "react";
-import { ScrollArea } from "@mantine/core";
+import { useRef, useState } from "react";
+import { Button, Popover, ScrollArea } from "@mantine/core";
+import { useSizeClass } from "../shell/use-size-class.js";
 import classes from "./article-layout.module.css";
 import { formatArticleDate } from "./article-model.js";
 import { Prose } from "./prose.js";
@@ -44,6 +45,13 @@ function ArticleLayout({
   const articleRef = useRef(null);
   const rootClass = [classes.root, !toc && classes.noToc, className].filter(Boolean).join(" ");
   const hasMetaRow = meta?.date !== void 0 || meta?.readingTime !== void 0;
+  const showTocRail = useSizeClass() === "expanded";
+  const [tocOpen, setTocOpen] = useState(false);
+  const prevShowTocRailRef = useRef(showTocRail);
+  if (prevShowTocRailRef.current !== showTocRail) {
+    prevShowTocRailRef.current = showTocRail;
+    if (tocOpen) setTocOpen(false);
+  }
   return /* @__PURE__ */ jsxs("div", { className: rootClass, ...style !== void 0 && { style }, children: [
     readingProgress && /* @__PURE__ */ jsx(ReadingProgress, { target: articleRef }),
     meta !== void 0 && /* @__PURE__ */ jsxs("header", { className: classes.header, children: [
@@ -59,7 +67,39 @@ function ArticleLayout({
       ] })
     ] }),
     /* @__PURE__ */ jsx("div", { className: classes.content, ref: articleRef, children: /* @__PURE__ */ jsx(Prose, { density, children }) }),
-    toc && /* @__PURE__ */ jsx("div", { className: classes.tocRail, children: /* @__PURE__ */ jsx(ScrollArea.Autosize, { mah: "calc(100vh - 108px)", type: "hover", children: /* @__PURE__ */ jsx(TableOfContents, { containerRef: articleRef }) }) }),
+    toc && showTocRail && /* @__PURE__ */ jsx("div", { className: classes.tocRail, children: /* @__PURE__ */ jsx(ScrollArea.Autosize, { mah: "calc(100vh - 108px)", type: "hover", children: /* @__PURE__ */ jsx(TableOfContents, { containerRef: articleRef }) }) }),
+    toc && !showTocRail && // `.tocTrigger`'s `grid-row: 2` (article-layout.module.css) is EXPLICIT, matching
+    // `.content`'s own row — not left to CSS Grid's auto-placement, which used to land this
+    // in its own row below the content instead of at its top (both are `grid-column: 1`, and
+    // the auto-placement cursor moves past row 2 once `.content` claims it).
+    /* @__PURE__ */ jsxs(
+      Popover,
+      {
+        opened: tocOpen,
+        onChange: setTocOpen,
+        onDismiss: () => setTocOpen(false),
+        position: "bottom-end",
+        withinPortal: true,
+        shadow: "md",
+        radius: "sm",
+        trapFocus: true,
+        children: [
+          /* @__PURE__ */ jsx(Popover.Target, { children: /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "subtle",
+              color: "gray",
+              size: "compact-xs",
+              className: classes.tocTrigger,
+              classNames: { label: classes.tocTriggerLabel },
+              onClick: () => setTocOpen((current) => !current),
+              children: "On this page"
+            }
+          ) }),
+          /* @__PURE__ */ jsx(Popover.Dropdown, { className: classes.tocDropdown, children: /* @__PURE__ */ jsx(ScrollArea.Autosize, { mah: "calc(100vh - 108px)", type: "hover", children: /* @__PURE__ */ jsx(TableOfContents, { containerRef: articleRef, onNavigate: () => setTocOpen(false) }) }) })
+        ]
+      }
+    ),
     (prev !== void 0 || next !== void 0) && /* @__PURE__ */ jsxs("footer", { className: classes.footer, children: [
       prev !== void 0 ? /* @__PURE__ */ jsx(NavCell, { target: prev, side: "prev", renderLink }) : /* @__PURE__ */ jsx("span", {}),
       next !== void 0 ? /* @__PURE__ */ jsx(NavCell, { target: next, side: "next", renderLink }) : /* @__PURE__ */ jsx("span", {})

package/dist/content/article-layout.module.css

@@ -17,12 +17,19 @@
   grid-template-columns: minmax(0, var(--vx-prose-measure));
 }
 
-/* The literal below MUST equal `BREAKPOINTS.article` (src/tokens/index.ts) — a `@media`
+/* The literal below MUST equal `BREAKPOINTS.article - 0.1` (src/tokens/index.ts) — a `@media`
  * condition is resolved before custom properties exist, so `max-width: var(--x)` is invalid CSS
- * and a stylesheet with a responsive rule has no choice but to write the number. The token is the
- * readable half; `article-layout.breakpoint.test.ts` asserts the two agree, the same
+ * and a stylesheet with a responsive rule has no choice but to write the number. The 0.1px offset
+ * is `tokens/size-classes.ts`' own `sizeClassMaxEm` convention (Mantine's own): the JS side
+ * (`article-layout.tsx`'s `useSizeClass() === 'expanded'`) reads a plain `min-width: 1200px`,
+ * inclusive AT 1200 — writing this query as a bare `max-width: 1200px` would ALSO be inclusive at
+ * exactly 1200px, so at that one width both conditions would fire at once: JS renders the rail,
+ * and this rule then hides it with `display: none`, leaving neither the rail nor the trigger
+ * visible. `1199.9px` makes the two conditions strict complements with no such gap. The token is
+ * the readable half; `article-layout.breakpoint.test.ts` asserts the two agree, the same
  * "literal must match the token" idiom as `styles.floor.test.ts`. Change both or neither. */
-@media (max-width: 1200px) {
+/* theme-allow raw-media-query — deliberate literal pinned to BREAKPOINTS.article, outside shell/** */
+@media (max-width: 1199.9px) {
   .root {
     grid-template-columns: minmax(0, var(--vx-prose-measure));
   }
@@ -34,6 +41,7 @@
 
 .header {
   grid-column: 1;
+  grid-row: 1;
   display: flex;
   flex-direction: column;
   gap: var(--vx-space-article-header-gap);
@@ -71,11 +79,13 @@
 
 .content {
   grid-column: 1;
+  grid-row: 2;
   min-width: 0;
 }
 
 .tocRail {
   grid-column: 2;
+  grid-row: 2;
   position: sticky;
   /* The rail sticks inside whatever scrolls it — `AppShell.Main` in a shell, the document without
    * one — and NOTHING overhangs that box: the app header and `PageBar` row 2's band are both shell
@@ -87,8 +97,39 @@
   align-self: start;
 }
 
+/* The rail's below-breakpoint replacement (docs/CONTENT-SPEC.md §7): a small sticky trigger that
+ * opens the SAME `TableOfContents` in a `Popover` instead of the rail vanishing. Rendered by JS
+ * (`useSizeClass() !== 'expanded'`), never both at once with `.tocRail` — no media query needed
+ * here, only the sticky/alignment behaviour for whenever it IS mounted. `grid-row: 2` is EXPLICIT,
+ * not left to auto-placement: `.content` also being `grid-column: 1` moves the auto-placement
+ * cursor's row on past row 2 by the time this item (also column 1) is placed, landing it in its
+ * own row BELOW the content instead of at its top — the whole point of this trigger. */
+.tocTrigger {
+  grid-column: 1;
+  grid-row: 2;
+  justify-self: end;
+  align-self: start;
+  position: sticky;
+  top: var(--vx-space-sticky-header-clearance);
+  z-index: 1;
+}
+
+.tocTriggerLabel {
+  font-family: var(--basalt-font-mono);
+  font-size: var(--vx-text-micro);
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  color: var(--vx-faint);
+}
+
+.tocDropdown {
+  min-width: 220px;
+  max-width: min(320px, calc(100vw - 32px));
+}
+
 .footer {
   grid-column: 1;
+  grid-row: 3;
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: var(--vx-space-article-footer-gap);

package/dist/content/article-layout.module.css.d.ts

@@ -11,6 +11,9 @@ declare const classes: {
   readonly metaRow: string
   readonly content: string
   readonly tocRail: string
+  readonly tocTrigger: string
+  readonly tocTriggerLabel: string
+  readonly tocDropdown: string
   readonly footer: string
   readonly navCell: string
   readonly navCellNext: string

package/dist/content/code-block.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"code-block.d.ts","sourceRoot":"","sources":["../../src/content/code-block.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAM1C,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;IAC1B,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,yDAAyD;IACzD,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAC3B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAC/B,CAAA;AAED,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,QAAe,EACf,SAAS,EACT,KAAK,GACN,EAAE,cAAc,+BA4ChB"}
+{"version":3,"file":"code-block.d.ts","sourceRoot":"","sources":["../../src/content/code-block.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAO1C,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;IAC1B,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,yDAAyD;IACzD,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAC3B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAC/B,CAAA;AAED,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,QAAe,EACf,SAAS,EACT,KAAK,GACN,EAAE,cAAc,+BAuFhB"}

package/dist/content/code-block.js

@@ -1,5 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useEffect, useState } from "react";
+import { useEffect, useRef, useState } from "react";
+import { useIsomorphicLayoutEffect } from "../common/isomorphic-layout-effect.js";
 import classes from "./code-block.module.css";
 import { CopyAction } from "./copy-action.js";
 import { highlightCode } from "./highlighter.js";
@@ -12,6 +13,10 @@ function CodeBlock({
   style
 }) {
   const [html, setHtml] = useState(null);
+  const bodyRef = useRef(null);
+  const setBodyRef = (node) => {
+    bodyRef.current = node;
+  };
   useEffect(() => {
     if (language === void 0) return;
     let cancelled = false;
@@ -23,6 +28,23 @@ function CodeBlock({
       cancelled = true;
     };
   }, [code, language]);
+  const [showOverflowFade, setShowOverflowFade] = useState(false);
+  useIsomorphicLayoutEffect(() => {
+    const body = bodyRef.current;
+    if (!body) return;
+    const update = () => {
+      const atEnd = body.scrollLeft + body.clientWidth >= body.scrollWidth - 1;
+      setShowOverflowFade(body.scrollWidth > body.clientWidth && !atEnd);
+    };
+    update();
+    body.addEventListener("scroll", update, { passive: true });
+    const observer = new ResizeObserver(update);
+    observer.observe(body);
+    return () => {
+      body.removeEventListener("scroll", update);
+      observer.disconnect();
+    };
+  }, [html, code]);
   const containerClass = [classes.container, className].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsxs("div", { className: containerClass, ...style !== void 0 && { style }, children: [
     title !== void 0 && /* @__PURE__ */ jsxs("div", { className: classes.header, children: [
@@ -32,7 +54,23 @@ function CodeBlock({
         showCopy && /* @__PURE__ */ jsx(CopyAction, { value: code, ariaLabel: "Copy code" })
       ] })
     ] }),
-    html !== null ? /* @__PURE__ */ jsx("div", { className: classes.body, dangerouslySetInnerHTML: { __html: html } }) : /* @__PURE__ */ jsx("pre", { className: classes.body, children: /* @__PURE__ */ jsx("code", { children: code }) }),
+    html !== null ? /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: setBodyRef,
+        className: classes.body,
+        ...showOverflowFade && { "data-code-overflow": true },
+        dangerouslySetInnerHTML: { __html: html }
+      }
+    ) : /* @__PURE__ */ jsx(
+      "pre",
+      {
+        ref: setBodyRef,
+        className: classes.body,
+        ...showOverflowFade && { "data-code-overflow": true },
+        children: /* @__PURE__ */ jsx("code", { children: code })
+      }
+    ),
     title === void 0 && showCopy && /* @__PURE__ */ jsx("div", { className: classes.floatingCopy, children: /* @__PURE__ */ jsx(CopyAction, { value: code, ariaLabel: "Copy code" }) })
   ] });
 }

package/dist/content/code-block.module.css

@@ -56,6 +56,27 @@
   overflow-x: auto;
 }
 
+/* Trailing-edge overflow fade (docs/MATURATION-LEDGER.md) — `code-block.tsx` toggles this
+ * attribute from a scroll/resize measurement (`scrollWidth > clientWidth`, not yet at the end), so
+ * it never decorates a block that already fits and never lingers once scrolled to the end. The mask
+ * fades to TRANSPARENT, not to a solid color — what shows through is `.container`'s own translucent
+ * background, already identical to what borders the block everywhere else, so the fade reads as a
+ * soft edge rather than a hard cut. Reuses the content inset token rather than a new literal; LTR
+ * only, matching the rest of this file (no `dir` handling exists here to fade the other edge from).
+ */
+.body[data-code-overflow] {
+  mask-image: linear-gradient(
+    to right,
+    black calc(100% - var(--vx-space-code-block-content-inset-x) * 2),
+    transparent 100%
+  );
+  -webkit-mask-image: linear-gradient(
+    to right,
+    black calc(100% - var(--vx-space-code-block-content-inset-x) * 2),
+    transparent 100%
+  );
+}
+
 .body :global(pre.shiki) {
   margin: 0;
   padding: 0;
@@ -77,11 +98,20 @@ html[data-mantine-color-scheme='light'] .body :global(.shiki span) {
   position: absolute;
   top: var(--vx-space-code-block-floating-copy-offset);
   right: var(--vx-space-code-block-floating-copy-offset);
-  opacity: 0;
   transition: opacity 120ms ease;
 }
 
-.container:hover .floatingCopy,
+/* Hidden-until-hover only where hover exists (pointer tier, docs/DESIGN-CORE.md § Layout). */
+@media (hover: hover) and (pointer: fine) {
+  .floatingCopy {
+    opacity: 0;
+  }
+
+  .container:hover .floatingCopy {
+    opacity: 1;
+  }
+}
+
 .container:focus-within .floatingCopy {
   opacity: 1;
 }

package/dist/content/prose.module.css

@@ -149,17 +149,22 @@
   display: inline-flex;
   vertical-align: middle;
   margin-left: var(--vx-space-prose-heading-anchor-gap);
-  opacity: 0;
   transition: opacity 120ms ease;
 }
 
-.root h1:hover .headingAnchor,
-.root h2:hover .headingAnchor,
-.root h3:hover .headingAnchor,
-.root h4:hover .headingAnchor,
-.root h5:hover .headingAnchor,
-.root h6:hover .headingAnchor,
-.headingAnchor:focus-within {
+/* Hidden-until-hover only where hover exists (pointer tier, docs/DESIGN-CORE.md § Layout,
+   elevation, shapes); touch shows it. Focus always reveals (the rule below outranks the hidden one). */
+@media (hover: hover) and (pointer: fine) {
+  .root :is(h1, h2, h3, h4, h5, h6) .headingAnchor {
+    opacity: 0;
+  }
+
+  .root :is(h1, h2, h3, h4, h5, h6):hover .headingAnchor {
+    opacity: 1;
+  }
+}
+
+.root :is(h1, h2, h3, h4, h5, h6) .headingAnchor:focus-within {
   opacity: 1;
 }
 

package/dist/controls/actions.d.ts

@@ -71,8 +71,6 @@ export type GlobalAction = {
     /** @default 'bar' for the first two, `'more'` for the rest */
     mobile?: 'bar' | 'more' | 'hidden';
 };
-/** Secondaries rendered inline on desktop; the rest fold into `More` (`docs/CONTROLS-SPEC.md` §2.1). */
-export declare const DESKTOP_SECONDARY_MAX = 3;
 /** `GlobalAction`s without an explicit `mobile` that still land on the mobile bar. */
 export declare const MOBILE_GLOBAL_BAR_MAX = 2;
 /**
@@ -100,6 +98,13 @@ export declare function barActionMobile(action: BarAction, isPrimary: boolean):
 export declare function globalActionMobile(action: GlobalAction, index: number): 'bar' | 'more' | 'hidden';
 /** A `GlobalAction` reaching a `BarAction` slot — the kebab renders one row shape, not two. */
 export declare function globalActionAsBarAction(action: GlobalAction): BarActionCustom;
+/**
+ * The DOM contract between `PageBar` row 1 and {@link useMeasuredFold} — module-internal, not part
+ * of any barrel. `PAGE_BAR_END_ATTR` marks the elastic row the fold measures; `BAR_KEY_ATTR` tags
+ * each rendered action with its `key` so a measured box maps back to its action.
+ */
+export declare const PAGE_BAR_END_ATTR = "data-basalt-page-bar-end";
+export declare const BAR_KEY_ATTR = "data-bar-key";
 export type OverflowMenuProps = BasaltProps & {
     actions: readonly BarAction[];
     /**
@@ -149,12 +154,30 @@ type BarActionRowProps = ActionGroupProps & {
      */
     syncNode?: ReactNode;
 };
+type FoldStep = 'icon' | 'overflow';
+/**
+ * The measured fold as a pure decision. `room` is the row's available width, `fixed` everything in it
+ * that never folds (primary, sync, joined runs, custom nodes), each foldable `item` its labelled and
+ * icon-only width (`icon` absent when it ships no icon). Folds from the LAST item back: first to
+ * icon-only where an icon exists, then into `More`. Items that stay whole are absent from the result.
+ */
+export declare function planBarFold(input: {
+    room: number;
+    fixed: number;
+    gap: number;
+    hasMenus: boolean;
+    items: readonly {
+        key: string;
+        full: number;
+        icon: number | undefined;
+    }[];
+}): Record<string, FoldStep>;
 export declare function BarActionRow({ primary, secondary, host, viewport, mobileOnly, syncNode, className, style, }: BarActionRowProps): ReactNode;
 /**
  * A home's `actions` slot, projected for both viewports.
  *
- * Desktop: `primary` as a `filled` button · up to `DESKTOP_SECONDARY_MAX` secondaries as `default`
- * buttons · everything past that, plus every `kind: 'menu'`, in one `More` menu.
+ * Desktop: `primary` as a `filled` button · secondaries as `default` buttons, folded by the row's
+ * measured width (icon-only, then into `More`) · every `kind: 'menu'` in that same `More` menu.
  * Mobile: `primary` as an icon button when it ships an icon and a compact labelled button when it
  * does not · one kebab holding every `mobile: 'more'` action · `mobile: 'hidden'` drops the action
  * entirely.
@@ -192,8 +215,8 @@ export type SlotActions = BarAction[] | ReactNode;
 export declare function isBarActionList(actions: SlotActions): actions is BarAction[];
 /**
  * Renders a {@link SlotActions} slot: the typed form goes through the SAME projection `PageBar` and
- * `ActionGroup` use — inline up to {@link DESKTOP_SECONDARY_MAX}, the rest folded into `More`, and a
- * mobile kebab below `sm` — and the node form is returned untouched.
+ * `ActionGroup` use — inline, `kind: 'menu'` folded into `More`, and a mobile kebab below `sm` — and
+ * the node form is returned untouched.
  *
  * Every entry lands in `secondary`: a `BarAction[]` carries no primary marker, and law C6's "exactly
  * one primary" is the page bar's rule, enforced by `ActionGroupProps.primary` being singular. A home

package/dist/controls/actions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"actions.d.ts","sourceRoot":"","sources":["../../src/controls/actions.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"actions.d.ts","sourceRoot":"","sources":["../../src/controls/actions.tsx"],"names":[],"mappings":"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"}