@treeui/mcp 0.8.0 → 0.8.1

package/dist/index.cjs

@@ -50,9 +50,9 @@ module.exports = __toCommonJS(index_exports);
 
 // src/generated/treeui.catalog.json
 var treeui_catalog_default = {
-  generatedAt: "0.30.0",
+  generatedAt: "0.32.0",
   packageName: "@treeui/vue",
-  packageVersion: "0.30.0",
+  packageVersion: "0.32.0",
   decisionGuides: [
     {
       id: "single-choice",
@@ -175,7 +175,7 @@ var treeui_catalog_default = {
           ],
           notes: [
             "Editing, not display. For read-only key/value display use TDescriptionList.",
-            "A write-only/sensitive mode (value never read back) is a closed contract on the queue, not yet shipped."
+            "A write-only/sensitive mode (value never read back) is a designed contract that is not yet shipped."
           ]
         },
         {
@@ -473,8 +473,8 @@ var treeui_catalog_default = {
         "Put the lockup in the `header-start` slot, not `header`. Filling `header-start` switches the header to the shell's own grid, so the mark tracks `--tree-app-shell-sidebar-width` and animates with the collapse \u2014 no local column math.",
         'The slot is scoped: use its `collapsed` binding to drop the wordmark and keep only the mark (`v-if="!collapsed"`), rather than hiding text with CSS.',
         'Logo is `TAvatar` (`size`, `alt`, `initials` fallback) or a plain `<img>` sized with `--tree-size-icon-*`; name and subtitle are `TText` (`weight`, `tone="muted"`, `truncate`) \u2014 never raw `<strong>`/`<span>` with a local class.',
-        "TreeUI ships no `TBrand` component on purpose: the logo asset, the product name, and what survives collapse are product identity, which must stay in the consumer. See DECISIONS.md \u2192 Portability Boundary.",
-        "Company and service logos (AWS, LocalStack, social networks) are brand assets and are not TreeUI icons \u2014 source them from the app's brand policy, not the icon registry."
+        "TreeUI ships no `TBrand` component on purpose: the logo asset, the product name, and what survives collapse are product identity, which must stay in the consuming application. See DECISIONS.md \u2192 Portability Boundary.",
+        "Company and service logos are brand assets, not TreeUI icons \u2014 source them from your own brand assets rather than the icon registry."
       ]
     },
     {
@@ -820,28 +820,38 @@ var treeui_catalog_default = {
         "Tab/Shift+Tab order, Escape to close, Enter/Space to activate, arrow keys where the pattern expects them.",
         "Overlays trap focus while open and restore it on close.",
         "Clickable targets stay at or above 44\xD744px.",
-        "Form control boundaries clear 3:1 against every surface (WCAG 1.4.11); decorative edges are a separate token and are not held to it."
+        "Form control boundaries clear 3:1 against every surface (WCAG 1.4.11); decorative edges are a separate token and are not held to it.",
+        "A panel anchored to a trigger is rendered in a layer no ancestor can clip, and is pushed back inside the viewport \u2014 a control that is painted off-screen or behind a clip is not operable.",
+        "Every string a screen reader announces is a prop with a default, never a hard-coded literal; a control whose only name is English is unusable in any other language."
       ],
       components: [
-        "TModal",
-        "TDrawer",
-        "TConfirmDialog",
-        "TDropdown",
-        "TTooltip",
         "TAccordion",
-        "TFormField",
-        "TTreeView",
-        "TToastProvider",
+        "TAppShell",
         "TButton",
+        "TCanvasSurface",
+        "TCheckbox",
         "TCodeBlock",
+        "TConfirmDialog",
+        "TDatePicker",
+        "TDrawer",
+        "TDropdown",
+        "TFileUpload",
+        "TFormField",
+        "TImage",
         "TLinkTile",
         "TMenu",
+        "TModal",
         "TPopover",
-        "TImage",
+        "TSelect",
         "TSkipLink",
-        "TAppShell",
-        "TCheckbox",
-        "TText"
+        "TSteps",
+        "TTabs",
+        "TText",
+        "TToast",
+        "TToastProvider",
+        "TToggleGroup",
+        "TTooltip",
+        "TTreeView"
       ]
     },
     {
@@ -901,26 +911,42 @@ var treeui_catalog_default = {
         "Spacing comes from the --tree-space-* scale, applied by layout components.",
         "Compose TPage, TStack, TGrid, and TSplit before writing a custom layout div.",
         "Forms align through TFormField + TStack + TGrid \u2014 labels, hints, and errors line up by contract.",
-        "Reading widths and page gutters come from TContainer/TPage, not local max-widths."
+        "Reading widths and page gutters come from TContainer/TPage, not local max-widths.",
+        "A surface takes its container's width: it never grows to the min-content of something inside it. Card, modal and timeline surfaces declare an explicit minmax(0, 1fr) track, and text that can lack a break opportunity wraps, so scrolling and truncation belong to the descendant that asked for them \u2014 never to every sibling on the surface."
       ],
       components: [
-        "TStack",
-        "TGrid",
-        "TSplit",
-        "TContainer",
-        "TSpacer",
-        "TPage",
-        "TPageHeader",
-        "TFormField",
+        "TAppShell",
+        "TBadge",
         "TBrandLockup",
-        "TList",
+        "TCanvasSurface",
+        "TCard",
+        "TCodeBlock",
+        "TConfirmDialog",
+        "TContainer",
         "TDescriptionList",
-        "TSection",
+        "TEmptyState",
+        "TFormField",
+        "TGrid",
         "THero",
+        "THide",
+        "TLinkTile",
+        "TList",
+        "TModal",
+        "TNavMenu",
+        "TPage",
+        "TPageHeader",
         "TPageSurface",
+        "TSection",
         "TShow",
-        "THide",
-        "TEmptyState"
+        "TSpacer",
+        "TSparkline",
+        "TSplit",
+        "TStack",
+        "TStat",
+        "TSteps",
+        "TTabs",
+        "TText",
+        "TTimeline"
       ]
     },
     {
@@ -967,6 +993,24 @@ var treeui_catalog_default = {
         "TTextarea",
         "TToast"
       ]
+    },
+    {
+      id: "branchline-icons",
+      title: "Icons drawn to a contract",
+      summary: "Branchline is the drawing contract behind every shipped icon: one grid, one weight, one closed modifier vocabulary. It is checked rather than reviewed \u2014 the build renders each glyph and fails when two names look alike at 16px or when a shape draws nothing.",
+      rules: [
+        "One grid: a 24x24 canvas with geometry inside a 1.5-22.5 trim area, so a 2u stroke never clips; four keylines carry the set \u2014 square 17.5, circle 18.5 diameter, wide 18x14, tall 14x18 \u2014 and positions land on a 0.25u step.",
+        "One weight: 2u stroke, round caps and joins, currentColor and fill=none, all declared on the root <svg>. A child that sets stroke or fill breaks absoluteStrokeWidth and fails the build.",
+        "Legible at the size it ships at: every pair of canonical icons is rendered at 16px and must differ by at least 5% of its ink. The rule is measured by branchline.test.ts, not judged by eye.",
+        "A modifier gets territory of its own, and the base keeps its size: it is drawn inside bases that enclose space (shield, file, folder, calendar, ticket, message, square, badge, search) and in a cleared corner otherwise, where the base is redrawn at full size with that corner interrupted so 5.5u of canvas stays clear around the mark.",
+        "Every shape earns its place: each node is removed and re-rendered, and a node that changes less than 1% of the glyph's ink fails the build. Geometry is never derived from the icon's name.",
+        "A family shares one base, drawn once and reused literally; a variant changes exactly one thing, in one place, by one rule.",
+        "The metaphor is the conventional one \u2014 an icon is not the place to be original. A concept with no settled picture composes one from Branchline primitives, drawn deliberately rather than generated.",
+        "One concept, one canonical name, one drawing. A synonym is an alias that shares its target's geometry byte for byte, so mic and microphone can never drift apart."
+      ],
+      components: [
+        "TIcon"
+      ]
     }
   ],
   setup: {
@@ -1604,7 +1648,7 @@ var treeui_catalog_default = {
           name: "showCollapseButton",
           type: "boolean",
           default: "true",
-          note: "Renders the built-in collapse toggle in the sidebar footer. Desktop only, and only when `collapsible` is set \u2014 no need to wire your own. Never rendered in the mobile drawer."
+          note: "Renders the built-in collapse toggle in the sidebar footer. Desktop only, and only when `collapsible` is set \u2014 no need to wire your own. Never rendered in the mobile drawer, and never inside the auto-rail band (between `breakpoint` and `railBreakpoint`): there the width decides the state, so the button could not change anything, did nothing when pressed, and announced the manual preference instead of what was on screen. Its `aria-expanded` and `aria-label` are derived from the EFFECTIVE collapsed state, as the glyph already was."
         },
         {
           name: "collapseLabel",
@@ -1688,7 +1732,7 @@ var treeui_catalog_default = {
         },
         {
           name: "header-end",
-          description: "Trailing header region for actions/controls, pinned to the far end of the row. Filling it adds `has-end`; in the plain flex header the content region's grow already pushes it to the end, and in the `has-start` grid it becomes a content-sized third column with the trailing padding. Replaces the consumer's own `TStack justify=flex-end` wrapper inside `#header`.\n",
+          description: "Trailing header region for actions/controls, pinned to the far end of the row. Filling it adds `has-end`; in the plain flex header the content region's grow already pushes it to the end, and in the `has-start` grid it becomes a content-sized third column with the trailing padding. Trailing alignment is the shell's own job, so header actions need no `TStack justify=flex-end` wrapper around them.\n",
           note: "AppShellSlotProps"
         },
         {
@@ -1742,6 +1786,7 @@ var treeui_catalog_default = {
         "menu_and_drawer_close_buttons_are_44px: true"
       ],
       behavior: [
+        "scroller_is_a_containing_block: `.t-app-shell__main` (and `.t-app-shell__sidebar-body`) carry `position: relative`. Without it an absolutely positioned descendant with auto insets \u2014 `.t-visually-hidden`, which this library itself uses for the TProgress label \u2014 anchored to the initial block instead of the panel: it was neither clipped nor scrolled with the panel, and it extended the DOCUMENT's scroll. The shell is `100dvh`, so the document is not supposed to scroll at all; it did, leaving an empty band below the shell.",
         "fills_viewport_full_width_and_height: true",
         "resets_body_margin_while_a_shell_is_mounted: body:has(.t-app-shell) { margin: 0 } \u2014 a deliberate global rule, scoped so it only applies to pages that mount a shell",
         "header_spans_full_width_above_sidebar_and_content: true",
@@ -1829,7 +1874,8 @@ var treeui_catalog_default = {
         "brand-lockup"
       ],
       practices: [
-        "accessible-by-default"
+        "accessible-by-default",
+        "content-alignment"
       ]
     },
     {
@@ -2040,6 +2086,18 @@ var treeui_catalog_default = {
             "lg"
           ],
           description: "Changes min-height and font-size only; inline padding is constant across sizes."
+        },
+        {
+          name: "truncate",
+          type: "boolean",
+          default: "false",
+          description: "Keep the label on one line and clip it with an ellipsis. Opt-in: the default is to wrap, because a status pill that silently loses the end of its text is worse than a two-line pill. Pass `label` alongside it so the full text reaches the `title` tooltip."
+        },
+        {
+          name: "label",
+          type: "string",
+          default: "undefined",
+          description: "The badge text. Only needed with `truncate`, which puts it in `title`; otherwise use the default slot."
         }
       ],
       events: [],
@@ -2062,8 +2120,10 @@ var treeui_catalog_default = {
         "tone_remaps_variant_color_variables: true",
         "tone_overrides_variant_danger_palette: true",
         "tone_neutral_has_no_stylesheet_rule: true",
+        'tint_ink_is_the_on_soft_token: The `soft` and `danger` variants paint their label with the tone\'s `*-on-soft` colour, never the tone\'s full-strength colour. `*-on-soft` is derived to clear AA on that exact tint and deepens as the tint deepens; the full-strength tone on its own tint measured below AA for eight of the ten tone/theme pairs, including `variant="soft" tone="neutral"`, which is both defaults. The mapping is declared in `@treeui/tokens` as `NATIVE_BADGE_TONES` and the stylesheet is tested against it.',
         "icon_wrapper_rendered_only_when_slot_filled: true",
-        "icon_renders_before_default_slot: true"
+        "icon_renders_before_default_slot: true",
+        "never_wider_than_its_container: The badge carries `max-inline-size: 100%` and `min-inline-size: 0`, so a long label wraps inside the container instead of pushing it. Wrapped lines use the UI line height with block padding rather than `line-height: 1`, at which a second line's ascenders touched the pill's border."
       ],
       selection: {
         keywords: [],
@@ -2081,6 +2141,7 @@ var treeui_catalog_default = {
       practices: [
         "predictable-api",
         "state-clarity",
+        "content-alignment",
         "token-driven"
       ]
     },
@@ -2271,7 +2332,7 @@ var treeui_catalog_default = {
           name: "href",
           type: "string",
           default: "undefined",
-          note: 'Anchor attributes (`href`, `target`, `rel`, `download`) are declared props and are only rendered when `as="a"`. They were fallthrough before, which typechecked as an error in a consumer\'s `strictTemplates` build even though a link button is the documented use of `as` (TREEUX-011, group 1).\n'
+          note: 'Anchor attributes (`href`, `target`, `rel`, `download`) are declared props and are only rendered when `as="a"`. They were fallthrough before, which typechecked as an error in a consumer\'s `strictTemplates` build even though a link button is the documented use of `as`.\n'
         },
         {
           name: "target",
@@ -2686,6 +2747,116 @@ var treeui_catalog_default = {
       recipes: [],
       practices: []
     },
+    {
+      name: "TCanvasSurface",
+      aliases: [],
+      package: "@treeui/vue",
+      kind: "data-display",
+      category: "Data Display",
+      status: "available",
+      purpose: "A sized, repaintable, hit-testable canvas for a data-driven drawing \u2014 a diagram, a graph, a custom plot.",
+      sourceFile: "packages/vue/src/components/TCanvasSurface.vue",
+      storyFile: "apps/docs/src/stories/CanvasSurface.stories.ts",
+      storyTitle: "Components/Data Display/Canvas Surface",
+      manifestFile: "docs/ai/COMPONENTS/canvas-surface.yaml",
+      props: [
+        {
+          name: "draw",
+          type: "(frame: CanvasSurfaceFrame) => void",
+          required: true,
+          note: "Paints the whole surface. Called on mount, on resize and on every `redraw()`. The context arrives already scaled to CSS pixels, so the drawing never does device-ratio arithmetic; it is expected to clear what it does not repaint.\n"
+        },
+        {
+          name: "height",
+          type: "number | string",
+          default: "320",
+          note: "Number is px, string is any CSS length. A diagram has no intrinsic height, so it is declared."
+        },
+        {
+          name: "cursor",
+          type: "string",
+          default: "undefined",
+          note: "Pointer over the surface. This cannot come from a stylesheet: the sensitive area is a rectangle inside the bitmap and no selector knows where it is. Bind it to whatever the consumer's hit-test just decided.\n"
+        },
+        {
+          name: "maxPixelRatio",
+          type: "number",
+          default: "2"
+        },
+        {
+          name: "ariaLabel",
+          type: "string",
+          default: "undefined",
+          note: "Sets role=img. A bitmap says nothing on its own."
+        },
+        {
+          name: "redrawKey",
+          type: "unknown",
+          default: "undefined",
+          note: "Repaint whenever this changes \u2014 pass the data, a version counter, or the theme. Deep-watched."
+        }
+      ],
+      events: [],
+      slots: [
+        {
+          name: "default",
+          description: "The long form of the drawing \u2014 a list, a table, the same data as markup. It lives inside the `<canvas>` element, which the browser exposes to assistive technology and never paints.\n"
+        }
+      ],
+      a11y: [
+        "Give it an ariaLabel; a canvas is opaque to assistive technology.",
+        "Put the same information in the default slot as markup \u2014 it is the accessible form, not a fallback.",
+        "Anything clickable inside the drawing needs a real control elsewhere, or a keyboard user cannot reach it."
+      ],
+      behavior: [
+        "repaints_on_demand_not_on_a_clock: true",
+        "backing_store_follows_the_element: true",
+        "pointer_events_reach_the_canvas: true",
+        "ssr_safe: Nothing touches the DOM outside onMounted."
+      ],
+      selection: {
+        keywords: [
+          "canvas",
+          "diagram",
+          "graph",
+          "node and edge",
+          "custom drawing",
+          "plot",
+          "topology",
+          "map",
+          "hit testing"
+        ],
+        useWhen: [
+          "The drawing is data-driven and no chart primitive expresses it \u2014 nodes and edges, a topology, a custom plot.",
+          "Parts of the drawing are click or hover targets.",
+          "It must repaint when the data, the locale or the theme changes."
+        ],
+        avoidWhen: [
+          "A line, area or bar chart says it \u2014 use TChart, which brings axes, legend, tooltip and an accessible table.",
+          "The drawing is ornament \u2014 use useDecorativeCanvas, which gates the loop on visibility and reduced motion.",
+          "The shape is an inline trend \u2014 use TSparkline."
+        ],
+        alternatives: [
+          {
+            component: "TChart",
+            when: "The data fits axes and categories."
+          },
+          {
+            component: "useDecorativeCanvas",
+            when: "It is decoration, not information."
+          }
+        ]
+      },
+      setup: {
+        required: [],
+        notes: []
+      },
+      recipes: [],
+      practices: [
+        "accessible-by-default",
+        "content-alignment"
+      ]
+    },
     {
       name: "TCard",
       aliases: [],
@@ -2759,6 +2930,9 @@ var treeui_catalog_default = {
         "unnamed_section_root: The default `section` root has no accessible name, so assistive tech exposes it as generic rather than as a region. The component sets no `inheritAttrs: false` and has a single root, so `aria-label` / `aria-labelledby` passed by the consumer fall through to that root when a named region is wanted."
       ],
       behavior: [
+        "surface_never_inflated_by_a_descendant: The surface and its body declare `grid-template-columns: minmax(0, 1fr)`. An implicit `auto` track takes its minimum from the min-content of its items, so one unbreakable descendant \u2014 a table, a code block, a machine string \u2014 behind any wrapper widened the whole surface and laid every sibling out past the border: `TText truncate` never engaged, the TTable wrapper's `overflow-x` never scrolled, and anything aligned to the end was painted outside the surface or over the neighbouring card.",
+        "title_wraps_instead_of_widening_the_card: `.t-card__title` carries `overflow-wrap: anywhere`. A title without spaces used to set the card's min-content width, and the `#header` slot was no way out because the same track was still `auto`.",
+        "actions_shrink_and_wrap: `.t-card__actions` is `flex-shrink: 1; min-inline-size: 0; flex-wrap: wrap`. It was `flex-shrink: 0`, so in a narrow card the controls were laid out past the border instead of moving to the next line \u2014 the header already wraps, and the actions now follow it.",
         "body_wrapper_class: t-card__body",
         "header_render_condition: The `header.t-card__header` element renders when ANY of the `header` slot, a truthy `title` prop, or the `actions` slot is present. All three branches are independent \u2014 actions alone still produces a header.",
         "footer_render_condition: The `footer.t-card__footer` element renders only when the `footer` slot is supplied.",
@@ -2801,6 +2975,7 @@ var treeui_catalog_default = {
       practices: [
         "interaction-feedback",
         "predictable-api",
+        "content-alignment",
         "token-driven"
       ]
     },
@@ -2817,6 +2992,12 @@ var treeui_catalog_default = {
       storyTitle: "Components/Data Display/Chart",
       manifestFile: "docs/ai/COMPONENTS/chart.yaml",
       props: [
+        {
+          name: "yAxisWidth",
+          type: "number",
+          default: "undefined",
+          description: "Fix the space reserved for the y-axis labels, in pixels. Left unset, the chart MEASURES the formatted ticks and reserves what they need \u2014 the margin used to be a flat 44px, which clipped a formatted `1,234,567`. Set it to line several charts up on a shared gutter."
+        },
         {
           name: "type",
           type: "TChartType",
@@ -2987,7 +3168,7 @@ var treeui_catalog_default = {
         ],
         avoidWhen: [
           "A single value tells the story \u2014 use TStat.",
-          "You only need an inline trend with no axes \u2014 use TSparkline.",
+          "You only need an inline trend with no axes \u2014 use TSparkline (`fluid` fills the card width).",
           "The data is a part-of-whole breakdown \u2014 use TDonutChart."
         ],
         alternatives: [
@@ -3159,6 +3340,17 @@ var treeui_catalog_default = {
       storyTitle: "Components/Data Display/CodeBlock",
       manifestFile: "docs/ai/COMPONENTS/code-block.yaml",
       props: [
+        {
+          name: "size",
+          type: "TSize",
+          default: "md",
+          values: [
+            "sm",
+            "md",
+            "lg"
+          ],
+          description: "Density. Scales the type size and the padding of the `<pre>` by tokens, like every other sized component. `md` is what the block has always shipped; `sm` is for a block inside a dense surface \u2014 a table cell, a list row \u2014 where the fixed type size dominated the row."
+        },
         {
           name: "code",
           type: "string",
@@ -3207,7 +3399,9 @@ var treeui_catalog_default = {
         'scroll_region: The `<pre>` is `role="region"` + `tabindex="0"` + `aria-label` (from `label`) so keyboard users can scroll it \u2014 the library does this for you.',
         "copy_button_state: The copy button's aria-label reflects the copied state briefly."
       ],
-      behavior: [],
+      behavior: [
+        'wrap_reduces_the_min_content: `.t-code-block.is-wrap .t-code-block__pre` uses `overflow-wrap: anywhere`, not `break-word`. `break-word` breaks only once a width is already settled, so wherever the block\'s width came from its content \u2014 a grid `auto` track, a table cell, a flex item without `min-width: 0` \u2014 the longest run without a break opportunity became the minimum width and pushed the container instead of wrapping. That is precisely the case `wrap` exists for: a URL, a token, a credential. Same semantics as `TText wrap="anywhere"`.'
+      ],
       selection: {
         keywords: [
           "code",
@@ -3245,6 +3439,7 @@ var treeui_catalog_default = {
       recipes: [],
       practices: [
         "accessible-by-default",
+        "content-alignment",
         "token-driven"
       ]
     },
@@ -3766,6 +3961,7 @@ var treeui_catalog_default = {
         "icon_slot_marked_aria_hidden: true"
       ],
       behavior: [
+        "surface_never_inflated_by_a_descendant: `.t-confirm-dialog` and its body declare `grid-template-columns: minmax(0, 1fr)`, and the icon variant uses `auto minmax(0, 1fr)`. It inherits TModal's title and description wrapping, which is what keeps confirm and cancel on the surface when the dialog names a long resource \u2014 it passes `title`/`description` as strings and exposes no `#header` slot, so there was no way around it from the API.",
         "built_on_modal_contract: true",
         "default_confirm_button_variant: danger",
         "default_cancel_button_variant: ghost",
@@ -3811,7 +4007,8 @@ var treeui_catalog_default = {
         "confirm-destructive-action"
       ],
       practices: [
-        "accessible-by-default"
+        "accessible-by-default",
+        "content-alignment"
       ]
     },
     {
@@ -4191,6 +4388,8 @@ var treeui_catalog_default = {
         "focus_is_not_trapped_and_tab_leaves_the_open_calendar: true"
       ],
       behavior: [
+        'panel_is_teleported_to_the_body: The calendar panel renders through `<Teleport to="body">` and is placed with `position: fixed` from the trigger\'s viewport rect by `useAnchoredLayer`. It used to be absolutely positioned inside the root, so inside a `TModal` it was trapped in the surface and clipped. Query it from `document.body` in tests.',
+        'month_title_capitalises_only_its_first_letter: `text-transform: capitalize` uppercased every word, which in most locales hits a particle in the middle of the title \u2014 pt-BR\'s "setembro de 2026" rendered as "Setembro De 2026". The rule is now `none` plus a `::first-letter` uppercase.',
         "value_format: YYYY-MM-DD",
         "controlled_and_uncontrolled_open: true",
         "open_state_emits_are_deduped: true",
@@ -4239,7 +4438,9 @@ var treeui_catalog_default = {
         ]
       },
       recipes: [],
-      practices: []
+      practices: [
+        "accessible-by-default"
+      ]
     },
     {
       name: "TDateTimePicker",
@@ -5253,6 +5454,24 @@ var treeui_catalog_default = {
       storyTitle: "Components/Data Entry/FileUpload",
       manifestFile: "docs/ai/COMPONENTS/file-upload.yaml",
       props: [
+        {
+          name: "clearLabel",
+          type: "string",
+          default: "Clear all",
+          description: "Label for the button that drops every selected file. It was hard-coded English with no way out."
+        },
+        {
+          name: "removeLabel",
+          type: "string",
+          default: "Remove",
+          description: "Label for a row's remove button."
+        },
+        {
+          name: "removeAriaLabel",
+          type: "(file: File) => string",
+          default: "(f) => `Remove ${f.name}`",
+          description: "Accessible name for a row's remove button. A function, not a string, because the file name sits INSIDE the sentence and its position differs by language \u2014 a prefix and a suffix cannot express that."
+        },
         {
           name: "modelValue",
           type: "File[]",
@@ -5512,7 +5731,9 @@ var treeui_catalog_default = {
       recipes: [
         "page-drop-target"
       ],
-      practices: []
+      practices: [
+        "accessible-by-default"
+      ]
     },
     {
       name: "TFlag",
@@ -5825,6 +6046,12 @@ var treeui_catalog_default = {
           name: "dense",
           type: "boolean",
           default: "false"
+        },
+        {
+          name: "balance",
+          type: "boolean",
+          default: "false",
+          note: 'Let the last row divide itself among the items it has instead of leaving empty tracks to its right \u2014 five cards over four tracks read as "one card failed to load". `auto-fit` cannot do it: it collapses a track only when that track is empty on EVERY row, so the remainder row keeps the widths of the rows above it. Balanced mode lays out with flex, where each line sizes itself: full rows are identical to the grid, only the remainder is shared out. Ignored when `columns` is set, since a declared track count already answers the same question.\n'
         }
       ],
       events: [],
@@ -5838,6 +6065,7 @@ var treeui_catalog_default = {
       ],
       behavior: [
         "semantic_element_controlled_by_as: true",
+        "balance_shares_the_last_row_instead_of_leaving_holes: true",
         "fixed_columns_supported: true",
         "auto_fit_columns_supported: true",
         "dense_mode_uses_grid_auto_flow_dense: true"
@@ -6130,6 +6358,7 @@ var treeui_catalog_default = {
             "calendar-plus",
             "calendar-range",
             "calendar-x",
+            "campaign",
             "carousel",
             "catalog",
             "chart-column",
@@ -6166,7 +6395,6 @@ var treeui_catalog_default = {
             "companion",
             "compass",
             "connections",
-            "contentpilot",
             "copy",
             "cpu",
             "cpu-chip",
@@ -6412,8 +6640,6 @@ var treeui_catalog_default = {
             "tickets",
             "timeline",
             "timer",
-            "toggle-left",
-            "toggle-right",
             "token-input",
             "token-output",
             "trail",
@@ -6451,10 +6677,18 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "number | string",
+          type: "number | TIconSize",
           default: "20",
-          description: "Pixel size for both width and height of the rendered svg.",
-          note: 'This is a PIXEL COUNT, not the sm | md | lg token scale used by nearly every\nother TreeUI component. `<TIcon size="md" />` does not fail loudly: it writes\nwidth="md" / height="md" onto the svg, which the browser discards, so the\nicon becomes unsized and stretches to fill its container. Pass a number\n(20, 32) or a numeric string ("20"). To size an icon from tokens, leave `size`\nalone and set width/height in CSS from the icon scale \u2014 --tree-size-icon-sm |\n-md | -lg | -xl | -2xl (1rem / 1.25rem / 1.5rem / 2rem / 3rem) \u2014 which is what\nTLanguageSelect\'s switcher variant does.\n'
+          values: [
+            "sm",
+            "md",
+            "lg",
+            "xl",
+            "2xl",
+            "<number of pixels>"
+          ],
+          description: "A token name from the icon scale, or a pixel number.",
+          note: '`size` used to be `number | string`, which meant `<TIcon size="sm" />`\ntype-checked, wrote width="sm" onto the svg, and left the icon unsized \u2014\nit then stretched to fill its container, measured at 300px in the report\nthat produced this change. It now takes either a NUMBER of pixels or one\nof the icon-scale token names, which map to the same values as\n--tree-size-icon-sm | -md | -lg | -xl | -2xl (16 / 20 / 24 / 32 / 48 px).\nAn unrecognised string is a compile error in TypeScript and, for\nJavaScript consumers, falls back to the default size with a console\nwarning in development rather than rendering at an arbitrary size.\nA free-form CSS length is no longer accepted: set width/height in CSS\nfrom the icon scale instead, which is what TLanguageSelect\'s switcher\nvariant does.\n'
         },
         {
           name: "strokeWidth",
@@ -6484,7 +6718,7 @@ var treeui_catalog_default = {
       behavior: [
         "unknown_name_renders_nothing: An unregistered name makes `resolveTreeIcon` return `undefined`, and `TIcon`'s `v-if` then renders no element at all \u2014 no empty box, no placeholder, no error. A `console.warn` names the missing icon, suggests the `registerTreeIcons` call, and lists every valid name. It warns once per NAME (not per message \u2014 the message embeds the valid-name list, which changes on every registration), so a miss inside a render loop cannot flood the console. The warning is NOT gated on `process.env.NODE_ENV`: it fires in production builds too, deliberately, because a missing icon is a misconfiguration worth hearing about once and `process` is undefined in most browser bundles. Components with a marker fallback (TNavMenu) show that instead \u2014 see nav-menu.yaml.",
         'absolute_stroke_width_math: Icons draw on `viewBox="0 0 24 24"` with the svg sized to `size`, so painted pixels = (stroke-width attribute) * size / 24. With `absoluteStrokeWidth` (the default) the attribute is set to `(strokeWidth * 24) / size`, which cancels the scale: at the default `strokeWidth: 2` the attribute is 2.4 at size 20, 1.5 at 32, and 1.0 at 48 \u2014 a constant 2px painted at every size. That is the entire point of the correction: a 48px icon sits beside a 20px one at the same optical weight. A `size` of 0 or a non-numeric value keeps the nominal stroke rather than producing NaN/Infinity. Setting `absoluteStrokeWidth: false` pins the attribute at `strokeWidth`, which is the hand-rolled behaviour: the painted stroke then scales WITH the icon (1.67px at 20, 2.67px at 32, 4px at 48 \u2014 double the library weight).',
-        "icons_are_built_lazily_and_cached: Geometry lives in a data registry; a component is created on first lookup and reused after that, so an unused icon stays as DATA instead of becoming a `defineComponent`. Note what this does not claim: the geometry for all 364 built-ins is retained by any import of the package (the registry copies `builtinTreeIconNodes` into a `Map` at module scope, so a live reference exists and nothing tree-shakes it away \u2014 `sideEffects: false` does not change that). The saving is component construction, not bundle bytes.",
+        "icons_are_built_lazily_and_cached: Geometry lives in a data registry; a component is created on first lookup and reused after that, so an unused icon stays as DATA instead of becoming a `defineComponent`. Note what this does not claim: the geometry for all 370 built-ins is retained by any import of the package (the registry copies `builtinTreeIconNodes` into a `Map` at module scope, so a live reference exists and nothing tree-shakes it away \u2014 `sideEffects: false` does not change that). The saving is component construction, not bundle bytes.",
         "resolved_per_render: TIcon resolves its name in a computed, not once at setup, so an icon registered after the component mounted still appears.",
         "migration_aliases: Twelve compatibility names resolve to the same geometry as their canonical names: grid \u2192 layout-grid, share \u2192 share-nodes, chevron-updown \u2192 chevrons-up-down, refresh \u2192 refresh-cw, comment/chat \u2192 message-circle, check-square \u2192 square-check, help \u2192 circle-help, automations \u2192 zap, connections \u2192 external-link, persona \u2192 user-round, and close \u2192 x.",
         "company_logos_are_app_owned: Company logos are not built-ins. When an application needs one, it imports the official SVG as its own component and passes or registers that component under an application-owned name."
@@ -6534,7 +6768,9 @@ var treeui_catalog_default = {
       recipes: [
         "nav-menu-icons"
       ],
-      practices: []
+      practices: [
+        "branchline-icons"
+      ]
     },
     {
       name: "TImage",
@@ -6657,7 +6893,7 @@ var treeui_catalog_default = {
           name: "modelValue",
           type: "T",
           default: "undefined",
-          note: "Generic over `T extends string | number`, so a `ref<number>` binds without a cast and `update:modelValue` pays back a number. `<script setup>` was widening every model to `string | number`, which under a consumer's `strictTemplates` made a numeric field a type error at the call site with no correct way to write it (TREEUX-011, group 3). When `T` is `number` the component parses the raw input value and only falls back to the raw string when it does not parse.\n"
+          note: "Generic over `T extends string | number`, so a `ref<number>` binds without a cast and `update:modelValue` pays back a number. `<script setup>` was widening every model to `string | number`, and widening makes a numeric field a type error under `strictTemplates`, with no correct way to write the binding. When `T` is `number` the component parses the raw input value and only falls back to the raw string when it does not parse.\n"
         },
         {
           name: "size",
@@ -7369,7 +7605,9 @@ var treeui_catalog_default = {
         "aria_current: `page` when `current`.",
         "focus_visible: Focus ring on the tile."
       ],
-      behavior: [],
+      behavior: [
+        "default_slot_does_not_stretch_its_children: `.t-link-tile__body` is `align-items: flex-start`, not the `stretch` default. The default slot is where a consumer drops a TTag or a TBadge, and stretch made a four-character tag as wide as the description. Title and description are TText and still wrap to the available width."
+      ],
       selection: {
         keywords: [
           "tile",
@@ -7405,6 +7643,7 @@ var treeui_catalog_default = {
       practices: [
         "interaction-feedback",
         "accessible-by-default",
+        "content-alignment",
         "token-driven"
       ]
     },
@@ -7451,7 +7690,8 @@ var treeui_catalog_default = {
         "not_selectable: For a single-select list of options use TSelectableList instead."
       ],
       behavior: [
-        "responsive: On a container narrower than 30rem the row wraps: meta drops below the content while actions stay visible inline. Actions are NEVER hidden or auto-collapsed into an overflow menu \u2014 compose a TMenu inside the actions slot deliberately if an overflow is wanted (uses a CSS container query; the list sets container-type).",
+        "actions_take_their_own_line_in_a_narrow_container: Inside the existing `@container (max-width: 30rem)` query, `.t-list-item__actions` becomes `flex-basis: 100%; order: 2; flex-wrap: wrap; justify-content: flex-end`. Rigid actions used to squeeze the content column down to 40\u2013110px rather than moving below it \u2014 the meta already dropped to its own line, and the actions now follow the same rule. Actions are still never hidden or auto-collapsed into an overflow menu; that stays a deliberate consumer choice.",
+        "responsive: On a container narrower than 30rem the row wraps: meta drops below the content while actions stay visible inline, and the leading slot stays on the first line of the content \u2014 the wrap is for the meta only. Actions are NEVER hidden or auto-collapsed into an overflow menu \u2014 compose a TMenu inside the actions slot deliberately if an overflow is wanted (uses a CSS container query; the list sets container-type).",
         "no_overflow_ownership: TList does not create, own, or collapse an actions overflow."
       ],
       selection: {
@@ -7614,7 +7854,7 @@ var treeui_catalog_default = {
       kind: "overlay",
       category: "Overlay",
       status: "available",
-      purpose: "Rich action menu in a popover \u2014 slot-driven compound with groups, icons, descriptions, meta, destructive items, link items, and a radio (workspace-switch) item, with roving focus and keyboard support. Built on TPopover, so anchoring and focus restore come from there (TREEUX-015).",
+      purpose: "Rich action menu in a popover \u2014 slot-driven compound with groups, icons, descriptions, meta, destructive items, link items, and a radio (workspace-switch) item, with roving focus and keyboard support. Built on TPopover, so anchoring and focus restore come from there.",
       sourceFile: "packages/vue/src/components/TMenu.vue",
       storyFile: "apps/docs/src/stories/Menu.stories.ts",
       storyTitle: "Components/Overlay/Menu",
@@ -7859,6 +8099,10 @@ var treeui_catalog_default = {
         "escape_closes_when_enabled: true"
       ],
       behavior: [
+        "surface_never_inflated_by_a_descendant: The surface and its body declare `grid-template-columns: minmax(0, 1fr)`. An implicit `auto` track takes its minimum from the min-content of its items, so one unbreakable descendant \u2014 a table, a code block, a machine string \u2014 behind any wrapper widened the whole surface and laid every sibling out past the border: `TText truncate` never engaged, the TTable wrapper's `overflow-x` never scrolled, and anything aligned to the end was painted outside the surface or over the neighbouring card.",
+        "only_the_body_scrolls: `.t-modal__surface` is a flex column with `overflow: hidden`, and `.t-modal__body` is the single scroller (`flex: 1 1 auto; min-block-size: 0; overflow: auto`). The whole surface used to scroll, so on a short viewport the footer's actions sat below the fold and the title scrolled away with the content. A flex column also removes the implicit `auto` track, which is the other half of the inflation above.",
+        "title_and_description_wrap: `.t-modal__title` and `.t-modal__description` carry `overflow-wrap: anywhere` \u2014 `anywhere`, not `break-word`, because only `anywhere` reduces the min-content. A confirm dialog exists to name the thing being deleted, and a resource name without a break opportunity used to push confirm and cancel off the surface at any width, desktop included.",
+        "a_child_overlay_must_be_teleported: Because the surface now clips, a panel rendered inside it would be cut off. TSelect's listbox and TDatePicker's panel teleport to the body for exactly this reason; a consumer composing its own overlay inside a modal should do the same with `useAnchoredLayer`.",
         "uses_teleport_to_body: true",
         "locks_body_scroll_while_open: true",
         "overlay_click_closes_when_enabled: true",
@@ -7903,7 +8147,8 @@ var treeui_catalog_default = {
       ],
       practices: [
         "accessible-by-default",
-        "predictable-api"
+        "predictable-api",
+        "content-alignment"
       ]
     },
     {
@@ -8249,6 +8494,7 @@ var treeui_catalog_default = {
         "aria_disabled: on link items when disabled"
       ],
       behavior: [
+        "labels_wrap_rather_than_scroll_the_sidebar: `.t-nav-menu__list` and `.t-nav-menu__copy` declare `grid-template-columns: minmax(0, 1fr)`, and the label and description carry `overflow-wrap: anywhere`. A sidebar is the one place a horizontal scrollbar is never the right answer, and an item label without a break opportunity used to give it one.",
         "can_be_controlled_or_uncontrolled: true",
         "can_inherit_collapsed_state_from_sidebar: true",
         "supports_rich_item_rendering_via_slot: true"
@@ -8296,7 +8542,8 @@ var treeui_catalog_default = {
         "responsive-navigation"
       ],
       practices: [
-        "interaction-feedback"
+        "interaction-feedback",
+        "content-alignment"
       ]
     },
     {
@@ -8315,7 +8562,7 @@ var treeui_catalog_default = {
         {
           name: "modelValue",
           type: "number | null",
-          note: "`null` is REAL, not an error state: clearing the field is empty, and the component emits `null` for it. So `v-model` needs a `ref<number | null>`, and a `ref<number>` is a genuine type error under a consumer's `strictTemplates` rather than a gap in the library. This is the one place in the round where the checker was right and the call site was wrong \u2014 the others (TInput, TTabs, TToggleGroup) were the library's fault.\n"
+          note: "`null` is REAL, not an error state: clearing the field is empty, and the component emits `null` for it. So `v-model` needs a `ref<number | null>`, and a `ref<number>` is a genuine type error under `strictTemplates` rather than a gap in the library \u2014 here the binding is what has to widen, not the model. The opposite of TInput/TTabs/TToggleGroup, where the library's own model type was too wide and no narrow ref could bind it.\n"
         },
         {
           name: "min",
@@ -8563,6 +8810,7 @@ var treeui_catalog_default = {
         "Actions area holds standard focusable controls (e.g. TButton) \u2014 no custom roles added."
       ],
       behavior: [
+        "slot_presence_is_read_during_render: The template tests `$slots.title` / `$slots.subtitle` directly instead of a `computed` over `useSlots()`. The computed cached its first answer, so a `v-if`'d title slot that appeared later never rendered, and one that disappeared left an empty `<h1>` behind. This is the arrangement TCard already used for `$slots.header`.",
         "title_and_subtitle_optional: true",
         "heading_level_controlled_by_level: true",
         "actions_area_right_aligned_and_wraps: true",
@@ -9583,14 +9831,14 @@ var treeui_catalog_default = {
       props: [
         {
           name: "modelValue",
-          type: "string | number",
-          default: ""
+          type: "T",
+          default: "undefined"
         },
         {
           name: "options",
-          type: "TSelectOption[]",
+          type: "TSelectOption<T>[]",
           default: "[]",
-          note: "Array of { label: string; value: string | number; disabled?: boolean }"
+          note: "Array of { label: string; value: T; disabled?: boolean }"
         },
         {
           name: "open",
@@ -9686,7 +9934,9 @@ var treeui_catalog_default = {
         "outside_click_closes_dropdown: true",
         "focus_restores_on_close: true",
         "numeric_values_supported_without_string_coercion: true",
-        "listbox_flips_above_trigger_when_space_below_is_insufficient: true"
+        "listbox_flips_above_trigger_when_space_below_is_insufficient: true",
+        "option_label_wraps_instead_of_being_clipped: `.t-select__option` carries `overflow-wrap: anywhere`, so a label without a break opportunity wraps inside the listbox rather than overflowing it and being cut off.",
+        "listbox_is_teleported_to_the_body: The listbox renders through `<Teleport to=\"body\">` and is placed with `position: fixed` from the trigger's viewport rect by the `useAnchoredLayer` composable, matching the trigger's width. It used to be positioned inside the root, which meant ANY ancestor with `overflow` clipped it \u2014 the TTable wrapper cut it off and a modal trapped it. Consequences for tests: the listbox is not a descendant of the component's root element, so query it from `document.body`."
       ],
       selection: {
         keywords: [
@@ -9724,6 +9974,7 @@ var treeui_catalog_default = {
       ],
       practices: [
         "interaction-feedback",
+        "accessible-by-default",
         "predictable-api",
         "token-driven"
       ]
@@ -10197,7 +10448,9 @@ var treeui_catalog_default = {
         "Hit area is `--tree-size-control-lg` (48px) tall, above the 44px target floor.",
         "The label must say where it goes; the library does not supply one."
       ],
-      behavior: [],
+      behavior: [
+        "hidden_link_paints_no_shadow: `.t-skip-link:not(:focus-visible)` sets `box-shadow: none`. The box is translated off-screen while hidden, but a 14px offset with a 34px blur is not: it painted a grey smudge in the top-left of every header, at every width, all the time. The shadow belongs to the focused state, which is when the link is actually on screen."
+      ],
       selection: {
         keywords: [
           "skip link",
@@ -10422,6 +10675,12 @@ var treeui_catalog_default = {
           default: "false",
           note: "Marker on the final point (line/area)."
         },
+        {
+          name: "fluid",
+          type: "boolean",
+          default: "false",
+          note: "Fill the parent's width; `width` stays the viewBox. The height is unchanged on purpose \u2014 a sparkline is a band, and growing in both directions turns it into a chart that lies about its precision. Strokes use `non-scaling-stroke`, so the pen keeps its declared width.\n"
+        },
         {
           name: "ariaLabel",
           type: "string",
@@ -10437,7 +10696,8 @@ var treeui_catalog_default = {
       behavior: [
         "no_axes_or_legend: true",
         "flat_series_renders_centered: true",
-        "scales_to_intrinsic_width_and_height: true"
+        "scales_to_intrinsic_width_and_height: true",
+        "fluid_fills_parent_width: true"
       ],
       selection: {
         keywords: [
@@ -10477,7 +10737,9 @@ var treeui_catalog_default = {
       recipes: [
         "metric-dashboard"
       ],
-      practices: []
+      practices: [
+        "content-alignment"
+      ]
     },
     {
       name: "TSpinner",
@@ -10882,6 +11144,16 @@ var treeui_catalog_default = {
           name: "loading",
           type: "boolean",
           default: "false"
+        },
+        {
+          name: "emphasis",
+          type: "TStatEmphasis",
+          default: "label",
+          values: [
+            "label",
+            "value"
+          ],
+          note: 'Which half leads. `label` is the dashboard reading \u2014 the eye is scanning for what is measured. `value` puts the figure first, for a marketing band where the number IS the argument; it also keeps a row of figures on one baseline, because the labels above them no longer have to be the same height. Visual order only: the DOM keeps label before value, so the announcement stays "Requests served, 4.2M".\n'
         }
       ],
       events: [],
@@ -10908,6 +11180,7 @@ var treeui_catalog_default = {
       ],
       behavior: [
         "value_and_trend_are_optional: true",
+        "emphasis_reorders_visually_not_in_the_dom: true",
         "icon_slot_adds_visual_emphasis: true",
         "trend_indicator_changes_with_direction: true",
         "loading_renders_internal_skeleton_placeholders: true"
@@ -10945,6 +11218,7 @@ var treeui_catalog_default = {
         "metric-dashboard"
       ],
       practices: [
+        "content-alignment",
         "token-driven"
       ]
     },
@@ -10957,7 +11231,7 @@ var treeui_catalog_default = {
       kind: "navigation",
       category: "Navigation",
       status: "available",
-      purpose: "Stepper component for visualizing workflow progress, with optional interactive selection.",
+      purpose: "Ordered sequence \u2014 a wizard to operate, or a described flow to read.",
       sourceFile: "packages/vue/src/components/TSteps.vue",
       storyFile: "apps/docs/src/stories/Steps.stories.ts",
       storyTitle: "Components/Navigation/Steps",
@@ -11001,7 +11275,20 @@ var treeui_catalog_default = {
         {
           name: "interactive",
           type: "boolean",
-          default: "false"
+          default: "false",
+          note: "Whether a step can be picked. False \u2014 the default \u2014 renders inert boxes: no button in the accessibility tree, no disabled wash, and no step elected current unless `modelValue`/`defaultValue` or an item `status` says so. A described sequence used to render one dead control per step, at 60% opacity, with the first step ringed as if the reader were standing on it.\n"
+        },
+        {
+          name: "columns",
+          type: "number",
+          default: "undefined",
+          note: "Fixed steps per row, horizontal only. Use for a sequence with a shape (3 + 3)."
+        },
+        {
+          name: "minItemWidth",
+          type: "string",
+          default: "14rem",
+          note: "Width at which a step stops shrinking and the strip wraps. Same axis as TGrid."
         }
       ],
       events: [
@@ -11017,10 +11304,13 @@ var treeui_catalog_default = {
       a11y: [
         "semantic_root: ol",
         "current_step_uses_aria_current_step: true",
-        "interactive_variant_uses_buttons: true"
+        "interactive_variant_uses_buttons: true",
+        "static_variant_emits_no_control: true"
       ],
       behavior: [
         "can_be_controlled_or_uncontrolled: true",
+        "static_variant_elects_no_current_step: true",
+        "shared_box_class_is_t_steps_box: true",
         "status_can_be_explicit_or_computed: true",
         "alias_export_available: true"
       ],
@@ -11051,7 +11341,10 @@ var treeui_catalog_default = {
         ]
       },
       recipes: [],
-      practices: []
+      practices: [
+        "accessible-by-default",
+        "content-alignment"
+      ]
     },
     {
       name: "TSwitch",
@@ -11162,7 +11455,7 @@ var treeui_catalog_default = {
           name: "columns",
           type: "TTableColumn[]",
           required: true,
-          description: "Array of column definitions with key, label, sortable, align, and width."
+          description: "Array of column definitions with key, label, sortable, align, width, and minWidth."
         },
         {
           name: "rows",
@@ -11290,7 +11583,7 @@ var treeui_catalog_default = {
           name: "modelValue",
           type: "T",
           default: "undefined",
-          note: "The value of the currently active tab; use with v-model. Generic over `T extends string`, so a `ref<'overview' | 'logs'>` keeps its literal union instead of being widened to `string` \u2014 under a consumer's `strictTemplates` that widening made the binding an error with no correct way to write it (TREEUX-011, group 3).\n"
+          note: "The value of the currently active tab; use with v-model. Generic over `T extends string`, so a `ref<'overview' | 'logs'>` keeps its literal union instead of being widened to `string` \u2014 widening makes the binding an error under `strictTemplates`, with no correct way to write it.\n"
         },
         {
           name: "defaultValue",
@@ -11340,6 +11633,7 @@ var treeui_catalog_default = {
         "aria_controls_aria_labelledby_pairing: true"
       ],
       behavior: [
+        "overflowing_tabs_scroll_within_their_own_strip: `.t-tabs__list` is `overflow-x: auto` with `overscroll-behavior-x: contain`. Tabs that did not fit pushed the PAGE sideways, which moves every other element on screen to solve a problem belonging to one component. TTabList scrolls the active tab into view whenever the active value changes, so a tab reached by keyboard or restored from a model value is never left off-strip.",
         "arrow_left_right_moves_focus: true",
         "home_focuses_first_tab: true",
         "end_focuses_last_tab: true",
@@ -11379,7 +11673,9 @@ var treeui_catalog_default = {
         "router-backed-tabs"
       ],
       practices: [
-        "interaction-feedback"
+        "interaction-feedback",
+        "accessible-by-default",
+        "content-alignment"
       ]
     },
     {
@@ -11717,6 +12013,17 @@ var treeui_catalog_default = {
           ],
           note: "Break axis for a string with no break opportunity \u2014 an id, ARN, API key or hash is one long word, so it overflows its box. `truncate` is the wrong answer when the string IS what the reader came to copy: an ellipsis makes an id useless. `anywhere` breaks at any character (and sets `min-inline-size: 0`, without which a flex or grid child still refuses to shrink below its longest word and never breaks); `break-word` only breaks a word that would otherwise overflow. Ignored when `truncate` is set.\n"
         },
+        {
+          name: "align",
+          type: "TTextAlign",
+          default: "undefined",
+          values: [
+            "start",
+            "center",
+            "end"
+          ],
+          note: "How the LINES sit inside the box, which is the other half of `TStack align` \u2014 that one centres the box, and a centred box only looks centred while it is narrow: at full width the paragraph inside reads left-aligned. Renders block, because `text-align` does nothing on an inline box that shrink-wraps its content. Logical values, so `start`/`end` follow the writing direction. Combined with `measure`, `center` also centres the capped block itself.\n"
+        },
         {
           name: "balance",
           type: "boolean",
@@ -11757,6 +12064,7 @@ var treeui_catalog_default = {
         "Choose `as` to convey the correct semantics (e.g. headings via h1\u2013h6); TText adds only visual styling."
       ],
       behavior: [
+        'the_wrap_axis_outranks_preserve_whitespace: `.t-text.t-text--wrap-anywhere` is qualified with `.t-text` so it matches the (0,2,0) specificity of `.t-text.is-pre-wrap`, and wins by order. Without it `preserveWhitespace` silently downgraded `wrap="anywhere"` to `break-word`, which is the one thing `anywhere` exists to do differently: only `anywhere` reduces the min-content.',
         "semantic_element_controlled_by_as: true",
         "token_driven_size_tone_weight: true",
         "truncate_takes_precedence_over_preserve_whitespace: true"
@@ -11778,6 +12086,7 @@ var treeui_catalog_default = {
       practices: [
         "accessible-by-default",
         "predictable-api",
+        "content-alignment",
         "token-driven"
       ]
     },
@@ -11794,6 +12103,12 @@ var treeui_catalog_default = {
       storyTitle: "Components/Data Entry/Textarea",
       manifestFile: "docs/ai/COMPONENTS/textarea.yaml",
       props: [
+        {
+          name: "spellcheck",
+          type: "boolean",
+          default: "undefined",
+          description: 'A real `<textarea>` attribute that the declared surface was missing. It matters most with `family="mono"`: a JSON or config editor wants the spell-checker to stop underlining keys, ARNs and identifiers.'
+        },
         {
           name: "modelValue",
           type: "string",
@@ -11867,7 +12182,7 @@ var treeui_catalog_default = {
             "sans",
             "mono"
           ],
-          note: "Font family of the editable content, same vocabulary as TText. `mono` is for machine text \u2014 JSON, a policy document, a payload \u2014 which otherwise leaves a `.mono` class behind in the consumer's stylesheet. Applied to the `<textarea>`, not the label wrapper, which also holds the loading spinner.\n"
+          note: "Font family of the editable content, same vocabulary as TText. `mono` is for machine text \u2014 JSON, a policy document, a payload \u2014 which otherwise needs a one-off `.mono` font-family rule in product CSS. Applied to the `<textarea>`, not the label wrapper, which also holds the loading spinner.\n"
         }
       ],
       events: [
@@ -11967,6 +12282,7 @@ var treeui_catalog_default = {
         "timestamp_uses_time_element_when_provided: true"
       ],
       behavior: [
+        "content_stays_inside_the_container: `.t-timeline` and `.t-timeline__content` declare `grid-template-columns: minmax(0, 1fr)`, and the title and description carry `overflow-wrap: anywhere`. Together they stop an unbreakable string from setting the column's min-content and carrying the whole entry across the container.",
         "items_render_in_order_given: true",
         "line_hidden_on_last_item: true",
         "marker_tone_defaults_to_neutral: true"
@@ -11982,7 +12298,9 @@ var treeui_catalog_default = {
         notes: []
       },
       recipes: [],
-      practices: []
+      practices: [
+        "content-alignment"
+      ]
     },
     {
       name: "TToast",
@@ -11997,6 +12315,12 @@ var treeui_catalog_default = {
       storyTitle: "Components/Feedback/Toast",
       manifestFile: "docs/ai/COMPONENTS/toast.yaml",
       props: [
+        {
+          name: "closeLabel",
+          type: "string",
+          default: "Dismiss notification",
+          description: "Accessible name for the dismiss button, on `TToastProvider` as the instance default and on a single toast's options to override it. It was hard-coded English, which left the toast's only control unreadable to a screen reader in any other language."
+        },
         {
           name: "toast",
           type: "ToastItem",
@@ -12056,6 +12380,7 @@ var treeui_catalog_default = {
         "confirm-destructive-action"
       ],
       practices: [
+        "accessible-by-default",
         "token-driven"
       ]
     },
@@ -12076,7 +12401,7 @@ var treeui_catalog_default = {
           name: "modelValue",
           type: "TToggleGroupModel<T, M> \u2014 `T` in single mode, `T[]` in multiple",
           default: "undefined",
-          note: "Generic over the option type AND the selection mode, so the model is the type the call site actually has: `<TToggleGroup v-model=\"view\">` with a `ref<'grid' | 'list'>` binds, and `selectionMode=\"multiple\"` binds a `('grid' | 'list')[]`. It was `string | string[]` in and `string | string[] | undefined` out, which no literal-union ref could bind under a consumer's `strictTemplates` \u2014 the same defect as TTabs/TInput (TREEUX-011, group 3), found by the gate once it ran on the same `vue-tsc` major consumers use. `undefined` was never actually emitted.\n"
+          note: "Generic over the option type AND the selection mode, so the model is the type the binding actually has: `<TToggleGroup v-model=\"view\">` with a `ref<'grid' | 'list'>` binds, and `selectionMode=\"multiple\"` binds a `('grid' | 'list')[]`. It was `string | string[]` in and `string | string[] | undefined` out, which no literal-union ref could bind under `strictTemplates` \u2014 the same defect as TTabs/TInput, and invisible to any build that does not typecheck templates against the published types. `undefined` was never actually emitted.\n"
         },
         {
           name: "options",
@@ -12137,6 +12462,7 @@ var treeui_catalog_default = {
         "activation_keys_select_option: true"
       ],
       behavior: [
+        'selected_item_repaints_its_descendants_secondary_text: `.t-toggle-group__item.is-selected` rebinds `--tree-color-text-muted` to `--tree-color-brand-contrast`. Only the inherited colour used to change, so a `TText tone="muted"` in the `#option` slot kept reading the muted token and measured 1.18:1 (light) and 1.09:1 (dark) over the brand fill, where `xs` text needs 4.5:1. Rebinding the token is what keeps a slot the library does not control legible; `brand-contrast` is the only value that clears AA in both themes (5.19:1 / 6.21:1) \u2014 a `color-mix` at 85% still measured 4.18:1.',
         "single_and_multiple_modes: true",
         "variant_changes_visual_style_only: true",
         "visible_option_set_expected: true"
@@ -12177,7 +12503,9 @@ var treeui_catalog_default = {
         ]
       },
       recipes: [],
-      practices: []
+      practices: [
+        "accessible-by-default"
+      ]
     },
     {
       name: "TTooltip",
@@ -13326,25 +13654,25 @@ var treeui_catalog_default = {
     {
       cssVar: "--tree-color-status-success",
       path: "color.status.success",
-      value: "#1a7f37",
+      value: "#197d36",
       category: "color",
       derived: false,
       description: "Themed semantic color, resolved per [data-tree-theme].",
       themeValues: {
-        light: "#1a7f37",
-        dark: "#59ac5c"
+        light: "#197d36",
+        dark: "#5bae5e"
       }
     },
     {
       cssVar: "--tree-color-status-warning",
       path: "color.status.warning",
-      value: "#956400",
+      value: "#946300",
       category: "color",
       derived: false,
       description: "Themed semantic color, resolved per [data-tree-theme].",
       themeValues: {
-        light: "#956400",
-        dark: "#c69026"
+        light: "#946300",
+        dark: "#c99227"
       }
     },
     {
@@ -13650,25 +13978,25 @@ var treeui_catalog_default = {
     {
       cssVar: "--tree-color-status-success-hover",
       path: "color.status.success-hover",
-      value: "#15682d",
+      value: "#15672c",
       category: "color",
       derived: true,
       description: "Themed semantic color, resolved per [data-tree-theme]. Derived by the library from the semantic layer \u2014 read it, do not override it.",
       themeValues: {
-        light: "#15682d",
-        dark: "#77bb79"
+        light: "#15672c",
+        dark: "#79bd7b"
       }
     },
     {
       cssVar: "--tree-color-status-success-press",
       path: "color.status.success-press",
-      value: "#125625",
+      value: "#115525",
       category: "color",
       derived: true,
       description: "Themed semantic color, resolved per [data-tree-theme]. Derived by the library from the semantic layer \u2014 read it, do not override it.",
       themeValues: {
-        light: "#125625",
-        dark: "#8ec790"
+        light: "#115525",
+        dark: "#8fc892"
       }
     },
     {
@@ -13680,31 +14008,31 @@ var treeui_catalog_default = {
       description: "Themed semantic color, resolved per [data-tree-theme]. Derived by the library from the semantic layer \u2014 read it, do not override it.",
       themeValues: {
         light: "#dfede3",
-        dark: "#2a3a34"
+        dark: "#2a3a35"
       }
     },
     {
       cssVar: "--tree-color-status-success-soft-hover",
       path: "color.status.success-soft-hover",
-      value: "#c3decb",
+      value: "#c3ddcb",
       category: "color",
       derived: true,
       description: "Themed semantic color, resolved per [data-tree-theme]. Derived by the library from the semantic layer \u2014 read it, do not override it.",
       themeValues: {
-        light: "#c3decb",
-        dark: "#314a3a"
+        light: "#c3ddcb",
+        dark: "#314a3b"
       }
     },
     {
       cssVar: "--tree-color-status-success-border",
       path: "color.status.success-border",
-      value: "#419559",
+      value: "#419359",
       category: "color",
       derived: true,
       description: "Themed semantic color, resolved per [data-tree-theme]. Derived by the library from the semantic layer \u2014 read it, do not override it.",
       themeValues: {
-        light: "#419559",
-        dark: "#4d9052"
+        light: "#419359",
+        dark: "#4f9154"
       }
     },
     {
@@ -13722,49 +14050,49 @@ var treeui_catalog_default = {
     {
       cssVar: "--tree-color-status-success-on-soft",
       path: "color.status.success-on-soft",
-      value: "#197934",
+      value: "#187733",
       category: "color",
       derived: true,
       description: "Themed semantic color, resolved per [data-tree-theme]. Derived by the library from the semantic layer \u2014 read it, do not override it.",
       themeValues: {
-        light: "#197934",
-        dark: "#61b064"
+        light: "#187733",
+        dark: "#63b266"
       }
     },
     {
       cssVar: "--tree-color-status-success-on-soft-hover",
       path: "color.status.success-on-soft-hover",
-      value: "#15672d",
+      value: "#156b2e",
       category: "color",
       derived: true,
       description: "Themed semantic color, resolved per [data-tree-theme]. Derived by the library from the semantic layer \u2014 read it, do not override it.",
       themeValues: {
-        light: "#15672d",
-        dark: "#85c287"
+        light: "#156b2e",
+        dark: "#80c082"
       }
     },
     {
       cssVar: "--tree-color-status-warning-hover",
       path: "color.status.warning-hover",
-      value: "#7a5200",
+      value: "#795100",
       category: "color",
       derived: true,
       description: "Themed semantic color, resolved per [data-tree-theme]. Derived by the library from the semantic layer \u2014 read it, do not override it.",
       themeValues: {
-        light: "#7a5200",
-        dark: "#d0a44d"
+        light: "#795100",
+        dark: "#d3a64e"
       }
     },
     {
       cssVar: "--tree-color-status-warning-press",
       path: "color.status.warning-press",
-      value: "#654400",
+      value: "#654300",
       category: "color",
       derived: true,
       description: "Themed semantic color, resolved per [data-tree-theme]. Derived by the library from the semantic layer \u2014 read it, do not override it.",
       themeValues: {
-        light: "#654400",
-        dark: "#d8b46b"
+        light: "#654300",
+        dark: "#dab56c"
       }
     },
     {
@@ -13794,13 +14122,13 @@ var treeui_catalog_default = {
     {
       cssVar: "--tree-color-status-warning-border",
       path: "color.status.warning-border",
-      value: "#a77f2c",
+      value: "#a67e2c",
       category: "color",
       derived: true,
       description: "Themed semantic color, resolved per [data-tree-theme]. Derived by the library from the semantic layer \u2014 read it, do not override it.",
       themeValues: {
-        light: "#a77f2c",
-        dark: "#a37a28"
+        light: "#a67e2c",
+        dark: "#a57b29"
       }
     },
     {
@@ -13818,25 +14146,25 @@ var treeui_catalog_default = {
     {
       cssVar: "--tree-color-status-warning-on-soft",
       path: "color.status.warning-on-soft",
-      value: "#8e5f00",
+      value: "#8d5e00",
       category: "color",
       derived: true,
       description: "Themed semantic color, resolved per [data-tree-theme]. Derived by the library from the semantic layer \u2014 read it, do not override it.",
       themeValues: {
-        light: "#8e5f00",
-        dark: "#c99631"
+        light: "#8d5e00",
+        dark: "#cc9732"
       }
     },
     {
       cssVar: "--tree-color-status-warning-on-soft-hover",
       path: "color.status.warning-on-soft-hover",
-      value: "#805600",
+      value: "#7f5500",
       category: "color",
       derived: true,
       description: "Themed semantic color, resolved per [data-tree-theme]. Derived by the library from the semantic layer \u2014 read it, do not override it.",
       themeValues: {
-        light: "#805600",
-        dark: "#d5ad5f"
+        light: "#7f5500",
+        dark: "#d5ab58"
       }
     },
     {
@@ -14547,16 +14875,23 @@ var treePrimitives = {
     600: "#633fa6",
     800: "#332e4a"
   },
+  /**
+   * The status hues carry the narrowest margin in the palette, because the band
+   * they have to clear is `bg.subtle` — the secondary surface a status line
+   * usually lands on (inside a card, under a field), not the primary one they
+   * are easy to calibrate against. Each of these three was a step away from the
+   * floor and is now a step above it; `status.test.ts` holds the headroom, and
+   * the contract validator holds the floor.
+   */
   green: {
-    400: "#59ac5c",
-    500: "#1a7f37"
+    400: "#5bae5e",
+    500: "#197d36"
   },
   amber: {
-    400: "#c69026",
-    500: "#956400"
+    400: "#c99227",
+    500: "#946300"
   },
   red: {
-    /** Landed on 4.50:1 against the dark subtle band; nudged for headroom. */
     400: "#f5766e",
     500: "#d1242f"
   },