@godxjp/ui 33.21.0 → 33.22.2

package/README.md

@@ -18,7 +18,7 @@ npm i @godxjp/ui
 
 <!-- agent-catalog-counts:start -->
 
-The catalog — 210 components, 3183 tokens, 44 cardinal rules — is published in two forms from one
+The catalog — 210 components, 3184 tokens, 44 cardinal rules — is published in two forms from one
 source. **Entry point for either: [`AGENTS.md`](AGENTS.md).**
 <!-- agent-catalog-counts:end -->
 
@@ -56,7 +56,7 @@ static files straight from this public repo — no hosting, no deploy step:
 | [`agent/components-index.json`](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components-index.json) | 46 KB | all 210 as name + group + tagline — **fetch this first** |
 | [`agent/components/<Name>.json`](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components/Select.json) | 1 KB–38 KB | one file per component, each with its `importPath` — **this is the route to take** |
 | [`agent/components.json`](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components.json) | 1.4 MB | all 210 entries in one file — most URL fetchers truncate this silently; prefer the per-component files |
-| [`agent/tokens.json`](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/tokens.json) | 1.4 MB | all 3183 design tokens, their values and why they exist |
+| [`agent/tokens.json`](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/tokens.json) | 1.4 MB | all 3184 design tokens, their values and why they exist |
 | [`agent/vocabulary.json`](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/vocabulary.json) | 7 KB | the controlled prop vocabulary |
 | [`agent/rules.json`](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/rules.json) | 23 KB | the 44 cardinal rules |
 <!-- prettier-ignore-end -->

package/agent/START-HERE.md

@@ -3,7 +3,7 @@
 You are about to write code against a design system you did not author. This file is the whole
 contract. Read it before you write JSX.
 
-**This catalog describes `@godxjp/ui` 33.21.0.** If the project you are editing has a different
+**This catalog describes `@godxjp/ui` 33.22.2.** If the project you are editing has a different
 version in its `package.json`, read the pinned catalog for THAT version instead
 (`…/v<their-version>/agent/…`). A catalog newer than the installed package describes props that do
 not exist yet; older, and it hides props that do. Neither failure announces itself.
@@ -61,10 +61,10 @@ screen anatomy, the visual target the rules below do not give you. Then fetch in
    its `importPath`, and its examples. Fetch only the handful you picked in step 1.
 3. `rules.json` — 44 cardinal rules. The ones about raw HTML and hardcoded colour are not
    style advice.
-4. `tokens.json` — 3183 design tokens, each tagged with its `tier`. **If you were handed a
+4. `tokens.json` — 3184 design tokens, each tagged with its `tier`. **If you were handed a
    brand, read the 220 `foundation` entries first** — `--primary`, `--background`,
    `--radius`, `--font-size-base` are the handful everything else derives from. The
-   2850 `component` entries are per-part knobs; reach for one only when a role is
+   2851 `component` entries are per-part knobs; reach for one only when a role is
    right everywhere except one component.
 5. `anti-ai-tells.json` — 35 shapes that make generated UI look generated, each with the
    fix. Read before you reach for a gradient hero or a wall of coloured chips.
@@ -150,7 +150,7 @@ has stopped following the brand.
 |---|---|---|---|
 | `foundation` | 220 | the seeds — `--primary`, `--background`, `--foreground`, `--radius`, `--font-size-base`, `--shadow-color`. Everything below is derived from these | **yes — this is the main road.** The default `--primary` is a neutral placeholder: set it (`:root { --primary: <H> <S>% <L>%; }`, HSL components, no `hsl()` wrapper) or import a theme preset such as `@godxjp/ui/themes/godx.css` |
 | `semantic` | 113 | named roles that follow the seeds — `--ring`, `--text-link`, `--primary-hover`, `--overlay-background` | only when the seed is right and ONE role must differ. That role then stops following a later brand change |
