@treeui/mcp 0.1.1 → 0.3.0

package/dist/index.cjs

@@ -47,9 +47,9 @@ module.exports = __toCommonJS(index_exports);
 
 // src/generated/treeui.catalog.json
 var treeui_catalog_default = {
-  generatedAt: "2026-04-10T16:42:52.904Z",
+  generatedAt: "2026-07-15T22:47:49.302Z",
   packageName: "@treeui/vue",
-  packageVersion: "0.6.1",
+  packageVersion: "0.13.0",
   decisionGuides: [
     {
       id: "single-choice",
@@ -247,6 +247,50 @@ var treeui_catalog_default = {
           notes: []
         }
       ]
+    },
+    {
+      id: "data-viz-choice",
+      question: "Visualize numeric data",
+      options: [
+        {
+          use: "TStat",
+          when: [
+            "The story is a single headline number, optionally with a trend and delta.",
+            "It is not a plot \u2014 prefer the number over a chart when one value says it."
+          ],
+          notes: []
+        },
+        {
+          use: "TSparkline",
+          when: [
+            "You want an inline micro-trend next to a value, in a table cell, or in text.",
+            "No axes, legend, or tooltip are needed."
+          ],
+          notes: []
+        },
+        {
+          use: "TChart",
+          when: [
+            "You need line, area, or bar plots with axes, gridlines, legend, and hover tooltip.",
+            "There are one or more series over shared categories."
+          ],
+          notes: []
+        },
+        {
+          use: "TDonutChart",
+          when: [
+            "The data is a part-of-whole breakdown (donut or pie)."
+          ],
+          notes: []
+        },
+        {
+          use: "TProgress",
+          when: [
+            "You are showing completion toward a single target, not a distribution or trend."
+          ],
+          notes: []
+        }
+      ]
     }
   ],
   recipes: [
@@ -296,11 +340,28 @@ var treeui_catalog_default = {
         "Set end `min` from the selected start time when appropriate."
       ]
     },
