jsswift 1.0.45 → 1.0.46
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/dist/documentions/AI.md +85 -0
- package/dist/documentions/README.md +2 -0
- package/dist/documentions/ai-development.md +3 -1
- package/dist/documentions/components/alert.md +29 -493
- package/dist/documentions/components/app-shell.md +37 -524
- package/dist/documentions/components/avatar.md +47 -575
- package/dist/documentions/components/badge.md +27 -461
- package/dist/documentions/components/banner.md +35 -535
- package/dist/documentions/components/breadcrumbs.md +35 -518
- package/dist/documentions/components/btn.md +3 -21
- package/dist/documentions/components/card-body.md +11 -328
- package/dist/documentions/components/card-footer.md +15 -367
- package/dist/documentions/components/card-header.md +15 -367
- package/dist/documentions/components/card.md +3 -19
- package/dist/documentions/components/checkbox.md +25 -456
- package/dist/documentions/components/chip.md +16 -393
- package/dist/documentions/components/col.md +57 -612
- package/dist/documentions/components/container.md +40 -535
- package/dist/documentions/components/context-menu.md +60 -696
- package/dist/documentions/components/date.md +56 -673
- package/dist/documentions/components/dialog.md +5 -21
- package/dist/documentions/components/drawer.md +48 -616
- package/dist/documentions/components/empty-state.md +28 -477
- package/dist/documentions/components/footer.md +42 -586
- package/dist/documentions/components/form-field.md +40 -568
- package/dist/documentions/components/form.md +7 -321
- package/dist/documentions/components/grid-col.md +42 -542
- package/dist/documentions/components/grid.md +40 -542
- package/dist/documentions/components/header.md +38 -547
- package/dist/documentions/components/icon.md +17 -370
- package/dist/documentions/components/input.md +4 -22
- package/dist/documentions/components/item.md +37 -533
- package/dist/documentions/components/kpi.md +34 -519
- package/dist/documentions/components/layout.md +81 -811
- package/dist/documentions/components/list.md +19 -405
- package/dist/documentions/components/loading-bar.md +58 -679
- package/dist/documentions/components/menu.md +62 -710
- package/dist/documentions/components/notify.md +34 -525
- package/dist/documentions/components/page.md +35 -526
- package/dist/documentions/components/pagination.md +3 -20
- package/dist/documentions/components/parallax.md +50 -633
- package/dist/documentions/components/popover.md +55 -661
- package/dist/documentions/components/progress.md +39 -554
- package/dist/documentions/components/radio.md +27 -470
- package/dist/documentions/components/rating.md +41 -574
- package/dist/documentions/components/route-tab.md +30 -491
- package/dist/documentions/components/row.md +35 -507
- package/dist/documentions/components/search.md +62 -723
- package/dist/documentions/components/select.md +3 -22
- package/dist/documentions/components/separator.md +7 -321
- package/dist/documentions/components/slider.md +49 -631
- package/dist/documentions/components/spacer.md +6 -314
- package/dist/documentions/components/spinner.md +25 -440
- package/dist/documentions/components/stat.md +32 -505
- package/dist/documentions/components/tab-panel.md +40 -563
- package/dist/documentions/components/table.md +3 -22
- package/dist/documentions/components/tabs.md +36 -538
- package/dist/documentions/components/time.md +29 -491
- package/dist/documentions/components/toggle.md +31 -498
- package/dist/documentions/components/toolbar.md +52 -640
- package/dist/documentions/components/tooltip.md +35 -535
- package/dist/documentions/knowledge-map.json +19 -1
- package/dist/documentions/ui/common-props.md +301 -0
- package/dist/jsswift.js +10543 -14102
- package/dist/jsswift.min.js +3 -3
- package/dist/min-jsswift.js +3 -3
- package/package.json +3 -2
|
@@ -1,31 +1,11 @@
|
|
|
1
1
|
# Table
|
|
2
2
|
|
|
3
|
-
Exact JSswift UI
|
|
3
|
+
Exact JSswift UI contract. Shared definitions listed in `commonProps` are in [common props](../ui/common-props.md); all component-specific props, slots, events, and methods are below.
|
|
4
4
|
|
|
5
5
|
```json
|
|
6
6
|
{
|
|
7
7
|
"signature": "_.Table(props)",
|
|
8
8
|
"props": {
|
|
9
|
-
"size": {"type": "string|number", "description": "Size token, number, or CSS length for sizing.", "default": null, "values": ["number", "CSS units", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"], "category": "style"},
|
|
10
|
-
"color": {"type": "string", "description": "Semantic color name used to style the component.", "default": null, "values": ["primary", "secondary", "success", "warning", "danger", "info", "light", "dark"], "category": "style"},
|
|
11
|
-
"outline": {"type": "boolean", "description": "Uses outlined visual style.", "default": false, "values": ["number", "CSS units", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"], "category": "style"},
|
|
12
|
-
"clickable": {"type": "boolean", "description": "Enables pointer/hover styles and click handling on the component.", "default": false, "values": null, "category": "behavior"},
|
|
13
|
-
"padding": {"type": "string|number", "description": "Padding applied to the component root element.", "default": null, "values": ["number", "CSS units", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"], "category": "layout"},
|
|
14
|
-
"margin": {"type": "string|number", "description": "Margin applied to the component root element.", "default": null, "values": ["number", "CSS units", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"], "category": "layout"},
|
|
15
|
-
"width": {"type": "string|number", "description": "Explicit width (number interpreted as px or CSS length).", "default": null, "values": ["number", "CSS units", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"], "category": "layout"},
|
|
16
|
-
"minWidth": {"type": "string|number", "description": "Minimum width constraint (number interpreted as px or CSS length).", "default": null, "values": ["number", "CSS units", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"], "category": "layout"},
|
|
17
|
-
"maxWidth": {"type": "string|number", "description": "Maximum width constraint (number interpreted as px or CSS length).", "default": null, "values": ["number", "CSS units", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"], "category": "layout"},
|
|
18
|
-
"height": {"type": "string|number", "description": "Explicit height (number interpreted as px or CSS length).", "default": null, "values": ["number", "CSS units", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"], "category": "layout"},
|
|
19
|
-
"minHeight": {"type": "string|number", "description": "Minimum height constraint (number interpreted as px or CSS length).", "default": null, "values": ["number", "CSS units", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"], "category": "layout"},
|
|
20
|
-
"maxHeight": {"type": "string|number", "description": "Maximum height constraint (number interpreted as px or CSS length).", "default": null, "values": ["number", "CSS units", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"], "category": "layout"},
|
|
21
|
-
"radius": {"type": "string|number", "description": "Border radius token or CSS length applied to the component.", "default": null, "values": ["number", "CSS units", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"], "category": "style"},
|
|
22
|
-
"borderRadius": {"type": "string|number", "description": "Border radius token or CSS length applied to the component.", "default": null, "values": ["number", "CSS units", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"], "category": "style"},
|
|
23
|
-
"shadow": {"type": "string|boolean", "description": "Shadow token or CSS box-shadow string applied to the component.", "default": null, "values": ["none", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"], "category": "style"},
|
|
24
|
-
"mobile": {"type": "object", "description": "Responsive overrides applied at the base/mobile viewport.", "default": null, "values": null, "category": "layout"},
|
|
25
|
-
"tablet": {"type": "object", "description": "Responsive overrides applied from the tablet breakpoint upward.", "default": null, "values": null, "category": "layout"},
|
|
26
|
-
"pc": {"type": "object", "description": "Responsive overrides applied from the desktop breakpoint upward.", "default": null, "values": null, "category": "layout"},
|
|
27
|
-
"class": {"type": "string", "description": "Additional CSS classes applied to the component root element.", "default": null, "values": null, "category": "style"},
|
|
28
|
-
"style": {"type": "object", "description": "Inline styles applied to the component root element.", "default": null, "values": null, "category": "style"},
|
|
29
9
|
"columns": {"type": "Array<{ key, label?, sortable?, get?, value?, render?, format?, width?, minWidth?, maxWidth?, align?, compare?, style?, headerStyle?, thStyle?, cellStyle?, tdStyle?, cellClass?, headerClass?, nowrap?, searchable? }>", "description": "Column definitions for table-like components.", "default": null, "values": null, "category": "data"},
|
|
30
10
|
"rows": {"type": "Array|() => Array", "description": "Row data array for table-like components.", "default": null, "values": null, "category": "data"},
|
|
31
11
|
"rowKey": {"type": "string|((row)=>string)", "description": "Key or function used to derive unique row IDs.", "default": null, "values": null, "category": "general"},
|
|
@@ -86,7 +66,8 @@ Exact JSswift UI metadata contract. Use only the props, slots, events, and metho
|
|
|
86
66
|
"onRowDblClick": "(row, ctx, event) => void"
|
|
87
67
|
},
|
|
88
68
|
"returns": "HTMLDivElement",
|
|
89
|
-
"description": "Standardized table with toolbar, search, sorting, pagination, states, and flexible rendering."
|
|
69
|
+
"description": "Standardized table with toolbar, search, sorting, pagination, states, and flexible rendering.",
|
|
70
|
+
"commonProps": {"path": "ui/common-props.md", "keys": ["size", "color", "outline", "clickable", "padding", "margin", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "radius", "borderRadius", "shadow", "mobile", "tablet", "pc", "class", "style"]}
|
|
90
71
|
}
|
|
91
72
|
```
|
|
92
73
|
|
|
@@ -1,554 +1,52 @@
|
|
|
1
1
|
# Tabs
|
|
2
2
|
|
|
3
|
-
Exact JSswift UI
|
|
3
|
+
Exact JSswift UI contract. Shared definitions listed in `commonProps` are in [common props](../ui/common-props.md); all component-specific props, slots, events, and methods are below.
|
|
4
4
|
|
|
5
5
|
```json
|
|
6
6
|
{
|
|
7
7
|
"signature": "_.Tabs(props) | _.Tabs(props, ...children)",
|
|
8
8
|
"props": {
|
|
9
|
-
"
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
},
|
|
27
|
-
"
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
"values": [
|
|
32
|
-
"primary",
|
|
33
|
-
"secondary",
|
|
34
|
-
"success",
|
|
35
|
-
"warning",
|
|
36
|
-
"danger",
|
|
37
|
-
"info",
|
|
38
|
-
"light",
|
|
39
|
-
"dark"
|
|
40
|
-
],
|
|
41
|
-
"category": "style"
|
|
42
|
-
},
|
|
43
|
-
"outline": {
|
|
44
|
-
"type": "boolean",
|
|
45
|
-
"description": "Uses outlined visual style.",
|
|
46
|
-
"default": false,
|
|
47
|
-
"values": [
|
|
48
|
-
"number",
|
|
49
|
-
"CSS units",
|
|
50
|
-
"xxs",
|
|
51
|
-
"xs",
|
|
52
|
-
"sm",
|
|
53
|
-
"md",
|
|
54
|
-
"lg",
|
|
55
|
-
"xl",
|
|
56
|
-
"xxl",
|
|
57
|
-
"xxxl"
|
|
58
|
-
],
|
|
59
|
-
"category": "style"
|
|
60
|
-
},
|
|
61
|
-
"clickable": {
|
|
62
|
-
"type": "boolean",
|
|
63
|
-
"description": "Enables pointer/hover styles and click handling on the component.",
|
|
64
|
-
"default": false,
|
|
65
|
-
"values": null,
|
|
66
|
-
"category": "behavior"
|
|
67
|
-
},
|
|
68
|
-
"padding": {
|
|
69
|
-
"type": "string|number",
|
|
70
|
-
"description": "Padding applied to the component root element.",
|
|
71
|
-
"default": null,
|
|
72
|
-
"values": [
|
|
73
|
-
"number",
|
|
74
|
-
"CSS units",
|
|
75
|
-
"xxs",
|
|
76
|
-
"xs",
|
|
77
|
-
"sm",
|
|
78
|
-
"md",
|
|
79
|
-
"lg",
|
|
80
|
-
"xl",
|
|
81
|
-
"xxl",
|
|
82
|
-
"xxxl"
|
|
83
|
-
],
|
|
84
|
-
"category": "layout"
|
|
85
|
-
},
|
|
86
|
-
"margin": {
|
|
87
|
-
"type": "string|number",
|
|
88
|
-
"description": "Margin applied to the component root element.",
|
|
89
|
-
"default": null,
|
|
90
|
-
"values": [
|
|
91
|
-
"number",
|
|
92
|
-
"CSS units",
|
|
93
|
-
"xxs",
|
|
94
|
-
"xs",
|
|
95
|
-
"sm",
|
|
96
|
-
"md",
|
|
97
|
-
"lg",
|
|
98
|
-
"xl",
|
|
99
|
-
"xxl",
|
|
100
|
-
"xxxl"
|
|
101
|
-
],
|
|
102
|
-
"category": "layout"
|
|
103
|
-
},
|
|
104
|
-
"width": {
|
|
105
|
-
"type": "string|number",
|
|
106
|
-
"description": "Explicit width (number interpreted as px or CSS length).",
|
|
107
|
-
"default": null,
|
|
108
|
-
"values": [
|
|
109
|
-
"number",
|
|
110
|
-
"CSS units",
|
|
111
|
-
"xxs",
|
|
112
|
-
"xs",
|
|
113
|
-
"sm",
|
|
114
|
-
"md",
|
|
115
|
-
"lg",
|
|
116
|
-
"xl",
|
|
117
|
-
"xxl",
|
|
118
|
-
"xxxl"
|
|
119
|
-
],
|
|
120
|
-
"category": "layout"
|
|
121
|
-
},
|
|
122
|
-
"minWidth": {
|
|
123
|
-
"type": "string|number",
|
|
124
|
-
"description": "Minimum width constraint (number interpreted as px or CSS length).",
|
|
125
|
-
"default": null,
|
|
126
|
-
"values": [
|
|
127
|
-
"number",
|
|
128
|
-
"CSS units",
|
|
129
|
-
"xxs",
|
|
130
|
-
"xs",
|
|
131
|
-
"sm",
|
|
132
|
-
"md",
|
|
133
|
-
"lg",
|
|
134
|
-
"xl",
|
|
135
|
-
"xxl",
|
|
136
|
-
"xxxl"
|
|
137
|
-
],
|
|
138
|
-
"category": "layout"
|
|
139
|
-
},
|
|
140
|
-
"maxWidth": {
|
|
141
|
-
"type": "string|number",
|
|
142
|
-
"description": "Maximum width constraint (number interpreted as px or CSS length).",
|
|
143
|
-
"default": null,
|
|
144
|
-
"values": [
|
|
145
|
-
"number",
|
|
146
|
-
"CSS units",
|
|
147
|
-
"xxs",
|
|
148
|
-
"xs",
|
|
149
|
-
"sm",
|
|
150
|
-
"md",
|
|
151
|
-
"lg",
|
|
152
|
-
"xl",
|
|
153
|
-
"xxl",
|
|
154
|
-
"xxxl"
|
|
155
|
-
],
|
|
156
|
-
"category": "layout"
|
|
157
|
-
},
|
|
158
|
-
"height": {
|
|
159
|
-
"type": "string|number",
|
|
160
|
-
"description": "Explicit height (number interpreted as px or CSS length).",
|
|
161
|
-
"default": null,
|
|
162
|
-
"values": [
|
|
163
|
-
"number",
|
|
164
|
-
"CSS units",
|
|
165
|
-
"xxs",
|
|
166
|
-
"xs",
|
|
167
|
-
"sm",
|
|
168
|
-
"md",
|
|
169
|
-
"lg",
|
|
170
|
-
"xl",
|
|
171
|
-
"xxl",
|
|
172
|
-
"xxxl"
|
|
173
|
-
],
|
|
174
|
-
"category": "layout"
|
|
175
|
-
},
|
|
176
|
-
"minHeight": {
|
|
177
|
-
"type": "string|number",
|
|
178
|
-
"description": "Minimum height constraint (number interpreted as px or CSS length).",
|
|
179
|
-
"default": null,
|
|
180
|
-
"values": [
|
|
181
|
-
"number",
|
|
182
|
-
"CSS units",
|
|
183
|
-
"xxs",
|
|
184
|
-
"xs",
|
|
185
|
-
"sm",
|
|
186
|
-
"md",
|
|
187
|
-
"lg",
|
|
188
|
-
"xl",
|
|
189
|
-
"xxl",
|
|
190
|
-
"xxxl"
|
|
191
|
-
],
|
|
192
|
-
"category": "layout"
|
|
193
|
-
},
|
|
194
|
-
"maxHeight": {
|
|
195
|
-
"type": "string|number",
|
|
196
|
-
"description": "Maximum height constraint (number interpreted as px or CSS length).",
|
|
197
|
-
"default": null,
|
|
198
|
-
"values": [
|
|
199
|
-
"number",
|
|
200
|
-
"CSS units",
|
|
201
|
-
"xxs",
|
|
202
|
-
"xs",
|
|
203
|
-
"sm",
|
|
204
|
-
"md",
|
|
205
|
-
"lg",
|
|
206
|
-
"xl",
|
|
207
|
-
"xxl",
|
|
208
|
-
"xxxl"
|
|
209
|
-
],
|
|
210
|
-
"category": "layout"
|
|
211
|
-
},
|
|
212
|
-
"radius": {
|
|
213
|
-
"type": "string|number",
|
|
214
|
-
"description": "Border radius token or CSS length applied to the component.",
|
|
215
|
-
"default": null,
|
|
216
|
-
"values": [
|
|
217
|
-
"number",
|
|
218
|
-
"CSS units",
|
|
219
|
-
"xxs",
|
|
220
|
-
"xs",
|
|
221
|
-
"sm",
|
|
222
|
-
"md",
|
|
223
|
-
"lg",
|
|
224
|
-
"xl",
|
|
225
|
-
"xxl",
|
|
226
|
-
"xxxl"
|
|
227
|
-
],
|
|
228
|
-
"category": "style"
|
|
229
|
-
},
|
|
230
|
-
"borderRadius": {
|
|
231
|
-
"type": "string|number",
|
|
232
|
-
"description": "Border radius token or CSS length applied to the component.",
|
|
233
|
-
"default": null,
|
|
234
|
-
"values": [
|
|
235
|
-
"number",
|
|
236
|
-
"CSS units",
|
|
237
|
-
"xxs",
|
|
238
|
-
"xs",
|
|
239
|
-
"sm",
|
|
240
|
-
"md",
|
|
241
|
-
"lg",
|
|
242
|
-
"xl",
|
|
243
|
-
"xxl",
|
|
244
|
-
"xxxl"
|
|
245
|
-
],
|
|
246
|
-
"category": "style"
|
|
247
|
-
},
|
|
248
|
-
"shadow": {
|
|
249
|
-
"type": "string|boolean",
|
|
250
|
-
"description": "Shadow token or CSS box-shadow string applied to the component.",
|
|
251
|
-
"default": null,
|
|
252
|
-
"values": [
|
|
253
|
-
"none",
|
|
254
|
-
"xxs",
|
|
255
|
-
"xs",
|
|
256
|
-
"sm",
|
|
257
|
-
"md",
|
|
258
|
-
"lg",
|
|
259
|
-
"xl",
|
|
260
|
-
"xxl",
|
|
261
|
-
"xxxl"
|
|
262
|
-
],
|
|
263
|
-
"category": "style"
|
|
264
|
-
},
|
|
265
|
-
"mobile": {
|
|
266
|
-
"type": "object",
|
|
267
|
-
"description": "Responsive overrides applied at the base/mobile viewport.",
|
|
268
|
-
"default": null,
|
|
269
|
-
"values": null,
|
|
270
|
-
"category": "layout"
|
|
271
|
-
},
|
|
272
|
-
"tablet": {
|
|
273
|
-
"type": "object",
|
|
274
|
-
"description": "Responsive overrides applied from the tablet breakpoint upward.",
|
|
275
|
-
"default": null,
|
|
276
|
-
"values": null,
|
|
277
|
-
"category": "layout"
|
|
278
|
-
},
|
|
279
|
-
"pc": {
|
|
280
|
-
"type": "object",
|
|
281
|
-
"description": "Responsive overrides applied from the desktop breakpoint upward.",
|
|
282
|
-
"default": null,
|
|
283
|
-
"values": null,
|
|
284
|
-
"category": "layout"
|
|
285
|
-
},
|
|
286
|
-
"class": {
|
|
287
|
-
"type": "string",
|
|
288
|
-
"description": "Additional CSS classes applied to the component root element.",
|
|
289
|
-
"default": null,
|
|
290
|
-
"values": null,
|
|
291
|
-
"category": "style"
|
|
292
|
-
},
|
|
293
|
-
"style": {
|
|
294
|
-
"type": "object",
|
|
295
|
-
"description": "Inline styles applied to the component root element.",
|
|
296
|
-
"default": null,
|
|
297
|
-
"values": null,
|
|
298
|
-
"category": "style"
|
|
299
|
-
},
|
|
300
|
-
"tabs": {
|
|
301
|
-
"type": "Array<{ value|name|id|key, label|title, note|subtitle|description, icon, badge|counter, disabled, hidden, onClick }>",
|
|
302
|
-
"description": "Tab definitions array.",
|
|
303
|
-
"default": null,
|
|
304
|
-
"values": null,
|
|
305
|
-
"category": "general"
|
|
306
|
-
},
|
|
307
|
-
"items": {
|
|
308
|
-
"type": "Alias of tabs",
|
|
309
|
-
"description": "Array of items or nodes to render.",
|
|
310
|
-
"default": null,
|
|
311
|
-
"values": null,
|
|
312
|
-
"category": "data"
|
|
313
|
-
},
|
|
314
|
-
"value": {
|
|
315
|
-
"type": "any",
|
|
316
|
-
"description": "Current value (controlled).",
|
|
317
|
-
"default": null,
|
|
318
|
-
"values": null,
|
|
319
|
-
"category": "data"
|
|
320
|
-
},
|
|
321
|
-
"defaultValue": {
|
|
322
|
-
"type": "any",
|
|
323
|
-
"description": "Component configuration for \"defaultValue\". When not handled internally, it is forwarded to the root element.",
|
|
324
|
-
"default": null,
|
|
325
|
-
"values": null,
|
|
326
|
-
"category": "general"
|
|
327
|
-
},
|
|
328
|
-
"default": {
|
|
329
|
-
"type": "Alias of defaultValue",
|
|
330
|
-
"description": "Component configuration for \"default\". When not handled internally, it is forwarded to the root element.",
|
|
331
|
-
"default": null,
|
|
332
|
-
"values": null,
|
|
333
|
-
"category": "general"
|
|
334
|
-
},
|
|
335
|
-
"model": {
|
|
336
|
-
"type": "[get,set] signal",
|
|
337
|
-
"description": "Two-way bound value (alias to value in some components).",
|
|
338
|
-
"default": null,
|
|
339
|
-
"values": null,
|
|
340
|
-
"category": "data"
|
|
341
|
-
},
|
|
342
|
-
"orientation": {
|
|
343
|
-
"type": "horizontal|vertical",
|
|
344
|
-
"description": "Component configuration for \"orientation\". When not handled internally, it is forwarded to the root element.",
|
|
345
|
-
"default": null,
|
|
346
|
-
"values": null,
|
|
347
|
-
"category": "general"
|
|
348
|
-
},
|
|
349
|
-
"variant": {
|
|
350
|
-
"type": "line|pills|soft",
|
|
351
|
-
"description": "Component configuration for \"variant\". When not handled internally, it is forwarded to the root element.",
|
|
352
|
-
"default": null,
|
|
353
|
-
"values": null,
|
|
354
|
-
"category": "general"
|
|
355
|
-
},
|
|
356
|
-
"fill": {
|
|
357
|
-
"type": "boolean",
|
|
358
|
-
"description": "Component configuration for \"fill\". When not handled internally, it is forwarded to the root element.",
|
|
359
|
-
"default": null,
|
|
360
|
-
"values": null,
|
|
361
|
-
"category": "general"
|
|
362
|
-
},
|
|
363
|
-
"wrap": {
|
|
364
|
-
"type": "boolean",
|
|
365
|
-
"description": "Allows children to wrap to new lines.",
|
|
366
|
-
"default": null,
|
|
367
|
-
"values": null,
|
|
368
|
-
"category": "general"
|
|
369
|
-
},
|
|
370
|
-
"disabled": {
|
|
371
|
-
"type": "boolean",
|
|
372
|
-
"description": "Disables interaction and applies disabled styling/ARIA.",
|
|
373
|
-
"default": false,
|
|
374
|
-
"values": null,
|
|
375
|
-
"category": "state"
|
|
376
|
-
},
|
|
377
|
-
"state": {
|
|
378
|
-
"type": "string",
|
|
379
|
-
"description": "Component configuration for \"state\". When not handled internally, it is forwarded to the root element.",
|
|
380
|
-
"default": null,
|
|
381
|
-
"values": null,
|
|
382
|
-
"category": "general"
|
|
383
|
-
},
|
|
384
|
-
"gap": {
|
|
385
|
-
"type": "string|number",
|
|
386
|
-
"description": "Gap/spacing between child elements.",
|
|
387
|
-
"default": null,
|
|
388
|
-
"values": null,
|
|
389
|
-
"category": "general"
|
|
390
|
-
},
|
|
391
|
-
"tabGap": {
|
|
392
|
-
"type": "string|number",
|
|
393
|
-
"description": "Component configuration for \"tabGap\". When not handled internally, it is forwarded to the root element.",
|
|
394
|
-
"default": null,
|
|
395
|
-
"values": null,
|
|
396
|
-
"category": "general"
|
|
397
|
-
},
|
|
398
|
-
"align": {
|
|
399
|
-
"type": "string",
|
|
400
|
-
"description": "Alignment of content along the cross axis (e.g. left/center/right).",
|
|
401
|
-
"default": null,
|
|
402
|
-
"values": [
|
|
403
|
-
"left",
|
|
404
|
-
"center",
|
|
405
|
-
"right"
|
|
406
|
-
],
|
|
407
|
-
"category": "general"
|
|
408
|
-
},
|
|
409
|
-
"justify": {
|
|
410
|
-
"type": "string",
|
|
411
|
-
"description": "Justification of items along the main axis.",
|
|
412
|
-
"default": null,
|
|
413
|
-
"values": [
|
|
414
|
-
"start",
|
|
415
|
-
"center",
|
|
416
|
-
"end",
|
|
417
|
-
"space-between",
|
|
418
|
-
"space-around",
|
|
419
|
-
"space-evenly"
|
|
420
|
-
],
|
|
421
|
-
"category": "general"
|
|
422
|
-
},
|
|
423
|
-
"dense": {
|
|
424
|
-
"type": "boolean",
|
|
425
|
-
"description": "Uses compact spacing and sizing.",
|
|
426
|
-
"default": false,
|
|
427
|
-
"values": null,
|
|
428
|
-
"category": "layout"
|
|
429
|
-
},
|
|
430
|
-
"navClass": {
|
|
431
|
-
"type": "string",
|
|
432
|
-
"description": "Component configuration for \"navClass\". When not handled internally, it is forwarded to the root element.",
|
|
433
|
-
"default": null,
|
|
434
|
-
"values": null,
|
|
435
|
-
"category": "general"
|
|
436
|
-
},
|
|
437
|
-
"tabClass": {
|
|
438
|
-
"type": "string",
|
|
439
|
-
"description": "Component configuration for \"tabClass\". When not handled internally, it is forwarded to the root element.",
|
|
440
|
-
"default": null,
|
|
441
|
-
"values": null,
|
|
442
|
-
"category": "general"
|
|
443
|
-
},
|
|
444
|
-
"itemClass": {
|
|
445
|
-
"type": "string",
|
|
446
|
-
"description": "Component configuration for \"itemClass\". When not handled internally, it is forwarded to the root element.",
|
|
447
|
-
"default": null,
|
|
448
|
-
"values": null,
|
|
449
|
-
"category": "general"
|
|
450
|
-
},
|
|
451
|
-
"slots": {
|
|
452
|
-
"type": "{ nav?, tab?, label?, icon?, note?, badge?, extra?, empty?, default? }",
|
|
453
|
-
"description": "Named slots map for render overrides.",
|
|
454
|
-
"default": null,
|
|
455
|
-
"values": null,
|
|
456
|
-
"category": "general"
|
|
457
|
-
},
|
|
458
|
-
"children": {
|
|
459
|
-
"type": "Node|Array|Function",
|
|
460
|
-
"description": "Default child content (nodes, arrays, or render function).",
|
|
461
|
-
"default": null,
|
|
462
|
-
"values": null,
|
|
463
|
-
"category": "general"
|
|
464
|
-
}
|
|
9
|
+
"tabs": {"type": "Array<{ value|name|id|key, label|title, note|subtitle|description, icon, badge|counter, disabled, hidden, onClick }>", "description": "Tab definitions array.", "default": null, "values": null, "category": "general"},
|
|
10
|
+
"items": {"type": "Alias of tabs", "description": "Array of items or nodes to render.", "default": null, "values": null, "category": "data"},
|
|
11
|
+
"value": {"type": "any", "description": "Current value (controlled).", "default": null, "values": null, "category": "data"},
|
|
12
|
+
"defaultValue": {"type": "any", "description": "Component configuration for \"defaultValue\". When not handled internally, it is forwarded to the root element.", "default": null, "values": null, "category": "general"},
|
|
13
|
+
"default": {"type": "Alias of defaultValue", "description": "Component configuration for \"default\". When not handled internally, it is forwarded to the root element.", "default": null, "values": null, "category": "general"},
|
|
14
|
+
"model": {"type": "[get,set] signal", "description": "Two-way bound value (alias to value in some components).", "default": null, "values": null, "category": "data"},
|
|
15
|
+
"orientation": {"type": "horizontal|vertical", "description": "Component configuration for \"orientation\". When not handled internally, it is forwarded to the root element.", "default": null, "values": null, "category": "general"},
|
|
16
|
+
"variant": {"type": "line|pills|soft", "description": "Component configuration for \"variant\". When not handled internally, it is forwarded to the root element.", "default": null, "values": null, "category": "general"},
|
|
17
|
+
"fill": {"type": "boolean", "description": "Component configuration for \"fill\". When not handled internally, it is forwarded to the root element.", "default": null, "values": null, "category": "general"},
|
|
18
|
+
"wrap": {"type": "boolean", "description": "Allows children to wrap to new lines.", "default": null, "values": null, "category": "general"},
|
|
19
|
+
"disabled": {"type": "boolean", "description": "Disables interaction and applies disabled styling/ARIA.", "default": false, "values": null, "category": "state"},
|
|
20
|
+
"state": {"type": "string", "description": "Component configuration for \"state\". When not handled internally, it is forwarded to the root element.", "default": null, "values": null, "category": "general"},
|
|
21
|
+
"gap": {"type": "string|number", "description": "Gap/spacing between child elements.", "default": null, "values": null, "category": "general"},
|
|
22
|
+
"tabGap": {"type": "string|number", "description": "Component configuration for \"tabGap\". When not handled internally, it is forwarded to the root element.", "default": null, "values": null, "category": "general"},
|
|
23
|
+
"align": {"type": "string", "description": "Alignment of content along the cross axis (e.g. left/center/right).", "default": null, "values": ["left", "center", "right"], "category": "general"},
|
|
24
|
+
"justify": {"type": "string", "description": "Justification of items along the main axis.", "default": null, "values": ["start", "center", "end", "space-between", "space-around", "space-evenly"], "category": "general"},
|
|
25
|
+
"dense": {"type": "boolean", "description": "Uses compact spacing and sizing.", "default": false, "values": null, "category": "layout"},
|
|
26
|
+
"navClass": {"type": "string", "description": "Component configuration for \"navClass\". When not handled internally, it is forwarded to the root element.", "default": null, "values": null, "category": "general"},
|
|
27
|
+
"tabClass": {"type": "string", "description": "Component configuration for \"tabClass\". When not handled internally, it is forwarded to the root element.", "default": null, "values": null, "category": "general"},
|
|
28
|
+
"itemClass": {"type": "string", "description": "Component configuration for \"itemClass\". When not handled internally, it is forwarded to the root element.", "default": null, "values": null, "category": "general"},
|
|
29
|
+
"slots": {"type": "{ nav?, tab?, label?, icon?, note?, badge?, extra?, empty?, default? }", "description": "Named slots map for render overrides.", "default": null, "values": null, "category": "general"},
|
|
30
|
+
"children": {"type": "Node|Array|Function", "description": "Default child content (nodes, arrays, or render function).", "default": null, "values": null, "category": "general"}
|
|
465
31
|
},
|
|
466
32
|
"slots": {
|
|
467
|
-
"nav": {
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
},
|
|
474
|
-
"
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
"default": null,
|
|
478
|
-
"values": null,
|
|
479
|
-
"category": "slot"
|
|
480
|
-
},
|
|
481
|
-
"label": {
|
|
482
|
-
"type": "Label renderer",
|
|
483
|
-
"description": "Slot for label content.",
|
|
484
|
-
"default": null,
|
|
485
|
-
"values": null,
|
|
486
|
-
"category": "slot"
|
|
487
|
-
},
|
|
488
|
-
"icon": {
|
|
489
|
-
"type": "Icon renderer",
|
|
490
|
-
"description": "Slot for icon content.",
|
|
491
|
-
"default": null,
|
|
492
|
-
"values": [
|
|
493
|
-
"#name_tabler",
|
|
494
|
-
"name_material",
|
|
495
|
-
"class"
|
|
496
|
-
],
|
|
497
|
-
"category": "slot"
|
|
498
|
-
},
|
|
499
|
-
"note": {
|
|
500
|
-
"type": "Note renderer",
|
|
501
|
-
"description": "Slot for note/secondary text.",
|
|
502
|
-
"default": null,
|
|
503
|
-
"values": null,
|
|
504
|
-
"category": "state"
|
|
505
|
-
},
|
|
506
|
-
"badge": {
|
|
507
|
-
"type": "Badge/counter renderer",
|
|
508
|
-
"description": "Slot content for \"badge\". Accepts nodes, arrays, or render functions.",
|
|
509
|
-
"default": null,
|
|
510
|
-
"values": null,
|
|
511
|
-
"category": "slot"
|
|
512
|
-
},
|
|
513
|
-
"extra": {
|
|
514
|
-
"type": "Extra area next to the nav",
|
|
515
|
-
"description": "Slot content for \"extra\". Accepts nodes, arrays, or render functions.",
|
|
516
|
-
"default": null,
|
|
517
|
-
"values": null,
|
|
518
|
-
"category": "slot"
|
|
519
|
-
},
|
|
520
|
-
"empty": {
|
|
521
|
-
"type": "Fallback when tabs/items are empty",
|
|
522
|
-
"description": "Slot for empty-state content.",
|
|
523
|
-
"default": null,
|
|
524
|
-
"values": null,
|
|
525
|
-
"category": "slot"
|
|
526
|
-
},
|
|
527
|
-
"default": {
|
|
528
|
-
"type": "Children / extra content fallback",
|
|
529
|
-
"description": "Primary content for the component.",
|
|
530
|
-
"default": null,
|
|
531
|
-
"values": null,
|
|
532
|
-
"category": "slot"
|
|
533
|
-
},
|
|
534
|
-
"iconRight": {
|
|
535
|
-
"type": "Icon renderer",
|
|
536
|
-
"description": "Slot for right-aligned icon content."
|
|
537
|
-
}
|
|
33
|
+
"nav": {"type": "Full nav renderer", "description": "Slot content for \"nav\". Accepts nodes, arrays, or render functions.", "default": null, "values": null, "category": "slot"},
|
|
34
|
+
"tab": {"type": "Single tab renderer", "description": "Slot for custom tab label/content.", "default": null, "values": null, "category": "slot"},
|
|
35
|
+
"label": {"type": "Label renderer", "description": "Slot for label content.", "default": null, "values": null, "category": "slot"},
|
|
36
|
+
"icon": {"type": "Icon renderer", "description": "Slot for icon content.", "default": null, "values": ["#name_tabler", "name_material", "class"], "category": "slot"},
|
|
37
|
+
"note": {"type": "Note renderer", "description": "Slot for note/secondary text.", "default": null, "values": null, "category": "state"},
|
|
38
|
+
"badge": {"type": "Badge/counter renderer", "description": "Slot content for \"badge\". Accepts nodes, arrays, or render functions.", "default": null, "values": null, "category": "slot"},
|
|
39
|
+
"extra": {"type": "Extra area next to the nav", "description": "Slot content for \"extra\". Accepts nodes, arrays, or render functions.", "default": null, "values": null, "category": "slot"},
|
|
40
|
+
"empty": {"type": "Fallback when tabs/items are empty", "description": "Slot for empty-state content.", "default": null, "values": null, "category": "slot"},
|
|
41
|
+
"default": {"type": "Children / extra content fallback", "description": "Primary content for the component.", "default": null, "values": null, "category": "slot"},
|
|
42
|
+
"iconRight": {"type": "Icon renderer", "description": "Slot for right-aligned icon content."}
|
|
538
43
|
},
|
|
539
44
|
"events": {
|
|
540
45
|
"onChange": "(value, tab, event, index)"
|
|
541
46
|
},
|
|
542
|
-
"keyboard": [
|
|
543
|
-
"Enter/Space",
|
|
544
|
-
"ArrowLeft",
|
|
545
|
-
"ArrowRight",
|
|
546
|
-
"ArrowUp",
|
|
547
|
-
"ArrowDown",
|
|
548
|
-
"Home",
|
|
549
|
-
"End"
|
|
550
|
-
],
|
|
47
|
+
"keyboard": ["Enter/Space", "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End"],
|
|
551
48
|
"returns": "HTMLDivElement con ._getValue(), ._setValue(value), ._select(value), ._next(), ._prev(), ._getTabs()",
|
|
552
|
-
"description": "Standardized tab bar with controlled/uncontrolled support, structured slots, badge/note/icon, and keyboard navigation."
|
|
49
|
+
"description": "Standardized tab bar with controlled/uncontrolled support, structured slots, badge/note/icon, and keyboard navigation.",
|
|
50
|
+
"commonProps": {"path": "ui/common-props.md", "keys": ["size", "color", "outline", "clickable", "padding", "margin", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "radius", "borderRadius", "shadow", "mobile", "tablet", "pc", "class", "style"]}
|
|
553
51
|
}
|
|
554
52
|
```
|