-| `component` | 2850 | per-part knobs, `--{component}-{part}-{property}` | rarely. Most are declared `initial` with the real default at the call site — deliberate, so a scoped override re-resolves instead of freezing at `:root` |
+| `component` | 2851 | per-part knobs, `--{component}-{part}-{property}` | rarely. Most are declared `initial` with the real default at the call site — deliberate, so a scoped override re-resolves instead of freezing at `:root` |
 
 A token whose `value` is `initial` is not empty and not broken: `initial` is the guaranteed-invalid
 value, so the real default is computed where the element paints it. Set it and yours wins.

package/agent/components/BlockEditor.json

@@ -57,10 +57,15 @@
       "type": "\"framed\" | \"plain\""
     },
     {
-      "description": "Extra `/` rows ({ key, label, icon, keywords?, run(api) }) — `api.insertMarkdown` inserts through the codec.",
+      "description": "Extra `/` rows ({ key, label, icon, keywords?, run(api) }) — `api.insertMarkdown` inserts through the codec, so a directive skeleton (`:::poll[Q]{id=x}\\n- A\\n- B\\n:::`) lands as a directive block.",
       "name": "actions",
       "type": "BlockEditorAction[]"
     },
+    {
+      "description": "Editor previews for directive blocks, by name. A container directive the kit does not model (`:::poll[…]{…}`) is one atomic block — dragged, deleted and inserted whole, its source edited behind Edit source; the preview gets `{ name, label, attributes, source, body }` (canonical). No renderer, or `undefined`: the block shows its source.",
+      "name": "directives",
+      "type": "Record<string, (block: DirectiveBlock) => ReactNode | undefined>"
+    },
     {
       "description": "Override any string (defaults: kit ja / en / vi).",
       "name": "labels",

package/agent/components/Button.json

@@ -59,7 +59,7 @@
     },
     {
       "defaultValue": "false",
-      "description": "In-flight state — shows a leading `Loader2` spinner (replaces a leading icon if present), sets `aria-busy=\"true\"`, and blocks activation (non-interactive, pointer-events disabled) while keeping the label visible so the width doesn't jump. Prefer this over a hand-rolled `<Loader2 className=\"animate-spin\">` inside the button. Ignored when `asChild` (Slot requires a single child).",
+      "description": "In-flight state — shows a leading `Loader2` spinner (replaces a leading icon if present), sets `aria-busy=\"true\"` and `aria-disabled=\"true\"`, and blocks activation (click, Enter/Space and a `type=\"submit\"` form submission are swallowed; pointer-events disabled) while keeping the label visible so the width doesn't jump. It never sets native `disabled`, so the button keeps focus while the request runs — a disabled element drops focus to <body>, which strands a keyboard user outside a dialog after a failed save. Prefer this over a hand-rolled `<Loader2 className=\"animate-spin\">` inside the button. Ignored when `asChild` (Slot requires a single child).",
       "name": "loading",
       "type": "boolean"
     },

package/agent/components/Markdown.json

@@ -78,6 +78,11 @@
       "description": "Fenced code in a known language is tokenised at parse time as `<span data-code-token>` with the kit's twelve names, which Prose colours (renderer v6). `false` leaves plain text for a host `pre` with its own highlighter.",
       "name": "highlight",
       "type": "boolean"