+    {
+      id: "app-shell",
+      name: "Full-viewport application shell",
+      useWhen: [
+        "The app needs a header plus side navigation that fills the whole screen and adapts to mobile.",
+        "The layout must use the full page width on large monitors, not a centered column."
+      ],
+      compose: [
+        "TAppShell",
+        "TNavMenu"
+      ],
+      notes: [
+        "`TAppShell` orchestrates the header, sidebar, and fluid content in one component; put a `TNavMenu` in its `sidebar` slot and it inherits collapsed state automatically.",
+        "Leave `mobile` unset to auto-switch at `breakpoint` (default 768px), or bind it to force mobile; the sidebar becomes an off-canvas drawer with a header menu button.",
+        "Mount it at the app root. Wrap only inner regions in `TContainer` if a specific area needs a constrained reading width."
+      ]
+    },
     {
       id: "sidebar-shell",
       name: "Sidebar application shell",
       useWhen: [
-        "The screen needs persistent section navigation."
+        "The screen needs persistent section navigation and you are composing the shell by hand."
       ],
       compose: [
         "TSidebar",
@@ -309,7 +370,8 @@ var treeui_catalog_default = {
         "TContainer"
       ],
       notes: [
-        "Let `TNavMenu` inherit collapsed state from `TSidebar` when possible."
+        "Let `TNavMenu` inherit collapsed state from `TSidebar` when possible.",
+        "Prefer `TAppShell` (recipe `app-shell`) when you also need full-viewport sizing and a responsive mobile drawer."
       ]
     },
     {
@@ -407,15 +469,38 @@ var treeui_catalog_default = {
       id: "chart-surface",
       name: "Chart surface",
       useWhen: [
-        "A screen needs data visualization, but the charting engine should stay external to TreeUI."
+        "A screen needs data visualization inside a framed, titled surface."
       ],
       compose: [
         "TCard",
         "TStack",
-        "external chart library"
+        "TChart",
+        "TSelect"
       ],
       notes: [
-        "Use TreeUI for the surrounding surface, headings, badges, filters, and empty/loading states."
+        "Prefer the native TChart / TDonutChart / TSparkline \u2014 no external charting library is required.",
+        "Use TreeUI for the surrounding surface, headings, badges, range filters, and empty/loading states.",
+        "TChart has its own loading and empty slots; you can still wrap it in TCard for the frame.",
+        "Only reach for an external chart engine for chart types TreeUI does not cover yet (e.g. scatter, heatmap)."
+      ]
+    },
+    {
+      id: "metric-dashboard",
+      name: "Metric dashboard",
+      useWhen: [
+        "A dashboard shows KPIs alongside trends and breakdowns."
+      ],
+      compose: [
+        "TStat",
+        "TSparkline",
+        "TChart",
+        "TDonutChart",
+        "TGrid"
+      ],
+      notes: [
+        "Lead with TStat tiles; embed a TSparkline in a stat's meta slot for the inline trend.",
+        "Use one TChart for the main time series and a TDonutChart for a part-of-whole split.",
+        "Keep series colors stable across the dashboard \u2014 rely on the --tree-color-chart-* order, do not remap by rank."
       ]
     },
     {
@@ -490,7 +575,7 @@ var treeui_catalog_default = {
     },
     globalRules: [
       "Always import `@treeui/vue/style.css` once in the consuming application.",
-      "Compatibility aliases such as `TreeButton` remain available but are not the preferred direction.",
+      "All components use the `T<Name>` export prefix; there are no `Tree<Name>` aliases.",
       "Form controls use `modelValue` + `update:modelValue`.",
       "Overlay-style components generally support controlled and uncontrolled open state.",
       "Date-only values use `YYYY-MM-DD`.",
@@ -565,17 +650,27 @@ var treeui_catalog_default = {
           "Use `accept`, `multiple`, and size limits in the app layer to constrain uploads."
         ]
       },
+      TAppShell: {
+        required: [],
+        notes: [
+          "Mount at the app root; it fills the viewport (100dvh, full width) and scrolls its content region independently.",
+          "Put navigation in the `sidebar` slot (e.g. `TNavMenu`) \u2014 it inherits collapsed state from the shell provider like `TSidebar`.",
+          "Leave `mobile` unset to auto-switch to an off-canvas drawer at `breakpoint`, or bind `mobile` to control it explicitly.",
+          "Use `v-model:collapsed` for the desktop rail and `v-model:sidebarOpen` for the mobile drawer when the app persists layout state."
+        ]
+      },
       TSidebar: {
         required: [],
         notes: [
           "Pair with `TNavMenu` for app-section navigation.",
-          "Use controlled `collapsed` state when the app shell persists layout preferences."
+          "Use controlled `collapsed` state when the app shell persists layout preferences.",
+          "Prefer `TAppShell` when you also want full-viewport sizing, a top header, and a responsive mobile drawer."
         ]
       },
       TNavMenu: {
         required: [],
         notes: [
-          "When nested inside `TSidebar`, `collapsed` can be inherited from the sidebar provider."
+          "When nested inside `TSidebar` or `TAppShell`, `collapsed` can be inherited from the sidebar provider."
         ]
       },
       TTreeView: {
@@ -609,6 +704,32 @@ var treeui_catalog_default = {
           "Use `href` for native links.",
           "Use `to` when the app has vue-router and breadcrumb items should render RouterLink."
         ]
+      },
+      TChart: {
+        required: [],
+        notes: [
+          "Pass `series` as `{ name, data, color? }[]` and `labels` as a parallel `string[]` (one label per data index).",
+          "Set `type` to `line`, `area`, or `bar`; use `stacked` only with `bar`.",
+          "Series colors come from `--tree-color-chart-1..8` in order; pass `color` per series to override \u2014 do not remap colors when the series set changes.",
+          "Pass `valueFormat: (n) => string` to format axis and tooltip values (currency, compact, etc.).",
+          "No charting library or provider is required \u2014 the SVG and geometry are built in."
+        ]
+      },
+      TSparkline: {
+        required: [],
+        notes: [
+          "Pass `data` as `number[]`; there are no axes, legend, or tooltip by design.",
+          "Size it with `width`/`height`; use it inside `TStat`, table cells, or text.",
+          "Always keep a visible number nearby \u2014 a sparkline supplements a value, it does not replace it."
+        ]
+      },
+      TDonutChart: {
+        required: [],
+        notes: [
+          "Pass `segments` as `{ label, value, color? }[]`; non-positive values are dropped.",
+          "Set `thickness: 0` for a full pie; keep the default for a donut with a center readout.",
+          "Use the `center` slot (donut only) for a custom center; otherwise it shows the total or the hovered slice."
+        ]
       }
     },
     appPatterns: {
@@ -622,6 +743,9 @@ var treeui_catalog_default = {
       commonCompositions: [
         "TFormField + input-like control",
         "TGrid + TStat",
+        "TStat + TSparkline",
+        "TCard + TChart",
+        "TAppShell + TNavMenu",
         "TSidebar + TNavMenu",
         "TTable + TPagination",
         "TPricing + TPricingCard"
@@ -631,16 +755,13 @@ var treeui_catalog_default = {
   components: [
     {
       name: "TAccordion",
-      legacyAlias: "TreeAccordion",
-      aliases: [
-        "TreeAccordion"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "disclosure",
       category: "Data Display",
       status: "available",
       purpose: "Organized content sections with expandable/collapsible behavior. Supports single-open and multi-open modes.\n",
-      sourceFile: "packages/vue/src/components/TreeAccordion.vue",
+      sourceFile: "packages/vue/src/components/TAccordion.vue",
       storyFile: "apps/docs/src/stories/Accordion.stories.ts",
       storyTitle: "Components/Data Display/Accordion",
       manifestFile: "docs/ai/COMPONENTS/accordion.yaml",
@@ -687,16 +808,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TAlert",
-      legacyAlias: "TreeAlert",
-      aliases: [
-        "TreeAlert"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "feedback",
       category: "Feedback",
       status: "available",
       purpose: "Inline status banner for info, success, warning, and danger messages.",
-      sourceFile: "packages/vue/src/components/TreeAlert.vue",
+      sourceFile: "packages/vue/src/components/TAlert.vue",
       storyFile: "apps/docs/src/stories/Alert.stories.ts",
       storyTitle: "Components/Feedback/Alert",
       manifestFile: "docs/ai/COMPONENTS/alert.yaml",
@@ -714,7 +832,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -789,15 +907,217 @@ var treeui_catalog_default = {
       recipes: []
     },
     {
-      name: "TAvatar",
-      legacyAlias: "TreeAvatar",
-      aliases: [
-        "TreeAvatar"
+      name: "TAppShell",
+      aliases: [],
+      package: "@treeui/vue",
+      kind: "layout",
+      category: "Layout",
+      status: "available",
+      purpose: "Full-viewport application shell with a top header, a persistent side navigation, and a fluid content area that collapses the sidebar into an off-canvas drawer on small screens.",
+      sourceFile: "packages/vue/src/components/TAppShell.vue",
+      storyFile: "apps/docs/src/stories/AppShell.stories.ts",
+      storyTitle: "Components/Layout/AppShell",
+      manifestFile: "docs/ai/COMPONENTS/app-shell.yaml",
+      props: [
+        {
+          name: "as",
+          type: "string",
+          default: "div"
+        },
+        {
+          name: "side",
+          type: "TSidebarSide",
+          default: "left",
+          values: [
+            "left",
+            "right"
+          ]
+        },
+        {
+          name: "sidebarWidth",
+          type: "string",
+          default: "17.5rem"
+        },
+        {
+          name: "collapsedWidth",
+          type: "string",
+          default: "4.75rem"
+        },
+        {
+          name: "collapsible",
+          type: "boolean",
+          default: "false"
+        },
+        {
+          name: "collapsed",
+          type: "boolean",
+          default: "undefined"
+        },
+        {
+          name: "defaultCollapsed",
+          type: "boolean",
+          default: "false"
+        },
+        {
+          name: "mobile",
+          type: "boolean",
+          default: "undefined"
+        },
+        {
+          name: "breakpoint",
+          type: "string",
+          default: "768px"
+        },
+        {
+          name: "sidebarOpen",
+          type: "boolean",
+          default: "undefined"
+        },
+        {
+          name: "defaultSidebarOpen",
+          type: "boolean",
+          default: "false"
+        },
+        {
+          name: "closeOnEscape",
+          type: "boolean",
+          default: "true"
+        },
+        {
+          name: "closeOnOverlay",
+          type: "boolean",
+          default: "true"
+        },
+        {
+          name: "showMenuButton",
+          type: "boolean",
+          default: "true"
+        },
+        {
+          name: "menuLabel",
+          type: "string",
+          default: "Open menu"
+        },
+        {
+          name: "closeLabel",
+          type: "string",
+          default: "Close menu"
+        },
+        {
+          name: "sidebarLabel",
+          type: "string",
+          default: "Sidebar"
+        }
       ],
+      events: [
+        {
+          name: "update:collapsed"
+        },
+        {
+          name: "collapse-change"
+        },
+        {
+          name: "update:sidebarOpen"
+        },
+        {
+          name: "sidebar-open-change"
+        }
+      ],
+      slots: [
+        {
+          name: "header"
+        },
+        {
+          name: "sidebar"
+        },
+        {
+          name: "default"
+        },
+        {
+          name: "menu-icon"
+        }
+      ],
+      a11y: [
+        "role: dialog",
+        "aria_modal: true",
+        "focus_trap: true",
+        "restores_focus_on_close: true",
+        "escape_closes_when_enabled: true",
+        "menu_button_aria_expanded: true",
+        "menu_button_aria_controls_drawer: true",
+        "sidebar_labelled_by_sidebar_label: true"
+      ],
+      behavior: [
+        "fills_viewport_full_width_and_height: true",
+        "header_spans_full_width_above_sidebar_and_content: true",
+        "content_area_scrolls_independently: true",
+        "auto_switches_to_mobile_at_breakpoint_when_mobile_undefined: true",
+        "mobile_prop_forces_mobile_mode: true",
+        "mobile_sidebar_becomes_off_canvas_drawer: true",
+        "auto_menu_button_in_header_on_mobile: true",
+        "controlled_and_uncontrolled_collapsed_state: true",
+        "controlled_and_uncontrolled_sidebar_open_state: true",
+        "provides_collapsed_state_to_descendants: true",
+        "drawer_reports_collapsed_false_to_descendants_and_slots: true",
+        "left_and_right_variants: true",
+        "locks_body_scroll_while_drawer_open: true",
+        "overlay_click_closes_when_enabled: true",
+        "exposes_slot_props_with_mobile_collapsed_and_toggles: true"
+      ],
+      selection: {
+        keywords: [
+          "app shell",
+          "layout",
+          "dashboard",
+          "admin",
+          "header sidebar",
+          "full screen",
+          "responsive shell",
+          "off-canvas"
+        ],
+        useWhen: [
+          "You need a full-viewport application layout with a header, a side navigation, and a fluid content area.",
+          "The layout should use the entire page width (not a centered max-width) and switch the sidebar to an off-canvas drawer on small screens."
+        ],
+        avoidWhen: [
+          "You only need one region (just a top bar, or just a side rail) \u2014 compose TNavbar or TSidebar directly.",
+          "The page content should be centered with a readable max width \u2014 use TContainer inside the shell content instead."
+        ],
+        alternatives: [
+          {
+            component: "TSidebar",
+            when: "You want a standalone collapsible side rail without the header/content orchestration or responsive drawer."
+          },
+          {
+            component: "TNavbar",
+            when: "You only need the top application bar."
+          },
+          {
+            component: "TDrawer",
+            when: "You need a general temporary overlay panel rather than the shell's responsive navigation."
+          }
+        ]
+      },
+      setup: {
+        required: [],
+        notes: [
+          "Mount at the app root; it fills the viewport (100dvh, full width) and scrolls its content region independently.",
+          "Put navigation in the `sidebar` slot (e.g. `TNavMenu`) \u2014 it inherits collapsed state from the shell provider like `TSidebar`.",
+          "Leave `mobile` unset to auto-switch to an off-canvas drawer at `breakpoint`, or bind `mobile` to control it explicitly.",
+          "Use `v-model:collapsed` for the desktop rail and `v-model:sidebarOpen` for the mobile drawer when the app persists layout state."
+        ]
+      },
+      recipes: [
+        "app-shell"
+      ]
+    },
+    {
+      name: "TAvatar",
+      aliases: [],
       package: "@treeui/vue",
       category: "Data Display",
       description: "User image with fallback initials and optional status indicator dot.",
-      sourceFile: "packages/vue/src/components/TreeAvatar.vue",
+      sourceFile: "packages/vue/src/components/TAvatar.vue",
       storyFile: "apps/docs/src/stories/Avatar.stories.ts",
       storyTitle: "Components/Data Display/Avatar",
       manifestFile: "docs/ai/COMPONENTS/avatar.yaml",
@@ -822,7 +1142,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -832,7 +1152,7 @@ var treeui_catalog_default = {
         },
         {
           name: "status",
-          type: "TreeAvatarStatus",
+          type: "TAvatarStatus",
           required: false,
           values: [
             "online",
@@ -870,23 +1190,20 @@ var treeui_catalog_default = {
     },
     {
       name: "TBadge",
-      legacyAlias: "TreeBadge",
-      aliases: [
-        "TreeBadge"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "display",
       category: "Data Display",
       status: "available",
       purpose: "Compact status or metadata label with optional icon.",
-      sourceFile: "packages/vue/src/components/TreeBadge.vue",
+      sourceFile: "packages/vue/src/components/TBadge.vue",
       storyFile: "apps/docs/src/stories/Badge.stories.ts",
       storyTitle: "Components/Data Display/Badge",
       manifestFile: "docs/ai/COMPONENTS/badge.yaml",
       props: [
         {
           name: "variant",
-          type: "TreeVariant",
+          type: "TVariant",
           default: "soft",
           values: [
             "solid",
@@ -898,7 +1215,7 @@ var treeui_catalog_default = {
         },
         {
           name: "tone",
-          type: "TreeBadgeTone",
+          type: "TBadgeTone",
           default: "neutral",
           values: [
             "neutral",
@@ -911,7 +1228,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -950,16 +1267,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TBreadcrumb",
-      legacyAlias: "TreeBreadcrumb",
-      aliases: [
-        "TreeBreadcrumb"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "navigation",
       category: "Navigation",
       status: "available",
       purpose: "Hierarchical navigation trail showing the user's current location within a site or application.",
-      sourceFile: "packages/vue/src/components/TreeBreadcrumb.vue",
+      sourceFile: "packages/vue/src/components/TBreadcrumb.vue",
       storyFile: "apps/docs/src/stories/Breadcrumb.stories.ts",
       storyTitle: "Components/Navigation/Breadcrumb",
       manifestFile: "docs/ai/COMPONENTS/breadcrumb.yaml",
@@ -1002,16 +1316,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TButton",
-      legacyAlias: "TreeButton",
-      aliases: [
-        "TreeButton"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "primitive",
       category: "Actions",
       status: "available",
       purpose: "Clickable action trigger with variants, sizes, optional polymorphism, and loading state.",
-      sourceFile: "packages/vue/src/components/TreeButton.vue",
+      sourceFile: "packages/vue/src/components/TButton.vue",
       storyFile: "apps/docs/src/stories/Button.stories.ts",
       storyTitle: "Components/Actions/Button",
       manifestFile: "docs/ai/COMPONENTS/button.yaml",
@@ -1023,7 +1334,7 @@ var treeui_catalog_default = {
         },
         {
           name: "variant",
-          type: "TreeVariant",
+          type: "TVariant",
           default: "solid",
           values: [
             "solid",
@@ -1035,7 +1346,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -1100,16 +1411,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TCard",
-      legacyAlias: "TreeCard",
-      aliases: [
-        "TreeCard"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "layout",
       category: "Data Display",
       status: "available",
       purpose: "Surface container with optional header and footer slots.",
-      sourceFile: "packages/vue/src/components/TreeCard.vue",
+      sourceFile: "packages/vue/src/components/TCard.vue",
       storyFile: "apps/docs/src/stories/Card.stories.ts",
       storyTitle: "Components/Data Display/Card",
       manifestFile: "docs/ai/COMPONENTS/card.yaml",
@@ -1121,7 +1429,7 @@ var treeui_catalog_default = {
         },
         {
           name: "variant",
-          type: "TreeCardVariant",
+          type: "TCardVariant",
           default: "outline",
           values: [
             "outline",
@@ -1132,7 +1440,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -1164,7 +1472,8 @@ var treeui_catalog_default = {
       ],
       a11y: [],
       behavior: [
-        "body_wrapper_class: tree-card__body"
+        "body_wrapper_class: t-card__body",
+        "solid_variant_rescopes_color_tokens_for_nested_content: true"
       ],
       selection: {
         keywords: [
@@ -1200,17 +1509,210 @@ var treeui_catalog_default = {
       ]
     },
     {
-      name: "TCheckbox",
-      legacyAlias: "TreeCheckbox",
-      aliases: [
-        "TreeCheckbox"
+      name: "TChart",
+      aliases: [],
+      package: "@treeui/vue",
+      kind: "data-display",
+      category: "Data Display",
+      status: "available",
+      purpose: "Lightweight cartesian chart (line, area, bar) for multi-series data, with axes, gridlines, hover tooltip, legend, and an accessible data table. No external charting dependency.",
+      sourceFile: "packages/vue/src/components/TChart.vue",
+      storyFile: "apps/docs/src/stories/Chart.stories.ts",
+      storyTitle: "Components/Data Display/Chart",
+      manifestFile: "docs/ai/COMPONENTS/chart.yaml",
+      props: [
+        {
+          name: "type",
+          type: "TChartType",
+          default: "line",
+          values: [
+            "line",
+            "area",
+            "bar"
+          ]
+        },
+        {
+          name: "series",
+          type: "TChartSeries[]",
+          default: "[]",
+          note: "Each item is { name: string; data: number[]; color?: string }."
+        },
+        {
+          name: "labels",
+          type: "string[]",
+          default: "[]",
+          note: "X-axis categories, aligned index-for-index to each series' data."
+        },
+        {
+          name: "height",
+          type: "number",
+          default: "260",
+          note: "Width is fluid (measured via ResizeObserver)."
+        },
+        {
+          name: "smooth",
+          type: "boolean",
+          default: "false",
+          note: "Curved line/area."
+        },
+        {
+          name: "stacked",
+          type: "boolean",
+          default: "false",
+          note: "Stacks bar series; ignored for line/area. Negative values are clamped to 0 in stacked mode (grouped mode renders them)."
+        },
+        {
+          name: "showGrid",
+          type: "boolean",
+          default: "true"
+        },
+        {
+          name: "showLegend",
+          type: "boolean",
+          default: "auto (true when more than one series)"
+        },
+        {
+          name: "showXAxis",
+          type: "boolean",
+          default: "true"
+        },
+        {
+          name: "showYAxis",
+          type: "boolean",
+          default: "true"
+        },
+        {
+          name: "showTooltip",
+          type: "boolean",
+          default: "true"
+        },
+        {
+          name: "showPoints",
+          type: "boolean",
+          default: "false",
+          note: "Always draw markers on line/area points."
+        },
+        {
+          name: "yTicks",
+          type: "number",
+          default: "5"
+        },
+        {
+          name: "valueFormat",
+          type: "(value: number) => string",
+          default: "locale integers for |value| >= 1000"
+        },
+        {
+          name: "minY",
+          type: "number",
+          default: "auto"
+        },
+        {
+          name: "maxY",
+          type: "number",
+          default: "auto"
+        },
+        {
+          name: "animated",
+          type: "boolean",
+          default: "true",
+          note: "Draw-in animation; disabled under prefers-reduced-motion."
+        },
+        {
+          name: "loading",
+          type: "boolean",
+          default: "false"
+        },
+        {
+          name: "ariaLabel",
+          type: "string",
+          default: "auto-generated summary"
+        }
+      ],
+      events: [
+        {
+          name: "point-click",
+          payload: "{ index: number; label: string; values: { name: string; value: number; color: string }[] }"
+        }
+      ],
+      slots: [
+        {
+          name: "legend"
+        },
+        {
+          name: "tooltip"
+        },
+        {
+          name: "empty"
+        }
+      ],
+      a11y: [
+        "SVG is aria-hidden; a visually-hidden <table> mirrors the series data for assistive tech.",
+        "Legend defaults on for multiple series so identity is not color-only.",
+        "Provide a meaningful ariaLabel describing what the chart shows."
       ],
+      behavior: [
+        "colors_auto_assign_from_chart_palette: --tree-color-chart-1..8, cycling; per-series color overrides",
+        "bar_zero_baseline: true",
+        "line_domain_uses_nice_ticks: true",
+        "hover_shows_crosshair_and_tooltip: true"
+      ],
+      selection: {
+        keywords: [
+          "chart",
+          "graph",
+          "line chart",
+          "area chart",
+          "bar chart",
+          "plot",
+          "dashboard",
+          "time series",
+          "analytics"
+        ],
+        useWhen: [
+          "You need a line, area, or bar chart with axes, gridlines, legend, and a hover tooltip.",
+          "One or more series share a set of category labels."
+        ],
+        avoidWhen: [
+          "A single value tells the story \u2014 use TStat.",
+          "You only need an inline trend with no axes \u2014 use TSparkline.",
+          "The data is a part-of-whole breakdown \u2014 use TDonutChart."
+        ],
+        alternatives: [
+          {
+            component: "TSparkline",
+            when: "The trend should be inline and axis-less."
+          },
+          {
+            component: "TDonutChart",
+            when: "The data is proportional (parts of a whole)."
+          }
+        ]
+      },
+      setup: {
+        required: [],
+        notes: [
+          "Pass `series` as `{ name, data, color? }[]` and `labels` as a parallel `string[]` (one label per data index).",
+          "Set `type` to `line`, `area`, or `bar`; use `stacked` only with `bar`.",
+          "Series colors come from `--tree-color-chart-1..8` in order; pass `color` per series to override \u2014 do not remap colors when the series set changes.",
+          "Pass `valueFormat: (n) => string` to format axis and tooltip values (currency, compact, etc.).",
+          "No charting library or provider is required \u2014 the SVG and geometry are built in."
+        ]
+      },
+      recipes: [
+        "chart-surface",
+        "metric-dashboard"
+      ]
+    },
+    {
+      name: "TCheckbox",
+      aliases: [],
       package: "@treeui/vue",
       kind: "primitive",
       category: "Data Entry",
       status: "available",
       purpose: "Boolean toggle with indeterminate state; supports v-model via modelValue.",
-      sourceFile: "packages/vue/src/components/TreeCheckbox.vue",
+      sourceFile: "packages/vue/src/components/TCheckbox.vue",
       storyFile: "apps/docs/src/stories/Checkbox.stories.ts",
       storyTitle: "Components/Data Entry/Checkbox",
       manifestFile: "docs/ai/COMPONENTS/checkbox.yaml",
@@ -1222,7 +1724,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -1302,16 +1804,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TCombobox",
-      legacyAlias: "TreeCombobox",
-      aliases: [
-        "TreeCombobox"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "primitive",
       category: "Data Entry",
       status: "available",
       purpose: "Searchable combobox / autocomplete input with local filtering, controlled selection, and shared open-state behavior.",
-      sourceFile: "packages/vue/src/components/TreeCombobox.vue",
+      sourceFile: "packages/vue/src/components/TCombobox.vue",
       storyFile: "apps/docs/src/stories/Combobox.stories.ts",
       storyTitle: "Components/Data Entry/Combobox",
       manifestFile: "docs/ai/COMPONENTS/combobox.yaml",
@@ -1323,7 +1822,7 @@ var treeui_catalog_default = {
         },
         {
           name: "options",
-          type: "TreeComboboxOption[]",
+          type: "TComboboxOption[]",
           default: "[]",
           note: "Array of { label: string; value: string; description?: string; keywords?: string[]; disabled?: boolean }"
         },
@@ -1339,7 +1838,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -1456,16 +1955,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TConfirmDialog",
-      legacyAlias: "TreeConfirmDialog",
-      aliases: [
-        "TreeConfirmDialog"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "overlay",
       category: "Overlay",
       status: "available",
       purpose: "High-level confirmation dialog built on the shared modal contract, with default confirm and cancel actions.",
-      sourceFile: "packages/vue/src/components/TreeConfirmDialog.vue",
+      sourceFile: "packages/vue/src/components/TConfirmDialog.vue",
       storyFile: "apps/docs/src/stories/ConfirmDialog.stories.ts",
       storyTitle: "Components/Overlay/ConfirmDialog",
       manifestFile: "docs/ai/COMPONENTS/confirm-dialog.yaml",
@@ -1487,7 +1983,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "sm",
           values: [
             "sm",
@@ -1517,7 +2013,7 @@ var treeui_catalog_default = {
         },
         {
           name: "confirmVariant",
-          type: "TreeVariant",
+          type: "TVariant",
           default: "danger"
         },
         {
@@ -1625,16 +2121,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TContainer",
-      legacyAlias: "TreeContainer",
-      aliases: [
-        "TreeContainer"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "layout",
       category: "Layout",
       status: "available",
       purpose: "Width-constrained layout wrapper for readable page content and app sections.",
-      sourceFile: "packages/vue/src/components/TreeContainer.vue",
+      sourceFile: "packages/vue/src/components/TContainer.vue",
       storyFile: "apps/docs/src/stories/Container.stories.ts",
       storyTitle: "Components/Layout/Container",
       manifestFile: "docs/ai/COMPONENTS/container.yaml",
@@ -1646,7 +2139,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeContainerSize",
+          type: "TContainerSize",
           default: "lg",
           values: [
             "sm",
@@ -1717,10 +2210,7 @@ var treeui_catalog_default = {
     },
     {
       name: "TContextMenu",
-      legacyAlias: "TreeContextMenu",
-      aliases: [
-        "TreeContextMenu"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       category: "Overlay",
       status: "stable",
@@ -1730,7 +2220,7 @@ var treeui_catalog_default = {
       props: [
         {
           name: "items",
-          type: "TreeContextMenuItem[]",
+          type: "TContextMenuItem[]",
           default: "[]",
           description: "Menu items to render."
         },
@@ -1754,7 +2244,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           description: "Item sizing variant."
         }
@@ -1827,16 +2317,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TDatePicker",
-      legacyAlias: "TreeDatePicker",
-      aliases: [
-        "TreeDatePicker"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "form_overlay",
       category: "Data Entry",
       status: "available",
       purpose: "Date input with calendar popover and keyboard navigation.",
-      sourceFile: "packages/vue/src/components/TreeDatePicker.vue",
+      sourceFile: "packages/vue/src/components/TDatePicker.vue",
       storyFile: "apps/docs/src/stories/DatePicker.stories.ts",
       storyTitle: "Components/Data Entry/DatePicker",
       manifestFile: "docs/ai/COMPONENTS/date-picker.yaml",
@@ -1858,7 +2345,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -1979,16 +2466,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TDateTimePicker",
-      legacyAlias: "TreeDateTimePicker",
-      aliases: [
-        "TreeDateTimePicker"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "form",
       category: "Data Entry",
       status: "available",
       purpose: "Date and time picker with a calendar grid, time selection, and overlay trigger.",
-      sourceFile: "packages/vue/src/components/TreeDateTimePicker.vue",
+      sourceFile: "packages/vue/src/components/TDateTimePicker.vue",
       storyFile: "apps/docs/src/stories/DateTimePicker.stories.ts",
       storyTitle: "Components/Data Entry/DateTimePicker",
       manifestFile: "docs/ai/COMPONENTS/date-time-picker.yaml",
@@ -2011,7 +2495,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -2140,14 +2624,11 @@ var treeui_catalog_default = {
     },
     {
       name: "TDivider",
-      legacyAlias: "TreeDivider",
-      aliases: [
-        "TreeDivider"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       category: "Layout",
       description: "Horizontal or vertical visual separator.",
-      sourceFile: "packages/vue/src/components/TreeDivider.vue",
+      sourceFile: "packages/vue/src/components/TDivider.vue",
       storyFile: "apps/docs/src/stories/Divider.stories.ts",
       storyTitle: "Components/Layout/Divider",
       manifestFile: "docs/ai/COMPONENTS/divider.yaml",
@@ -2162,50 +2643,183 @@ var treeui_catalog_default = {
           ]
         },
         {
-          name: "decorative",
+          name: "decorative",
+          type: "boolean",
+          default: "true",
+          description: "When true, renders role='none' (purely visual). When false, renders as role='separator'."
+        },
+        {
+          name: "label",
+          type: "string",
+          required: false,
+          description: "Accessible label for non-decorative dividers."
+        }
+      ],
+      events: [],
+      slots: [],
+      a11y: [
+        "role: none (decorative) or separator (semantic)",
+        "aria-orientation: Set when non-decorative.",
+        "aria-label: Set from `label` prop when non-decorative."
+      ],
+      behavior: [],
+      selection: {
+        keywords: [],
+        useWhen: [],
+        avoidWhen: [],
+        alternatives: []
+      },
+      setup: {
+        required: [],
+        notes: []
+      },
+      recipes: []
+    },
+    {
+      name: "TDonutChart",
+      aliases: [],
+      package: "@treeui/vue",
+      kind: "data-display",
+      category: "Data Display",
+      status: "available",
+      purpose: "Part-of-whole chart rendered as a donut (default) or full pie, with a legend, percentages, an interactive center readout, and an accessible label.",
+      sourceFile: "packages/vue/src/components/TDonutChart.vue",
+      storyFile: "apps/docs/src/stories/DonutChart.stories.ts",
+      storyTitle: "Components/Data Display/Donut Chart",
+      manifestFile: "docs/ai/COMPONENTS/donut-chart.yaml",
+      props: [
+        {
+          name: "segments",
+          type: "TDonutSegment[]",
+          default: "[]",
+          note: "Each item is { label: string; value: number; color?: string }. Non-positive values are omitted."
+        },
+        {
+          name: "size",
+          type: "number",
+          default: "200",
+          note: "Square canvas in px."
+        },
+        {
+          name: "thickness",
+          type: "number",
+          default: "26",
+          note: "Ring thickness; 0 renders a full pie."
+        },
+        {
+          name: "gap",
+          type: "number",
+          default: "2",
+          note: "Gap between slices, in degrees."
+        },
+        {
+          name: "rounded",
+          type: "boolean",
+          default: "false",
+          note: "Round the ends of donut segments (widens the gap to make room). Best with a thinner ring."
+        },
+        {
+          name: "showLegend",
+          type: "boolean",
+          default: "true"
+        },
+        {
+          name: "showPercent",
+          type: "boolean",
+          default: "true"
+        },
+        {
+          name: "centerLabel",
+          type: "string",
+          default: "Total",
+          note: "Donut only; ignored for pie."
+        },
+        {
+          name: "centerValue",
+          type: "string | number",
+          default: "auto (sum of values)"
+        },
+        {
+          name: "valueFormat",
+          type: "(value: number) => string",
+          default: "locale integers for |value| >= 1000"
+        },
+        {
+          name: "loading",
           type: "boolean",
-          default: "true",
-          description: "When true, renders role='none' (purely visual). When false, renders as role='separator'."
+          default: "false"
         },
         {
-          name: "label",
+          name: "ariaLabel",
           type: "string",
-          required: false,
-          description: "Accessible label for non-decorative dividers."
+          default: "auto-generated summary"
         }
       ],
       events: [],
-      slots: [],
+      slots: [
+        {
+          name: "center"
+        },
+        {
+          name: "empty"
+        }
+      ],
       a11y: [
-        "role: none (decorative) or separator (semantic)",
-        "aria-orientation: Set when non-decorative.",
-        "aria-label: Set from `label` prop when non-decorative."
+        "Renders role=img with an aria-label summarizing the chart.",
+        "Legend + percentages give a non-visual reading of each slice."
+      ],
+      behavior: [
+        "colors_auto_assign_from_chart_palette: --tree-color-chart-1..8, cycling; per-segment color overrides",
+        "hovering_a_slice_dims_the_rest_and_updates_center: true",
+        "center_shows_total_or_the_hovered_segment: true"
       ],
-      behavior: [],
       selection: {
-        keywords: [],
-        useWhen: [],
-        avoidWhen: [],
-        alternatives: []
+        keywords: [
+          "donut",
+          "doughnut",
+          "pie",
+          "proportion",
+          "share",
+          "breakdown",
+          "part of whole",
+          "percentage"
+        ],
+        useWhen: [
+          "You are showing how a total splits into a handful of categories.",
+          "A donut center readout (total or hovered slice) is useful."
+        ],
+        avoidWhen: [
+          "There are many categories or precise comparison matters \u2014 use TChart bars.",
+          "The data is a trend over time \u2014 use TChart or TSparkline."
+        ],
+        alternatives: [
+          {
+            component: "TChart",
+            when: "Precise magnitude comparison across categories is needed (bars)."
+          }
+        ]
       },
       setup: {
         required: [],
-        notes: []
+        notes: [
+          "Pass `segments` as `{ label, value, color? }[]`; non-positive values are dropped.",
+          "Set `thickness: 0` for a full pie; keep the default for a donut with a center readout.",
+          "Use the `center` slot (donut only) for a custom center; otherwise it shows the total or the hovered slice."
+        ]
       },
-      recipes: []
+      recipes: [
+        "metric-dashboard"
+      ]
     },
     {
       name: "TDrawer",
-      legacyAlias: "TreeDrawer",
-      aliases: [
-        "TreeDrawer"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "overlay",
       category: "Overlay",
       status: "available",
       purpose: "Side-anchored panel for secondary content, navigation, or forms.",
-      sourceFile: "packages/vue/src/components/TreeDrawer.vue",
+      sourceFile: "packages/vue/src/components/TDrawer.vue",
       storyFile: "apps/docs/src/stories/Drawer.stories.ts",
       storyTitle: "Components/Overlay/Drawer",
       manifestFile: "docs/ai/COMPONENTS/drawer.yaml",
@@ -2227,7 +2841,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -2237,7 +2851,7 @@ var treeui_catalog_default = {
         },
         {
           name: "side",
-          type: "TreeDrawerSide",
+          type: "TDrawerSide",
           default: "right",
           values: [
             "top",
@@ -2352,23 +2966,20 @@ var treeui_catalog_default = {
     },
     {
       name: "TDropdown",
-      legacyAlias: "TreeDropdown",
-      aliases: [
-        "TreeDropdown"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "overlay",
       category: "Overlay",
       status: "available",
       purpose: "Trigger + floating menu with keyboard navigation for action lists.",
-      sourceFile: "packages/vue/src/components/TreeDropdown.vue",
+      sourceFile: "packages/vue/src/components/TDropdown.vue",
       storyFile: "apps/docs/src/stories/Dropdown.stories.ts",
       storyTitle: "Components/Overlay/Dropdown",
       manifestFile: "docs/ai/COMPONENTS/dropdown.yaml",
       props: [
         {
           name: "items",
-          type: "TreeDropdownItem[]",
+          type: "TDropdownItem[]",
           default: "[]",
           note: "Array of { label: string; value: string; disabled?: boolean }"
         },
@@ -2389,7 +3000,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -2401,6 +3012,16 @@ var treeui_catalog_default = {
           name: "label",
           type: "string",
           default: ""
+        },
+        {
+          name: "align",
+          type: "TDropdownAlign",
+          default: "start",
+          values: [
+            "start",
+            "end"
+          ],
+          note: "Horizontal alignment of the menu relative to the trigger. Use `end` when the trigger sits near the right edge of a clipping container (e.g. a table actions column)."
         }
       ],
       events: [
@@ -2436,7 +3057,8 @@ var treeui_catalog_default = {
       behavior: [
         "outside_click_closes_menu: true",
         "focus_restores_on_close: true",
-        "chevron_rotates_when_open: true"
+        "chevron_rotates_when_open: true",
+        "menu_grows_to_fit_items_without_wrapping: true"
       ],
       selection: {
         keywords: [
@@ -2469,16 +3091,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TEmptyState",
-      legacyAlias: "TreeEmptyState",
-      aliases: [
-        "TreeEmptyState"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "feedback",
       category: "Feedback",
       status: "available",
       purpose: "Structured empty, no-results, and first-run placeholder block with optional icon, body content, and actions.",
-      sourceFile: "packages/vue/src/components/TreeEmptyState.vue",
+      sourceFile: "packages/vue/src/components/TEmptyState.vue",
       storyFile: "apps/docs/src/stories/EmptyState.stories.ts",
       storyTitle: "Components/Feedback/EmptyState",
       manifestFile: "docs/ai/COMPONENTS/empty-state.yaml",
@@ -2490,7 +3109,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -2564,16 +3183,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TFileUpload",
-      legacyAlias: "TreeFileUpload",
-      aliases: [
-        "TreeFileUpload"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "form",
       category: "Form",
       status: "available",
       purpose: "Composable dropzone and file picker with browse, drag-and-drop, and Ctrl+V paste support.",
-      sourceFile: "packages/vue/src/components/TreeFileUpload.vue",
+      sourceFile: "packages/vue/src/components/TFileUpload.vue",
       storyFile: "apps/docs/src/stories/FileUpload.stories.ts",
       storyTitle: "Components/Form/FileUpload",
       manifestFile: "docs/ai/COMPONENTS/file-upload.yaml",
@@ -2585,7 +3201,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -2718,15 +3334,12 @@ var treeui_catalog_default = {
     },
     {
       name: "TFormField",
-      legacyAlias: "TreeFormField",
-      aliases: [
-        "TreeFormField"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       category: "Data Entry",
       status: "milestone-1",
       description: "Label + input wrapper with error and hint slots. Provides consistent layout, labelling, and validation messaging for any form control.\n",
-      sourceFile: "packages/vue/src/components/TreeFormField.vue",
+      sourceFile: "packages/vue/src/components/TFormField.vue",
       storyFile: "apps/docs/src/stories/FormField.stories.ts",
       storyTitle: "Components/Data Entry/FormField",
       manifestFile: "docs/ai/COMPONENTS/form-field.yaml",
@@ -2769,7 +3382,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -2850,16 +3463,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TGrid",
-      legacyAlias: "TreeGrid",
-      aliases: [
-        "TreeGrid"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "layout",
       category: "Layout",
       status: "available",
       purpose: "Responsive grid wrapper for cards, forms, stats, and other multi-column layouts.",
-      sourceFile: "packages/vue/src/components/TreeGrid.vue",
+      sourceFile: "packages/vue/src/components/TGrid.vue",
       storyFile: "apps/docs/src/stories/Grid.stories.ts",
       storyTitle: "Components/Layout/Grid",
       manifestFile: "docs/ai/COMPONENTS/grid.yaml",
@@ -2948,21 +3558,109 @@ var treeui_catalog_default = {
       },
       recipes: [
         "date-range-form",
-        "stat-grid"
+        "stat-grid",
+        "metric-dashboard"
       ]
     },
     {
-      name: "TInput",
-      legacyAlias: "TreeInput",
-      aliases: [
-        "TreeInput"
+      name: "TIcon",
+      aliases: [],
+      package: "@treeui/vue",
+      kind: "display",
+      category: "Data Display",
+      status: "available",
+      purpose: "Render a registered TreeUI icon by name with consistent sizing and accessibility defaults.",
+      sourceFile: "packages/vue/src/components/TIcon.vue",
+      storyFile: "apps/docs/src/stories/Icon.stories.ts",
+      storyTitle: "Components/Data Display/Icon",
+      manifestFile: "docs/ai/COMPONENTS/icon.yaml",
+      props: [
+        {
+          name: "name",
+          type: "TIconName",
+          required: true,
+          values: [
+            "alert-circle",
+            "calendar",
+            "check",
+            "chevron-left",
+            "chevron-down",
+            "chevron-right",
+            "info",
+            "loader-circle",
+            "search",
+            "x"
+          ],
+          description: "Icon identifier from the @treeui/icons registry."
+        },
+        {
+          name: "size",
+          type: "number | string",
+          default: "20",
+          description: "Pixel size for both width and height of the rendered svg."
+        },
+        {
+          name: "strokeWidth",
+          type: "number | string",
+          default: "2"
+        },
+        {
+          name: "absoluteStrokeWidth",
+          type: "boolean",
+          default: "true",
+          description: "When true, stroke width stays visually constant across sizes."
+        },
+        {
+          name: "label",
+          type: "string",
+          default: "undefined",
+          description: 'Accessible label. When set, the icon becomes role="img" with aria-label; otherwise it is aria-hidden.'
+        }
+      ],
+      events: [],
+      slots: [],
+      a11y: [
+        "decorative_by_default: true",
+        "becomes_image_when_labeled: true",
+        "rule: Provide `label` only when the icon conveys meaning that is not already in adjacent text."
       ],
+      behavior: [],
+      selection: {
+        keywords: [
+          "icon",
+          "svg",
+          "glyph",
+          "pictogram"
+        ],
+        useWhen: [
+          "You need to render a registered TreeUI icon by name.",
+          "You want consistent sizing and a11y defaults without importing the icon component directly."
+        ],
+        avoidWhen: [
+          "The icon is not in the @treeui/icons registry \u2014 import or register it instead."
+        ],
+        alternatives: [
+          {
+            component: "named import from @treeui/icons",
+            when: "You need tree-shaken, statically-imported icon components."
+          }
+        ]
+      },
+      setup: {
+        required: [],
+        notes: []
+      },
+      recipes: []
+    },
+    {
+      name: "TInput",
+      aliases: [],
       package: "@treeui/vue",
       kind: "primitive",
       category: "Data Entry",
       status: "available",
       purpose: "Text input with size, loading, invalid, and prefix or suffix slots.",
-      sourceFile: "packages/vue/src/components/TreeInput.vue",
+      sourceFile: "packages/vue/src/components/TInput.vue",
       storyFile: "apps/docs/src/stories/Input.stories.ts",
       storyTitle: "Components/Data Entry/Input",
       manifestFile: "docs/ai/COMPONENTS/input.yaml",
@@ -2974,7 +3672,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -3068,16 +3766,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TLink",
-      legacyAlias: "TreeLink",
-      aliases: [
-        "TreeLink"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "navigation",
       category: "Navigation",
       status: "available",
       purpose: "Inline link with consistent styling, optional RouterLink rendering, and external link support.",
-      sourceFile: "packages/vue/src/components/TreeLink.vue",
+      sourceFile: "packages/vue/src/components/TLink.vue",
       storyFile: "apps/docs/src/stories/Link.stories.ts",
       storyTitle: "Components/Navigation/Link",
       manifestFile: "docs/ai/COMPONENTS/link.yaml",
@@ -3107,7 +3802,7 @@ var treeui_catalog_default = {
         },
         {
           name: "variant",
-          type: "TreeLinkVariant",
+          type: "TLinkVariant",
           default: "default",
           values: [
             "default",
@@ -3143,10 +3838,7 @@ var treeui_catalog_default = {
     },
     {
       name: "TMarkdownEditor",
-      legacyAlias: "TreeMarkdownEditor",
-      aliases: [
-        "TreeMarkdownEditor"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       category: "Form",
       status: "stable",
@@ -3163,7 +3855,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -3248,16 +3940,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TModal",
-      legacyAlias: "TreeModal",
-      aliases: [
-        "TreeModal"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "overlay",
       category: "Overlay",
       status: "available",
       purpose: "Accessible modal dialog for focused tasks and confirmations.",
-      sourceFile: "packages/vue/src/components/TreeModal.vue",
+      sourceFile: "packages/vue/src/components/TModal.vue",
       storyFile: "apps/docs/src/stories/Modal.stories.ts",
       storyTitle: "Components/Overlay/Modal",
       manifestFile: "docs/ai/COMPONENTS/modal.yaml",
@@ -3279,7 +3968,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -3399,16 +4088,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TMultiSelect",
-      legacyAlias: "TreeMultiSelect",
-      aliases: [
-        "TreeMultiSelect"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "form",
       category: "Data Entry",
       status: "available",
       purpose: "Searchable multi-select control that renders selected values as tags.",
-      sourceFile: "packages/vue/src/components/TreeMultiSelect.vue",
+      sourceFile: "packages/vue/src/components/TMultiSelect.vue",
       storyFile: "apps/docs/src/stories/MultiSelect.stories.ts",
       storyTitle: "Components/Data Entry/MultiSelect",
       manifestFile: "docs/ai/COMPONENTS/multi-select.yaml",
@@ -3420,7 +4106,7 @@ var treeui_catalog_default = {
         },
         {
           name: "options",
-          type: "TreeMultiSelectOption[]",
+          type: "TMultiSelectOption[]",
           default: "[]",
           note: "Array of `{ label, value, description?, keywords?, disabled? }`."
         },
@@ -3436,7 +4122,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -3561,18 +4247,15 @@ var treeui_catalog_default = {
     },
     {
       name: "TNavbar",
-      legacyAlias: "TreeAppBar",
       aliases: [
-        "TAppBar",
-        "TreeAppBar",
-        "TreeNavbar"
+        "TAppBar"
       ],
       package: "@treeui/vue",
       kind: "layout",
       category: "Layout",
       status: "available",
       purpose: "Top application bar with start, center, and end content areas.",
-      sourceFile: "packages/vue/src/components/TreeNavbar.vue",
+      sourceFile: "packages/vue/src/components/TNavbar.vue",
       storyFile: "apps/docs/src/stories/Navbar.stories.ts",
       storyTitle: "Components/Layout/Navbar",
       manifestFile: "docs/ai/COMPONENTS/navbar.yaml",
@@ -3584,7 +4267,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -3662,16 +4345,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TNavMenu",
-      legacyAlias: "TreeNavMenu",
-      aliases: [
-        "TreeNavMenu"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "navigation",
       category: "Layout",
       status: "available",
       purpose: "Vertical navigation menu with selection state, keyboard navigation, optional RouterLink rendering, and sidebar integration.",
-      sourceFile: "packages/vue/src/components/TreeNavMenu.vue",
+      sourceFile: "packages/vue/src/components/TNavMenu.vue",
       storyFile: "apps/docs/src/stories/NavMenu.stories.ts",
       storyTitle: "Components/Layout/NavMenu",
       manifestFile: "docs/ai/COMPONENTS/nav-menu.yaml",
@@ -3688,13 +4368,13 @@ var treeui_catalog_default = {
         },
         {
           name: "items",
-          type: "TreeNavMenuItem[]",
+          type: "TNavMenuItem[]",
           default: "[]",
           note: "Array of `{ label, value, shortLabel?, description?, icon?, to?, badge?, disabled? }`."
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -3769,25 +4449,23 @@ var treeui_catalog_default = {
       setup: {
         required: [],
         notes: [
-          "When nested inside `TSidebar`, `collapsed` can be inherited from the sidebar provider."
+          "When nested inside `TSidebar` or `TAppShell`, `collapsed` can be inherited from the sidebar provider."
         ]
       },
       recipes: [
+        "app-shell",
         "sidebar-shell"
       ]
     },
     {
       name: "TNumberInput",
-      legacyAlias: "TreeNumberInput",
-      aliases: [
-        "TreeNumberInput"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "form",
       category: "Data Entry",
       status: "available",
       purpose: "Numeric input with optional increment and decrement controls.",
-      sourceFile: "packages/vue/src/components/TreeNumberInput.vue",
+      sourceFile: "packages/vue/src/components/TNumberInput.vue",
       storyFile: "apps/docs/src/stories/NumberInput.stories.ts",
       storyTitle: "Components/Data Entry/NumberInput",
       manifestFile: "docs/ai/COMPONENTS/number-input.yaml",
@@ -3813,7 +4491,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -3888,16 +4566,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TPagination",
-      legacyAlias: "TreePagination",
-      aliases: [
-        "TreePagination"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "primitive",
       category: "Navigation",
       status: "available",
       purpose: "Page controls with previous/next navigation, numbered page buttons, and ellipsis for large page ranges. Supports v-model for the active page.\n",
-      sourceFile: "packages/vue/src/components/TreePagination.vue",
+      sourceFile: "packages/vue/src/components/TPagination.vue",
       storyFile: "apps/docs/src/stories/Pagination.stories.ts",
       storyTitle: "Components/Navigation/Pagination",
       manifestFile: "docs/ai/COMPONENTS/pagination.yaml",
@@ -3922,7 +4597,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -4004,10 +4679,7 @@ var treeui_catalog_default = {
     },
     {
       name: "TPopover",
-      legacyAlias: "TreePopover",
-      aliases: [
-        "TreePopover"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       category: "Overlay",
       status: "stable",
@@ -4110,10 +4782,7 @@ var treeui_catalog_default = {
     },
     {
       name: "TPricing",
-      legacyAlias: "TreePricing",
-      aliases: [
-        "TreePricing"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       status: "stable",
       description: "Grid wrapper that renders multiple PricingCard components from an array of plan objects.\n",
@@ -4129,7 +4798,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           description: "Size applied to all child pricing cards."
         },
@@ -4177,10 +4846,7 @@ var treeui_catalog_default = {
     },
     {
       name: "TPricingCard",
-      legacyAlias: "TreePricingCard",
-      aliases: [
-        "TreePricingCard"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       category: "Data Display",
       status: "stable",
@@ -4245,7 +4911,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           description: "Card size \u2014 affects padding, font sizes."
         },
@@ -4290,7 +4956,7 @@ var treeui_catalog_default = {
         "Uses <h3> for plan title.",
         'Feature list uses role="list" with <ul>/<li>.',
         'Feature icons are aria-hidden="true".',
-        "CTA button inherits TreeButton a11y (disabled, aria-busy)."
+        "CTA button inherits TButton a11y (disabled, aria-busy)."
       ],
       behavior: [],
       selection: {
@@ -4309,10 +4975,7 @@ var treeui_catalog_default = {
     },
     {
       name: "TProgress",
-      legacyAlias: "TreeProgress",
-      aliases: [
-        "TreeProgress"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       category: "Feedback",
       status: "draft",
@@ -4335,7 +4998,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -4373,15 +5036,12 @@ var treeui_catalog_default = {
     },
     {
       name: "TRadio",
-      legacyAlias: "TreeRadio",
-      aliases: [
-        "TreeRadio"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "primitive",
       status: "available",
       purpose: "Single radio option within a TRadioGroup; renders a native radio input.",
-      sourceFile: "packages/vue/src/components/TreeRadio.vue",
+      sourceFile: "packages/vue/src/components/TRadio.vue",
       manifestFile: "docs/ai/COMPONENTS/radio.yaml",
       props: [
         {
@@ -4401,7 +5061,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "inherited_from_group",
           values: [
             "sm",
@@ -4444,16 +5104,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TRadioGroup",
-      legacyAlias: "TreeRadioGroup",
-      aliases: [
-        "TreeRadioGroup"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "primitive",
       category: "Data Entry",
       status: "available",
       purpose: "Container for TRadio options; manages v-model for single-select from a group.",
-      sourceFile: "packages/vue/src/components/TreeRadioGroup.vue",
+      sourceFile: "packages/vue/src/components/TRadioGroup.vue",
       storyFile: "apps/docs/src/stories/Radio.stories.ts",
       storyTitle: "Components/Data Entry/Radio",
       manifestFile: "docs/ai/COMPONENTS/radio.yaml",
@@ -4480,7 +5137,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -4522,16 +5179,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TSelect",
-      legacyAlias: "TreeSelect",
-      aliases: [
-        "TreeSelect"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "primitive",
       category: "Data Entry",
       status: "available",
       purpose: "Custom styled dropdown select with listbox; controlled and uncontrolled via v-model and open/defaultOpen.",
-      sourceFile: "packages/vue/src/components/TreeSelect.vue",
+      sourceFile: "packages/vue/src/components/TSelect.vue",
       storyFile: "apps/docs/src/stories/Select.stories.ts",
       storyTitle: "Components/Data Entry/Select",
       manifestFile: "docs/ai/COMPONENTS/select.yaml",
@@ -4543,7 +5197,7 @@ var treeui_catalog_default = {
         },
         {
           name: "options",
-          type: "TreeSelectOption[]",
+          type: "TSelectOption[]",
           default: "[]",
           note: "Array of { label: string; value: string | number; disabled?: boolean }"
         },
@@ -4559,7 +5213,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -4626,7 +5280,8 @@ var treeui_catalog_default = {
         "check_icon_on_selected_option: true",
         "outside_click_closes_dropdown: true",
         "focus_restores_on_close: true",
-        "numeric_values_supported_without_string_coercion: true"
+        "numeric_values_supported_without_string_coercion: true",
+        "listbox_flips_above_trigger_when_space_below_is_insufficient: true"
       ],
       selection: {
         keywords: [
@@ -4659,20 +5314,19 @@ var treeui_catalog_default = {
           "Use `placeholder` when no selection has been made."
         ]
       },
-      recipes: []
+      recipes: [
+        "chart-surface"
+      ]
     },
     {
       name: "TSelectableList",
-      legacyAlias: "TreeSelectableList",
-      aliases: [
-        "TreeSelectableList"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "selection",
       category: "Navigation & Disclosure",
       status: "available",
       purpose: "Rich single-selection list for options with description and metadata.",
-      sourceFile: "packages/vue/src/components/TreeSelectableList.vue",
+      sourceFile: "packages/vue/src/components/TSelectableList.vue",
       storyFile: "apps/docs/src/stories/SelectableList.stories.ts",
       storyTitle: "Components/Navigation & Disclosure/SelectableList",
       manifestFile: "docs/ai/COMPONENTS/selectable-list.yaml",
@@ -4689,13 +5343,13 @@ var treeui_catalog_default = {
         },
         {
           name: "items",
-          type: "TreeSelectableListItem[]",
+          type: "TSelectableListItem[]",
           default: "[]",
           note: "Array of `{ label, value, description?, meta?, disabled? }`."
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -4772,16 +5426,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TSidebar",
-      legacyAlias: "TreeSidebar",
-      aliases: [
-        "TreeSidebar"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "layout",
       category: "Layout",
       status: "available",
       purpose: "Persistent or collapsible side shell for app navigation and secondary workspace controls.",
-      sourceFile: "packages/vue/src/components/TreeSidebar.vue",
+      sourceFile: "packages/vue/src/components/TSidebar.vue",
       storyFile: "apps/docs/src/stories/Sidebar.stories.ts",
       storyTitle: "Components/Layout/Sidebar",
       manifestFile: "docs/ai/COMPONENTS/sidebar.yaml",
@@ -4808,7 +5459,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -4818,7 +5469,7 @@ var treeui_catalog_default = {
         },
         {
           name: "side",
-          type: "TreeSidebarSide",
+          type: "TSidebarSide",
           default: "left",
           values: [
             "left",
@@ -4887,7 +5538,8 @@ var treeui_catalog_default = {
         "controlled_and_uncontrolled_collapsed_state: true",
         "provides_collapsed_state_to_descendants: true",
         "left_and_right_variants: true",
-        "exposes_slot_props_with_collapsed_state: true"
+        "exposes_slot_props_with_collapsed_state: true",
+        "collapsed_state_centers_header_and_footer_content: true"
       ],
       selection: {
         keywords: [
@@ -4912,7 +5564,8 @@ var treeui_catalog_default = {
         required: [],
         notes: [
           "Pair with `TNavMenu` for app-section navigation.",
-          "Use controlled `collapsed` state when the app shell persists layout preferences."
+          "Use controlled `collapsed` state when the app shell persists layout preferences.",
+          "Prefer `TAppShell` when you also want full-viewport sizing, a top header, and a responsive mobile drawer."
         ]
       },
       recipes: [
@@ -4921,16 +5574,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TSkeleton",
-      legacyAlias: "TreeSkeleton",
-      aliases: [
-        "TreeSkeleton"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "feedback",
       category: "Feedback",
       status: "available",
       purpose: "Placeholder shimmer for loading states. Renders an animated block that indicates content is being loaded.",
-      sourceFile: "packages/vue/src/components/TreeSkeleton.vue",
+      sourceFile: "packages/vue/src/components/TSkeleton.vue",
       storyFile: "apps/docs/src/stories/Skeleton.stories.ts",
       storyTitle: "Components/Feedback/Skeleton",
       manifestFile: "docs/ai/COMPONENTS/skeleton.yaml",
@@ -4986,24 +5636,144 @@ var treeui_catalog_default = {
       recipes: []
     },
     {
-      name: "TSpinner",
-      legacyAlias: "TreeSpinner",
-      aliases: [
-        "TreeSpinner"
+      name: "TSparkline",
+      aliases: [],
+      package: "@treeui/vue",
+      kind: "data-display",
+      category: "Data Display",
+      status: "available",
+      purpose: "Tiny, axis-less inline trend chart (line, area, or bar) sized for stat tiles, table cells, and running text.",
+      sourceFile: "packages/vue/src/components/TSparkline.vue",
+      storyFile: "apps/docs/src/stories/Sparkline.stories.ts",
+      storyTitle: "Components/Data Display/Sparkline",
+      manifestFile: "docs/ai/COMPONENTS/sparkline.yaml",
+      props: [
+        {
+          name: "data",
+          type: "number[]",
+          default: "[]"
+        },
+        {
+          name: "type",
+          type: "line | area | bar",
+          default: "line"
+        },
+        {
+          name: "color",
+          type: "string",
+          default: "var(--tree-color-chart-1)",
+          note: "Any CSS color."
+        },
+        {
+          name: "width",
+          type: "number",
+          default: "120"
+        },
+        {
+          name: "height",
+          type: "number",
+          default: "32"
+        },
+        {
+          name: "smooth",
+          type: "boolean",
+          default: "false",
+          note: "Curved line/area."
+        },
+        {
+          name: "strokeWidth",
+          type: "number",
+          default: "2",
+          note: "Line/area only."
+        },
+        {
+          name: "min",
+          type: "number",
+          default: "data min"
+        },
+        {
+          name: "max",
+          type: "number",
+          default: "data max"
+        },
+        {
+          name: "showLastPoint",
+          type: "boolean",
+          default: "false",
+          note: "Marker on the final point (line/area)."
+        },
+        {
+          name: "ariaLabel",
+          type: "string",
+          default: "Trend sparkline"
+        }
       ],
+      events: [],
+      slots: [],
+      a11y: [
+        "Renders role=img with an aria-label; pass a specific one for meaningful trends.",
+        "Pair with a visible number \u2014 a sparkline supplements a value, it does not replace it."
+      ],
+      behavior: [
+        "no_axes_or_legend: true",
+        "flat_series_renders_centered: true",
+        "scales_to_intrinsic_width_and_height: true"
+      ],
+      selection: {
+        keywords: [
+          "sparkline",
+          "mini chart",
+          "inline chart",
+          "micro trend",
+          "trend line",
+          "table chart"
+        ],
+        useWhen: [
+          "You want a compact trend beside a value, in a table cell, or inline in text.",
+          "No axes, legend, or tooltip are required."
+        ],
+        avoidWhen: [
+          "You need axes, multiple labeled series, or a tooltip \u2014 use TChart."
+        ],
+        alternatives: [
+          {
+            component: "TChart",
+            when: "The chart needs axes, a legend, or a tooltip."
+          },
+          {
+            component: "TStat",
+            when: "A single value with a trend badge is enough."
+          }
+        ]
+      },
+      setup: {
+        required: [],
+        notes: [
+          "Pass `data` as `number[]`; there are no axes, legend, or tooltip by design.",
+          "Size it with `width`/`height`; use it inside `TStat`, table cells, or text.",
+          "Always keep a visible number nearby \u2014 a sparkline supplements a value, it does not replace it."
+        ]
+      },
+      recipes: [
+        "metric-dashboard"
+      ]
+    },
+    {
+      name: "TSpinner",
+      aliases: [],
       package: "@treeui/vue",
       kind: "feedback",
       category: "Feedback",
       status: "available",
       purpose: "Accessible loading indicator.",
-      sourceFile: "packages/vue/src/components/TreeSpinner.vue",
+      sourceFile: "packages/vue/src/components/TSpinner.vue",
       storyFile: "apps/docs/src/stories/Spinner.stories.ts",
       storyTitle: "Components/Feedback/Spinner",
       manifestFile: "docs/ai/COMPONENTS/spinner.yaml",
       props: [
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -5039,16 +5809,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TStack",
-      legacyAlias: "TreeStack",
-      aliases: [
-        "TreeStack"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "layout",
       category: "Layout",
       status: "available",
       purpose: "One-dimensional spacing and alignment wrapper for vertical or horizontal compositions.",
-      sourceFile: "packages/vue/src/components/TreeStack.vue",
+      sourceFile: "packages/vue/src/components/TStack.vue",
       storyFile: "apps/docs/src/stories/Stack.stories.ts",
       storyTitle: "Components/Layout/Stack",
       manifestFile: "docs/ai/COMPONENTS/stack.yaml",
@@ -5060,7 +5827,7 @@ var treeui_catalog_default = {
         },
         {
           name: "direction",
-          type: "TreeStackDirection",
+          type: "TStackDirection",
           default: "vertical",
           values: [
             "vertical",
@@ -5140,16 +5907,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TStat",
-      legacyAlias: "TreeStat",
-      aliases: [
-        "TreeStat"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "data-display",
       category: "Data Display",
       status: "available",
       purpose: "Compact KPI display with label, value, trend, metadata, and optional icon.",
-      sourceFile: "packages/vue/src/components/TreeStat.vue",
+      sourceFile: "packages/vue/src/components/TStat.vue",
       storyFile: "apps/docs/src/stories/Stat.stories.ts",
       storyTitle: "Components/Data Display/Stat",
       manifestFile: "docs/ai/COMPONENTS/stat.yaml",
@@ -5176,7 +5940,7 @@ var treeui_catalog_default = {
         },
         {
           name: "tone",
-          type: "TreeStatTone",
+          type: "TStatTone",
           default: "neutral",
           values: [
             "neutral",
@@ -5188,7 +5952,7 @@ var treeui_catalog_default = {
         },
         {
           name: "trendDirection",
-          type: "TreeStatTrendDirection",
+          type: "TStatTrendDirection",
           default: "neutral",
           values: [
             "up",
@@ -5247,6 +6011,10 @@ var treeui_catalog_default = {
           {
             component: "TCard",
             when: "The content is not a metric."
+          },
+          {
+            component: "TSparkline",
+            when: "You want to show the metric's trend as an inline mini-chart."
           }
         ]
       },
@@ -5255,23 +6023,21 @@ var treeui_catalog_default = {
         notes: []
       },
       recipes: [
-        "stat-grid"
+        "stat-grid",
+        "metric-dashboard"
       ]
     },
     {
       name: "TSteps",
-      legacyAlias: "TreeStepper",
       aliases: [
-        "TStepper",
-        "TreeStepper",
-        "TreeSteps"
+        "TStepper"
       ],
       package: "@treeui/vue",
       kind: "navigation",
       category: "Navigation & Disclosure",
       status: "available",
       purpose: "Stepper component for visualizing workflow progress, with optional interactive selection.",
-      sourceFile: "packages/vue/src/components/TreeSteps.vue",
+      sourceFile: "packages/vue/src/components/TSteps.vue",
       storyFile: "apps/docs/src/stories/Steps.stories.ts",
       storyTitle: "Components/Navigation & Disclosure/Steps",
       manifestFile: "docs/ai/COMPONENTS/steps.yaml",
@@ -5288,13 +6054,13 @@ var treeui_catalog_default = {
         },
         {
           name: "items",
-          type: "TreeStepItem[]",
+          type: "TStepItem[]",
           default: "[]",
           note: "Array of `{ label, value, description?, meta?, status?, disabled? }`."
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -5304,7 +6070,7 @@ var treeui_catalog_default = {
         },
         {
           name: "orientation",
-          type: "TreeStepOrientation",
+          type: "TStepOrientation",
           default: "horizontal",
           values: [
             "horizontal",
@@ -5367,16 +6133,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TSwitch",
-      legacyAlias: "TreeSwitch",
-      aliases: [
-        "TreeSwitch"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "primitive",
       category: "Data Entry",
       status: "available",
       purpose: "On/off toggle; semantic alternative to checkbox for settings. Supports v-model via modelValue.",
-      sourceFile: "packages/vue/src/components/TreeSwitch.vue",
+      sourceFile: "packages/vue/src/components/TSwitch.vue",
       storyFile: "apps/docs/src/stories/Switch.stories.ts",
       storyTitle: "Components/Data Entry/Switch",
       manifestFile: "docs/ai/COMPONENTS/switch.yaml",
@@ -5388,7 +6151,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -5459,21 +6222,18 @@ var treeui_catalog_default = {
     },
     {
       name: "TTable",
-      legacyAlias: "TreeTable",
-      aliases: [
-        "TreeTable"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       category: "Data Display",
       description: "Sortable, accessible data table with column definitions and row data.",
-      sourceFile: "packages/vue/src/components/TreeTable.vue",
+      sourceFile: "packages/vue/src/components/TTable.vue",
       storyFile: "apps/docs/src/stories/Table.stories.ts",
       storyTitle: "Components/Data Display/Table",
       manifestFile: "docs/ai/COMPONENTS/table.yaml",
       props: [
         {
           name: "columns",
-          type: "TreeTableColumn[]",
+          type: "TTableColumn[]",
           required: true,
           description: "Array of column definitions with key, label, sortable, align, and width."
         },
@@ -5485,7 +6245,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -5495,7 +6255,7 @@ var treeui_catalog_default = {
         },
         {
           name: "sortBy",
-          type: "TreeTableSortState",
+          type: "TTableSortState",
           required: false,
           description: "Controlled sort state. When provided, overrides internal sort tracking."
         }
@@ -5504,7 +6264,7 @@ var treeui_catalog_default = {
         {
           name: "sort",
           description: "Emitted when a sortable column header is clicked.",
-          payload: "TreeTableSortState"
+          payload: "TTableSortState"
         }
       ],
       slots: [
@@ -5563,16 +6323,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TTabs",
-      legacyAlias: "TreeTabs",
-      aliases: [
-        "TreeTabs"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "navigation",
       category: "Navigation",
       status: "available",
       purpose: "Tabbed panel navigation with full keyboard support and automatic/manual activation modes.",
-      sourceFile: "packages/vue/src/components/TreeTabs.vue",
+      sourceFile: "packages/vue/src/components/TTabs.vue",
       storyFile: "apps/docs/src/stories/Tabs.stories.ts",
       storyTitle: "Components/Navigation/Tabs",
       manifestFile: "docs/ai/COMPONENTS/tabs.yaml",
@@ -5591,7 +6348,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -5672,21 +6429,18 @@ var treeui_catalog_default = {
     },
     {
       name: "TTag",
-      legacyAlias: "TreeTag",
-      aliases: [
-        "TreeTag"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       category: "Data Display",
       description: "Removable label/chip for filters and selections.",
-      sourceFile: "packages/vue/src/components/TreeTag.vue",
+      sourceFile: "packages/vue/src/components/TTag.vue",
       storyFile: "apps/docs/src/stories/Tag.stories.ts",
       storyTitle: "Components/Data Display/Tag",
       manifestFile: "docs/ai/COMPONENTS/tag.yaml",
       props: [
         {
           name: "variant",
-          type: "TreeTagVariant",
+          type: "TTagVariant",
           default: "soft",
           values: [
             "solid",
@@ -5696,7 +6450,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -5755,16 +6509,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TTextarea",
-      legacyAlias: "TreeTextarea",
-      aliases: [
-        "TreeTextarea"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "primitive",
       category: "Data Entry",
       status: "available",
       purpose: "Multi-line text field with size, loading, invalid states, and auto-grow option.",
-      sourceFile: "packages/vue/src/components/TreeTextarea.vue",
+      sourceFile: "packages/vue/src/components/TTextarea.vue",
       storyFile: "apps/docs/src/stories/Textarea.stories.ts",
       storyTitle: "Components/Data Entry/Textarea",
       manifestFile: "docs/ai/COMPONENTS/textarea.yaml",
@@ -5776,7 +6527,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -5861,28 +6612,25 @@ var treeui_catalog_default = {
     },
     {
       name: "TTimeline",
-      legacyAlias: "TreeTimeline",
-      aliases: [
-        "TreeTimeline"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "data_display",
       status: "available",
       purpose: "Vertical timeline for activity history, audits, release events, and chronological product updates.",
-      sourceFile: "packages/vue/src/components/TreeTimeline.vue",
+      sourceFile: "packages/vue/src/components/TTimeline.vue",
       storyFile: "apps/docs/src/stories/Timeline.stories.ts",
       storyTitle: "Release queued for review",
       manifestFile: "docs/ai/COMPONENTS/timeline.yaml",
       props: [
         {
           name: "items",
-          type: "TreeTimelineItem[]",
+          type: "TTimelineItem[]",
           default: "[]",
           note: "Array of { id?: string | number; title: string; description?: string; meta?: string; timestamp?: string; datetime?: string; tone?: 'neutral' | 'brand' | 'success' | 'warning' | 'danger' }"
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -5924,15 +6672,12 @@ var treeui_catalog_default = {
     },
     {
       name: "TToast",
-      legacyAlias: "TreeToast",
-      aliases: [
-        "TreeToast"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "feedback",
       status: "available",
       purpose: "Ephemeral notification stack driven by a composable. Renders toast items inside a positioned container with auto-dismiss and manual close.",
-      sourceFile: "packages/vue/src/components/TreeToast.vue",
+      sourceFile: "packages/vue/src/components/TToast.vue",
       manifestFile: "docs/ai/COMPONENTS/toast.yaml",
       props: [],
       events: [
@@ -5990,16 +6735,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TToggleGroup",
-      legacyAlias: "TreeToggleGroup",
-      aliases: [
-        "TreeToggleGroup"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "selection",
       category: "Data Entry",
       status: "available",
       purpose: "Segmented button group for single or multiple visible choices.",
-      sourceFile: "packages/vue/src/components/TreeToggleGroup.vue",
+      sourceFile: "packages/vue/src/components/TToggleGroup.vue",
       storyFile: "apps/docs/src/stories/ToggleGroup.stories.ts",
       storyTitle: "Components/Data Entry/ToggleGroup",
       manifestFile: "docs/ai/COMPONENTS/toggle-group.yaml",
@@ -6011,13 +6753,13 @@ var treeui_catalog_default = {
         },
         {
           name: "options",
-          type: "TreeToggleGroupOption[]",
+          type: "TToggleGroupOption[]",
           default: "[]",
           note: "Array of `{ label, value, disabled? }`."
         },
         {
           name: "selectionMode",
-          type: "TreeToggleGroupSelectionMode",
+          type: "TToggleGroupSelectionMode",
           default: "single",
           values: [
             "single",
@@ -6026,7 +6768,7 @@ var treeui_catalog_default = {
         },
         {
           name: "size",
-          type: "TreeSize",
+          type: "TSize",
           default: "md",
           values: [
             "sm",
@@ -6036,7 +6778,7 @@ var treeui_catalog_default = {
         },
         {
           name: "variant",
-          type: "TreeToggleGroupVariant",
+          type: "TToggleGroupVariant",
           default: "outline",
           values: [
             "outline",
@@ -6110,16 +6852,13 @@ var treeui_catalog_default = {
     },
     {
       name: "TTooltip",
-      legacyAlias: "TreeTooltip",
-      aliases: [
-        "TreeTooltip"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "overlay",
       category: "Overlay",
       status: "available",
       purpose: "Small contextual overlay shown on hover or focus.",
-      sourceFile: "packages/vue/src/components/TreeTooltip.vue",
+      sourceFile: "packages/vue/src/components/TTooltip.vue",
       storyFile: "apps/docs/src/stories/Tooltip.stories.ts",
       storyTitle: "Components/Overlay/Tooltip",
       manifestFile: "docs/ai/COMPONENTS/tooltip.yaml",
@@ -6146,7 +6885,7 @@ var treeui_catalog_default = {
         },
         {
           name: "side",
-          type: "TreeTooltipSide",
+          type: "TTooltipSide",
           default: "top",
           values: [
             "top",
@@ -6225,18 +6964,15 @@ var treeui_catalog_default = {
     },
     {
       name: "TTreeView",
-      legacyAlias: "TreeTreeView",
-      aliases: [
-        "TreeTreeView"
-      ],
+      aliases: [],
       package: "@treeui/vue",
       kind: "selection",
       category: "Navigation & Disclosure",
       status: "available",
       purpose: "Hierarchical tree view with expansion, keyboard navigation, and single or multiple selection.",
-      sourceFile: "packages/vue/src/components/TreeTreeView.vue",
+      sourceFile: "packages/vue/src/components/TTreeView.vue",
       storyFile: "apps/docs/src/stories/TreeView.stories.ts",
-      storyTitle: "Components/Navigation & Disclosure/TreeView",
+      storyTitle: "Components/Navigation & Disclosure/TView",
       manifestFile: "docs/ai/COMPONENTS/tree-view.yaml",
       props: [
         {
@@ -6251,13 +6987,13 @@ var treeui_catalog_default = {
         },
         {
           name: "nodes",
-          type: "TreeTreeViewNode[]",
+          type: "TTreeViewNode[]",
           default: "[]",
           note: "Array of `{ id, label, description?, meta?, disabled?, children? }`."
         },
         {
           name: "selectionMode",
-          type: "TreeTreeViewSelectionMode",
+          type: "TTreeViewSelectionMode",
           default: "single",
           values: [
             "single",
@@ -6928,11 +7664,9 @@ var buildCatalogFromRepo = (repoRoot) => {
       const setup2 = normalizeSetupEntry(componentSetup[name]);
       const aliases = Array.from(
         new Set(
-          [
-            ...normalizeStringList(document.aliases),
-            aliasMap[name],
-            name.startsWith("T") ? `Tree${name.slice(1)}` : void 0
-          ].filter((value) => Boolean(value))
+          [...normalizeStringList(document.aliases), aliasMap[name]].filter(
+            (value) => Boolean(value)
+          )
         )
       );
       const componentRecipes = recipes.filter((recipe) => recipe.compose.includes(name)).map((recipe) => recipe.id);
@@ -7136,7 +7870,7 @@ var createTreeuiMcpServer = () => {
         inputSchema: {
           type: "object",
           properties: {
-            name: { type: "string", description: "Component name or alias, such as TSelect or TreeSelect." }
+            name: { type: "string", description: "Component name or alias, such as TSelect or TSelect." }
           },
           required: ["name"]
         }