@uniweb/kit 0.10.6 → 0.10.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniweb/kit",
-  "version": "0.10.6",
+  "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/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>
 }