+    },
+    {
+      "description": "Host renderers for container directives the kit does not model, by name (`{ poll: (b) => <PollCard … /> }`). Each gets `{ name, label, attributes, source, body, children }` — label / source / body as written, `children` the rendered body without the label (a `::::form`'s `:::poll` cards). Return `undefined` to render the block as an unknown directive (its content in `div.ui-prose-directive`), which is also what an unregistered name renders. `toggle` / `columns` / `column` cannot be overridden.",
+      "name": "directives",
+      "type": "Record<string, (block: DirectiveRenderProps) => ReactNode | undefined>"
     }
   ],
   "related": [
@@ -94,6 +99,7 @@
     "DO `<Prose><Markdown>{body}</Markdown></Prose>` for every rendered body (wiki page, issue, mail).",
     "DO record `MARKDOWN_FORMAT` and `RENDERER_VERSION` on stored versions.",
     "DO `import \"@godxjp/markdown/katex.css\"` once in the app: `$…$`, `$$…$$` and ```math are drawn by KaTeX at parse time (trust: false, renderer v6) and need its stylesheet and fonts. A single `$` follows Pandoc's rule, so `$5 and $10` stays text.",
+    "DO import `Markdown` from `@godxjp/markdown/lazy` in a client-rendered app: KaTeX (+ its stylesheet, no global katex.css import needed) and highlight.js load only when a body has math or a fence with a language, then the body re-renders. The default entry stays eager because a server or Worker render is synchronous; a server or a hydrating client using `/lazy` awaits `preloadMarkdownRuntime(body)` first.",
     "DON'T assemble react-markdown + rehype-sanitize per app, add rehype-raw, or render Mermaid yourself — `checkMermaidSvg` is the gate."
   ]
 }

package/agent/components.json

@@ -4749,7 +4749,7 @@
       },
       {
         "defaultValue": "false",
-        "description": "In-flight state — shows a leading `Loader2` spinner (replaces a leading icon if present), sets `aria-busy=\"true\"`, and blocks activation (non-interactive, pointer-events disabled) while keeping the label visible so the width doesn't jump. Prefer this over a hand-rolled `<Loader2 className=\"animate-spin\">` inside the button. Ignored when `asChild` (Slot requires a single child).",
+        "description": "In-flight state — shows a leading `Loader2` spinner (replaces a leading icon if present), sets `aria-busy=\"true\"` and `aria-disabled=\"true\"`, and blocks activation (click, Enter/Space and a `type=\"submit\"` form submission are swallowed; pointer-events disabled) while keeping the label visible so the width doesn't jump. It never sets native `disabled`, so the button keeps focus while the request runs — a disabled element drops focus to <body>, which strands a keyboard user outside a dialog after a failed save. Prefer this over a hand-rolled `<Loader2 className=\"animate-spin\">` inside the button. Ignored when `asChild` (Slot requires a single child).",
         "name": "loading",
         "type": "boolean"
       },
@@ -7148,6 +7148,11 @@
         "description": "Fenced code in a known language is tokenised at parse time as `<span data-code-token>` with the kit's twelve names, which Prose colours (renderer v6). `false` leaves plain text for a host `pre` with its own highlighter.",
         "name": "highlight",
         "type": "boolean"
+      },
+      {
+        "description": "Host renderers for container directives the kit does not model, by name (`{ poll: (b) => <PollCard … /> }`). Each gets `{ name, label, attributes, source, body, children }` — label / source / body as written, `children` the rendered body without the label (a `::::form`'s `:::poll` cards). Return `undefined` to render the block as an unknown directive (its content in `div.ui-prose-directive`), which is also what an unregistered name renders. `toggle` / `columns` / `column` cannot be overridden.",
+        "name": "directives",
+        "type": "Record<string, (block: DirectiveRenderProps) => ReactNode | undefined>"
       }
     ],
     "related": [
@@ -7164,6 +7169,7 @@
       "DO `<Prose><Markdown>{body}</Markdown></Prose>` for every rendered body (wiki page, issue, mail).",
       "DO record `MARKDOWN_FORMAT` and `RENDERER_VERSION` on stored versions.",
       "DO `import \"@godxjp/markdown/katex.css\"` once in the app: `$…$`, `$$…$$` and ```math are drawn by KaTeX at parse time (trust: false, renderer v6) and need its stylesheet and fonts. A single `$` follows Pandoc's rule, so `$5 and $10` stays text.",
+      "DO import `Markdown` from `@godxjp/markdown/lazy` in a client-rendered app: KaTeX (+ its stylesheet, no global katex.css import needed) and highlight.js load only when a body has math or a fence with a language, then the body re-renders. The default entry stays eager because a server or Worker render is synchronous; a server or a hydrating client using `/lazy` awaits `preloadMarkdownRuntime(body)` first.",
       "DON'T assemble react-markdown + rehype-sanitize per app, add rehype-raw, or render Mermaid yourself — `checkMermaidSvg` is the gate."
     ]
   },
