@uniweb/kit 0.19.12 → 0.19.14

package/README.md

@@ -53,7 +53,7 @@ function Hero({ content }) {
 
 ### Link
 
-Smart link component with routing, downloads, and auto-generated accessible titles.
+Smart link component with routing and downloads. A link that leaves the site, downloads a file, writes an email or places a call gets a tooltip saying so; an internal link gets none.
 
 ```jsx
 import { Link } from '@uniweb/kit'
@@ -67,7 +67,7 @@ import { Link } from '@uniweb/kit'
 | Prop | Type | Description |
 |------|------|-------------|
 | `to` / `href` | `string` | Destination URL |
-| `title` | `string` | Tooltip (auto-generated if omitted) |
+| `title` | `string` | Tooltip. If omitted, one is generated only where the link leaves the site, downloads, writes an email or places a call |
 | `target` | `string` | Link target |
 | `download` | `boolean` | Force download behavior |
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniweb/kit",
-  "version": "0.19.12",
+  "version": "0.19.14",
   "description": "Standard component library for Uniweb foundations",
   "type": "module",
   "exports": {
@@ -43,10 +43,10 @@
     "shiki": "^3.0.0",
     "tailwind-merge": "^3.6.0",
     "temml": "^0.13.2",
-    "@uniweb/semantic-parser": "^1.5.0",
-    "@uniweb/core": "^0.35.0",
+    "@uniweb/schemas": "^0.10.0",
+    "@uniweb/semantic-parser": "^1.5.1",
     "@uniweb/scene": "^0.1.3",
-    "@uniweb/schemas": "^0.9.3",
+    "@uniweb/core": "^0.35.0",
     "@uniweb/projections": "^0.7.11"
   },
   "peerDependencies": {

package/src/components/Link/Link.jsx

@@ -5,7 +5,8 @@
  * - Internal navigation via React Router
  * - External links with appropriate attributes
  * - File downloads
- * - Auto-generated accessible titles
+ * - A generated tooltip where a link does something its text may not say:
+ *   leaves the site, downloads a file, writes an email, places a call
  *
  * @module @uniweb/kit/Link
  */
@@ -52,10 +53,17 @@ function detectSocialPlatform(url) {
 }
 
 /**
- * Generate an accessible title for a link
+ * The tooltip a link gets when its caller gives none — only where the link does
+ * something its text may not say. An internal link gets none: its text names where
+ * it goes.
+ *
+ * ⛔ Until 2026-09-30 an internal link got `Go to <its path>`, dashes as spaces —
+ * `Go to blog/writing for the web` on every card of a blog [Diego: "stop adding it
+ * to internal links"].
+ *
  * @param {string} href - The link URL
  * @param {Function} localize - Localization function
- * @returns {string}
+ * @returns {string} the tooltip, or '' for none
  */
 function generateTitle(href, localize) {
   if (!href) return ''
@@ -108,26 +116,6 @@ function generateTitle(href, localize) {
     })
   }
 
-  // Internal links - humanize the path
-  try {
-    const url = new URL(href, window.location.origin)
-    const path = decodeURIComponent(url.pathname)
-      .replace(/^\/+/, '')
-      .replace(/[-_]/g, ' ')
-      .replace(/\.\w+$/, '')
-      .trim()
-
-    if (path) {
-      return localize({
-        en: `Go to ${path}`,
-        fr: `Aller à ${path}`,
-        es: `Ir a ${path}`
-      })
-    }
-  } catch {
-    // Invalid URL
-  }
-
   return ''
 }
 
@@ -137,7 +125,9 @@ function generateTitle(href, localize) {
  * @param {Object} props
  * @param {string} [props.to] - Destination URL (alias for href)
  * @param {string} [props.href] - Destination URL
- * @param {string} [props.title] - Custom title/tooltip (auto-generated if not provided)
+ * @param {string} [props.title] - Custom title/tooltip. Without one, a link that leaves the
+ *   site, downloads, writes an email or places a call gets one saying so; an internal
+ *   link gets none
  * @param {string} [props.target] - Link target (_blank, _self, etc.)
  * @param {string} [props.className] - CSS classes
  * @param {boolean} [props.download] - Force download behavior
@@ -192,8 +182,8 @@ export function Link({
   // Determine if external
   const isExternal = isExternalUrl(linkHref)
 
-  // Auto-generate title if not provided
-  const linkTitle = title || generateTitle(linkHref, localize)
+  // A generated tooltip when none is given — none at all rather than an empty one.
+  const linkTitle = title || generateTitle(linkHref, localize) || undefined
 
   // Links with reload: render plain <a> for full page navigation
   // Used for locale switches (same-domain or cross-domain)

package/src/styled/Render/index.jsx

@@ -325,12 +325,15 @@ export function SequenceElement({ element, block, components }) {
     // 2026-09-29 the parser delivered a document as an image, and this drew
     // `<img src="report.pdf">`.
     case 'document': {
-      const { url, alt, caption, preview, author, description } = element.attrs || {}
-      const name = caption || alt || fileNameOf(url)
+      // `file` is the file's own name — the parser reads it from the address, and a build
+      // that copies the file under a hashed name stamps the one it had; the address is
+      // the fallback for content parsed before documents carried one (2026-09-29).
+      const { url, alt, caption, preview, author, description, name: file } = element.attrs || {}
+      const name = caption || alt || file || fileNameOf(url)
       return (
         <figure id={authoredId(element)} data-kind="document">
           <Link to={url}>
-            {preview ? <Image src={preview} alt="" /> : <FileLogo filename={url} />}
+            {preview ? <Image src={preview} alt="" /> : <FileLogo filename={file || url} />}
             <span>{name}</span>
           </Link>
           {(author || description) && (

package/src/styled/Visual/index.jsx

@@ -1,8 +1,8 @@
 /**
  * Visual Component
  *
- * Renders the first non-empty visual from the given candidates.
- * Resolution order: inset > video > image. Only tries what's passed.
+ * Renders one visual: a `content.media` item by its kind, or the first non-empty of
+ * the candidates it is handed (inset, then video, then image).
  *
  * @module @uniweb/kit/styled/Visual
  */
@@ -13,9 +13,19 @@ import { Image } from "../../components/Image/index.js";
 import { getChildBlockRenderer } from "../../utils/index.js";
 
 /**
- * Renders the first non-empty visual from the given candidates.
+ * Renders one visual.
+ *
+ * ⭐ `media` is a `content.media` item — an image, a video or an embedded component,
+ * tagged with its `kind` — rendered by that kind. Handed the whole `content.media`,
+ * it renders the first item: a slot of one is the first thing the author placed in
+ * it, whatever its kind. An embedded component needs `block`, whose insets it is
+ * one of.
+ *
+ * Without `media`, the first non-empty candidate: inset, then video, then image.
  *
  * @param {Object} props
+ * @param {Object|Object[]} [props.media] - A `content.media` item, or the list (its first item)
+ * @param {Object} [props.block] - The section's block — resolves an embedded component
  * @param {Object} [props.inset] - Inset Block instance (from block.insets or block.getInset())
  * @param {Object} [props.video] - Video object with src property
  * @param {Object} [props.image] - Image object with src and alt properties
@@ -23,24 +33,25 @@ import { getChildBlockRenderer } from "../../utils/index.js";
  * @param {React.ReactNode} [props.fallback] - Fallback when no visual is found
  *
  * @example
- * // Try inset first, fall back to video, then image
- * <Visual inset={block.insets[0]} video={content.videos[0]} image={content.images[0]} />
+ * // The slot of one — the author's first image, video or component
+ * <Visual media={content.media} block={block} className="rounded-lg" />
  *
  * @example
- * // Specific inset only
- * <Visual inset={block.getInset('chart')} className="rounded-lg" />
+ * // Every item of a gallery, in the author's order
+ * {content.media.map((item, i) => <Visual key={i} media={item} block={block} />)}
  *
  * @example
- * // Image only
- * <Visual image={content.images[1]} className="aspect-video" />
+ * // Try inset first, fall back to video, then image
+ * <Visual inset={block.insets[0]} video={content.videos[0]} image={content.images[0]} />
  */
-export function Visual({ inset, video, image, className, fallback = null }) {
-    if (inset) {
-        const Renderer = getChildBlockRenderer();
-        const rendered = <Renderer blocks={[inset]} />;
-        return className ? <div className={className}>{rendered}</div> : rendered;
+export function Visual({ media, block, inset, video, image, className, fallback = null }) {
+    if (media !== undefined) {
+        const item = Array.isArray(media) ? media[0] : media;
+        return renderItem(item, block, className) ?? fallback;
     }
 
+    if (inset) return renderInset(inset, className);
+
     if (video) {
         return <Media {...video} className={className} />;
     }
@@ -52,3 +63,30 @@ export function Visual({ inset, video, image, className, fallback = null }) {
 
     return fallback;
 }
+
+/** A `content.media` item, rendered by its kind — or null when it cannot be. */
+function renderItem(item, block, className) {
+    if (!item || typeof item !== "object") return null;
+    const { kind, ...attrs } = item;
+    switch (kind) {
+        case "image": {
+            const { contentType, viewType, contentId, imgPos, ...imageProps } = attrs;
+            return <Image {...imageProps} className={className} />;
+        }
+        case "video":
+            return <Media {...attrs} className={className} />;
+        case "inset": {
+            const insetBlock = attrs.refId ? block?.getInset?.(attrs.refId) : null;
+            return insetBlock ? renderInset(insetBlock, className) : null;
+        }
+        default:
+            return null;
+    }
+}
+
+function renderInset(inset, className) {
+    const Renderer = getChildBlockRenderer();
+    if (!Renderer) return null;
+    const rendered = <Renderer blocks={[inset]} />;
+    return className ? <div className={className}>{rendered}</div> : rendered;
+}