@treeui/mcp 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +22 -0
- package/dist/{chunk-SNF26WKA.js → chunk-LDH2IV6Q.js} +219 -21
- package/dist/cli.cjs +219 -21
- package/dist/cli.js +1 -1
- package/dist/index.cjs +219 -21
- package/dist/index.js +1 -1
- package/package.json +6 -6
package/LICENSE
ADDED
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 TreeUI
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
|
22
|
+
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
// src/generated/treeui.catalog.json
|
|
2
2
|
var treeui_catalog_default = {
|
|
3
|
-
generatedAt: "2026-04-
|
|
3
|
+
generatedAt: "2026-04-10T16:42:52.904Z",
|
|
4
4
|
packageName: "@treeui/vue",
|
|
5
|
-
packageVersion: "0.
|
|
5
|
+
packageVersion: "0.6.1",
|
|
6
6
|
decisionGuides: [
|
|
7
7
|
{
|
|
8
8
|
id: "single-choice",
|
|
@@ -279,6 +279,37 @@ var treeui_catalog_default = {
|
|
|
279
279
|
"Use `TCard` only when the stat needs additional arbitrary content."
|
|
280
280
|
]
|
|
281
281
|
},
|
|
282
|
+
{
|
|
283
|
+
id: "color-field",
|
|
284
|
+
name: "Color field",
|
|
285
|
+
useWhen: [
|
|
286
|
+
"A form needs a color selection control without adding a dedicated TreeUI component."
|
|
287
|
+
],
|
|
288
|
+
compose: [
|
|
289
|
+
"TFormField",
|
|
290
|
+
'native input[type="color"]'
|
|
291
|
+
],
|
|
292
|
+
notes: [
|
|
293
|
+
"Wrap the native color input with `TFormField` for label, hint, and error handling."
|
|
294
|
+
]
|
|
295
|
+
},
|
|
296
|
+
{
|
|
297
|
+
id: "tag-input",
|
|
298
|
+
name: "Tag input field",
|
|
299
|
+
useWhen: [
|
|
300
|
+
"A form needs freeform tag entry such as domains, labels, or emails."
|
|
301
|
+
],
|
|
302
|
+
compose: [
|
|
303
|
+
"TFormField",
|
|
304
|
+
"TInput",
|
|
305
|
+
"TTag",
|
|
306
|
+
"TStack"
|
|
307
|
+
],
|
|
308
|
+
notes: [
|
|
309
|
+
"Keep the draft value in app state and add a tag on Enter or separator keys.",
|
|
310
|
+
"Use removable `TTag` items below or inside the field wrapper."
|
|
311
|
+
]
|
|
312
|
+
},
|
|
282
313
|
{
|
|
283
314
|
id: "data-listing",
|
|
284
315
|
name: "Data table with paging",
|
|
@@ -291,7 +322,23 @@ var treeui_catalog_default = {
|
|
|
291
322
|
"TStack"
|
|
292
323
|
],
|
|
293
324
|
notes: [
|
|
294
|
-
"`TTable` stays focused on structured listing; filters and toolbars compose around it."
|
|
325
|
+
"`TTable` stays focused on structured listing; filters and toolbars compose around it.",
|
|
326
|
+
"Use `#cell-{key}` slots when a column renders derived or rich content."
|
|
327
|
+
]
|
|
328
|
+
},
|
|
329
|
+
{
|
|
330
|
+
id: "router-backed-tabs",
|
|
331
|
+
name: "Router-backed tabs",
|
|
332
|
+
useWhen: [
|
|
333
|
+
"Tabs should deep-link to app state without turning into primary route navigation."
|
|
334
|
+
],
|
|
335
|
+
compose: [
|
|
336
|
+
"TTabs",
|
|
337
|
+
"app router state"
|
|
338
|
+
],
|
|
339
|
+
notes: [
|
|
340
|
+
"Bind `v-model` to a route param, query param, or derived route name in the app layer.",
|
|
341
|
+
"Prefer `TNavMenu` when the selection becomes app-section navigation instead of in-place panel switching."
|
|
295
342
|
]
|
|
296
343
|
},
|
|
297
344
|
{
|
|
@@ -309,6 +356,21 @@ var treeui_catalog_default = {
|
|
|
309
356
|
"Use `TToast` only for the post-confirm success feedback."
|
|
310
357
|
]
|
|
311
358
|
},
|
|
359
|
+
{
|
|
360
|
+
id: "chart-surface",
|
|
361
|
+
name: "Chart surface",
|
|
362
|
+
useWhen: [
|
|
363
|
+
"A screen needs data visualization, but the charting engine should stay external to TreeUI."
|
|
364
|
+
],
|
|
365
|
+
compose: [
|
|
366
|
+
"TCard",
|
|
367
|
+
"TStack",
|
|
368
|
+
"external chart library"
|
|
369
|
+
],
|
|
370
|
+
notes: [
|
|
371
|
+
"Use TreeUI for the surrounding surface, headings, badges, filters, and empty/loading states."
|
|
372
|
+
]
|
|
373
|
+
},
|
|
312
374
|
{
|
|
313
375
|
id: "anchored-help",
|
|
314
376
|
name: "Anchored help affordance",
|
|
@@ -409,7 +471,7 @@ var treeui_catalog_default = {
|
|
|
409
471
|
TSelect: {
|
|
410
472
|
required: [],
|
|
411
473
|
notes: [
|
|
412
|
-
"Pass `options` as `{ label, value, disabled? }[]`.",
|
|
474
|
+
"Pass `options` as `{ label, value, disabled? }[]` where `value` can be `string` or `number`.",
|
|
413
475
|
"Use `placeholder` when no selection has been made."
|
|
414
476
|
]
|
|
415
477
|
},
|
|
@@ -487,6 +549,19 @@ var treeui_catalog_default = {
|
|
|
487
549
|
notes: [
|
|
488
550
|
"Pass `plans` matching the same core fields used by `TPricingCard`."
|
|
489
551
|
]
|
|
552
|
+
},
|
|
553
|
+
TModal: {
|
|
554
|
+
required: [],
|
|
555
|
+
notes: [
|
|
556
|
+
"Use `v-model:open` for the idiomatic Vue controlled pattern."
|
|
557
|
+
]
|
|
558
|
+
},
|
|
559
|
+
TBreadcrumb: {
|
|
560
|
+
required: [],
|
|
561
|
+
notes: [
|
|
562
|
+
"Use `href` for native links.",
|
|
563
|
+
"Use `to` when the app has vue-router and breadcrumb items should render RouterLink."
|
|
564
|
+
]
|
|
490
565
|
}
|
|
491
566
|
},
|
|
492
567
|
appPatterns: {
|
|
@@ -774,6 +849,19 @@ var treeui_catalog_default = {
|
|
|
774
849
|
"danger"
|
|
775
850
|
]
|
|
776
851
|
},
|
|
852
|
+
{
|
|
853
|
+
name: "tone",
|
|
854
|
+
type: "TreeBadgeTone",
|
|
855
|
+
default: "neutral",
|
|
856
|
+
values: [
|
|
857
|
+
"neutral",
|
|
858
|
+
"success",
|
|
859
|
+
"warning",
|
|
860
|
+
"danger",
|
|
861
|
+
"info"
|
|
862
|
+
],
|
|
863
|
+
description: "Optional semantic tone layered on top of the visual variant."
|
|
864
|
+
},
|
|
777
865
|
{
|
|
778
866
|
name: "size",
|
|
779
867
|
type: "TreeSize",
|
|
@@ -858,7 +946,10 @@ var treeui_catalog_default = {
|
|
|
858
946
|
},
|
|
859
947
|
setup: {
|
|
860
948
|
required: [],
|
|
861
|
-
notes: [
|
|
949
|
+
notes: [
|
|
950
|
+
"Use `href` for native links.",
|
|
951
|
+
"Use `to` when the app has vue-router and breadcrumb items should render RouterLink."
|
|
952
|
+
]
|
|
862
953
|
},
|
|
863
954
|
recipes: []
|
|
864
955
|
},
|
|
@@ -988,7 +1079,8 @@ var treeui_catalog_default = {
|
|
|
988
1079
|
values: [
|
|
989
1080
|
"outline",
|
|
990
1081
|
"soft",
|
|
991
|
-
"solid"
|
|
1082
|
+
"solid",
|
|
1083
|
+
"inset"
|
|
992
1084
|
]
|
|
993
1085
|
},
|
|
994
1086
|
{
|
|
@@ -1000,6 +1092,12 @@ var treeui_catalog_default = {
|
|
|
1000
1092
|
"md",
|
|
1001
1093
|
"lg"
|
|
1002
1094
|
]
|
|
1095
|
+
},
|
|
1096
|
+
{
|
|
1097
|
+
name: "title",
|
|
1098
|
+
type: "string",
|
|
1099
|
+
default: "undefined",
|
|
1100
|
+
description: "Optional card heading rendered inside the header area."
|
|
1003
1101
|
}
|
|
1004
1102
|
],
|
|
1005
1103
|
events: [],
|
|
@@ -1007,6 +1105,9 @@ var treeui_catalog_default = {
|
|
|
1007
1105
|
{
|
|
1008
1106
|
name: "header"
|
|
1009
1107
|
},
|
|
1108
|
+
{
|
|
1109
|
+
name: "actions"
|
|
1110
|
+
},
|
|
1010
1111
|
{
|
|
1011
1112
|
name: "default"
|
|
1012
1113
|
},
|
|
@@ -1047,7 +1148,9 @@ var treeui_catalog_default = {
|
|
|
1047
1148
|
required: [],
|
|
1048
1149
|
notes: []
|
|
1049
1150
|
},
|
|
1050
|
-
recipes: [
|
|
1151
|
+
recipes: [
|
|
1152
|
+
"chart-surface"
|
|
1153
|
+
]
|
|
1051
1154
|
},
|
|
1052
1155
|
{
|
|
1053
1156
|
name: "TCheckbox",
|
|
@@ -2693,6 +2796,8 @@ var treeui_catalog_default = {
|
|
|
2693
2796
|
"form-field-input",
|
|
2694
2797
|
"searchable-multi-choice",
|
|
2695
2798
|
"date-range-form",
|
|
2799
|
+
"color-field",
|
|
2800
|
+
"tag-input",
|
|
2696
2801
|
"hierarchy-picker"
|
|
2697
2802
|
]
|
|
2698
2803
|
},
|
|
@@ -2910,9 +3015,85 @@ var treeui_catalog_default = {
|
|
|
2910
3015
|
notes: []
|
|
2911
3016
|
},
|
|
2912
3017
|
recipes: [
|
|
2913
|
-
"form-field-input"
|
|
3018
|
+
"form-field-input",
|
|
3019
|
+
"tag-input"
|
|
2914
3020
|
]
|
|
2915
3021
|
},
|
|
3022
|
+
{
|
|
3023
|
+
name: "TLink",
|
|
3024
|
+
legacyAlias: "TreeLink",
|
|
3025
|
+
aliases: [
|
|
3026
|
+
"TreeLink"
|
|
3027
|
+
],
|
|
3028
|
+
package: "@treeui/vue",
|
|
3029
|
+
kind: "navigation",
|
|
3030
|
+
category: "Navigation",
|
|
3031
|
+
status: "available",
|
|
3032
|
+
purpose: "Inline link with consistent styling, optional RouterLink rendering, and external link support.",
|
|
3033
|
+
sourceFile: "packages/vue/src/components/TreeLink.vue",
|
|
3034
|
+
storyFile: "apps/docs/src/stories/Link.stories.ts",
|
|
3035
|
+
storyTitle: "Components/Navigation/Link",
|
|
3036
|
+
manifestFile: "docs/ai/COMPONENTS/link.yaml",
|
|
3037
|
+
props: [
|
|
3038
|
+
{
|
|
3039
|
+
name: "to",
|
|
3040
|
+
type: "string | Record<string, unknown>",
|
|
3041
|
+
default: "undefined",
|
|
3042
|
+
description: "Route target. When provided and vue-router is available, renders RouterLink."
|
|
3043
|
+
},
|
|
3044
|
+
{
|
|
3045
|
+
name: "href",
|
|
3046
|
+
type: "string",
|
|
3047
|
+
default: "undefined",
|
|
3048
|
+
description: "Native href for anchor elements. Ignored when `to` is provided with vue-router."
|
|
3049
|
+
},
|
|
3050
|
+
{
|
|
3051
|
+
name: "external",
|
|
3052
|
+
type: "boolean",
|
|
3053
|
+
default: "false",
|
|
3054
|
+
description: "Opens link in new tab with rel='noopener noreferrer'."
|
|
3055
|
+
},
|
|
3056
|
+
{
|
|
3057
|
+
name: "disabled",
|
|
3058
|
+
type: "boolean",
|
|
3059
|
+
default: "false"
|
|
3060
|
+
},
|
|
3061
|
+
{
|
|
3062
|
+
name: "variant",
|
|
3063
|
+
type: "TreeLinkVariant",
|
|
3064
|
+
default: "default",
|
|
3065
|
+
values: [
|
|
3066
|
+
"default",
|
|
3067
|
+
"muted",
|
|
3068
|
+
"danger"
|
|
3069
|
+
]
|
|
3070
|
+
}
|
|
3071
|
+
],
|
|
3072
|
+
events: [],
|
|
3073
|
+
slots: [
|
|
3074
|
+
{
|
|
3075
|
+
name: "default"
|
|
3076
|
+
}
|
|
3077
|
+
],
|
|
3078
|
+
a11y: [
|
|
3079
|
+
"semantic_element: a (or RouterLink, or span when disabled)",
|
|
3080
|
+
"aria_disabled: set when disabled",
|
|
3081
|
+
"tabindex: -1 when disabled",
|
|
3082
|
+
"focus_visible: true"
|
|
3083
|
+
],
|
|
3084
|
+
behavior: [],
|
|
3085
|
+
selection: {
|
|
3086
|
+
keywords: [],
|
|
3087
|
+
useWhen: [],
|
|
3088
|
+
avoidWhen: [],
|
|
3089
|
+
alternatives: []
|
|
3090
|
+
},
|
|
3091
|
+
setup: {
|
|
3092
|
+
required: [],
|
|
3093
|
+
notes: []
|
|
3094
|
+
},
|
|
3095
|
+
recipes: []
|
|
3096
|
+
},
|
|
2916
3097
|
{
|
|
2917
3098
|
name: "TMarkdownEditor",
|
|
2918
3099
|
legacyAlias: "TreeMarkdownEditor",
|
|
@@ -3163,7 +3344,9 @@ var treeui_catalog_default = {
|
|
|
3163
3344
|
},
|
|
3164
3345
|
setup: {
|
|
3165
3346
|
required: [],
|
|
3166
|
-
notes: [
|
|
3347
|
+
notes: [
|
|
3348
|
+
"Use `v-model:open` for the idiomatic Vue controlled pattern."
|
|
3349
|
+
]
|
|
3167
3350
|
},
|
|
3168
3351
|
recipes: []
|
|
3169
3352
|
},
|
|
@@ -3440,7 +3623,7 @@ var treeui_catalog_default = {
|
|
|
3440
3623
|
kind: "navigation",
|
|
3441
3624
|
category: "Layout",
|
|
3442
3625
|
status: "available",
|
|
3443
|
-
purpose: "
|
|
3626
|
+
purpose: "Vertical navigation menu with selection state, keyboard navigation, optional RouterLink rendering, and sidebar integration.",
|
|
3444
3627
|
sourceFile: "packages/vue/src/components/TreeNavMenu.vue",
|
|
3445
3628
|
storyFile: "apps/docs/src/stories/NavMenu.stories.ts",
|
|
3446
3629
|
storyTitle: "Components/Layout/NavMenu",
|
|
@@ -3460,7 +3643,7 @@ var treeui_catalog_default = {
|
|
|
3460
3643
|
name: "items",
|
|
3461
3644
|
type: "TreeNavMenuItem[]",
|
|
3462
3645
|
default: "[]",
|
|
3463
|
-
note: "Array of `{ label, value, shortLabel?, description?, badge?, disabled? }`."
|
|
3646
|
+
note: "Array of `{ label, value, shortLabel?, description?, icon?, to?, badge?, disabled? }`."
|
|
3464
3647
|
},
|
|
3465
3648
|
{
|
|
3466
3649
|
name: "size",
|
|
@@ -3504,7 +3687,9 @@ var treeui_catalog_default = {
|
|
|
3504
3687
|
"roving_focus: true",
|
|
3505
3688
|
"home_end_navigation: true",
|
|
3506
3689
|
"arrow_navigation: true",
|
|
3507
|
-
"activation_keys_select_item: true"
|
|
3690
|
+
"activation_keys_select_item: true",
|
|
3691
|
+
"aria_current: page on selected item",
|
|
3692
|
+
"aria_disabled: on link items when disabled"
|
|
3508
3693
|
],
|
|
3509
3694
|
behavior: [
|
|
3510
3695
|
"can_be_controlled_or_uncontrolled: true",
|
|
@@ -4306,14 +4491,14 @@ var treeui_catalog_default = {
|
|
|
4306
4491
|
props: [
|
|
4307
4492
|
{
|
|
4308
4493
|
name: "modelValue",
|
|
4309
|
-
type: "string",
|
|
4494
|
+
type: "string | number",
|
|
4310
4495
|
default: ""
|
|
4311
4496
|
},
|
|
4312
4497
|
{
|
|
4313
4498
|
name: "options",
|
|
4314
4499
|
type: "TreeSelectOption[]",
|
|
4315
4500
|
default: "[]",
|
|
4316
|
-
note: "Array of { label: string; value: string; disabled?: boolean }"
|
|
4501
|
+
note: "Array of { label: string; value: string | number; disabled?: boolean }"
|
|
4317
4502
|
},
|
|
4318
4503
|
{
|
|
4319
4504
|
name: "open",
|
|
@@ -4387,13 +4572,14 @@ var treeui_catalog_default = {
|
|
|
4387
4572
|
"home_end_navigation: true"
|
|
4388
4573
|
],
|
|
4389
4574
|
behavior: [
|
|
4390
|
-
"update_payload_type: string",
|
|
4575
|
+
"update_payload_type: string | number",
|
|
4391
4576
|
"loading_does_not_disable_by_itself: true",
|
|
4392
4577
|
"placeholder_shown_as_muted_text: true",
|
|
4393
4578
|
"chevron_rotates_when_open: true",
|
|
4394
4579
|
"check_icon_on_selected_option: true",
|
|
4395
4580
|
"outside_click_closes_dropdown: true",
|
|
4396
|
-
"focus_restores_on_close: true"
|
|
4581
|
+
"focus_restores_on_close: true",
|
|
4582
|
+
"numeric_values_supported_without_string_coercion: true"
|
|
4397
4583
|
],
|
|
4398
4584
|
selection: {
|
|
4399
4585
|
keywords: [
|
|
@@ -4422,7 +4608,7 @@ var treeui_catalog_default = {
|
|
|
4422
4608
|
setup: {
|
|
4423
4609
|
required: [],
|
|
4424
4610
|
notes: [
|
|
4425
|
-
"Pass `options` as `{ label, value, disabled? }[]`.",
|
|
4611
|
+
"Pass `options` as `{ label, value, disabled? }[]` where `value` can be `string` or `number`.",
|
|
4426
4612
|
"Use `placeholder` when no selection has been made."
|
|
4427
4613
|
]
|
|
4428
4614
|
},
|
|
@@ -4900,7 +5086,9 @@ var treeui_catalog_default = {
|
|
|
4900
5086
|
notes: []
|
|
4901
5087
|
},
|
|
4902
5088
|
recipes: [
|
|
4903
|
-
"
|
|
5089
|
+
"tag-input",
|
|
5090
|
+
"data-listing",
|
|
5091
|
+
"chart-surface"
|
|
4904
5092
|
]
|
|
4905
5093
|
},
|
|
4906
5094
|
{
|
|
@@ -4960,6 +5148,11 @@ var treeui_catalog_default = {
|
|
|
4960
5148
|
"down",
|
|
4961
5149
|
"neutral"
|
|
4962
5150
|
]
|
|
5151
|
+
},
|
|
5152
|
+
{
|
|
5153
|
+
name: "loading",
|
|
5154
|
+
type: "boolean",
|
|
5155
|
+
default: "false"
|
|
4963
5156
|
}
|
|
4964
5157
|
],
|
|
4965
5158
|
events: [],
|
|
@@ -4987,7 +5180,8 @@ var treeui_catalog_default = {
|
|
|
4987
5180
|
behavior: [
|
|
4988
5181
|
"value_and_trend_are_optional: true",
|
|
4989
5182
|
"icon_slot_adds_visual_emphasis: true",
|
|
4990
|
-
"trend_indicator_changes_with_direction: true"
|
|
5183
|
+
"trend_indicator_changes_with_direction: true",
|
|
5184
|
+
"loading_renders_internal_skeleton_placeholders: true"
|
|
4991
5185
|
],
|
|
4992
5186
|
selection: {
|
|
4993
5187
|
keywords: [
|
|
@@ -5425,7 +5619,9 @@ var treeui_catalog_default = {
|
|
|
5425
5619
|
required: [],
|
|
5426
5620
|
notes: []
|
|
5427
5621
|
},
|
|
5428
|
-
recipes: [
|
|
5622
|
+
recipes: [
|
|
5623
|
+
"router-backed-tabs"
|
|
5624
|
+
]
|
|
5429
5625
|
},
|
|
5430
5626
|
{
|
|
5431
5627
|
name: "TTag",
|
|
@@ -5506,7 +5702,9 @@ var treeui_catalog_default = {
|
|
|
5506
5702
|
required: [],
|
|
5507
5703
|
notes: []
|
|
5508
5704
|
},
|
|
5509
|
-
recipes: [
|
|
5705
|
+
recipes: [
|
|
5706
|
+
"tag-input"
|
|
5707
|
+
]
|
|
5510
5708
|
},
|
|
5511
5709
|
{
|
|
5512
5710
|
name: "TTextarea",
|
package/dist/cli.cjs
CHANGED
|
@@ -34,9 +34,9 @@ var import_server = require("@modelcontextprotocol/sdk/server/index.js");
|
|
|
34
34
|
|
|
35
35
|
// src/generated/treeui.catalog.json
|
|
36
36
|
var treeui_catalog_default = {
|
|
37
|
-
generatedAt: "2026-04-
|
|
37
|
+
generatedAt: "2026-04-10T16:42:52.904Z",
|
|
38
38
|
packageName: "@treeui/vue",
|
|
39
|
-
packageVersion: "0.
|
|
39
|
+
packageVersion: "0.6.1",
|
|
40
40
|
decisionGuides: [
|
|
41
41
|
{
|
|
42
42
|
id: "single-choice",
|
|
@@ -313,6 +313,37 @@ var treeui_catalog_default = {
|
|
|
313
313
|
"Use `TCard` only when the stat needs additional arbitrary content."
|
|
314
314
|
]
|
|
315
315
|
},
|
|
316
|
+
{
|
|
317
|
+
id: "color-field",
|
|
318
|
+
name: "Color field",
|
|
319
|
+
useWhen: [
|
|
320
|
+
"A form needs a color selection control without adding a dedicated TreeUI component."
|
|
321
|
+
],
|
|
322
|
+
compose: [
|
|
323
|
+
"TFormField",
|
|
324
|
+
'native input[type="color"]'
|
|
325
|
+
],
|
|
326
|
+
notes: [
|
|
327
|
+
"Wrap the native color input with `TFormField` for label, hint, and error handling."
|
|
328
|
+
]
|
|
329
|
+
},
|
|
330
|
+
{
|
|
331
|
+
id: "tag-input",
|
|
332
|
+
name: "Tag input field",
|
|
333
|
+
useWhen: [
|
|
334
|
+
"A form needs freeform tag entry such as domains, labels, or emails."
|
|
335
|
+
],
|
|
336
|
+
compose: [
|
|
337
|
+
"TFormField",
|
|
338
|
+
"TInput",
|
|
339
|
+
"TTag",
|
|
340
|
+
"TStack"
|
|
341
|
+
],
|
|
342
|
+
notes: [
|
|
343
|
+
"Keep the draft value in app state and add a tag on Enter or separator keys.",
|
|
344
|
+
"Use removable `TTag` items below or inside the field wrapper."
|
|
345
|
+
]
|
|
346
|
+
},
|
|
316
347
|
{
|
|
317
348
|
id: "data-listing",
|
|
318
349
|
name: "Data table with paging",
|
|
@@ -325,7 +356,23 @@ var treeui_catalog_default = {
|
|
|
325
356
|
"TStack"
|
|
326
357
|
],
|
|
327
358
|
notes: [
|
|
328
|
-
"`TTable` stays focused on structured listing; filters and toolbars compose around it."
|
|
359
|
+
"`TTable` stays focused on structured listing; filters and toolbars compose around it.",
|
|
360
|
+
"Use `#cell-{key}` slots when a column renders derived or rich content."
|
|
361
|
+
]
|
|
362
|
+
},
|
|
363
|
+
{
|
|
364
|
+
id: "router-backed-tabs",
|
|
365
|
+
name: "Router-backed tabs",
|
|
366
|
+
useWhen: [
|
|
367
|
+
"Tabs should deep-link to app state without turning into primary route navigation."
|
|
368
|
+
],
|
|
369
|
+
compose: [
|
|
370
|
+
"TTabs",
|
|
371
|
+
"app router state"
|
|
372
|
+
],
|
|
373
|
+
notes: [
|
|
374
|
+
"Bind `v-model` to a route param, query param, or derived route name in the app layer.",
|
|
375
|
+
"Prefer `TNavMenu` when the selection becomes app-section navigation instead of in-place panel switching."
|
|
329
376
|
]
|
|
330
377
|
},
|
|
331
378
|
{
|
|
@@ -343,6 +390,21 @@ var treeui_catalog_default = {
|
|
|
343
390
|
"Use `TToast` only for the post-confirm success feedback."
|
|
344
391
|
]
|
|
345
392
|
},
|
|
393
|
+
{
|
|
394
|
+
id: "chart-surface",
|
|
395
|
+
name: "Chart surface",
|
|
396
|
+
useWhen: [
|
|
397
|
+
"A screen needs data visualization, but the charting engine should stay external to TreeUI."
|
|
398
|
+
],
|
|
399
|
+
compose: [
|
|
400
|
+
"TCard",
|
|
401
|
+
"TStack",
|
|
402
|
+
"external chart library"
|
|
403
|
+
],
|
|
404
|
+
notes: [
|
|
405
|
+
"Use TreeUI for the surrounding surface, headings, badges, filters, and empty/loading states."
|
|
406
|
+
]
|
|
407
|
+
},
|
|
346
408
|
{
|
|
347
409
|
id: "anchored-help",
|
|
348
410
|
name: "Anchored help affordance",
|
|
@@ -443,7 +505,7 @@ var treeui_catalog_default = {
|
|
|
443
505
|
TSelect: {
|
|
444
506
|
required: [],
|
|
445
507
|
notes: [
|
|
446
|
-
"Pass `options` as `{ label, value, disabled? }[]`.",
|
|
508
|
+
"Pass `options` as `{ label, value, disabled? }[]` where `value` can be `string` or `number`.",
|
|
447
509
|
"Use `placeholder` when no selection has been made."
|
|
448
510
|
]
|
|
449
511
|
},
|
|
@@ -521,6 +583,19 @@ var treeui_catalog_default = {
|
|
|
521
583
|
notes: [
|
|
522
584
|
"Pass `plans` matching the same core fields used by `TPricingCard`."
|
|
523
585
|
]
|
|
586
|
+
},
|
|
587
|
+
TModal: {
|
|
588
|
+
required: [],
|
|
589
|
+
notes: [
|
|
590
|
+
"Use `v-model:open` for the idiomatic Vue controlled pattern."
|
|
591
|
+
]
|
|
592
|
+
},
|
|
593
|
+
TBreadcrumb: {
|
|
594
|
+
required: [],
|
|
595
|
+
notes: [
|
|
596
|
+
"Use `href` for native links.",
|
|
597
|
+
"Use `to` when the app has vue-router and breadcrumb items should render RouterLink."
|
|
598
|
+
]
|
|
524
599
|
}
|
|
525
600
|
},
|
|
526
601
|
appPatterns: {
|
|
@@ -808,6 +883,19 @@ var treeui_catalog_default = {
|
|
|
808
883
|
"danger"
|
|
809
884
|
]
|
|
810
885
|
},
|
|
886
|
+
{
|
|
887
|
+
name: "tone",
|
|
888
|
+
type: "TreeBadgeTone",
|
|
889
|
+
default: "neutral",
|
|
890
|
+
values: [
|
|
891
|
+
"neutral",
|
|
892
|
+
"success",
|
|
893
|
+
"warning",
|
|
894
|
+
"danger",
|
|
895
|
+
"info"
|
|
896
|
+
],
|
|
897
|
+
description: "Optional semantic tone layered on top of the visual variant."
|
|
898
|
+
},
|
|
811
899
|
{
|
|
812
900
|
name: "size",
|
|
813
901
|
type: "TreeSize",
|
|
@@ -892,7 +980,10 @@ var treeui_catalog_default = {
|
|
|
892
980
|
},
|
|
893
981
|
setup: {
|
|
894
982
|
required: [],
|
|
895
|
-
notes: [
|
|
983
|
+
notes: [
|
|
984
|
+
"Use `href` for native links.",
|
|
985
|
+
"Use `to` when the app has vue-router and breadcrumb items should render RouterLink."
|
|
986
|
+
]
|
|
896
987
|
},
|
|
897
988
|
recipes: []
|
|
898
989
|
},
|
|
@@ -1022,7 +1113,8 @@ var treeui_catalog_default = {
|
|
|
1022
1113
|
values: [
|
|
1023
1114
|
"outline",
|
|
1024
1115
|
"soft",
|
|
1025
|
-
"solid"
|
|
1116
|
+
"solid",
|
|
1117
|
+
"inset"
|
|
1026
1118
|
]
|
|
1027
1119
|
},
|
|
1028
1120
|
{
|
|
@@ -1034,6 +1126,12 @@ var treeui_catalog_default = {
|
|
|
1034
1126
|
"md",
|
|
1035
1127
|
"lg"
|
|
1036
1128
|
]
|
|
1129
|
+
},
|
|
1130
|
+
{
|
|
1131
|
+
name: "title",
|
|
1132
|
+
type: "string",
|
|
1133
|
+
default: "undefined",
|
|
1134
|
+
description: "Optional card heading rendered inside the header area."
|
|
1037
1135
|
}
|
|
1038
1136
|
],
|
|
1039
1137
|
events: [],
|
|
@@ -1041,6 +1139,9 @@ var treeui_catalog_default = {
|
|
|
1041
1139
|
{
|
|
1042
1140
|
name: "header"
|
|
1043
1141
|
},
|
|
1142
|
+
{
|
|
1143
|
+
name: "actions"
|
|
1144
|
+
},
|
|
1044
1145
|
{
|
|
1045
1146
|
name: "default"
|
|
1046
1147
|
},
|
|
@@ -1081,7 +1182,9 @@ var treeui_catalog_default = {
|
|
|
1081
1182
|
required: [],
|
|
1082
1183
|
notes: []
|
|
1083
1184
|
},
|
|
1084
|
-
recipes: [
|
|
1185
|
+
recipes: [
|
|
1186
|
+
"chart-surface"
|
|
1187
|
+
]
|
|
1085
1188
|
},
|
|
1086
1189
|
{
|
|
1087
1190
|
name: "TCheckbox",
|
|
@@ -2727,6 +2830,8 @@ var treeui_catalog_default = {
|
|
|
2727
2830
|
"form-field-input",
|
|
2728
2831
|
"searchable-multi-choice",
|
|
2729
2832
|
"date-range-form",
|
|
2833
|
+
"color-field",
|
|
2834
|
+
"tag-input",
|
|
2730
2835
|
"hierarchy-picker"
|
|
2731
2836
|
]
|
|
2732
2837
|
},
|
|
@@ -2944,9 +3049,85 @@ var treeui_catalog_default = {
|
|
|
2944
3049
|
notes: []
|
|
2945
3050
|
},
|
|
2946
3051
|
recipes: [
|
|
2947
|
-
"form-field-input"
|
|
3052
|
+
"form-field-input",
|
|
3053
|
+
"tag-input"
|
|
2948
3054
|
]
|
|
2949
3055
|
},
|
|
3056
|
+
{
|
|
3057
|
+
name: "TLink",
|
|
3058
|
+
legacyAlias: "TreeLink",
|
|
3059
|
+
aliases: [
|
|
3060
|
+
"TreeLink"
|
|
3061
|
+
],
|
|
3062
|
+
package: "@treeui/vue",
|
|
3063
|
+
kind: "navigation",
|
|
3064
|
+
category: "Navigation",
|
|
3065
|
+
status: "available",
|
|
3066
|
+
purpose: "Inline link with consistent styling, optional RouterLink rendering, and external link support.",
|
|
3067
|
+
sourceFile: "packages/vue/src/components/TreeLink.vue",
|
|
3068
|
+
storyFile: "apps/docs/src/stories/Link.stories.ts",
|
|
3069
|
+
storyTitle: "Components/Navigation/Link",
|
|
3070
|
+
manifestFile: "docs/ai/COMPONENTS/link.yaml",
|
|
3071
|
+
props: [
|
|
3072
|
+
{
|
|
3073
|
+
name: "to",
|
|
3074
|
+
type: "string | Record<string, unknown>",
|
|
3075
|
+
default: "undefined",
|
|
3076
|
+
description: "Route target. When provided and vue-router is available, renders RouterLink."
|
|
3077
|
+
},
|
|
3078
|
+
{
|
|
3079
|
+
name: "href",
|
|
3080
|
+
type: "string",
|
|
3081
|
+
default: "undefined",
|
|
3082
|
+
description: "Native href for anchor elements. Ignored when `to` is provided with vue-router."
|
|
3083
|
+
},
|
|
3084
|
+
{
|
|
3085
|
+
name: "external",
|
|
3086
|
+
type: "boolean",
|
|
3087
|
+
default: "false",
|
|
3088
|
+
description: "Opens link in new tab with rel='noopener noreferrer'."
|
|
3089
|
+
},
|
|
3090
|
+
{
|
|
3091
|
+
name: "disabled",
|
|
3092
|
+
type: "boolean",
|
|
3093
|
+
default: "false"
|
|
3094
|
+
},
|
|
3095
|
+
{
|
|
3096
|
+
name: "variant",
|
|
3097
|
+
type: "TreeLinkVariant",
|
|
3098
|
+
default: "default",
|
|
3099
|
+
values: [
|
|
3100
|
+
"default",
|
|
3101
|
+
"muted",
|
|
3102
|
+
"danger"
|
|
3103
|
+
]
|
|
3104
|
+
}
|
|
3105
|
+
],
|
|
3106
|
+
events: [],
|
|
3107
|
+
slots: [
|
|
3108
|
+
{
|
|
3109
|
+
name: "default"
|
|
3110
|
+
}
|
|
3111
|
+
],
|
|
3112
|
+
a11y: [
|
|
3113
|
+
"semantic_element: a (or RouterLink, or span when disabled)",
|
|
3114
|
+
"aria_disabled: set when disabled",
|
|
3115
|
+
"tabindex: -1 when disabled",
|
|
3116
|
+
"focus_visible: true"
|
|
3117
|
+
],
|
|
3118
|
+
behavior: [],
|
|
3119
|
+
selection: {
|
|
3120
|
+
keywords: [],
|
|
3121
|
+
useWhen: [],
|
|
3122
|
+
avoidWhen: [],
|
|
3123
|
+
alternatives: []
|
|
3124
|
+
},
|
|
3125
|
+
setup: {
|
|
3126
|
+
required: [],
|
|
3127
|
+
notes: []
|
|
3128
|
+
},
|
|
3129
|
+
recipes: []
|
|
3130
|
+
},
|
|
2950
3131
|
{
|
|
2951
3132
|
name: "TMarkdownEditor",
|
|
2952
3133
|
legacyAlias: "TreeMarkdownEditor",
|
|
@@ -3197,7 +3378,9 @@ var treeui_catalog_default = {
|
|
|
3197
3378
|
},
|
|
3198
3379
|
setup: {
|
|
3199
3380
|
required: [],
|
|
3200
|
-
notes: [
|
|
3381
|
+
notes: [
|
|
3382
|
+
"Use `v-model:open` for the idiomatic Vue controlled pattern."
|
|
3383
|
+
]
|
|
3201
3384
|
},
|
|
3202
3385
|
recipes: []
|
|
3203
3386
|
},
|
|
@@ -3474,7 +3657,7 @@ var treeui_catalog_default = {
|
|
|
3474
3657
|
kind: "navigation",
|
|
3475
3658
|
category: "Layout",
|
|
3476
3659
|
status: "available",
|
|
3477
|
-
purpose: "
|
|
3660
|
+
purpose: "Vertical navigation menu with selection state, keyboard navigation, optional RouterLink rendering, and sidebar integration.",
|
|
3478
3661
|
sourceFile: "packages/vue/src/components/TreeNavMenu.vue",
|
|
3479
3662
|
storyFile: "apps/docs/src/stories/NavMenu.stories.ts",
|
|
3480
3663
|
storyTitle: "Components/Layout/NavMenu",
|
|
@@ -3494,7 +3677,7 @@ var treeui_catalog_default = {
|
|
|
3494
3677
|
name: "items",
|
|
3495
3678
|
type: "TreeNavMenuItem[]",
|
|
3496
3679
|
default: "[]",
|
|
3497
|
-
note: "Array of `{ label, value, shortLabel?, description?, badge?, disabled? }`."
|
|
3680
|
+
note: "Array of `{ label, value, shortLabel?, description?, icon?, to?, badge?, disabled? }`."
|
|
3498
3681
|
},
|
|
3499
3682
|
{
|
|
3500
3683
|
name: "size",
|
|
@@ -3538,7 +3721,9 @@ var treeui_catalog_default = {
|
|
|
3538
3721
|
"roving_focus: true",
|
|
3539
3722
|
"home_end_navigation: true",
|
|
3540
3723
|
"arrow_navigation: true",
|
|
3541
|
-
"activation_keys_select_item: true"
|
|
3724
|
+
"activation_keys_select_item: true",
|
|
3725
|
+
"aria_current: page on selected item",
|
|
3726
|
+
"aria_disabled: on link items when disabled"
|
|
3542
3727
|
],
|
|
3543
3728
|
behavior: [
|
|
3544
3729
|
"can_be_controlled_or_uncontrolled: true",
|
|
@@ -4340,14 +4525,14 @@ var treeui_catalog_default = {
|
|
|
4340
4525
|
props: [
|
|
4341
4526
|
{
|
|
4342
4527
|
name: "modelValue",
|
|
4343
|
-
type: "string",
|
|
4528
|
+
type: "string | number",
|
|
4344
4529
|
default: ""
|
|
4345
4530
|
},
|
|
4346
4531
|
{
|
|
4347
4532
|
name: "options",
|
|
4348
4533
|
type: "TreeSelectOption[]",
|
|
4349
4534
|
default: "[]",
|
|
4350
|
-
note: "Array of { label: string; value: string; disabled?: boolean }"
|
|
4535
|
+
note: "Array of { label: string; value: string | number; disabled?: boolean }"
|
|
4351
4536
|
},
|
|
4352
4537
|
{
|
|
4353
4538
|
name: "open",
|
|
@@ -4421,13 +4606,14 @@ var treeui_catalog_default = {
|
|
|
4421
4606
|
"home_end_navigation: true"
|
|
4422
4607
|
],
|
|
4423
4608
|
behavior: [
|
|
4424
|
-
"update_payload_type: string",
|
|
4609
|
+
"update_payload_type: string | number",
|
|
4425
4610
|
"loading_does_not_disable_by_itself: true",
|
|
4426
4611
|
"placeholder_shown_as_muted_text: true",
|
|
4427
4612
|
"chevron_rotates_when_open: true",
|
|
4428
4613
|
"check_icon_on_selected_option: true",
|
|
4429
4614
|
"outside_click_closes_dropdown: true",
|
|
4430
|
-
"focus_restores_on_close: true"
|
|
4615
|
+
"focus_restores_on_close: true",
|
|
4616
|
+
"numeric_values_supported_without_string_coercion: true"
|
|
4431
4617
|
],
|
|
4432
4618
|
selection: {
|
|
4433
4619
|
keywords: [
|
|
@@ -4456,7 +4642,7 @@ var treeui_catalog_default = {
|
|
|
4456
4642
|
setup: {
|
|
4457
4643
|
required: [],
|
|
4458
4644
|
notes: [
|
|
4459
|
-
"Pass `options` as `{ label, value, disabled? }[]`.",
|
|
4645
|
+
"Pass `options` as `{ label, value, disabled? }[]` where `value` can be `string` or `number`.",
|
|
4460
4646
|
"Use `placeholder` when no selection has been made."
|
|
4461
4647
|
]
|
|
4462
4648
|
},
|
|
@@ -4934,7 +5120,9 @@ var treeui_catalog_default = {
|
|
|
4934
5120
|
notes: []
|
|
4935
5121
|
},
|
|
4936
5122
|
recipes: [
|
|
4937
|
-
"
|
|
5123
|
+
"tag-input",
|
|
5124
|
+
"data-listing",
|
|
5125
|
+
"chart-surface"
|
|
4938
5126
|
]
|
|
4939
5127
|
},
|
|
4940
5128
|
{
|
|
@@ -4994,6 +5182,11 @@ var treeui_catalog_default = {
|
|
|
4994
5182
|
"down",
|
|
4995
5183
|
"neutral"
|
|
4996
5184
|
]
|
|
5185
|
+
},
|
|
5186
|
+
{
|
|
5187
|
+
name: "loading",
|
|
5188
|
+
type: "boolean",
|
|
5189
|
+
default: "false"
|
|
4997
5190
|
}
|
|
4998
5191
|
],
|
|
4999
5192
|
events: [],
|
|
@@ -5021,7 +5214,8 @@ var treeui_catalog_default = {
|
|
|
5021
5214
|
behavior: [
|
|
5022
5215
|
"value_and_trend_are_optional: true",
|
|
5023
5216
|
"icon_slot_adds_visual_emphasis: true",
|
|
5024
|
-
"trend_indicator_changes_with_direction: true"
|
|
5217
|
+
"trend_indicator_changes_with_direction: true",
|
|
5218
|
+
"loading_renders_internal_skeleton_placeholders: true"
|
|
5025
5219
|
],
|
|
5026
5220
|
selection: {
|
|
5027
5221
|
keywords: [
|
|
@@ -5459,7 +5653,9 @@ var treeui_catalog_default = {
|
|
|
5459
5653
|
required: [],
|
|
5460
5654
|
notes: []
|
|
5461
5655
|
},
|
|
5462
|
-
recipes: [
|
|
5656
|
+
recipes: [
|
|
5657
|
+
"router-backed-tabs"
|
|
5658
|
+
]
|
|
5463
5659
|
},
|
|
5464
5660
|
{
|
|
5465
5661
|
name: "TTag",
|
|
@@ -5540,7 +5736,9 @@ var treeui_catalog_default = {
|
|
|
5540
5736
|
required: [],
|
|
5541
5737
|
notes: []
|
|
5542
5738
|
},
|
|
5543
|
-
recipes: [
|
|
5739
|
+
recipes: [
|
|
5740
|
+
"tag-input"
|
|
5741
|
+
]
|
|
5544
5742
|
},
|
|
5545
5743
|
{
|
|
5546
5744
|
name: "TTextarea",
|
package/dist/cli.js
CHANGED
package/dist/index.cjs
CHANGED
|
@@ -47,9 +47,9 @@ module.exports = __toCommonJS(index_exports);
|
|
|
47
47
|
|
|
48
48
|
// src/generated/treeui.catalog.json
|
|
49
49
|
var treeui_catalog_default = {
|
|
50
|
-
generatedAt: "2026-04-
|
|
50
|
+
generatedAt: "2026-04-10T16:42:52.904Z",
|
|
51
51
|
packageName: "@treeui/vue",
|
|
52
|
-
packageVersion: "0.
|
|
52
|
+
packageVersion: "0.6.1",
|
|
53
53
|
decisionGuides: [
|
|
54
54
|
{
|
|
55
55
|
id: "single-choice",
|
|
@@ -326,6 +326,37 @@ var treeui_catalog_default = {
|
|
|
326
326
|
"Use `TCard` only when the stat needs additional arbitrary content."
|
|
327
327
|
]
|
|
328
328
|
},
|
|
329
|
+
{
|
|
330
|
+
id: "color-field",
|
|
331
|
+
name: "Color field",
|
|
332
|
+
useWhen: [
|
|
333
|
+
"A form needs a color selection control without adding a dedicated TreeUI component."
|
|
334
|
+
],
|
|
335
|
+
compose: [
|
|
336
|
+
"TFormField",
|
|
337
|
+
'native input[type="color"]'
|
|
338
|
+
],
|
|
339
|
+
notes: [
|
|
340
|
+
"Wrap the native color input with `TFormField` for label, hint, and error handling."
|
|
341
|
+
]
|
|
342
|
+
},
|
|
343
|
+
{
|
|
344
|
+
id: "tag-input",
|
|
345
|
+
name: "Tag input field",
|
|
346
|
+
useWhen: [
|
|
347
|
+
"A form needs freeform tag entry such as domains, labels, or emails."
|
|
348
|
+
],
|
|
349
|
+
compose: [
|
|
350
|
+
"TFormField",
|
|
351
|
+
"TInput",
|
|
352
|
+
"TTag",
|
|
353
|
+
"TStack"
|
|
354
|
+
],
|
|
355
|
+
notes: [
|
|
356
|
+
"Keep the draft value in app state and add a tag on Enter or separator keys.",
|
|
357
|
+
"Use removable `TTag` items below or inside the field wrapper."
|
|
358
|
+
]
|
|
359
|
+
},
|
|
329
360
|
{
|
|
330
361
|
id: "data-listing",
|
|
331
362
|
name: "Data table with paging",
|
|
@@ -338,7 +369,23 @@ var treeui_catalog_default = {
|
|
|
338
369
|
"TStack"
|
|
339
370
|
],
|
|
340
371
|
notes: [
|
|
341
|
-
"`TTable` stays focused on structured listing; filters and toolbars compose around it."
|
|
372
|
+
"`TTable` stays focused on structured listing; filters and toolbars compose around it.",
|
|
373
|
+
"Use `#cell-{key}` slots when a column renders derived or rich content."
|
|
374
|
+
]
|
|
375
|
+
},
|
|
376
|
+
{
|
|
377
|
+
id: "router-backed-tabs",
|
|
378
|
+
name: "Router-backed tabs",
|
|
379
|
+
useWhen: [
|
|
380
|
+
"Tabs should deep-link to app state without turning into primary route navigation."
|
|
381
|
+
],
|
|
382
|
+
compose: [
|
|
383
|
+
"TTabs",
|
|
384
|
+
"app router state"
|
|
385
|
+
],
|
|
386
|
+
notes: [
|
|
387
|
+
"Bind `v-model` to a route param, query param, or derived route name in the app layer.",
|
|
388
|
+
"Prefer `TNavMenu` when the selection becomes app-section navigation instead of in-place panel switching."
|
|
342
389
|
]
|
|
343
390
|
},
|
|
344
391
|
{
|
|
@@ -356,6 +403,21 @@ var treeui_catalog_default = {
|
|
|
356
403
|
"Use `TToast` only for the post-confirm success feedback."
|
|
357
404
|
]
|
|
358
405
|
},
|
|
406
|
+
{
|
|
407
|
+
id: "chart-surface",
|
|
408
|
+
name: "Chart surface",
|
|
409
|
+
useWhen: [
|
|
410
|
+
"A screen needs data visualization, but the charting engine should stay external to TreeUI."
|
|
411
|
+
],
|
|
412
|
+
compose: [
|
|
413
|
+
"TCard",
|
|
414
|
+
"TStack",
|
|
415
|
+
"external chart library"
|
|
416
|
+
],
|
|
417
|
+
notes: [
|
|
418
|
+
"Use TreeUI for the surrounding surface, headings, badges, filters, and empty/loading states."
|
|
419
|
+
]
|
|
420
|
+
},
|
|
359
421
|
{
|
|
360
422
|
id: "anchored-help",
|
|
361
423
|
name: "Anchored help affordance",
|
|
@@ -456,7 +518,7 @@ var treeui_catalog_default = {
|
|
|
456
518
|
TSelect: {
|
|
457
519
|
required: [],
|
|
458
520
|
notes: [
|
|
459
|
-
"Pass `options` as `{ label, value, disabled? }[]`.",
|
|
521
|
+
"Pass `options` as `{ label, value, disabled? }[]` where `value` can be `string` or `number`.",
|
|
460
522
|
"Use `placeholder` when no selection has been made."
|
|
461
523
|
]
|
|
462
524
|
},
|
|
@@ -534,6 +596,19 @@ var treeui_catalog_default = {
|
|
|
534
596
|
notes: [
|
|
535
597
|
"Pass `plans` matching the same core fields used by `TPricingCard`."
|
|
536
598
|
]
|
|
599
|
+
},
|
|
600
|
+
TModal: {
|
|
601
|
+
required: [],
|
|
602
|
+
notes: [
|
|
603
|
+
"Use `v-model:open` for the idiomatic Vue controlled pattern."
|
|
604
|
+
]
|
|
605
|
+
},
|
|
606
|
+
TBreadcrumb: {
|
|
607
|
+
required: [],
|
|
608
|
+
notes: [
|
|
609
|
+
"Use `href` for native links.",
|
|
610
|
+
"Use `to` when the app has vue-router and breadcrumb items should render RouterLink."
|
|
611
|
+
]
|
|
537
612
|
}
|
|
538
613
|
},
|
|
539
614
|
appPatterns: {
|
|
@@ -821,6 +896,19 @@ var treeui_catalog_default = {
|
|
|
821
896
|
"danger"
|
|
822
897
|
]
|
|
823
898
|
},
|
|
899
|
+
{
|
|
900
|
+
name: "tone",
|
|
901
|
+
type: "TreeBadgeTone",
|
|
902
|
+
default: "neutral",
|
|
903
|
+
values: [
|
|
904
|
+
"neutral",
|
|
905
|
+
"success",
|
|
906
|
+
"warning",
|
|
907
|
+
"danger",
|
|
908
|
+
"info"
|
|
909
|
+
],
|
|
910
|
+
description: "Optional semantic tone layered on top of the visual variant."
|
|
911
|
+
},
|
|
824
912
|
{
|
|
825
913
|
name: "size",
|
|
826
914
|
type: "TreeSize",
|
|
@@ -905,7 +993,10 @@ var treeui_catalog_default = {
|
|
|
905
993
|
},
|
|
906
994
|
setup: {
|
|
907
995
|
required: [],
|
|
908
|
-
notes: [
|
|
996
|
+
notes: [
|
|
997
|
+
"Use `href` for native links.",
|
|
998
|
+
"Use `to` when the app has vue-router and breadcrumb items should render RouterLink."
|
|
999
|
+
]
|
|
909
1000
|
},
|
|
910
1001
|
recipes: []
|
|
911
1002
|
},
|
|
@@ -1035,7 +1126,8 @@ var treeui_catalog_default = {
|
|
|
1035
1126
|
values: [
|
|
1036
1127
|
"outline",
|
|
1037
1128
|
"soft",
|
|
1038
|
-
"solid"
|
|
1129
|
+
"solid",
|
|
1130
|
+
"inset"
|
|
1039
1131
|
]
|
|
1040
1132
|
},
|
|
1041
1133
|
{
|
|
@@ -1047,6 +1139,12 @@ var treeui_catalog_default = {
|
|
|
1047
1139
|
"md",
|
|
1048
1140
|
"lg"
|
|
1049
1141
|
]
|
|
1142
|
+
},
|
|
1143
|
+
{
|
|
1144
|
+
name: "title",
|
|
1145
|
+
type: "string",
|
|
1146
|
+
default: "undefined",
|
|
1147
|
+
description: "Optional card heading rendered inside the header area."
|
|
1050
1148
|
}
|
|
1051
1149
|
],
|
|
1052
1150
|
events: [],
|
|
@@ -1054,6 +1152,9 @@ var treeui_catalog_default = {
|
|
|
1054
1152
|
{
|
|
1055
1153
|
name: "header"
|
|
1056
1154
|
},
|
|
1155
|
+
{
|
|
1156
|
+
name: "actions"
|
|
1157
|
+
},
|
|
1057
1158
|
{
|
|
1058
1159
|
name: "default"
|
|
1059
1160
|
},
|
|
@@ -1094,7 +1195,9 @@ var treeui_catalog_default = {
|
|
|
1094
1195
|
required: [],
|
|
1095
1196
|
notes: []
|
|
1096
1197
|
},
|
|
1097
|
-
recipes: [
|
|
1198
|
+
recipes: [
|
|
1199
|
+
"chart-surface"
|
|
1200
|
+
]
|
|
1098
1201
|
},
|
|
1099
1202
|
{
|
|
1100
1203
|
name: "TCheckbox",
|
|
@@ -2740,6 +2843,8 @@ var treeui_catalog_default = {
|
|
|
2740
2843
|
"form-field-input",
|
|
2741
2844
|
"searchable-multi-choice",
|
|
2742
2845
|
"date-range-form",
|
|
2846
|
+
"color-field",
|
|
2847
|
+
"tag-input",
|
|
2743
2848
|
"hierarchy-picker"
|
|
2744
2849
|
]
|
|
2745
2850
|
},
|
|
@@ -2957,9 +3062,85 @@ var treeui_catalog_default = {
|
|
|
2957
3062
|
notes: []
|
|
2958
3063
|
},
|
|
2959
3064
|
recipes: [
|
|
2960
|
-
"form-field-input"
|
|
3065
|
+
"form-field-input",
|
|
3066
|
+
"tag-input"
|
|
2961
3067
|
]
|
|
2962
3068
|
},
|
|
3069
|
+
{
|
|
3070
|
+
name: "TLink",
|
|
3071
|
+
legacyAlias: "TreeLink",
|
|
3072
|
+
aliases: [
|
|
3073
|
+
"TreeLink"
|
|
3074
|
+
],
|
|
3075
|
+
package: "@treeui/vue",
|
|
3076
|
+
kind: "navigation",
|
|
3077
|
+
category: "Navigation",
|
|
3078
|
+
status: "available",
|
|
3079
|
+
purpose: "Inline link with consistent styling, optional RouterLink rendering, and external link support.",
|
|
3080
|
+
sourceFile: "packages/vue/src/components/TreeLink.vue",
|
|
3081
|
+
storyFile: "apps/docs/src/stories/Link.stories.ts",
|
|
3082
|
+
storyTitle: "Components/Navigation/Link",
|
|
3083
|
+
manifestFile: "docs/ai/COMPONENTS/link.yaml",
|
|
3084
|
+
props: [
|
|
3085
|
+
{
|
|
3086
|
+
name: "to",
|
|
3087
|
+
type: "string | Record<string, unknown>",
|
|
3088
|
+
default: "undefined",
|
|
3089
|
+
description: "Route target. When provided and vue-router is available, renders RouterLink."
|
|
3090
|
+
},
|
|
3091
|
+
{
|
|
3092
|
+
name: "href",
|
|
3093
|
+
type: "string",
|
|
3094
|
+
default: "undefined",
|
|
3095
|
+
description: "Native href for anchor elements. Ignored when `to` is provided with vue-router."
|
|
3096
|
+
},
|
|
3097
|
+
{
|
|
3098
|
+
name: "external",
|
|
3099
|
+
type: "boolean",
|
|
3100
|
+
default: "false",
|
|
3101
|
+
description: "Opens link in new tab with rel='noopener noreferrer'."
|
|
3102
|
+
},
|
|
3103
|
+
{
|
|
3104
|
+
name: "disabled",
|
|
3105
|
+
type: "boolean",
|
|
3106
|
+
default: "false"
|
|
3107
|
+
},
|
|
3108
|
+
{
|
|
3109
|
+
name: "variant",
|
|
3110
|
+
type: "TreeLinkVariant",
|
|
3111
|
+
default: "default",
|
|
3112
|
+
values: [
|
|
3113
|
+
"default",
|
|
3114
|
+
"muted",
|
|
3115
|
+
"danger"
|
|
3116
|
+
]
|
|
3117
|
+
}
|
|
3118
|
+
],
|
|
3119
|
+
events: [],
|
|
3120
|
+
slots: [
|
|
3121
|
+
{
|
|
3122
|
+
name: "default"
|
|
3123
|
+
}
|
|
3124
|
+
],
|
|
3125
|
+
a11y: [
|
|
3126
|
+
"semantic_element: a (or RouterLink, or span when disabled)",
|
|
3127
|
+
"aria_disabled: set when disabled",
|
|
3128
|
+
"tabindex: -1 when disabled",
|
|
3129
|
+
"focus_visible: true"
|
|
3130
|
+
],
|
|
3131
|
+
behavior: [],
|
|
3132
|
+
selection: {
|
|
3133
|
+
keywords: [],
|
|
3134
|
+
useWhen: [],
|
|
3135
|
+
avoidWhen: [],
|
|
3136
|
+
alternatives: []
|
|
3137
|
+
},
|
|
3138
|
+
setup: {
|
|
3139
|
+
required: [],
|
|
3140
|
+
notes: []
|
|
3141
|
+
},
|
|
3142
|
+
recipes: []
|
|
3143
|
+
},
|
|
2963
3144
|
{
|
|
2964
3145
|
name: "TMarkdownEditor",
|
|
2965
3146
|
legacyAlias: "TreeMarkdownEditor",
|
|
@@ -3210,7 +3391,9 @@ var treeui_catalog_default = {
|
|
|
3210
3391
|
},
|
|
3211
3392
|
setup: {
|
|
3212
3393
|
required: [],
|
|
3213
|
-
notes: [
|
|
3394
|
+
notes: [
|
|
3395
|
+
"Use `v-model:open` for the idiomatic Vue controlled pattern."
|
|
3396
|
+
]
|
|
3214
3397
|
},
|
|
3215
3398
|
recipes: []
|
|
3216
3399
|
},
|
|
@@ -3487,7 +3670,7 @@ var treeui_catalog_default = {
|
|
|
3487
3670
|
kind: "navigation",
|
|
3488
3671
|
category: "Layout",
|
|
3489
3672
|
status: "available",
|
|
3490
|
-
purpose: "
|
|
3673
|
+
purpose: "Vertical navigation menu with selection state, keyboard navigation, optional RouterLink rendering, and sidebar integration.",
|
|
3491
3674
|
sourceFile: "packages/vue/src/components/TreeNavMenu.vue",
|
|
3492
3675
|
storyFile: "apps/docs/src/stories/NavMenu.stories.ts",
|
|
3493
3676
|
storyTitle: "Components/Layout/NavMenu",
|
|
@@ -3507,7 +3690,7 @@ var treeui_catalog_default = {
|
|
|
3507
3690
|
name: "items",
|
|
3508
3691
|
type: "TreeNavMenuItem[]",
|
|
3509
3692
|
default: "[]",
|
|
3510
|
-
note: "Array of `{ label, value, shortLabel?, description?, badge?, disabled? }`."
|
|
3693
|
+
note: "Array of `{ label, value, shortLabel?, description?, icon?, to?, badge?, disabled? }`."
|
|
3511
3694
|
},
|
|
3512
3695
|
{
|
|
3513
3696
|
name: "size",
|
|
@@ -3551,7 +3734,9 @@ var treeui_catalog_default = {
|
|
|
3551
3734
|
"roving_focus: true",
|
|
3552
3735
|
"home_end_navigation: true",
|
|
3553
3736
|
"arrow_navigation: true",
|
|
3554
|
-
"activation_keys_select_item: true"
|
|
3737
|
+
"activation_keys_select_item: true",
|
|
3738
|
+
"aria_current: page on selected item",
|
|
3739
|
+
"aria_disabled: on link items when disabled"
|
|
3555
3740
|
],
|
|
3556
3741
|
behavior: [
|
|
3557
3742
|
"can_be_controlled_or_uncontrolled: true",
|
|
@@ -4353,14 +4538,14 @@ var treeui_catalog_default = {
|
|
|
4353
4538
|
props: [
|
|
4354
4539
|
{
|
|
4355
4540
|
name: "modelValue",
|
|
4356
|
-
type: "string",
|
|
4541
|
+
type: "string | number",
|
|
4357
4542
|
default: ""
|
|
4358
4543
|
},
|
|
4359
4544
|
{
|
|
4360
4545
|
name: "options",
|
|
4361
4546
|
type: "TreeSelectOption[]",
|
|
4362
4547
|
default: "[]",
|
|
4363
|
-
note: "Array of { label: string; value: string; disabled?: boolean }"
|
|
4548
|
+
note: "Array of { label: string; value: string | number; disabled?: boolean }"
|
|
4364
4549
|
},
|
|
4365
4550
|
{
|
|
4366
4551
|
name: "open",
|
|
@@ -4434,13 +4619,14 @@ var treeui_catalog_default = {
|
|
|
4434
4619
|
"home_end_navigation: true"
|
|
4435
4620
|
],
|
|
4436
4621
|
behavior: [
|
|
4437
|
-
"update_payload_type: string",
|
|
4622
|
+
"update_payload_type: string | number",
|
|
4438
4623
|
"loading_does_not_disable_by_itself: true",
|
|
4439
4624
|
"placeholder_shown_as_muted_text: true",
|
|
4440
4625
|
"chevron_rotates_when_open: true",
|
|
4441
4626
|
"check_icon_on_selected_option: true",
|
|
4442
4627
|
"outside_click_closes_dropdown: true",
|
|
4443
|
-
"focus_restores_on_close: true"
|
|
4628
|
+
"focus_restores_on_close: true",
|
|
4629
|
+
"numeric_values_supported_without_string_coercion: true"
|
|
4444
4630
|
],
|
|
4445
4631
|
selection: {
|
|
4446
4632
|
keywords: [
|
|
@@ -4469,7 +4655,7 @@ var treeui_catalog_default = {
|
|
|
4469
4655
|
setup: {
|
|
4470
4656
|
required: [],
|
|
4471
4657
|
notes: [
|
|
4472
|
-
"Pass `options` as `{ label, value, disabled? }[]`.",
|
|
4658
|
+
"Pass `options` as `{ label, value, disabled? }[]` where `value` can be `string` or `number`.",
|
|
4473
4659
|
"Use `placeholder` when no selection has been made."
|
|
4474
4660
|
]
|
|
4475
4661
|
},
|
|
@@ -4947,7 +5133,9 @@ var treeui_catalog_default = {
|
|
|
4947
5133
|
notes: []
|
|
4948
5134
|
},
|
|
4949
5135
|
recipes: [
|
|
4950
|
-
"
|
|
5136
|
+
"tag-input",
|
|
5137
|
+
"data-listing",
|
|
5138
|
+
"chart-surface"
|
|
4951
5139
|
]
|
|
4952
5140
|
},
|
|
4953
5141
|
{
|
|
@@ -5007,6 +5195,11 @@ var treeui_catalog_default = {
|
|
|
5007
5195
|
"down",
|
|
5008
5196
|
"neutral"
|
|
5009
5197
|
]
|
|
5198
|
+
},
|
|
5199
|
+
{
|
|
5200
|
+
name: "loading",
|
|
5201
|
+
type: "boolean",
|
|
5202
|
+
default: "false"
|
|
5010
5203
|
}
|
|
5011
5204
|
],
|
|
5012
5205
|
events: [],
|
|
@@ -5034,7 +5227,8 @@ var treeui_catalog_default = {
|
|
|
5034
5227
|
behavior: [
|
|
5035
5228
|
"value_and_trend_are_optional: true",
|
|
5036
5229
|
"icon_slot_adds_visual_emphasis: true",
|
|
5037
|
-
"trend_indicator_changes_with_direction: true"
|
|
5230
|
+
"trend_indicator_changes_with_direction: true",
|
|
5231
|
+
"loading_renders_internal_skeleton_placeholders: true"
|
|
5038
5232
|
],
|
|
5039
5233
|
selection: {
|
|
5040
5234
|
keywords: [
|
|
@@ -5472,7 +5666,9 @@ var treeui_catalog_default = {
|
|
|
5472
5666
|
required: [],
|
|
5473
5667
|
notes: []
|
|
5474
5668
|
},
|
|
5475
|
-
recipes: [
|
|
5669
|
+
recipes: [
|
|
5670
|
+
"router-backed-tabs"
|
|
5671
|
+
]
|
|
5476
5672
|
},
|
|
5477
5673
|
{
|
|
5478
5674
|
name: "TTag",
|
|
@@ -5553,7 +5749,9 @@ var treeui_catalog_default = {
|
|
|
5553
5749
|
required: [],
|
|
5554
5750
|
notes: []
|
|
5555
5751
|
},
|
|
5556
|
-
recipes: [
|
|
5752
|
+
recipes: [
|
|
5753
|
+
"tag-input"
|
|
5754
|
+
]
|
|
5557
5755
|
},
|
|
5558
5756
|
{
|
|
5559
5757
|
name: "TTextarea",
|
package/dist/index.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@treeui/mcp",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.1",
|
|
4
4
|
"description": "Model Context Protocol server and AI catalog for TreeUI.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.cjs",
|
|
@@ -19,15 +19,15 @@
|
|
|
19
19
|
"files": [
|
|
20
20
|
"dist"
|
|
21
21
|
],
|
|
22
|
+
"dependencies": {
|
|
23
|
+
"@modelcontextprotocol/sdk": "^1.17.4",
|
|
24
|
+
"yaml": "^2.8.1"
|
|
25
|
+
},
|
|
22
26
|
"scripts": {
|
|
23
27
|
"generate:catalog": "node --import tsx scripts/generate-catalog.ts",
|
|
24
28
|
"build": "pnpm run generate:catalog && pnpm exec rimraf dist && pnpm exec tsup src/index.ts src/cli.ts --format esm,cjs --dts",
|
|
25
29
|
"start": "node --import tsx src/cli.ts",
|
|
26
30
|
"test": "pnpm -w exec vitest run packages/mcp/src/catalog.test.ts packages/mcp/src/server.test.ts",
|
|
27
31
|
"typecheck": "pnpm exec tsc -p tsconfig.json --noEmit"
|
|
28
|
-
},
|
|
29
|
-
"dependencies": {
|
|
30
|
-
"@modelcontextprotocol/sdk": "^1.17.4",
|
|
31
|
-
"yaml": "^2.8.1"
|
|
32
32
|
}
|
|
33
|
-
}
|
|
33
|
+
}
|