@@ -7292,10 +7298,15 @@
         "type": "\"framed\" | \"plain\""
       },
       {
-        "description": "Extra `/` rows ({ key, label, icon, keywords?, run(api) }) — `api.insertMarkdown` inserts through the codec.",
+        "description": "Extra `/` rows ({ key, label, icon, keywords?, run(api) }) — `api.insertMarkdown` inserts through the codec, so a directive skeleton (`:::poll[Q]{id=x}\\n- A\\n- B\\n:::`) lands as a directive block.",
         "name": "actions",
         "type": "BlockEditorAction[]"
       },
+      {
+        "description": "Editor previews for directive blocks, by name. A container directive the kit does not model (`:::poll[…]{…}`) is one atomic block — dragged, deleted and inserted whole, its source edited behind Edit source; the preview gets `{ name, label, attributes, source, body }` (canonical). No renderer, or `undefined`: the block shows its source.",
+        "name": "directives",
+        "type": "Record<string, (block: DirectiveBlock) => ReactNode | undefined>"
+      },
       {
         "description": "Override any string (defaults: kit ja / en / vi).",
         "name": "labels",

package/agent/index.json

@@ -4,7 +4,7 @@
     "components": 210,
     "patterns": 28,
     "rules": 44,
-    "tokens": 3183,
+    "tokens": 3184,
     "vocabulary": 16
   },
   "design": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/DESIGN.md",
@@ -54,19 +54,19 @@
   "note": "Pin to the tag that matches the @godxjp/ui version you installed. A catalog newer than your package describes props you do not have; older, and it hides props you do.",
   "read": {
     "live": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/index.json",
-    "pinned": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/v33.21.0/agent/index.json"
+    "pinned": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/v33.22.2/agent/index.json"
   },
   "source": "mcp/src/data — the same data @godxjp/ui-mcp serves — plus the foundation and semantic token tiers, read from src/tokens/*.css",
   "start": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/START-HERE.md",
   "tokenTiers": {
     "component": "per-part knobs, --{component}-{part}-{property}; usually leave these alone",
     "counts": {
-      "component": 2850,
+      "component": 2851,
       "foundation": 220,
       "semantic": 113
     },
     "foundation": "the seeds a consumer is invited to set — --primary, --background, --radius",
     "semantic": "named roles that follow the seeds — --ring, --text-link, --overlay-background"
   },
-  "version": "33.21.0"
+  "version": "33.22.2"
 }

package/agent/llms.txt

@@ -1,10 +1,10 @@
 # @godxjp/ui
 
-> A Japanese-enterprise React design system: 210 components, 3183 design tokens,
-> 44 cardinal rules. This file is the entry point for AI agents. Catalog version 33.21.0.
+> A Japanese-enterprise React design system: 210 components, 3184 design tokens,
+> 44 cardinal rules. This file is the entry point for AI agents. Catalog version 33.22.2.
 
 If your client can run a process, do not read these files — run the MCP server instead
-(`npx @godxjp/ui-mcp@33.21.0`). It is searchable and version-locked. These files exist for agents
+(`npx @godxjp/ui-mcp@33.22.2`). It is searchable and version-locked. These files exist for agents
 that can only fetch URLs.
 
 ## Start
@@ -19,7 +19,7 @@ that can only fetch URLs.
 - [components-index.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components-index.json): 46 KB — all 210 components as name, group, tagline, plus `absorbed`: the names that do NOT exist and map to it (`Combobox` → `Select`).
 - [components/<Name>.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components/Select.json): one file per component (1 KB–38 KB, median 5 KB). Read the index, then fetch only the ones you chose — this is the selective route, and the reason you do not need the blob.
 - [components.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components.json): 1.4 MB — every entry in one file. Most URL fetchers truncate a response this size without saying so; prefer the per-component files.
