@uniweb/kit 0.10.5 → 0.10.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniweb/kit",
-  "version": "0.10.5",
+  "version": "0.10.7",
   "description": "Standard component library for Uniweb foundations",
   "type": "module",
   "exports": {
@@ -43,8 +43,8 @@
     "shiki": "^3.0.0",
     "tailwind-merge": "^3.6.0",
     "@uniweb/core": "0.8.0",
-    "@uniweb/semantic-parser": "1.2.0",
-    "@uniweb/scene": "0.1.2"
+    "@uniweb/scene": "0.1.2",
+    "@uniweb/semantic-parser": "1.2.0"
   },
   "peerDependencies": {
     "react": "^19.0.0",

package/src/prose-tokens.css

@@ -101,3 +101,31 @@
 .prose :is(h1, h2, h3, h4) {
   scroll-margin-top: calc(var(--header-height, 4rem) + 1rem);
 }
+
+/* ─── Math (Temml → MathML) ────────────────────────────────────────────────────
+   Browsers render MathML natively, so it is easy to conclude math needs no CSS.
+   It needs these, for two separate reasons.
+
+   Temml emits class hooks and expects a stylesheet to define them: `tml-left`
+   and `tml-right` carry the `&` column alignment of an `aligned` environment,
+   `tml-jot` its extra row spacing. Undefined, a derivation's `=` signs drift
+   out of line and its rows sit flush. Those three declarations are Temml's own.
+
+   The `math mtd` rule is not. Temml's stylesheet only *adjusts* row spacing for
+   jot, on the stated assumption that mtd already gets 0.5ex of vertical padding
+   "per MathML-Core and user-agent CSS" — but a pristine mtd measures 0px in
+   Chrome (2026-07). A pmatrix or cases carries no tml-* class at all, so
+   Temml's stylesheet alone fixes the derivation and leaves the matrix touching.
+
+   These live here rather than in their own opt-in file because correct math
+   metrics are not a design choice the way callout colours are — a site that
+   sets its typography should not also have to know this.
+
+   press ships the same declarations to the EPUB and Paged.js lanes, which have
+   their own stylesheets and cannot import this one. That duplicate is pinned by
+   `framework/_contracts/math-css-parity.test.js`, not by trust. */
+.tml-right { text-align: right; }
+.tml-left { text-align: left; }
+.tml-sml-pad { padding-left: 0.05em; }
+math mtd { padding-top: 0.5ex; padding-bottom: 0.5ex; }
+math mtable.tml-jot mtd { padding-top: 0.7ex; padding-bottom: 0.7ex; }

package/src/styled/Render/index.jsx

@@ -84,6 +84,23 @@ export const NOT_RENDERED = {
   'document-group': 'an editor node — its documents reach content.links',
 }
 
+/**
+ * The author's `{#id}`, if they wrote one.
+ *
+ * Reads the same two places the xref registry reads
+ * (`@uniweb/kit/xref/registry.js`), because an id that numbers a figure and an
+ * id that anchors it must be the same string — otherwise `[#fig-cells]` would
+ * resolve to "Figure 3" and link to nothing.
+ *
+ * Emitting it matters beyond cross-references: it is what makes
+ * `/page#fig-cells` land on the figure, and what gives EPUB and Paged.js real
+ * internal links. Until 2026-07-31 nothing emitted it, so an authored id
+ * existed only inside the registry and never reached the document.
+ */
+function authoredId(element) {
+  return element?.attrs?.id ?? element?.id ?? undefined
+}
+
 /**
  * Normalize whatever a caller passed into a sequence.
  *
@@ -213,7 +230,7 @@ export function SequenceElement({ element, block, components }) {
       // The id is the anchor `useHeadings()` and every in-page nav link
       // resolve against, so it is behaviour rather than decoration.
       return (
-        <Tag id={headingId(element.text || '')}>
+        <Tag id={authoredId(element) || headingId(element.text || '')}>
           <SafeHtml value={element.text} as="span" />
         </Tag>
       )
@@ -235,7 +252,7 @@ export function SequenceElement({ element, block, components }) {
       const { url, src, alt, caption, role } = element.attrs || {}
       if (role === 'icon') return <Icon {...element.attrs} />
       return (
-        <figure>
+        <figure id={authoredId(element)}>
           <Image src={url || src} alt={alt || caption || ''} />
           {caption && <figcaption>{caption}</figcaption>}
         </figure>
@@ -262,6 +279,7 @@ export function SequenceElement({ element, block, components }) {
       const Tag = display ? 'div' : 'span'
       return (
         <Tag
+          id={authoredId(element)}
           className={display ? 'math-display' : 'math-inline'}
           dangerouslySetInnerHTML={{ __html: element.mathml }}
         />
@@ -319,7 +337,7 @@ export function SequenceElement({ element, block, components }) {
       // reference table on a phone.
       return (
         <div className="overflow-x-auto">
-          <table>
+          <table id={authoredId(element)}>
             {hasHeader && <thead>{renderRow(first, 'h')}</thead>}
             <tbody>{(hasHeader ? rest : rows).map((row, i) => renderRow(row, i))}</tbody>
           </table>

package/src/xref/Ref.jsx

@@ -136,6 +136,23 @@ export function Ref({ params, block }) {
     const missingTail = resolved.filter((r) => r.missing).map((r) => `[?${r.id}]`).join(', ')
     const body = [text, missingTail].filter(Boolean).join(', ')
 
+    // A reference to exactly one target links to it. The renderer emits the
+    // author's `{#id}` onto the labelled element, so `#fig-cells` is a real
+    // anchor in the page, in an EPUB, and in a Paged.js document.
+    //
+    // Only the single case. A cluster reads "Figures 1 and 2" — one href
+    // could only point at one of them, and linking the whole phrase to the
+    // first target is a worse answer than linking none of it. Making each
+    // number its own link means `renderGroupSameKind` returning nodes rather
+    // than a string; worth doing when someone needs it, not before.
+    if (onlyResolved.length === 1 && resolved.length === 1) {
+        return (
+            <a className="xref" href={`#${onlyResolved[0].id}`}>
+                {body}{locator}
+            </a>
+        )
+    }
+
     return <span className="xref">{body}{locator}</span>
 }