@godxjp/ui 33.12.8 → 33.13.0

package/README.md

@@ -274,8 +274,12 @@ pnpm release --ui <patch|minor|major> --mcp <…|skip>   # publish lib + MCP in
 node node_modules/@godxjp/ui/scripts/visual-audit.mjs http://localhost:5173 /invoices /settings
 node node_modules/@godxjp/ui/scripts/visual-audit.mjs http://localhost:5173 --format json  # machine-readable
 node node_modules/@godxjp/ui/scripts/visual-audit.mjs --strict http://localhost:5173       # CI gate
+# reuse a playwright-core + Chrome you already have, instead of installing the peer:
+node node_modules/@godxjp/ui/scripts/visual-audit.mjs --playwright-module /abs/path/playwright-core --executable-path /path/to/chrome http://localhost:5173
 ```
 
+The engine is resolved in this order: `--playwright-module` (a package directory or entry file exporting `chromium`; a bad path is an error, never a silent fallback) → the `playwright` peer → `playwright-core`. `--executable-path` is passed to `chromium.launch` and wins over `PLAYWRIGHT_CHROMIUM_EXECUTABLE`. When nothing resolves, the bootstrap error lists every place it looked.
+
 **Tested peer range** (pin one of these): `playwright >=1.55 <2` (tested 1.61.1)
 
 `--format json` **always** emits valid JSON — even on bootstrap failure — with a `status` (`ok` · `partial` · `error`) that separates **infrastructure errors** (missing peers, page won't load, axe won't inject → `errors[]`, `summary: null`/flagged) from **product findings** (`findings[]`). A tool failure can therefore never be misread as "zero violations". `pnpm check:visual-audit` is the CI smoke test: it serves a fixture page tripping all five rule families and asserts each one fires.

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.12.8.** If the project you are editing has a different
+**This catalog describes `@godxjp/ui` 33.13.0.** 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.

package/agent/components/BranchScopePicker.json

@@ -5,6 +5,24 @@
   "importPath": "@godxjp/ui/data-entry",
   "name": "BranchScopePicker",
   "props": [
+    {
+      "defaultValue": "\"multiple\"",
+      "description": "Single compact Select for all/one branch; multiple keeps the existing all/subset editor.",
+      "name": "selectionMode",
+      "type": "\"single\" | \"multiple\""
+    },
+    {
+      "defaultValue": "true",
+      "description": "Allow organization-wide scope. Set false for record fields, then validate exactly one permitted concrete branch on submit. Invalid supplied values are not silently coerced.",
+      "name": "allowAll",
+      "type": "boolean"
+    },
+    {
+      "defaultValue": "false",
+      "description": "Hide after a successful read of one enabled branch, except validation errors. Does not emit a change or normalize URL/default values; the app does that.",
+      "name": "hideWhenSingle",
+      "type": "boolean"
+    },
     {
       "description": "Giá trị có kiểm soát: phạm vi đang chọn.",
       "name": "value",
@@ -70,7 +88,7 @@
       "type": "ReactNode"
     },
     {
-      "description": "Native form name, forwarded to the MODE radio group — the all / selected choice is what submits under it. The checked branch ids are not native fields; they live in the single `{ mode, branchIds }` value and are yours to serialise.",
+      "description": "Native form name: multiple submits the MODE radio; single submits the Select key (`all` or `branch:<id>`). Serialize the public `{ mode, branchIds }` value yourself for domain records; native keys are not branch ownership.",
       "name": "name",
       "type": "string"
     },
@@ -91,6 +109,8 @@
   "storyPath": "data-entry/branch-scope-picker.tsx",
   "tagline": "Canonical scope control: all branches vs an explicit subset.",
   "usage": [
+    "Use selectionMode=single in Sidebar action (above navigation) and a Sheet opened from MobileShell tabBar More. These are compositions, not a new switcher. OrgSwitcher changes organization and stays in platform chrome.",
+    "The app owns URL parsing, validation against authorized branches, popstate/router updates, and onValueChange navigation. Resolve a single authorized branch in the app before hiding the picker. Viewing scope is not record ownership: record forms use separate state, selectionMode=single and allowAll=false, and validate exactly one permitted id on submit. Future groups need an explicit value contract; do not encode them as branch ids.",
     "DO treat scope as ONE form field: the single { mode, branchIds } value goes through FormField like any other control.",
     "DO import it from @godxjp/ui/data-entry — never compose an ad-hoc radio+checkbox scope block per screen.",
     "DO use `error` ONLY for validation (e.g. mode=selected with zero branches checked); a failed branch fetch is `listError`, a 403 is `denied`.",

package/agent/components/Breadcrumb.json

@@ -5,7 +5,13 @@
   "name": "Breadcrumb",
   "props": [
     {
-      "description": "Array of { label, to?, menu?, ellipsis? } — omit `to` on the last (current) segment. `ellipsis` (`boolean | { tooltip?: ReactNode }`, gh#1046; antd Breadcrumb has none, the shape is antd Typography's) keeps the trail on one line and cuts that segment's label with an ellipsis, showing the full label in a tooltip on hover and on keyboard focus of the crumb link; `{ tooltip: false }` drops the tooltip. Link and current segments only. `--breadcrumb-item-max-inline-size` (default `none`) caps such a segment. `menu` (Ant Design `BreadcrumbItemType.menu`) hangs a sibling picker off that segment: `{ items: { value, label, to?, disabled? }[], onSelect? }`. The segment then renders as a menu button, not a link — an entry with `to` becomes a real anchor inside the menu while keeping `role=\"menuitem\"`.",
+      "defaultValue": "\"last\"",
+      "description": "last | none. none renders an ancestor-only trail: every item with to stays linked and no default segment has aria-current. Missing paths remain text. menu and itemRender keep owning their segment bodies; custom renderers own their ARIA.",
+      "name": "currentItem",
+      "type": "BreadcrumbCurrentItemProp"
+    },
+    {
+      "description": "Array of { label, to?, menu?, ellipsis? } — omit `to` on the last (current) segment. `ellipsis` (`boolean | { tooltip?: ReactNode }`, gh#1046; antd Breadcrumb has none, the shape is antd Typography's) keeps the trail on one line and cuts that segment's label with an ellipsis, with the full label as aria-label and title on the clipped element (no duplicate aria-describedby), showing the full label in a tooltip on hover and on keyboard focus of the crumb link; `{ tooltip: false }` drops the tooltip. Link and current segments only. `--breadcrumb-item-max-inline-size` (default `none`) caps such a segment. `menu` (Ant Design `BreadcrumbItemType.menu`) hangs a sibling picker off that segment: `{ items: { value, label, to?, disabled? }[], onSelect? }`. The segment then renders as a menu button, not a link — an entry with `to` becomes a real anchor inside the menu while keeping `role=\"menuitem\"`.",
       "name": "items",
       "required": true,
       "type": "BreadcrumbItemProp[]"
@@ -37,7 +43,7 @@
   "tagline": "Standalone breadcrumb nav rendering an ordered trail of page segments.",
   "usage": [
     "DO import from `@godxjp/ui/layout` (not from a navigation or general sub-path) and pass a single `items` prop — an ordered array of `{ label, to? }` objects. No children, no sub-components, no render-prop API.",
-    "DO omit `to` on the last (current-page) segment — the component automatically renders it as a `<span aria-current=\"page\">` instead of a router `<Link>`. Passing `to` on the last item does NOT make it a link; drop it intentionally.",
+    "DO omit `to` on the last (current-page) segment — the component automatically renders it as a `<span aria-current=\"page\">` instead of a router `<Link>`. In the default currentItem=\"last\" mode, passing `to` on the last item does NOT make it a link. For ancestor-only trails use currentItem=\"none\" and supply every ancestor destination.",
     "DO pass the Breadcrumb node as a ReactNode to the `breadcrumb` prop of `AppShell` (or `AppShell`) for shell-level breadcrumbs, or to `PageContainer`'s `breadcrumb` prop (which accepts `BreadcrumbItemProp[]` directly — not a ReactNode). When passing to `PageContainer`, pass the raw array; when passing to `AppShell`, wrap it: `breadcrumb={<Breadcrumb items={…} />}`.",
     "DON'T hand-roll a breadcrumb strip (divs with chevrons, anchors, separators) — Breadcrumb ships the `<nav aria-label=\"Breadcrumb\">` + `<ol>` + `aria-hidden` chevrons. Any custom trail is a violation of the no-hand-roll rule and will fail `npm run ui:audit`.",
     "DON'T use Breadcrumb for tab-style or step-style navigation (multi-step forms, wizard progress). Those flows belong to `Steps`. Breadcrumb is strictly a spatial location trail, not a process indicator.",

package/agent/components/DataTable.json

@@ -86,7 +86,7 @@
     },
     {
       "defaultValue": "'default'",
-      "description": "Named collection contract — the SAME preset the Table primitive owns, forwarded to the table DataTable renders. 'default' emits NO attribute and matches no selector, so an existing DataTable is byte-identical. 'action-collection' is the canonical dense approval/action queue: below collapseBelow the desktop INTRINSIC column widths give way to the token-owned column-PRIORITY measures (--table-action-collection-*) under table-layout: fixed, cells wrap, and the bordered surface drops its --table-surface-min-inline-size floor — so requester · target · reason · requested date · row actions all stay inside a 390px frame with no horizontal scroll. Mark each column with `priority` on its ColumnDef. Semantics are untouched (no display change, no role rewriting, no card swap), so header association, aria-sort and screen-reader table navigation are identical at 390 and 1440. Measured: table 1182 / 766 / 388px at 1440 / 1024 / 390, document scrollWidth === clientWidth at every width, LTR and RTL. 'stacked-record-collection' is the other direction, for a WIDE, HETEROGENEOUS record set that has no sensible narrow column measure: below collapseBelow the <thead> hides and every <tr> becomes a bordered key-value card (--table-stacked-collection-*). Each cell then carries its column's header inline above the value, DERIVED from the same ColumnDef.header the <th> uses — so the card cannot drift from the table, and a column with a deliberately empty header names itself with ariaLabel (gh#864). In card mode the CARD owns the inline inset: a folded cell has no inline padding of its own (--table-stacked-collection-cell-padding-x, default 0), and an EMPTY cell (content null) prints no label and drops out of the card (gh#1102). Every folded cell reads from the START: a column's `align`/`numeric` end or centre alignment belongs to the table, not the card, so a count sits under its label like every other field (gh#1310). The labels are aria-hidden: the real <th> is still in the DOM and remains the accessible-name source, so screen-reader table navigation is unchanged at every width. Reach for this instead of building a parallel Card tree beside the table; two trees for one dataset means two sets of labels to keep in sync.",
+      "description": "Named collection contract — the SAME preset the Table primitive owns, forwarded to the table DataTable renders. 'default' emits NO attribute and matches no selector, so an existing DataTable is byte-identical. 'action-collection' is the canonical dense approval/action queue: below collapseBelow the desktop INTRINSIC column widths give way to the token-owned column-PRIORITY measures (--table-action-collection-*) under table-layout: fixed, cells wrap, and the bordered surface drops its --table-surface-min-inline-size floor — so requester · target · reason · requested date · row actions all stay inside a 390px frame with no horizontal scroll. Mark each column with `priority` on its ColumnDef. Semantics are untouched (no display change, no role rewriting, no card swap), so header association, aria-sort and screen-reader table navigation are identical at 390 and 1440. Measured: table 1182 / 766 / 388px at 1440 / 1024 / 390, document scrollWidth === clientWidth at every width, LTR and RTL. 'stacked-record-collection' is the other direction, for a WIDE, HETEROGENEOUS record set that has no sensible narrow column measure: below collapseBelow the <thead> hides and every <tr> becomes a bordered key-value card (--table-stacked-collection-*). Each cell then carries its column's header inline above the value, DERIVED from the same ColumnDef.header the <th> uses — so the card cannot drift from the table, and a column with a deliberately empty header names itself with ariaLabel (gh#864). In card mode the row inset defaults to the live --card-space-inset minus its own border, sharing the CardTitle keyline at every density and in RTL (override --table-stacked-collection-card-padding-x independently). The CARD owns the inline inset: a folded cell has no inline padding of its own (--table-stacked-collection-cell-padding-x, default 0), and an EMPTY cell (content null) prints no label and drops out of the card (gh#1102). Every folded cell reads from the START: a column's `align`/`numeric` end or centre alignment belongs to the table, not the card, so a count sits under its label like every other field (gh#1310). The labels are aria-hidden: the real <th> is still in the DOM and remains the accessible-name source, so screen-reader table navigation is unchanged at every width. Reach for this instead of building a parallel Card tree beside the table; two trees for one dataset means two sets of labels to keep in sync.",
       "name": "preset",
       "type": "'default' | 'action-collection' | 'stacked-record-collection'"
     },

package/agent/components/MobileShell.json

@@ -57,6 +57,7 @@
   "storyPath": "layout/mobile-shell.tsx",
   "tagline": "Handheld app shell (gh#354) — status band · app bar · the ONE scroll region · sticky action bar · bottom tab bar, with device safe-area insets and a document that never scrolls.",
   "usage": [
+    "Compose a More destination in tabBar with SheetTrigger + Sheet + BranchScopePicker selectionMode=single; see layout/mobile-branch-scope.tsx. MobileShell does not own routes or a built-in More menu.",
     "DO use MobileShell for a HANDHELD app screen — a warehouse/handy terminal, a driver app, a field-work PWA. It is the fourth root shell: AppShell (needs a sidebar) · the auth CenteredShell (unauthenticated card) · CenteredShell (authenticated scrolling document) · MobileShell (a phone app that does NOT scroll its document).",
     "DO let `children` be the only thing that scrolls. Put the primary verb in `actions` and navigation in `tabBar` — both sit outside the scroll region, so neither needs `position: sticky`, a z-index, or bottom padding to clear the other.",
     "DO NOT compose one out of <Card> + `ui-card-inset*` + `overflow-y-auto` (what docs/showcase/case6 did before gh#354). That reproduces the look and neither behaviour that matters on a device: the document still scrolls, and nothing pads out of env(safe-area-inset-*), so the notch covers the app bar and the home indicator covers the primary button.",

package/agent/components/PageContainer.json

@@ -4,6 +4,12 @@
   "importPath": "@godxjp/ui/layout",
   "name": "PageContainer",
   "props": [
+    {
+      "defaultValue": "\"last\"",
+      "description": "last | none, identical to Breadcrumb.currentItem. none keeps every supplied ancestor destination linked and emits no aria-current; the record name belongs in title. breadcrumb items also support ellipsis with the full label in aria-label and title, without a duplicate tooltip description.",
+      "name": "breadcrumbCurrentItem",
+      "type": "BreadcrumbCurrentItemProp"
+    },
     {
       "description": "Instance footer inset; omitted preserves the theme.",
       "name": "footerPad",

package/agent/components/Sidebar.json

@@ -97,6 +97,7 @@
   ],
   "tagline": "Data-driven vertical nav rail with collapsible submenu groups and a collapsed icon-only mode — never build nav manually with raw buttons.",
   "usage": [
+    "For app-local branch viewing scope, put one BranchScopePicker selectionMode=single in action above navigation; see data-entry/branch-scope-navigation.tsx. This differs from platform OrgSwitcher.",
     "DO: Define all nav items as a SidebarSectionProp[] data structure and pass it to sections — never hand-roll nav buttons alongside or instead of the Sidebar.",
     "DO: Add children: SidebarItemProp[] to any SidebarItemProp to create a collapsible submenu group. The group auto-opens and highlights when activeId matches any descendant. The SAME field drives NavList (gh#815), so one grouped settings nav is one NavList and one <nav> landmark.",
     "DO: Mirror the collapsed boolean between AppShell's sidebarCollapsed prop and Sidebar's collapsed prop — they must stay in sync so the shell layout grid adjusts correctly.",

package/agent/components/Table.json

@@ -69,7 +69,7 @@
     },
     {
       "defaultValue": "\"default\"",
-      "description": "Named collection contract. \"default\" emits no attribute and keeps the plain table. \"action-collection\" is the canonical dense approval/action queue: the desktop INTRINSIC column widths (which make a five-column queue wider than its card and force a horizontal scroll at 390) are replaced by table-layout: fixed plus the token-owned column PRIORITY measures (--table-action-collection-*), and cells wrap. Mark each column with `priority` on its TableHead AND its TableCell. Semantics are untouched — no display change, no role rewriting, no card transformation — so header association, aria-sort and screen-reader table navigation are identical at 390 and 1440. \"stacked-record-collection\" is the other direction, for a WIDE, HETEROGENEOUS record set with no sensible narrow column measure: below collapseBelow the <thead> hides and every <tr> becomes a bordered key-value card (--table-stacked-collection-*). Give each TableCell a `label` — its column header — because the <th> association it normally reads from is the thing that just went away; DataTable derives that label from ColumnDef.header for you (gh#864). In card mode the CARD owns the inline inset: a folded cell has no inline padding of its own (--table-stacked-collection-cell-padding-x, default 0), and an EMPTY cell (content null) prints no label and drops out of the card (gh#1102). Every folded cell reads from the START: a column's `align`/`numeric` end or centre alignment belongs to the table, not the card, so a count sits under its label like every other field (gh#1310). The label is aria-hidden and the real <th> stays in the DOM, so the accessible name and table navigation are unchanged.",
+      "description": "Named collection contract. \"default\" emits no attribute and keeps the plain table. \"action-collection\" is the canonical dense approval/action queue: the desktop INTRINSIC column widths (which make a five-column queue wider than its card and force a horizontal scroll at 390) are replaced by table-layout: fixed plus the token-owned column PRIORITY measures (--table-action-collection-*), and cells wrap. Mark each column with `priority` on its TableHead AND its TableCell. Semantics are untouched — no display change, no role rewriting, no card transformation — so header association, aria-sort and screen-reader table navigation are identical at 390 and 1440. \"stacked-record-collection\" is the other direction, for a WIDE, HETEROGENEOUS record set with no sensible narrow column measure: below collapseBelow the <thead> hides and every <tr> becomes a bordered key-value card (--table-stacked-collection-*). Give each TableCell a `label` — its column header — because the <th> association it normally reads from is the thing that just went away; DataTable derives that label from ColumnDef.header for you (gh#864). In card mode the row inset defaults to the live --card-space-inset minus its own border, sharing the CardTitle keyline at every density and in RTL (override --table-stacked-collection-card-padding-x independently). The CARD owns the inline inset: a folded cell has no inline padding of its own (--table-stacked-collection-cell-padding-x, default 0), and an EMPTY cell (content null) prints no label and drops out of the card (gh#1102). Every folded cell reads from the START: a column's `align`/`numeric` end or centre alignment belongs to the table, not the card, so a count sits under its label like every other field (gh#1310). The label is aria-hidden and the real <th> stays in the DOM, so the accessible name and table navigation are unchanged.",
       "name": "preset",
       "type": "\"default\" | \"action-collection\" | \"stacked-record-collection\""
     },

package/agent/components.json

@@ -651,6 +651,12 @@
     "importPath": "@godxjp/ui/layout",
     "name": "PageContainer",
     "props": [
+      {
+        "defaultValue": "\"last\"",
+        "description": "last | none, identical to Breadcrumb.currentItem. none keeps every supplied ancestor destination linked and emits no aria-current; the record name belongs in title. breadcrumb items also support ellipsis with the full label in aria-label and title, without a duplicate tooltip description.",
+        "name": "breadcrumbCurrentItem",
+        "type": "BreadcrumbCurrentItemProp"
+      },
       {
         "description": "Instance footer inset; omitted preserves the theme.",
         "name": "footerPad",
@@ -1541,6 +1547,7 @@
     "storyPath": "layout/mobile-shell.tsx",
     "tagline": "Handheld app shell (gh#354) — status band · app bar · the ONE scroll region · sticky action bar · bottom tab bar, with device safe-area insets and a document that never scrolls.",
     "usage": [
+      "Compose a More destination in tabBar with SheetTrigger + Sheet + BranchScopePicker selectionMode=single; see layout/mobile-branch-scope.tsx. MobileShell does not own routes or a built-in More menu.",
       "DO use MobileShell for a HANDHELD app screen — a warehouse/handy terminal, a driver app, a field-work PWA. It is the fourth root shell: AppShell (needs a sidebar) · the auth CenteredShell (unauthenticated card) · CenteredShell (authenticated scrolling document) · MobileShell (a phone app that does NOT scroll its document).",
       "DO let `children` be the only thing that scrolls. Put the primary verb in `actions` and navigation in `tabBar` — both sit outside the scroll region, so neither needs `position: sticky`, a z-index, or bottom padding to clear the other.",
       "DO NOT compose one out of <Card> + `ui-card-inset*` + `overflow-y-auto` (what docs/showcase/case6 did before gh#354). That reproduces the look and neither behaviour that matters on a device: the document still scrolls, and nothing pads out of env(safe-area-inset-*), so the notch covers the app bar and the home indicator covers the primary button.",
@@ -1654,6 +1661,7 @@
     ],
     "tagline": "Data-driven vertical nav rail with collapsible submenu groups and a collapsed icon-only mode — never build nav manually with raw buttons.",
     "usage": [
+      "For app-local branch viewing scope, put one BranchScopePicker selectionMode=single in action above navigation; see data-entry/branch-scope-navigation.tsx. This differs from platform OrgSwitcher.",
       "DO: Define all nav items as a SidebarSectionProp[] data structure and pass it to sections — never hand-roll nav buttons alongside or instead of the Sidebar.",
       "DO: Add children: SidebarItemProp[] to any SidebarItemProp to create a collapsible submenu group. The group auto-opens and highlights when activeId matches any descendant. The SAME field drives NavList (gh#815), so one grouped settings nav is one NavList and one <nav> landmark.",
       "DO: Mirror the collapsed boolean between AppShell's sidebarCollapsed prop and Sidebar's collapsed prop — they must stay in sync so the shell layout grid adjusts correctly.",
@@ -2495,7 +2503,13 @@
     "name": "Breadcrumb",
     "props": [
       {
-        "description": "Array of { label, to?, menu?, ellipsis? } — omit `to` on the last (current) segment. `ellipsis` (`boolean | { tooltip?: ReactNode }`, gh#1046; antd Breadcrumb has none, the shape is antd Typography's) keeps the trail on one line and cuts that segment's label with an ellipsis, showing the full label in a tooltip on hover and on keyboard focus of the crumb link; `{ tooltip: false }` drops the tooltip. Link and current segments only. `--breadcrumb-item-max-inline-size` (default `none`) caps such a segment. `menu` (Ant Design `BreadcrumbItemType.menu`) hangs a sibling picker off that segment: `{ items: { value, label, to?, disabled? }[], onSelect? }`. The segment then renders as a menu button, not a link — an entry with `to` becomes a real anchor inside the menu while keeping `role=\"menuitem\"`.",
+        "defaultValue": "\"last\"",
+        "description": "last | none. none renders an ancestor-only trail: every item with to stays linked and no default segment has aria-current. Missing paths remain text. menu and itemRender keep owning their segment bodies; custom renderers own their ARIA.",
+        "name": "currentItem",
+        "type": "BreadcrumbCurrentItemProp"
+      },
+      {
+        "description": "Array of { label, to?, menu?, ellipsis? } — omit `to` on the last (current) segment. `ellipsis` (`boolean | { tooltip?: ReactNode }`, gh#1046; antd Breadcrumb has none, the shape is antd Typography's) keeps the trail on one line and cuts that segment's label with an ellipsis, with the full label as aria-label and title on the clipped element (no duplicate aria-describedby), showing the full label in a tooltip on hover and on keyboard focus of the crumb link; `{ tooltip: false }` drops the tooltip. Link and current segments only. `--breadcrumb-item-max-inline-size` (default `none`) caps such a segment. `menu` (Ant Design `BreadcrumbItemType.menu`) hangs a sibling picker off that segment: `{ items: { value, label, to?, disabled? }[], onSelect? }`. The segment then renders as a menu button, not a link — an entry with `to` becomes a real anchor inside the menu while keeping `role=\"menuitem\"`.",
         "name": "items",
         "required": true,
         "type": "BreadcrumbItemProp[]"
@@ -2527,7 +2541,7 @@
     "tagline": "Standalone breadcrumb nav rendering an ordered trail of page segments.",
     "usage": [
       "DO import from `@godxjp/ui/layout` (not from a navigation or general sub-path) and pass a single `items` prop — an ordered array of `{ label, to? }` objects. No children, no sub-components, no render-prop API.",
-      "DO omit `to` on the last (current-page) segment — the component automatically renders it as a `<span aria-current=\"page\">` instead of a router `<Link>`. Passing `to` on the last item does NOT make it a link; drop it intentionally.",
+      "DO omit `to` on the last (current-page) segment — the component automatically renders it as a `<span aria-current=\"page\">` instead of a router `<Link>`. In the default currentItem=\"last\" mode, passing `to` on the last item does NOT make it a link. For ancestor-only trails use currentItem=\"none\" and supply every ancestor destination.",
       "DO pass the Breadcrumb node as a ReactNode to the `breadcrumb` prop of `AppShell` (or `AppShell`) for shell-level breadcrumbs, or to `PageContainer`'s `breadcrumb` prop (which accepts `BreadcrumbItemProp[]` directly — not a ReactNode). When passing to `PageContainer`, pass the raw array; when passing to `AppShell`, wrap it: `breadcrumb={<Breadcrumb items={…} />}`.",
       "DON'T hand-roll a breadcrumb strip (divs with chevrons, anchors, separators) — Breadcrumb ships the `<nav aria-label=\"Breadcrumb\">` + `<ol>` + `aria-hidden` chevrons. Any custom trail is a violation of the no-hand-roll rule and will fail `npm run ui:audit`.",
       "DON'T use Breadcrumb for tab-style or step-style navigation (multi-step forms, wizard progress). Those flows belong to `Steps`. Breadcrumb is strictly a spatial location trail, not a process indicator.",
@@ -3475,7 +3489,7 @@
       },
       {
         "defaultValue": "'default'",
-        "description": "Named collection contract — the SAME preset the Table primitive owns, forwarded to the table DataTable renders. 'default' emits NO attribute and matches no selector, so an existing DataTable is byte-identical. 'action-collection' is the canonical dense approval/action queue: below collapseBelow the desktop INTRINSIC column widths give way to the token-owned column-PRIORITY measures (--table-action-collection-*) under table-layout: fixed, cells wrap, and the bordered surface drops its --table-surface-min-inline-size floor — so requester · target · reason · requested date · row actions all stay inside a 390px frame with no horizontal scroll. Mark each column with `priority` on its ColumnDef. Semantics are untouched (no display change, no role rewriting, no card swap), so header association, aria-sort and screen-reader table navigation are identical at 390 and 1440. Measured: table 1182 / 766 / 388px at 1440 / 1024 / 390, document scrollWidth === clientWidth at every width, LTR and RTL. 'stacked-record-collection' is the other direction, for a WIDE, HETEROGENEOUS record set that has no sensible narrow column measure: below collapseBelow the <thead> hides and every <tr> becomes a bordered key-value card (--table-stacked-collection-*). Each cell then carries its column's header inline above the value, DERIVED from the same ColumnDef.header the <th> uses — so the card cannot drift from the table, and a column with a deliberately empty header names itself with ariaLabel (gh#864). In card mode the CARD owns the inline inset: a folded cell has no inline padding of its own (--table-stacked-collection-cell-padding-x, default 0), and an EMPTY cell (content null) prints no label and drops out of the card (gh#1102). Every folded cell reads from the START: a column's `align`/`numeric` end or centre alignment belongs to the table, not the card, so a count sits under its label like every other field (gh#1310). The labels are aria-hidden: the real <th> is still in the DOM and remains the accessible-name source, so screen-reader table navigation is unchanged at every width. Reach for this instead of building a parallel Card tree beside the table; two trees for one dataset means two sets of labels to keep in sync.",
+        "description": "Named collection contract — the SAME preset the Table primitive owns, forwarded to the table DataTable renders. 'default' emits NO attribute and matches no selector, so an existing DataTable is byte-identical. 'action-collection' is the canonical dense approval/action queue: below collapseBelow the desktop INTRINSIC column widths give way to the token-owned column-PRIORITY measures (--table-action-collection-*) under table-layout: fixed, cells wrap, and the bordered surface drops its --table-surface-min-inline-size floor — so requester · target · reason · requested date · row actions all stay inside a 390px frame with no horizontal scroll. Mark each column with `priority` on its ColumnDef. Semantics are untouched (no display change, no role rewriting, no card swap), so header association, aria-sort and screen-reader table navigation are identical at 390 and 1440. Measured: table 1182 / 766 / 388px at 1440 / 1024 / 390, document scrollWidth === clientWidth at every width, LTR and RTL. 'stacked-record-collection' is the other direction, for a WIDE, HETEROGENEOUS record set that has no sensible narrow column measure: below collapseBelow the <thead> hides and every <tr> becomes a bordered key-value card (--table-stacked-collection-*). Each cell then carries its column's header inline above the value, DERIVED from the same ColumnDef.header the <th> uses — so the card cannot drift from the table, and a column with a deliberately empty header names itself with ariaLabel (gh#864). In card mode the row inset defaults to the live --card-space-inset minus its own border, sharing the CardTitle keyline at every density and in RTL (override --table-stacked-collection-card-padding-x independently). The CARD owns the inline inset: a folded cell has no inline padding of its own (--table-stacked-collection-cell-padding-x, default 0), and an EMPTY cell (content null) prints no label and drops out of the card (gh#1102). Every folded cell reads from the START: a column's `align`/`numeric` end or centre alignment belongs to the table, not the card, so a count sits under its label like every other field (gh#1310). The labels are aria-hidden: the real <th> is still in the DOM and remains the accessible-name source, so screen-reader table navigation is unchanged at every width. Reach for this instead of building a parallel Card tree beside the table; two trees for one dataset means two sets of labels to keep in sync.",
         "name": "preset",
         "type": "'default' | 'action-collection' | 'stacked-record-collection'"
       },
@@ -5615,7 +5629,7 @@
       },
       {
         "defaultValue": "\"default\"",
-        "description": "Named collection contract. \"default\" emits no attribute and keeps the plain table. \"action-collection\" is the canonical dense approval/action queue: the desktop INTRINSIC column widths (which make a five-column queue wider than its card and force a horizontal scroll at 390) are replaced by table-layout: fixed plus the token-owned column PRIORITY measures (--table-action-collection-*), and cells wrap. Mark each column with `priority` on its TableHead AND its TableCell. Semantics are untouched — no display change, no role rewriting, no card transformation — so header association, aria-sort and screen-reader table navigation are identical at 390 and 1440. \"stacked-record-collection\" is the other direction, for a WIDE, HETEROGENEOUS record set with no sensible narrow column measure: below collapseBelow the <thead> hides and every <tr> becomes a bordered key-value card (--table-stacked-collection-*). Give each TableCell a `label` — its column header — because the <th> association it normally reads from is the thing that just went away; DataTable derives that label from ColumnDef.header for you (gh#864). In card mode the CARD owns the inline inset: a folded cell has no inline padding of its own (--table-stacked-collection-cell-padding-x, default 0), and an EMPTY cell (content null) prints no label and drops out of the card (gh#1102). Every folded cell reads from the START: a column's `align`/`numeric` end or centre alignment belongs to the table, not the card, so a count sits under its label like every other field (gh#1310). The label is aria-hidden and the real <th> stays in the DOM, so the accessible name and table navigation are unchanged.",
+        "description": "Named collection contract. \"default\" emits no attribute and keeps the plain table. \"action-collection\" is the canonical dense approval/action queue: the desktop INTRINSIC column widths (which make a five-column queue wider than its card and force a horizontal scroll at 390) are replaced by table-layout: fixed plus the token-owned column PRIORITY measures (--table-action-collection-*), and cells wrap. Mark each column with `priority` on its TableHead AND its TableCell. Semantics are untouched — no display change, no role rewriting, no card transformation — so header association, aria-sort and screen-reader table navigation are identical at 390 and 1440. \"stacked-record-collection\" is the other direction, for a WIDE, HETEROGENEOUS record set with no sensible narrow column measure: below collapseBelow the <thead> hides and every <tr> becomes a bordered key-value card (--table-stacked-collection-*). Give each TableCell a `label` — its column header — because the <th> association it normally reads from is the thing that just went away; DataTable derives that label from ColumnDef.header for you (gh#864). In card mode the row inset defaults to the live --card-space-inset minus its own border, sharing the CardTitle keyline at every density and in RTL (override --table-stacked-collection-card-padding-x independently). The CARD owns the inline inset: a folded cell has no inline padding of its own (--table-stacked-collection-cell-padding-x, default 0), and an EMPTY cell (content null) prints no label and drops out of the card (gh#1102). Every folded cell reads from the START: a column's `align`/`numeric` end or centre alignment belongs to the table, not the card, so a count sits under its label like every other field (gh#1310). The label is aria-hidden and the real <th> stays in the DOM, so the accessible name and table navigation are unchanged.",
         "name": "preset",
         "type": "\"default\" | \"action-collection\" | \"stacked-record-collection\""
       },
@@ -15024,6 +15038,24 @@
     "importPath": "@godxjp/ui/data-entry",
     "name": "BranchScopePicker",
     "props": [
+      {
+        "defaultValue": "\"multiple\"",
+        "description": "Single compact Select for all/one branch; multiple keeps the existing all/subset editor.",
+        "name": "selectionMode",
+        "type": "\"single\" | \"multiple\""
+      },
+      {
+        "defaultValue": "true",
+        "description": "Allow organization-wide scope. Set false for record fields, then validate exactly one permitted concrete branch on submit. Invalid supplied values are not silently coerced.",
+        "name": "allowAll",
+        "type": "boolean"
+      },
+      {
+        "defaultValue": "false",
+        "description": "Hide after a successful read of one enabled branch, except validation errors. Does not emit a change or normalize URL/default values; the app does that.",
+        "name": "hideWhenSingle",
+        "type": "boolean"
+      },
       {
         "description": "Giá trị có kiểm soát: phạm vi đang chọn.",
         "name": "value",
@@ -15089,7 +15121,7 @@
         "type": "ReactNode"
       },
       {
-        "description": "Native form name, forwarded to the MODE radio group — the all / selected choice is what submits under it. The checked branch ids are not native fields; they live in the single `{ mode, branchIds }` value and are yours to serialise.",
+        "description": "Native form name: multiple submits the MODE radio; single submits the Select key (`all` or `branch:<id>`). Serialize the public `{ mode, branchIds }` value yourself for domain records; native keys are not branch ownership.",
         "name": "name",
         "type": "string"
       },
@@ -15110,6 +15142,8 @@
     "storyPath": "data-entry/branch-scope-picker.tsx",
     "tagline": "Canonical scope control: all branches vs an explicit subset.",
     "usage": [
+      "Use selectionMode=single in Sidebar action (above navigation) and a Sheet opened from MobileShell tabBar More. These are compositions, not a new switcher. OrgSwitcher changes organization and stays in platform chrome.",
+      "The app owns URL parsing, validation against authorized branches, popstate/router updates, and onValueChange navigation. Resolve a single authorized branch in the app before hiding the picker. Viewing scope is not record ownership: record forms use separate state, selectionMode=single and allowAll=false, and validate exactly one permitted id on submit. Future groups need an explicit value contract; do not encode them as branch ids.",
       "DO treat scope as ONE form field: the single { mode, branchIds } value goes through FormField like any other control.",
       "DO import it from @godxjp/ui/data-entry — never compose an ad-hoc radio+checkbox scope block per screen.",
       "DO use `error` ONLY for validation (e.g. mode=selected with zero branches checked); a failed branch fetch is `listError`, a 403 is `denied`.",

package/agent/index.json

@@ -5,7 +5,7 @@
     "patterns": 28,
     "rules": 44,
     "tokens": 2241,
-    "vocabulary": 14
+    "vocabulary": 15
   },
   "design": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/DESIGN.md",
   "files": [
@@ -54,7 +54,7 @@
   "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.12.8/agent/index.json"
+    "pinned": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/v33.13.0/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",
@@ -68,5 +68,5 @@
     "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.12.8"
+  "version": "33.13.0"
 }

package/agent/llms.txt

@@ -1,10 +1,10 @@
 # @godxjp/ui
 
 > A Japanese-enterprise React design system: 169 components, 2241 design tokens,
-> 44 cardinal rules. This file is the entry point for AI agents. Catalog version 33.12.8.
+> 44 cardinal rules. This file is the entry point for AI agents. Catalog version 33.13.0.
 
 If your client can run a process, do not read these files — run the MCP server instead
-(`npx @godxjp/ui-mcp@33.12.8`). It is searchable and version-locked. These files exist for agents
+(`npx @godxjp/ui-mcp@33.13.0`). It is searchable and version-locked. These files exist for agents
 that can only fetch URLs.
 
 ## Start
@@ -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.12.8/agent/...`. A catalog that does not match the installed
+the tag: `.../godx-jp/godxjp-ui/v33.13.0/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

@@ -12534,10 +12534,10 @@
     "value": "var(--space-stack-sm)"
   },
   {
-    "description": "Table component tokens: row height, cell padding.",
+    "description": "default = Card inset minus the row border, resolved at the row",
     "name": "--table-stacked-collection-card-padding-x",
     "tier": "component",
-    "value": "var(--space-inline-md)"
+    "value": "initial"
   },
   {
     "description": "Table component tokens: row height, cell padding.",

package/agent/vocabulary.json

@@ -1,4 +1,17 @@
 [
+  {
+    "concept": "Which breadcrumb item represents the current page.",
+    "name": "BreadcrumbCurrentItemProp",
+    "notes": "Defaults to last. none retains ancestor links without aria-current; supply to for each ancestor.",
+    "usedBy": [
+      "Breadcrumb",
+      "PageContainer"
+    ],
+    "values": [
+      "last",
+      "none"
+    ]
+  },
   {
     "concept": "Abstract controlled value.",
     "name": "ValueProp<T = string>",

package/dist/components/data-entry/branch-scope-picker.d.ts

@@ -10,6 +10,9 @@ export declare const BranchScopePicker: React.ForwardRefExoticComponent<import("
     value?: BranchScopeValueProp;
     defaultValue?: BranchScopeValueProp;
     onValueChange?: (value: BranchScopeValueProp) => void;
+    selectionMode?: "single" | "multiple";
+    allowAll?: boolean;
+    hideWhenSingle?: boolean;
     disabled?: import("../../props/index.js").DisabledProp;
     readOnly?: boolean;
     searchable?: boolean;

package/dist/components/data-entry/branch-scope-picker.js

@@ -11,17 +11,21 @@ import { SkeletonRows } from "../feedback/skeleton.js";
 import { Text } from "../general/typography.js";
 import { CheckboxGroup } from "./checkbox-group.js";
 import { RadioGroup } from "./radio.js";
+import { Select } from "./select.js";
 import { SearchInput } from "./search-input.js";
 const DEFAULT_VALUE = { mode: "all" };
 const BranchScopePicker = React.forwardRef(
   function BranchScopePicker2({
     branches,
     value: controlledValue,
-    defaultValue = DEFAULT_VALUE,
+    defaultValue,
     onValueChange,
     disabled = false,
     readOnly = false,
     searchable = true,
+    selectionMode = "multiple",
+    allowAll = true,
+    hideWhenSingle = false,
     error,
     loading = false,
     empty,
@@ -39,7 +43,9 @@ const BranchScopePicker = React.forwardRef(
     const reactId = React.useId();
     const rootId = id ?? `branch-scope-${reactId}`;
     const errorId = `${rootId}-error`;
-    const [uncontrolled, setUncontrolled] = React.useState(defaultValue);
+    const [uncontrolled, setUncontrolled] = React.useState(
+      defaultValue ?? (allowAll ? DEFAULT_VALUE : { mode: "selected", branchIds: [] })
+    );
     const value = controlledValue ?? uncontrolled;
     const branchIds = React.useMemo(() => value.branchIds ?? [], [value.branchIds]);
     const commit = (next) => {
@@ -109,12 +115,58 @@ const BranchScopePicker = React.forwardRef(
         /* @__PURE__ */ jsx("div", { "aria-live": "polite", children: empty ?? /* @__PURE__ */ jsx(EmptyState, { variant: "compact", title: t("dataEntry.branchScope.empty"), titleAs: "p" }) })
       );
     }
+    if (hideWhenSingle && branches.length === 1 && !branches[0].disabled && !invalid) return null;
+    if (selectionMode === "single") {
+      const selected = value.mode === "selected" && branchIds.length === 1 && branches.some((branch) => branch.id === branchIds[0]) ? `branch:${branchIds[0]}` : value.mode === "all" && allowAll ? "all" : "";
+      return surface(
+        /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            Select,
+            {
+              value: selected,
+              onValueChange: (next) => {
+                if (next === "all" && allowAll) commit({ mode: "all" });
+                else if (next.startsWith("branch:"))
+                  commit({ mode: "selected", branchIds: [next.slice(7)] });
+              },
+              options: [
+                ...allowAll ? [
+                  {
+                    value: "all",
+                    label: typeof resolvedAllLabel === "string" ? resolvedAllLabel : t("dataEntry.branchScope.all")
+                  }
+                ] : [],
+                ...branches.map((branch) => ({
+                  value: `branch:${branch.id}`,
+                  label: branch.name,
+                  disabled: branch.disabled
+                }))
+              ],
+              optionRender: (option) => option.value === "all" ? resolvedAllLabel : option.label,
+              labelRender: (option) => option.value === "all" ? resolvedAllLabel : option.label,
+              showSearch: searchable,
+              searchPlaceholder: t("dataEntry.branchScope.searchPlaceholder"),
+              placeholder: t("dataEntry.branchScope.choose"),
+              notFoundContent: notFoundContent ?? t("dataEntry.branchScope.noMatches"),
+              disabled,
+              readOnly,
+              name,
+              ...fieldA11y,
+              "aria-label": fieldA11y["aria-label"] ?? t("dataEntry.branchScope.listLabel"),
+              "aria-invalid": invalid ? true : fieldA11y["aria-invalid"],
+              "aria-errormessage": invalid ? mergeAriaIds(errorId, fieldA11y["aria-errormessage"]) : void 0
+            }
+          ),
+          invalid && /* @__PURE__ */ jsx("p", { id: errorId, role: "alert", className: "text-error-strong text-xs", children: error })
+        ] })
+      );
+    }
     if (readOnly) {
       const selectedBranches = branches.filter((branch) => branchIds.includes(branch.id));
       return surface(
         /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(Text, { size: "sm", weight: "medium", children: value.mode === "all" ? resolvedAllLabel : resolvedSelectedLabel }),
-          value.mode === "selected" && /* @__PURE__ */ jsx("div", { className: "ui-branch-scope-picker-badges", children: selectedBranches.map((branch) => /* @__PURE__ */ jsx(Badge, { variant: "outline", children: branch.name }, branch.id)) })
+          /* @__PURE__ */ jsx(Text, { size: "sm", weight: "medium", children: value.mode === "all" && allowAll ? resolvedAllLabel : resolvedSelectedLabel }),
+          (value.mode === "selected" || !allowAll) && /* @__PURE__ */ jsx("div", { className: "ui-branch-scope-picker-badges", children: selectedBranches.map((branch) => /* @__PURE__ */ jsx(Badge, { variant: "outline", children: branch.name }, branch.id)) })
         ] })
       );
     }
@@ -123,16 +175,18 @@ const BranchScopePicker = React.forwardRef(
         /* @__PURE__ */ jsx(
           RadioGroup,
           {
-            value: value.mode,
+            value: allowAll ? value.mode : "selected",
             onValueChange: (mode) => {
               commit({ ...value, mode });
             },
             options: [
-              {
-                value: "all",
-                label: resolvedAllLabel,
-                description: allLabel === void 0 ? t("dataEntry.branchScope.allDescription") : void 0
-              },
+              ...allowAll ? [
+                {
+                  value: "all",
+                  label: resolvedAllLabel,
+                  description: allLabel === void 0 ? t("dataEntry.branchScope.allDescription") : void 0
+                }
+              ] : [],
               {
                 value: "selected",
                 label: resolvedSelectedLabel,
@@ -146,7 +200,7 @@ const BranchScopePicker = React.forwardRef(
             "aria-errormessage": invalid ? mergeAriaIds(errorId, fieldA11y["aria-errormessage"]) : void 0
           }
         ),
-        value.mode === "selected" && /* @__PURE__ */ jsxs("div", { className: "ui-branch-scope-picker-subset", children: [
+        (value.mode === "selected" || !allowAll) && /* @__PURE__ */ jsxs("div", { className: "ui-branch-scope-picker-subset", children: [
           searchable && branches.length > 0 && /* @__PURE__ */ jsx(
             SearchInput,
             {

package/dist/components/layout/breadcrumb-ellipsis.js

@@ -1,8 +1,24 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { cloneElement, useRef } from "react";
+import {
+  Children,
+  cloneElement,
+  isValidElement,
+  useEffect,
+  useRef
+} from "react";
 import { cn } from "../../lib/utils.js";
 import { EllipsisTooltip } from "../feedback/tooltip.js";
+function labelText(label) {
+  return Children.toArray(label).map((node) => {
+    if (typeof node === "string" || typeof node === "number") return String(node);
+    if (!isValidElement(node))
+      return "";
+    if (node.props["aria-hidden"] === true || node.props["aria-hidden"] === "true" || node.props.hidden)
+      return "";
+    return labelText(node.props.children);
+  }).join("");
+}
 function trailEllipsis(items) {
   return items.some((item) => item.ellipsis) ? "" : void 0;
 }
@@ -11,12 +27,28 @@ function BreadcrumbCrumbText({
   children
 }) {
   const anchorRef = useRef(null);
+  const fullLabel = labelText(item.label);
+  useEffect(() => {
+    const node = anchorRef.current;
+    if (!node || !item.ellipsis) return;
+    const rendered = node.cloneNode(true);
+    rendered.querySelectorAll('[aria-hidden="true"], [hidden]').forEach((child) => child.remove());
+    const text = rendered.textContent || fullLabel;
+    if (text) {
+      node.setAttribute("aria-label", text);
+      node.setAttribute("title", text);
+    }
+  }, [fullLabel, item.label, item.ellipsis]);
   if (!item.ellipsis) return children;
   const tooltip = typeof item.ellipsis === "object" && "tooltip" in item.ellipsis ? item.ellipsis.tooltip === true ? item.label : item.ellipsis.tooltip : item.label;
   const hasTooltip = tooltip !== void 0 && tooltip !== null && tooltip !== false && tooltip !== "";
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     cloneElement(children, {
+      // Keep the label's own start visible regardless of the page direction (#1370).
+      dir: "auto",
       ref: anchorRef,
+      "aria-label": fullLabel || void 0,
+      title: fullLabel || void 0,
       className: cn(children.props.className, "ui-breadcrumb-ellipsis")
     }),
     hasTooltip ? /* @__PURE__ */ jsx(EllipsisTooltip, { anchorRef, title: tooltip }) : null

package/dist/components/layout/breadcrumb.d.ts

@@ -1,7 +1,9 @@
 import type { ElementType } from "react";
-import type { BreadcrumbItemRenderProp, BreadcrumbProp, BreadcrumbSeparatorProp } from "../../props/vocabulary/navigation.prop.js";
+import type { BreadcrumbCurrentItemProp, BreadcrumbItemRenderProp, BreadcrumbProp, BreadcrumbSeparatorProp } from "../../props/vocabulary/navigation.prop.js";
 export type BreadcrumbProps = {
     items: BreadcrumbProp;
+    /** Last item is current by default; none keeps an ancestor-only trail linked. */
+    currentItem?: BreadcrumbCurrentItemProp;
     linkComponent?: ElementType;
     /** Override the `<nav>` landmark's accessible name. Defaults to a localized "Breadcrumb". */
     ariaLabel?: string;
@@ -18,4 +20,4 @@ export type BreadcrumbProps = {
      */
     itemRender?: BreadcrumbItemRenderProp;
 };
-export declare function Breadcrumb({ items, linkComponent: LinkComponent, ariaLabel, separator, itemRender, }: BreadcrumbProps): import("react").JSX.Element;
+export declare function Breadcrumb({ items, currentItem, linkComponent: LinkComponent, ariaLabel, separator, itemRender, }: BreadcrumbProps): import("react").JSX.Element;