-- [tokens.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/tokens.json): every design token with its value, the reason it exists, and its `tier` — 220 `foundation` seeds (`--primary`, `--background`, `--radius`: set these when you are handed a brand), 113 `semantic` roles, 2850 `component` knobs.
+- [tokens.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/tokens.json): every design token with its value, the reason it exists, and its `tier` — 220 `foundation` seeds (`--primary`, `--background`, `--radius`: set these when you are handed a brand), 113 `semantic` roles, 2851 `component` knobs.
 - [vocabulary.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/vocabulary.json): the controlled prop vocabulary — which prop name means what, across every component.
 - [rules.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/rules.json): 44 cardinal rules.
 - [anti-ai-tells.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/anti-ai-tells.json): 35 shapes that make generated UI look generated, each with its fix.
@@ -27,7 +27,7 @@ that can only fetch URLs.
 ## Pinning
 
 Every URL above tracks `main`. To pin to the release a project actually installed, swap `main` for
-the tag: `.../godx-jp/godxjp-ui/v33.21.0/agent/...`. A catalog that does not match the installed
+the tag: `.../godx-jp/godxjp-ui/v33.22.2/agent/...`. A catalog that does not match the installed
 package describes props that are absent, or hides props that are present, and says nothing either way.
 
 Pinned catalogs only exist for releases whose tag actually contains `agent/`. If `…/v<version>/agent/index.json` returns 404, that release predates this catalog: read `…/main/…` instead and compare `index.json` → `version` against the package you have, so you at least know which way it drifted.

package/agent/tokens.json

@@ -13895,6 +13895,12 @@
     "tier": "component",
     "value": "-0.21em"
   },
+  {
+    "description": "Where `text-box` is supported the line box is TRIMMED to the band's top and the baseline (styles/logo-layout.css), so the four constants above are not applied. A descender still hangs below that baseline, and the font's `text` descent is not where it ends — Noto Sans JP's is deeper than its `g`, which left g / y / p 1.12–1.37px HIGH at `sm`. So the descender classes trim to the baseline like the others and move up by half a descender instead: measured with `alphabetic` and no offset, g / y / p / gX sat 0.07–0.12em low across xs–lg (Chromium, macOS, Noto Sans JP 700).",
+    "name": "--logo-glyph-descender-trimmed-optical-offset",
+    "tier": "component",
+    "value": "-0.1em"
+  },
   {
     "description": "The escape hatch, for a mark none of the four bands fits — a face with unusual metrics, or a glyph the classifier cannot see (an inline `<svg>`, which is left unclassified on purpose). Set once and it PINS every band to that value. Declared `initial` (guaranteed-invalid) so it is inert by default and the per-band default at the CALL SITE wins — the same pattern as --logo-godx-size (docs/TOKENS.md). Documented default: --logo-glyph-optical-offset = the --logo-glyph-*-optical-offset for the band the glyph was classified into, or 0 when it was not classified.",
     "name": "--logo-glyph-optical-offset",

package/dist/components/data-display/image.js

@@ -429,6 +429,9 @@ const ImageRoot = React.forwardRef(function Image({
   className,
   onLoad,
   onError,
+  fetchPriority,
+  loading = fetchPriority === "high" ? "eager" : "lazy",
+  decoding = "async",
   ...imgProps
 }, ref) {
   const { t } = useTranslation();
@@ -486,6 +489,9 @@ const ImageRoot = React.forwardRef(function Image({
       "img",
       {
         ...imgProps,
+        loading,
+        decoding,
+        fetchPriority,
         width,
         height,
         ref: setImgRef,

package/dist/components/general/button.js

@@ -99,11 +99,15 @@ const Button = React.forwardRef(
     disabled,
     type,
     children,
+    onClick,
     ...props
   }, ref) => {
     const { locale } = useTranslation();
     const Comp = asChild ? Slot : "button";
     const isLoading = !asChild && loading;
+    const handleClick = isLoading ? (event) => {
+      event.preventDefault();
+    } : onClick;
     const content = isLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(Loader2, { className: "animate-spin", "aria-hidden": "true" }),
       loadingText ?? children
@@ -132,7 +136,9 @@ const Button = React.forwardRef(
         "data-loading": isLoading ? "" : void 0,
         "data-label": labelled ? "" : void 0,
         "aria-busy": isLoading || void 0,
-        disabled: isLoading || disabled,
+        "aria-disabled": isLoading && !disabled || void 0,
+        disabled,
+        onClick: handleClick,
         type: asChild ? void 0 : type ?? "button",
         className: cn(
           fullWidth && "w-full",

package/dist/contracts/measurement.json

@@ -1,6 +1,6 @@
 {
   "$comment": "AUTO-GENERATED by scripts/gen-measurement-contract.mjs — do not edit. Read this instead of guessing: docs/MEASUREMENT-CONTRACT.md.",
-  "version": "33.21.0",
+  "version": "33.22.2",
   "targetSize": {
     "standard": "WCAG 2.2 SC 2.5.8 Target Size (Minimum), level AA — 24×24 CSS px",
     "min": 24,

package/dist/lab/legal-document-shell.js

@@ -122,6 +122,8 @@ const LegalDocumentShell = React.forwardRef(
       target.focus({ preventScroll: true });
     };
     const contentsName = contentsLabel ?? t("layout.legalDocumentShell.contents");
+    const hasContents = sections.length > 0;
+    const hasRail = hasContents || documentNavigation !== void 0;
     return /* @__PURE__ */ jsx(
       "div",
       {
@@ -129,58 +131,66 @@ const LegalDocumentShell = React.forwardRef(
         id,
         "data-slot": "legal-document-shell",
         className: cn("ui-legal-document-scope", className),
-        children: /* @__PURE__ */ jsxs("article", { className: "ui-legal-document", "aria-labelledby": titleId, children: [
-          /* @__PURE__ */ jsxs("header", { className: "ui-legal-document-header", children: [
-            /* @__PURE__ */ jsx(Heading, { level: 1, id: titleId, children: title }),
-            (version !== void 0 || effectiveDate !== void 0) && /* @__PURE__ */ jsxs("div", { className: "ui-legal-document-meta", children: [
-              version !== void 0 && /* @__PURE__ */ jsx("span", { children: t("layout.legalDocumentShell.version", { version }) }),
-              effectiveDate !== void 0 && // <time dateTime> keeps the MACHINE-readable value as the ISO 8601 input while
-              // the visible text is the Intl-formatted, locale-correct rendering.
-              /* @__PURE__ */ jsx("time", { dateTime: effectiveDate, children: t(
-                dateKind === "updated" ? "layout.legalDocumentShell.updatedDate" : "layout.legalDocumentShell.effectiveDate",
+        children: /* @__PURE__ */ jsxs(
+          "article",
+          {
+            className: "ui-legal-document",
+            "aria-labelledby": titleId,
+            "data-rail": hasRail ? void 0 : "none",
+            children: [
+              /* @__PURE__ */ jsxs("header", { className: "ui-legal-document-header", children: [
+                /* @__PURE__ */ jsx(Heading, { level: 1, id: titleId, children: title }),
+                (version !== void 0 || effectiveDate !== void 0) && /* @__PURE__ */ jsxs("div", { className: "ui-legal-document-meta", children: [
+                  version !== void 0 && /* @__PURE__ */ jsx("span", { children: t("layout.legalDocumentShell.version", { version }) }),
+                  effectiveDate !== void 0 && // <time dateTime> keeps the MACHINE-readable value as the ISO 8601 input while
+                  // the visible text is the Intl-formatted, locale-correct rendering.
+                  /* @__PURE__ */ jsx("time", { dateTime: effectiveDate, children: t(
+                    dateKind === "updated" ? "layout.legalDocumentShell.updatedDate" : "layout.legalDocumentShell.effectiveDate",
+                    {
+                      date: formatEffectiveDate(effectiveDate, locale)
+                    }
+                  ) })
+                ] }),
+                summary !== void 0 && // A <div> (not <p>): the summary slot may carry block content, and a <p> inside a <p>
+                // is invalid HTML the browser silently un-nests.
+                /* @__PURE__ */ jsx("div", { className: "ui-legal-document-summary", children: summary })
+              ] }),
+              hasRail && /* @__PURE__ */ jsxs("div", { className: "ui-legal-document-rail", children: [
+                documentNavigation !== void 0 && /* @__PURE__ */ jsx("div", { "data-slot": "legal-document-navigation", children: documentNavigation }),
+                hasContents && /* @__PURE__ */ jsxs("nav", { className: "ui-legal-document-toc", "aria-labelledby": contentsId, children: [
+                  /* @__PURE__ */ jsx("p", { id: contentsId, className: "ui-legal-document-toc-title", children: contentsName }),
+                  /* @__PURE__ */ jsx("ol", { className: "ui-legal-document-toc-list", children: sections.map((section) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+                    "a",
+                    {
+                      href: `#${section.id}`,
+                      className: "ui-legal-document-toc-link",
+                      "data-active": section.id === active ? "" : void 0,
+                      "aria-current": section.id === active ? "location" : void 0,
+                      onClick: (event) => handleContentsClick(event, section.id),
+                      children: section.title
+                    }
+                  ) }, section.id)) })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx("div", { className: "ui-legal-document-content", children: sections.map((section) => /* @__PURE__ */ jsxs(
+                "section",
                 {
-                  date: formatEffectiveDate(effectiveDate, locale)
-                }
-              ) })
-            ] }),
-            summary !== void 0 && // A <div> (not <p>): the summary slot may carry block content, and a <p> inside a <p>
-            // is invalid HTML the browser silently un-nests.
-            /* @__PURE__ */ jsx("div", { className: "ui-legal-document-summary", children: summary })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { className: "ui-legal-document-rail", children: [
-            documentNavigation !== void 0 && /* @__PURE__ */ jsx("div", { "data-slot": "legal-document-navigation", children: documentNavigation }),
-            /* @__PURE__ */ jsxs("nav", { className: "ui-legal-document-toc", "aria-labelledby": contentsId, children: [
-              /* @__PURE__ */ jsx("p", { id: contentsId, className: "ui-legal-document-toc-title", children: contentsName }),
-              /* @__PURE__ */ jsx("ol", { className: "ui-legal-document-toc-list", children: sections.map((section) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                "a",
-                {
-                  href: `#${section.id}`,
-                  className: "ui-legal-document-toc-link",
-                  "data-active": section.id === active ? "" : void 0,
-                  "aria-current": section.id === active ? "location" : void 0,
-                  onClick: (event) => handleContentsClick(event, section.id),
-                  children: section.title
-                }
-              ) }, section.id)) })
-            ] })
-          ] }),
-          /* @__PURE__ */ jsx("div", { className: "ui-legal-document-content", children: sections.map((section) => /* @__PURE__ */ jsxs(
-            "section",
-            {
-              id: section.id,
-              tabIndex: -1,
-              "data-legal-section": section.id,
-              "aria-labelledby": `${section.id}-heading`,
-              className: "ui-legal-document-section",
-              children: [
-                /* @__PURE__ */ jsx(Heading, { level: 2, id: `${section.id}-heading`, children: section.title }),
-                /* @__PURE__ */ jsx("div", { className: "ui-legal-document-section-body", children: section.content })
-              ]
-            },
-            section.id
-          )) }),
-          footerAction !== void 0 && /* @__PURE__ */ jsx("footer", { className: "ui-legal-document-footer", children: footerAction })
-        ] })
+                  id: section.id,
+                  tabIndex: -1,
+                  "data-legal-section": section.id,
+                  "aria-labelledby": `${section.id}-heading`,
+                  className: "ui-legal-document-section",
+                  children: [
+                    /* @__PURE__ */ jsx(Heading, { level: 2, id: `${section.id}-heading`, children: section.title }),
+                    /* @__PURE__ */ jsx("div", { className: "ui-legal-document-section-body", children: section.content })
+                  ]
+                },
+                section.id
+              )) }),
+              footerAction !== void 0 && /* @__PURE__ */ jsx("footer", { className: "ui-legal-document-footer", children: footerAction })
+            ]
+          }
+        )
       }
     );
   }

package/dist/props/components/data-display.prop.d.ts

@@ -1310,6 +1310,8 @@ export type ImagePreviewGroupConfigProp = Omit<ImagePreviewConfigProp, "src" | "
 /**
  * @see Image — a picture that opens large in a full-viewport preview (antd `Image`): zoom, rotate,
  * flip, and — inside an `ImagePreviewGroup` — prev/next across every picture of the group.
+ * Lazy by default (gh#1454): `loading` defaults to `"lazy"` (`"eager"` with `fetchPriority="high"`,
+ * the page's LCP picture) and `decoding` to `"async"`; explicit values win.
  */
 export type ImageProp = Omit<React.ImgHTMLAttributes<HTMLImageElement>, "alt" | "placeholder"> & {
     /** Image URL. */

package/dist/styles/control.css

@@ -122,7 +122,8 @@
     pointer-events: none;
   }
 
-  .ui-button:disabled {
+  .ui-button:disabled,
+  .ui-button[data-loading] {
     opacity: var(--disabled-opacity);
   }
 

package/dist/styles/layers.json

@@ -1,5 +1,5 @@
 {
-  "version": "33.21.0",
+  "version": "33.22.2",
   "generatedBy": "scripts/gen-style-layers.mjs — do not edit by hand; run `pnpm gen:style-layers`",
   "base": "base.css",
   "fonts": "fonts.css",

package/dist/styles/layout.css

@@ -1826,6 +1826,15 @@
       grid-column: 2;
       grid-row: 3;
     }
+
+    .ui-legal-document[data-rail="none"] {
+      grid-template-columns: minmax(0, var(--legal-document-measure-max-width));
+    }
+
+    .ui-legal-document[data-rail="none"]
+      > :is(.ui-legal-document-header, .ui-legal-document-content, .ui-legal-document-footer) {
+      grid-column: 1;
+    }
   }
 }
 

package/dist/styles/logo-layout.css

@@ -71,6 +71,33 @@
     translate: 0 var(--logo-glyph-optical-offset, var(--logo-glyph-x-descender-optical-offset));
   }
 
+  @supports (text-box: trim-both cap alphabetic) {
+    .ui-logo-glyph[data-ink] {
+      translate: 0 var(--logo-glyph-optical-offset, 0em);
+    }
+
+    .ui-logo-glyph[data-ink="cap-baseline"] {
+      text-box: trim-both cap alphabetic;
+    }
+
+    .ui-logo-glyph[data-ink="cap-descender"] {
+      text-box: trim-both cap alphabetic;
+    }
+
+    .ui-logo-glyph[data-ink="x-baseline"] {
+      text-box: trim-both ex alphabetic;
+    }
+
+    .ui-logo-glyph[data-ink="x-descender"] {
+      text-box: trim-both ex alphabetic;
+    }
+
+    .ui-logo-glyph:is([data-ink="cap-descender"], [data-ink="x-descender"]) {
+      translate: 0
+        var(--logo-glyph-optical-offset, var(--logo-glyph-descender-trimmed-optical-offset));
+    }
+  }
+
   .ui-logo[data-size="xs"] {
     width: var(--logo-size-xs);
     height: var(--logo-size-xs);

package/dist/styles/shell-layout.css

@@ -793,7 +793,7 @@
   }
 
   .app-topbar-logo,
-  .app-topbar-logo > a {
+  .app-topbar-logo > a:not(.ui-logo) {
     display: flex;
     align-items: center;
   }