@smwb/ui-mcp-react 2.7.0 → 2.8.0
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/component-meta/base/icon/icon.json +6 -1
- package/component-meta/base/ripple/ripple.json +6 -1
- package/component-meta/connects/rt/table/table.json +1 -1
- package/component-meta/dataDisplay/avatar/avatar.avatarGroup.json +5 -0
- package/component-meta/dataDisplay/avatar/avatar.json +5 -0
- package/component-meta/dataDisplay/card/card.json +10 -5
- package/component-meta/dataDisplay/chart/chart.json +5 -0
- package/component-meta/dataDisplay/chat/chatLayout.json +5 -0
- package/component-meta/dataDisplay/chat/chatOverlayLayout.json +5 -0
- package/component-meta/dataDisplay/chip/chip.json +14 -4
- package/component-meta/dataDisplay/descriptionList/descriptionList.json +1 -1
- package/component-meta/dataDisplay/kanban/kanban.json +5 -0
- package/component-meta/dataDisplay/kanban/kanban.kanbanCard.json +5 -0
- package/component-meta/dataDisplay/kanban/kanban.kanbanColumn.json +5 -0
- package/component-meta/dataDisplay/list/list.json +5 -0
- package/component-meta/dataDisplay/meter/meter.json +5 -0
- package/component-meta/dataDisplay/personChip/personChip.json +5 -0
- package/component-meta/dataDisplay/stat/stat.json +5 -0
- package/component-meta/dataDisplay/table/table.json +1 -1
- package/component-meta/dataDisplay/table/tableCell.json +6 -1
- package/component-meta/dataDisplay/table/tableHeadCell.json +11 -1
- package/component-meta/dataDisplay/table/tableRow.json +5 -0
- package/component-meta/dataDisplay/thumbCard/thumbCard.json +16 -6
- package/component-meta/dataDisplay/treeView/treeView.json +5 -0
- package/component-meta/feedBack/emptyState/emptyState.json +5 -0
- package/component-meta/feedBack/message/message.json +5 -0
- package/component-meta/feedBack/skeleton/skeleton.json +7 -2
- package/component-meta/feedBack/tooltip/tooltip.json +4 -4
- package/component-meta/inputs/button/button.json +5 -0
- package/component-meta/inputs/buttonGroups/buttonGroup.json +5 -0
- package/component-meta/inputs/checkbox/checkbox.json +2 -2
- package/component-meta/inputs/radioButton/radioButton.json +6 -1
- package/component-meta/inputs/rating/rating.json +11 -1
- package/component-meta/inputs/selectField/dropdownMenu.json +45 -0
- package/component-meta/inputs/selectField/selectField.json +6 -6
- package/component-meta/inputs/slider/slider.json +8 -3
- package/component-meta/inputs/textField/textField.json +3 -3
- package/component-meta/inputs/textField/textFieldWrapper.json +16 -1
- package/component-meta/inputs/toggle/toggle.json +1 -1
- package/component-meta/inputs/valueSlider/valueSlider.json +13 -8
- package/component-meta/layout/appLayout/appLayout.json +5 -0
- package/component-meta/layout/divider/divider.json +5 -0
- package/component-meta/layout/floatingWindow/floatingWindow.json +5 -0
- package/component-meta/layout/grid/grid.column.json +1 -1
- package/component-meta/layout/grid/grid.container.json +5 -0
- package/component-meta/layout/grid/grid.row.json +5 -0
- package/component-meta/layout/page/page.json +5 -0
- package/component-meta/layout/pageHeader/pageHeader.json +5 -0
- package/component-meta/layout/sectionHeader/sectionHeader.json +5 -0
- package/component-meta/layout/sheet/sheet.json +5 -0
- package/component-meta/layout/stack/stack.json +5 -0
- package/component-meta/navigation/appBar/appBar.json +5 -0
- package/component-meta/navigation/breadcrumbs/breadcrumbs.json +5 -0
- package/component-meta/navigation/menu/menu.json +1 -1
- package/component-meta/navigation/menu/menuItem.json +1 -1
- package/component-meta/navigation/pagination/pagination.json +5 -0
- package/component-meta/navigation/stepper/stepper.json +5 -0
- package/component-meta/navigation/tabs/tabs.json +3 -3
- package/package.json +3 -3
|
@@ -59,12 +59,17 @@
|
|
|
59
59
|
"title": {
|
|
60
60
|
"type": "string",
|
|
61
61
|
"required": false,
|
|
62
|
-
"description": "Accessible name.
|
|
62
|
+
"description": "Accessible name, also shown as a tooltip. A non-empty `title`,\n`aria-label` or `aria-labelledby` names the icon: it is exposed as\n`role=\"img\"`, or with the `role` you pass. Without any of them the icon is\ndecorative and `aria-hidden`."
|
|
63
63
|
},
|
|
64
64
|
"source": {
|
|
65
65
|
"type": "IconSource",
|
|
66
66
|
"required": false,
|
|
67
67
|
"description": "Overrides the icon source for this icon only. See IconSource."
|
|
68
|
+
},
|
|
69
|
+
"data-testid": {
|
|
70
|
+
"type": "string",
|
|
71
|
+
"required": false,
|
|
72
|
+
"description": "Test id of the root `<span>`; `icon` unless given."
|
|
68
73
|
}
|
|
69
74
|
}
|
|
70
75
|
}
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"classes": {
|
|
30
30
|
"type": "RippleClasses",
|
|
31
31
|
"required": false,
|
|
32
|
-
"description": "
|
|
32
|
+
"description": "Extra classes: `ripple` for the root, `child` for each ripple."
|
|
33
33
|
},
|
|
34
34
|
"center": {
|
|
35
35
|
"type": "boolean",
|
|
@@ -45,6 +45,11 @@
|
|
|
45
45
|
"type": "string",
|
|
46
46
|
"required": false,
|
|
47
47
|
"description": "Ripple color (any CSS color). Defaults to inherited currentColor."
|
|
48
|
+
},
|
|
49
|
+
"data-testid": {
|
|
50
|
+
"type": "string",
|
|
51
|
+
"required": false,
|
|
52
|
+
"description": "Test id of the root `<span>`; `ripple` unless given."
|
|
48
53
|
}
|
|
49
54
|
}
|
|
50
55
|
}
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
"rendering": "universal"
|
|
7
7
|
},
|
|
8
8
|
"extends": [
|
|
9
|
-
"SMWBTableProps & {\n withPagination?: boolean;\n isInfinite?: boolean;\n dense?: boolean;\n limit?: number;\n limitOptions?: number[];\n sortable?: boolean;\n expandable?: boolean;\n draggableColumns?: boolean;\n enableColumnResizing?: boolean;\n onColumnSizingChange?: (oldValue: ColumnSizingState, newValue: ColumnSizingState) => void;\n onColumnOrderChange?: (oldValue: ColumnOrderState, newValue: ColumnOrderState) => void;\n getRowCanExpand?: (row: Row<TData>) => boolean;\n renderSubComponent?: (props: { row: Row<TData> }) => React.ReactElement;\n cellAlign?: \"left\" | \"right\" | \"center\";\n isLoading?: boolean;\n onNextPage?: () => void;\n onPrevPage?: () => void;\n error?: string;\n onHeadCellClick?: (colDef?: ColumnDef<TData, TValue>) => void;\n headerCellInnerRenderer?: React.ReactElement;\n onBodyRowClick?: (row: Row<TData>, event: React.MouseEvent<HTMLTableRowElement>) => void;\n data: TData[];\n columns: ColumnDef<TData, TValue>[];\n columnResizeMode?: ColumnResizeMode;\n}"
|
|
9
|
+
"SMWBTableProps & {\n withPagination?: boolean;\n isInfinite?: boolean;\n dense?: boolean;\n limit?: number;\n limitOptions?: number[];\n sortable?: boolean;\n expandable?: boolean;\n draggableColumns?: boolean;\n enableColumnResizing?: boolean;\n onColumnSizingChange?: (oldValue: ColumnSizingState, newValue: ColumnSizingState) => void;\n onColumnOrderChange?: (oldValue: ColumnOrderState, newValue: ColumnOrderState) => void;\n getRowCanExpand?: (row: Row<TData>) => boolean;\n renderSubComponent?: (props: { row: Row<TData> }) => React.ReactElement;\n cellAlign?: \"left\" | \"right\" | \"center\";\n isLoading?: boolean;\n onNextPage?: () => void;\n onPrevPage?: () => void;\n error?: string;\n onHeadCellClick?: (colDef?: ColumnDef<TData, TValue>) => void;\n headerCellInnerRenderer?: React.ReactElement;\n onBodyRowClick?: (row: Row<TData>, event: React.MouseEvent<HTMLTableRowElement>) => void;\n data: TData[];\n /**\n * TanStack column definitions. A column's `meta` may add `headerActions`\n * (controls drawn beside the sort control in its head cell), `label` (its\n * name on stacked rows), `cellProps` (attributes of its body cells) and\n * `draggableColumn`.\n */\n columns: ColumnDef<TData, TValue>[];\n columnResizeMode?: ColumnResizeMode;\n}"
|
|
10
10
|
],
|
|
11
11
|
"styles": {
|
|
12
12
|
"base": [
|
|
@@ -50,6 +50,11 @@
|
|
|
50
50
|
"type": "AvatarSize | number",
|
|
51
51
|
"required": false,
|
|
52
52
|
"description": "Size of the \"+N\" surplus chip: match the avatars in the group."
|
|
53
|
+
},
|
|
54
|
+
"data-testid": {
|
|
55
|
+
"type": "string",
|
|
56
|
+
"required": false,
|
|
57
|
+
"description": "Test id of the root `<div>`; `avatar-group` unless given."
|
|
53
58
|
}
|
|
54
59
|
}
|
|
55
60
|
}
|
|
@@ -55,6 +55,11 @@
|
|
|
55
55
|
"type": "ImgHTMLAttributes<HTMLImageElement>",
|
|
56
56
|
"required": false,
|
|
57
57
|
"description": "Extra attributes forwarded to the underlying <img> (srcSet, loading…)."
|
|
58
|
+
},
|
|
59
|
+
"data-testid": {
|
|
60
|
+
"type": "string",
|
|
61
|
+
"required": false,
|
|
62
|
+
"description": "Test id of the root `<div>`; `avatar` unless given."
|
|
58
63
|
}
|
|
59
64
|
}
|
|
60
65
|
}
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
"className": {
|
|
25
25
|
"type": "string",
|
|
26
26
|
"required": false,
|
|
27
|
-
"description": "
|
|
27
|
+
"description": "Class name(s) for the root `<div>`, the card's box. `style`, `id`, `data-*`, `aria-hidden`, `ref` and event\nhandlers go to the root too. With `onClick`, `role`, `tabIndex`, `onFocus`, `onBlur` and the other `aria-*`\nattributes go to the card's button, `.smwb-card__content` (the title and the children), which is also the element\nto focus. Without `onClick` the card is not a control, and they stay on the root, which holds the footer too."
|
|
28
28
|
},
|
|
29
29
|
"variant": {
|
|
30
30
|
"type": "\"filled\" | \"elevated\" | \"outlined\"",
|
|
@@ -34,22 +34,27 @@
|
|
|
34
34
|
"disabled": {
|
|
35
35
|
"type": "boolean",
|
|
36
36
|
"required": false,
|
|
37
|
-
"description": "
|
|
37
|
+
"description": "Disables the card: it says `aria-disabled`, and neither clicks nor keys run `onClick`. With `onClick` the card is\nstill a button, out of the tab order."
|
|
38
38
|
},
|
|
39
39
|
"title": {
|
|
40
40
|
"type": "string",
|
|
41
41
|
"required": false,
|
|
42
|
-
"description": "
|
|
42
|
+
"description": "A heading drawn at the top of the card, not the `title` attribute. With `onClick` it is part of the card's button,\nand the button's name starts with it."
|
|
43
43
|
},
|
|
44
44
|
"footer": {
|
|
45
45
|
"type": "ReactNode",
|
|
46
46
|
"required": false,
|
|
47
|
-
"description": "Footer slot rendered after the content."
|
|
47
|
+
"description": "Footer slot rendered after the content. With `onClick` it sits beside the card's button, not inside it, so\ncontrols here keep their own names, clicks and keys; see `onClick`."
|
|
48
48
|
},
|
|
49
49
|
"onClick": {
|
|
50
50
|
"type": "React.MouseEventHandler<HTMLDivElement>",
|
|
51
51
|
"required": false,
|
|
52
|
-
"description": "Makes the card interactive (
|
|
52
|
+
"description": "Makes the card interactive: its content (the title and the children) becomes a button, named by that content, with\na focus ring around the whole card. The footer is not part of that button but its sibling, so the card's controls\ngo there: a control in the children would sit inside the button, and its name would join the card's.\n\nRuns when the card is activated: a click on it, or Enter / Space while its button has focus. A click on a control\n(button, link, input, anything focusable), in the footer or the children, or in a portal opened from the card does\nnot run it, and neither do Enter / Space pressed on such a control. Content that is not a control keeps its click\nfrom activating the card by calling `preventDefault()` on it."
|
|
53
|
+
},
|
|
54
|
+
"data-testid": {
|
|
55
|
+
"type": "string",
|
|
56
|
+
"required": false,
|
|
57
|
+
"description": "Test id of the root `<div>`; `card` unless given."
|
|
53
58
|
}
|
|
54
59
|
}
|
|
55
60
|
}
|
|
@@ -68,6 +68,11 @@
|
|
|
68
68
|
"type": "(chart: ChartInstance) => void",
|
|
69
69
|
"required": false,
|
|
70
70
|
"description": "The ECharts instance, once it has drawn — for other events and actions. Called again if a theme change re-creates it."
|
|
71
|
+
},
|
|
72
|
+
"data-testid": {
|
|
73
|
+
"type": "string",
|
|
74
|
+
"required": false,
|
|
75
|
+
"description": "Test id of the root `<div>`; `chart` unless given."
|
|
71
76
|
}
|
|
72
77
|
}
|
|
73
78
|
}
|
|
@@ -89,6 +89,11 @@
|
|
|
89
89
|
"type": "ChatLayoutChatProps",
|
|
90
90
|
"required": true,
|
|
91
91
|
"description": "Chat configuration passed to ChatLayout."
|
|
92
|
+
},
|
|
93
|
+
"data-testid": {
|
|
94
|
+
"type": "string",
|
|
95
|
+
"required": false,
|
|
96
|
+
"description": "Test id of the root `<div>`; `chat-layout` unless given."
|
|
92
97
|
}
|
|
93
98
|
}
|
|
94
99
|
}
|
|
@@ -74,6 +74,11 @@
|
|
|
74
74
|
"type": "ChatOverlayLayoutChatProps",
|
|
75
75
|
"required": true,
|
|
76
76
|
"description": "Chat configuration passed to ChatLayout."
|
|
77
|
+
},
|
|
78
|
+
"data-testid": {
|
|
79
|
+
"type": "string",
|
|
80
|
+
"required": false,
|
|
81
|
+
"description": "Test id of the root `<div>`; `chat-overlay-layout` unless given."
|
|
77
82
|
}
|
|
78
83
|
}
|
|
79
84
|
}
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
"className": {
|
|
28
28
|
"type": "string",
|
|
29
29
|
"required": false,
|
|
30
|
-
"description": "
|
|
30
|
+
"description": "Class name(s) for the chip's root, a `<span>` (an `<a>` with `asLink`). `style`, `id`, `data-*`, `aria-hidden`,\n`ref` and event handlers go to the root too. In a clickable chip (`onClick`), `role`, `tabIndex`, `onFocus`,\n`onBlur` and the other `aria-*` attributes go to its button, `.smwb-chip__content` (the icon and the label), which\nis also the element to focus. Otherwise they stay on the root, which holds the delete button too."
|
|
31
31
|
},
|
|
32
32
|
"variant": {
|
|
33
33
|
"type": "\"filled\" | \"outlined\"",
|
|
@@ -47,7 +47,7 @@
|
|
|
47
47
|
"onDelete": {
|
|
48
48
|
"type": "(event: React.SyntheticEvent) => void",
|
|
49
49
|
"required": false,
|
|
50
|
-
"description": "
|
|
50
|
+
"description": "Shows a delete button in the chip and runs when it is pressed: a click, or\nEnter / Space while the button has focus. In a clickable chip it sits\nbeside the chip's button, not inside it, and pressing it does not run the\nchip's `onClick`."
|
|
51
51
|
},
|
|
52
52
|
"icon": {
|
|
53
53
|
"type": "React.ReactNode",
|
|
@@ -67,7 +67,7 @@
|
|
|
67
67
|
"onClick": {
|
|
68
68
|
"type": "() => void",
|
|
69
69
|
"required": false,
|
|
70
|
-
"description": "
|
|
70
|
+
"description": "Makes the chip clickable: its icon and label become a button, named by\nthem, with a focus ring around the whole chip. The delete button is not\npart of that button but its sibling, so it keeps its own name.\n\nRuns on a click on the chip and on Enter / Space while the chip's button\nhas focus, but not on a click or key on the delete button."
|
|
71
71
|
},
|
|
72
72
|
"onDeleteMouseDown": {
|
|
73
73
|
"type": "React.MouseEventHandler",
|
|
@@ -77,7 +77,7 @@
|
|
|
77
77
|
"disabled": {
|
|
78
78
|
"type": "boolean",
|
|
79
79
|
"required": false,
|
|
80
|
-
"description": "
|
|
80
|
+
"description": "Disables the chip: it is dimmed, takes no pointer input and says `aria-disabled`, and its delete button is\ndisabled too. With `onClick` the chip is still a button, out of the tab order."
|
|
81
81
|
},
|
|
82
82
|
"asLink": {
|
|
83
83
|
"type": "boolean",
|
|
@@ -99,10 +99,20 @@
|
|
|
99
99
|
"required": false,
|
|
100
100
|
"description": "Controlled selected tab index or value."
|
|
101
101
|
},
|
|
102
|
+
"labelId": {
|
|
103
|
+
"type": "string",
|
|
104
|
+
"required": false,
|
|
105
|
+
"description": "Id of the label's element, for another element to take the chip's text as\nits name (`aria-labelledby`) without the delete button's name."
|
|
106
|
+
},
|
|
102
107
|
"deleteAriaLabel": {
|
|
103
108
|
"type": "string",
|
|
104
109
|
"required": false,
|
|
105
110
|
"description": "Accessible label for the delete control."
|
|
111
|
+
},
|
|
112
|
+
"data-testid": {
|
|
113
|
+
"type": "string",
|
|
114
|
+
"required": false,
|
|
115
|
+
"description": "Test id of the root; `chip`, or `chip-link` for a link, unless given."
|
|
106
116
|
}
|
|
107
117
|
}
|
|
108
118
|
}
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
"layout": {
|
|
35
35
|
"type": "DescriptionListLayout",
|
|
36
36
|
"required": false,
|
|
37
|
-
"description": "
|
|
37
|
+
"description": "\"auto\" (default): each term beside its value while the list is at least\n420px wide, above it when narrower — the list's own width decides. So its\ncontent does not widen it: where the parent takes its width from its\ncontent (a flex item that does not grow, a popover, a table cell) the list\nhas no width; give it one there, or use \"row\" / \"stacked\", which fix one\nlayout and take their width from their content."
|
|
38
38
|
},
|
|
39
39
|
"termWidth": {
|
|
40
40
|
"type": "number | string",
|
|
@@ -30,6 +30,11 @@
|
|
|
30
30
|
"type": "number | string",
|
|
31
31
|
"required": false,
|
|
32
32
|
"description": "The narrowest a column gets before the board scrolls sideways: a number of\npixels or any CSS length. 15.5rem by default."
|
|
33
|
+
},
|
|
34
|
+
"data-testid": {
|
|
35
|
+
"type": "string",
|
|
36
|
+
"required": false,
|
|
37
|
+
"description": "Test id of the root `<div>`; `kanban` unless given."
|
|
33
38
|
}
|
|
34
39
|
}
|
|
35
40
|
}
|
|
@@ -40,6 +40,11 @@
|
|
|
40
40
|
"type": "number",
|
|
41
41
|
"required": false,
|
|
42
42
|
"description": "Lines the title is clamped to: 3 by default."
|
|
43
|
+
},
|
|
44
|
+
"data-testid": {
|
|
45
|
+
"type": "string",
|
|
46
|
+
"required": false,
|
|
47
|
+
"description": "Test id of the card's `<li>`; `kanban-card` unless given."
|
|
43
48
|
}
|
|
44
49
|
}
|
|
45
50
|
}
|
|
@@ -50,6 +50,11 @@
|
|
|
50
50
|
"type": "ReactNode",
|
|
51
51
|
"required": false,
|
|
52
52
|
"description": "Under the cards, e.g. a link to the rest as a list."
|
|
53
|
+
},
|
|
54
|
+
"data-testid": {
|
|
55
|
+
"type": "string",
|
|
56
|
+
"required": false,
|
|
57
|
+
"description": "Test id of the column's `<div>`; `kanban-column` unless given."
|
|
53
58
|
}
|
|
54
59
|
}
|
|
55
60
|
}
|
|
@@ -35,6 +35,11 @@
|
|
|
35
35
|
"type": "ReactNode",
|
|
36
36
|
"required": false,
|
|
37
37
|
"description": "Section subheader rendered before the items."
|
|
38
|
+
},
|
|
39
|
+
"data-testid": {
|
|
40
|
+
"type": "string",
|
|
41
|
+
"required": false,
|
|
42
|
+
"description": "Test id of the root `<ul>`; `list` unless given."
|
|
38
43
|
}
|
|
39
44
|
}
|
|
40
45
|
}
|
|
@@ -65,6 +65,11 @@
|
|
|
65
65
|
"type": "boolean",
|
|
66
66
|
"required": false,
|
|
67
67
|
"description": "The bar only; the text stays available to assistive technology."
|
|
68
|
+
},
|
|
69
|
+
"data-testid": {
|
|
70
|
+
"type": "string",
|
|
71
|
+
"required": false,
|
|
72
|
+
"description": "Test id of the root `<div>`; `meter` unless given."
|
|
68
73
|
}
|
|
69
74
|
}
|
|
70
75
|
}
|
|
@@ -67,6 +67,11 @@
|
|
|
67
67
|
"type": "ReactNode",
|
|
68
68
|
"required": false,
|
|
69
69
|
"description": "A second line under the name: a role, a date."
|
|
70
|
+
},
|
|
71
|
+
"data-testid": {
|
|
72
|
+
"type": "string",
|
|
73
|
+
"required": false,
|
|
74
|
+
"description": "Test id of the root; `person-chip` unless given."
|
|
70
75
|
}
|
|
71
76
|
}
|
|
72
77
|
}
|
|
@@ -62,6 +62,11 @@
|
|
|
62
62
|
"type": "string",
|
|
63
63
|
"required": false,
|
|
64
64
|
"description": "Make the whole stat a link to what the figure is made of."
|
|
65
|
+
},
|
|
66
|
+
"data-testid": {
|
|
67
|
+
"type": "string",
|
|
68
|
+
"required": false,
|
|
69
|
+
"description": "Test id of the root; `stat` unless given."
|
|
65
70
|
}
|
|
66
71
|
}
|
|
67
72
|
}
|
|
@@ -54,7 +54,7 @@
|
|
|
54
54
|
"stackBelow": {
|
|
55
55
|
"type": "\"sm\" | \"md\" | \"lg\"",
|
|
56
56
|
"required": false,
|
|
57
|
-
"description": "Show each row as a card — cells one under another, each with its column's\nlabel — while the table's container is narrower than this breakpoint:\n`sm` (420px), `md` (768px) or `lg` (1024px). A container query: the space\nthe table has decides, not the window.
|
|
57
|
+
"description": "Show each row as a card — cells one under another, each with its column's\nlabel — while the table's container is narrower than this breakpoint:\n`sm` (420px), `md` (768px) or `lg` (1024px). A container query: the space\nthe table has decides, not the window.\n\nA cell's label is its `TableCell label`, or else the label of the head cell\nof its column: the head cell's `label`, or the text of its content. Columns\ncount as in HTML: by position in the row, with `colSpan`, after the columns\nthat `rowSpan` cells of the rows above take in the same head or body. A cell\nspanning several columns takes no label from the head and fills the card's\nwidth, and a head cell spanning several columns labels none of them. With\nseveral head rows, the lowest head cell over a column names it.\n\nThe columns come from the elements written: rows written as `TableRow` in\n`TableHead` or `TableBody`, and cells in a row (arrays and fragments\nincluded). A component that renders a row counts as a row whose cells span\nno rows down, and a component that renders cells counts as one cell, with\nits own `colSpan` and `rowSpan`: give the cells after such a component, or\nthe component's own cells, a `label`."
|
|
58
58
|
},
|
|
59
59
|
"paginationSettings": {
|
|
60
60
|
"type": "TablePaginationProps",
|
|
@@ -32,9 +32,14 @@
|
|
|
32
32
|
"description": "Cell Align. Optional. Type: \"left\" | \"right\" | \"center\"."
|
|
33
33
|
},
|
|
34
34
|
"label": {
|
|
35
|
+
"type": "string | false",
|
|
36
|
+
"required": false,
|
|
37
|
+
"description": "The column's name, shown next to the value when the table stacks rows as\ncards (`Table stackBelow`). Without it, the cell takes the label of its\ncolumn's head cell; `false` keeps the cell unlabelled, so it fills the\ncard's width (an action, a sub-row). A caller's own `data-label` counts as a\ngiven label too."
|
|
38
|
+
},
|
|
39
|
+
"data-label": {
|
|
35
40
|
"type": "string",
|
|
36
41
|
"required": false,
|
|
37
|
-
"description": "The
|
|
42
|
+
"description": "The cell's label written by hand, as the attribute the stacked layout shows; `label` replaces it."
|
|
38
43
|
}
|
|
39
44
|
}
|
|
40
45
|
}
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
"sortable": {
|
|
47
47
|
"type": "boolean",
|
|
48
48
|
"required": false,
|
|
49
|
-
"description": "Enables the interactive sort affordance with keyboard/aria support.\n\nThe children sit inside the sort control, and controls among them keep\ntheir own input: Enter and Space sort only while the sort control itself\nhas focus, and a click sorts unless it lands in a nested control (input,\nbutton, link, label, anything focusable) or in a portal. Content that is not\na control, such as click-to-edit text, keeps its click from sorting by\ncalling `preventDefault()` on it. A nested control's name, or its value,\nbecomes part of the sort control's accessible name."
|
|
49
|
+
"description": "Enables the interactive sort affordance with keyboard/aria support.\n\nThe children sit inside the sort control, and controls among them keep\ntheir own input: Enter and Space sort only while the sort control itself\nhas focus, and a click sorts unless it lands in a nested control (input,\nbutton, link, label, anything focusable) or in a portal. Content that is not\na control, such as click-to-edit text, keeps its click from sorting by\ncalling `preventDefault()` on it. A nested control's name, or its value,\nbecomes part of the sort control's accessible name: put controls in\n`actions` instead."
|
|
50
50
|
},
|
|
51
51
|
"sortDirection": {
|
|
52
52
|
"type": "SortDirection",
|
|
@@ -57,6 +57,16 @@
|
|
|
57
57
|
"type": "() => void",
|
|
58
58
|
"required": false,
|
|
59
59
|
"description": "Invoked when the user activates the sort control."
|
|
60
|
+
},
|
|
61
|
+
"actions": {
|
|
62
|
+
"type": "ReactNode",
|
|
63
|
+
"required": false,
|
|
64
|
+
"description": "The column's controls — a filter field, a menu button, a column resizer —\ndrawn after the sort control, outside it. Their names and values stay out\nof the sort control's accessible name, and their keys and clicks never\nreach it. Rendered whether or not the cell is sortable.\n\nThe column header is then named after the children alone: the cell's\n`aria-labelledby` points at the sort control, unless the cell is given\n`aria-label` or `aria-labelledby`. Named from its content, the header would\ntake in the controls' names and values too."
|
|
65
|
+
},
|
|
66
|
+
"label": {
|
|
67
|
+
"type": "string",
|
|
68
|
+
"required": false,
|
|
69
|
+
"description": "The column's name for its body cells while the table stacks rows as cards\n(`Table stackBelow`). Without it, the text of the children is the name; give\n`label` where they hold no text of their own (an icon, a translated message\ncomponent) or more than the name. An empty `label` leaves the column's cells\nunlabelled, so they fill the card's width."
|
|
60
70
|
}
|
|
61
71
|
}
|
|
62
72
|
}
|
|
@@ -35,6 +35,11 @@
|
|
|
35
35
|
"type": "boolean",
|
|
36
36
|
"required": false,
|
|
37
37
|
"description": "Reflects expandable-row state (adds aria-expanded + styling)."
|
|
38
|
+
},
|
|
39
|
+
"data-testid": {
|
|
40
|
+
"type": "string",
|
|
41
|
+
"required": false,
|
|
42
|
+
"description": "Test id of the `<tr>`; `table-row` unless given."
|
|
38
43
|
}
|
|
39
44
|
}
|
|
40
45
|
}
|
|
@@ -24,6 +24,11 @@
|
|
|
24
24
|
"importExample": "@import (less) \"node_modules/@smwb/ui-styles/less/foundation.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/theme.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/thumbCard/thumbCard.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/lazyImage/lazyImage.entry.less\";"
|
|
25
25
|
},
|
|
26
26
|
"props": {
|
|
27
|
+
"className": {
|
|
28
|
+
"type": "string",
|
|
29
|
+
"required": false,
|
|
30
|
+
"description": "Class name(s) for the root `<div>`, the card's box. `style`, `id`, `data-*`, `aria-hidden`, `ref` and event\nhandlers go to the root too, but `role`, `tabIndex`, `onFocus`, `onBlur` and the other `aria-*` attributes go to\nthe card's content, `.smwb-thumb-card__content` (the image and the caption): that is the card's button when it has\n`onSelect`, and the element to focus."
|
|
31
|
+
},
|
|
27
32
|
"src": {
|
|
28
33
|
"type": "string",
|
|
29
34
|
"required": false,
|
|
@@ -32,17 +37,22 @@
|
|
|
32
37
|
"caption": {
|
|
33
38
|
"type": "React.ReactNode",
|
|
34
39
|
"required": false,
|
|
35
|
-
"description": "
|
|
40
|
+
"description": "Text under the image. With `onSelect` it is part of the card's button and names it, so keep controls out of it:\nthey go in `topStart` / `topEnd`."
|
|
36
41
|
},
|
|
37
42
|
"selected": {
|
|
38
43
|
"type": "boolean",
|
|
39
44
|
"required": false,
|
|
40
|
-
"description": "
|
|
45
|
+
"description": "Outlines the image; with `onSelect`, the card's button is also `aria-pressed=\"true\"`."
|
|
41
46
|
},
|
|
42
47
|
"onSelect": {
|
|
43
48
|
"type": "() => void",
|
|
44
49
|
"required": false,
|
|
45
|
-
"description": "Makes the card a
|
|
50
|
+
"description": "Makes the card selectable: its content (the image and the caption) becomes a toggle button with `aria-pressed`,\nselected by a click and by Enter / Space. The corner slots are not part of that button but its siblings, laid over\nthe image, so their controls keep their own names, clicks and keys.\n\nA click selects the card unless it lands in a control in a slot (button, link, input, anything focusable) or in a\nportal opened from the card. Slot content that is not a control keeps its click from selecting the card by calling\n`preventDefault()` on it."
|
|
51
|
+
},
|
|
52
|
+
"onClick": {
|
|
53
|
+
"type": "React.MouseEventHandler<HTMLDivElement> | undefined",
|
|
54
|
+
"required": false,
|
|
55
|
+
"description": "Runs on each click on the card, before `onSelect`, but not while the card is `disabled`.\nA click on a control in a slot runs it too, without selecting the card.\nEnter / Space select the card without a click, so they call only `onSelect`."
|
|
46
56
|
},
|
|
47
57
|
"fallback": {
|
|
48
58
|
"type": "React.ReactNode",
|
|
@@ -57,12 +67,12 @@
|
|
|
57
67
|
"topStart": {
|
|
58
68
|
"type": "React.ReactNode",
|
|
59
69
|
"required": false,
|
|
60
|
-
"description": "Top-left overlay slot (e.g. a favourite star)."
|
|
70
|
+
"description": "Top-left overlay slot (e.g. a favourite star). It sits over the image, outside the card's button, so controls here\nkeep their own names, clicks and keys; see `onSelect`."
|
|
61
71
|
},
|
|
62
72
|
"topEnd": {
|
|
63
73
|
"type": "React.ReactNode",
|
|
64
74
|
"required": false,
|
|
65
|
-
"description": "Top-right overlay slot (e.g. a kebab menu)."
|
|
75
|
+
"description": "Top-right overlay slot (e.g. a kebab menu). It sits over the image, outside the card's button, so controls here\nkeep their own names, clicks and keys; see `onSelect`."
|
|
66
76
|
},
|
|
67
77
|
"lazy": {
|
|
68
78
|
"type": "boolean",
|
|
@@ -72,7 +82,7 @@
|
|
|
72
82
|
"disabled": {
|
|
73
83
|
"type": "boolean",
|
|
74
84
|
"required": false,
|
|
75
|
-
"description": "
|
|
85
|
+
"description": "Dims the card and ignores clicks on it: neither `onClick` nor `onSelect` runs.\nKeys do not select it either, and there is no hover preview. With `onSelect`\nthe card is still a button, `aria-disabled` and out of the tab order."
|
|
76
86
|
},
|
|
77
87
|
"hoverDelay": {
|
|
78
88
|
"type": "number",
|
|
@@ -87,6 +87,11 @@
|
|
|
87
87
|
"type": "(item: ITreeNodeItem, nodeId: string) => Promise<ITreeNodeItem[]>",
|
|
88
88
|
"required": false,
|
|
89
89
|
"description": "Lazily resolves children the first time a node is expanded."
|
|
90
|
+
},
|
|
91
|
+
"data-testid": {
|
|
92
|
+
"type": "string",
|
|
93
|
+
"required": false,
|
|
94
|
+
"description": "Test id of the root `<div>`; `tree-view` unless given."
|
|
90
95
|
}
|
|
91
96
|
}
|
|
92
97
|
}
|
|
@@ -52,6 +52,11 @@
|
|
|
52
52
|
"type": "\"small\" | \"medium\"",
|
|
53
53
|
"required": false,
|
|
54
54
|
"description": "`small`: tighter, for a narrow column or a card."
|
|
55
|
+
},
|
|
56
|
+
"data-testid": {
|
|
57
|
+
"type": "string",
|
|
58
|
+
"required": false,
|
|
59
|
+
"description": "Test id of the root `<div>`; `empty-state` unless given."
|
|
55
60
|
}
|
|
56
61
|
}
|
|
57
62
|
}
|
|
@@ -52,6 +52,11 @@
|
|
|
52
52
|
"type": "string",
|
|
53
53
|
"required": false,
|
|
54
54
|
"description": "Accessible label for the close button."
|
|
55
|
+
},
|
|
56
|
+
"data-testid": {
|
|
57
|
+
"type": "string",
|
|
58
|
+
"required": false,
|
|
59
|
+
"description": "Test id of the root `<div>`; `message` unless given."
|
|
55
60
|
}
|
|
56
61
|
}
|
|
57
62
|
}
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
"count": {
|
|
50
50
|
"type": "number",
|
|
51
51
|
"required": false,
|
|
52
|
-
"description": "Render N stacked placeholders."
|
|
52
|
+
"description": "Render N stacked placeholders. With `count` > 1 they sit in a group `<span>`, which takes the `ref` and the\nother HTML attributes; `className` and `style` go on each placeholder."
|
|
53
53
|
},
|
|
54
54
|
"animationDelay": {
|
|
55
55
|
"type": "number",
|
|
@@ -59,7 +59,12 @@
|
|
|
59
59
|
"component": {
|
|
60
60
|
"type": "\"span\" | \"div\"",
|
|
61
61
|
"required": false,
|
|
62
|
-
"description": "
|
|
62
|
+
"description": "Element of each placeholder."
|
|
63
|
+
},
|
|
64
|
+
"data-testid": {
|
|
65
|
+
"type": "string",
|
|
66
|
+
"required": false,
|
|
67
|
+
"description": "Test id of the placeholder; `skeleton` unless given. With `count` > 1 it\nmarks the group, and each placeholder keeps `skeleton`."
|
|
63
68
|
}
|
|
64
69
|
}
|
|
65
70
|
}
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
"message": {
|
|
32
32
|
"type": "React.ReactNode",
|
|
33
33
|
"required": true,
|
|
34
|
-
"description": "
|
|
34
|
+
"description": "What the tip says: text or markup."
|
|
35
35
|
},
|
|
36
36
|
"placement": {
|
|
37
37
|
"type": "Placement",
|
|
@@ -46,17 +46,17 @@
|
|
|
46
46
|
"trigger": {
|
|
47
47
|
"type": "TooltipTrigger",
|
|
48
48
|
"required": false,
|
|
49
|
-
"description": "hover (default):
|
|
49
|
+
"description": "What shows the tooltip. `hover` (default): the pointer over the target or keyboard focus\nin it, until both have left. Keyboard focus is focus with a focus ring (`:focus-visible`),\nnot the focus a mouse press gives a button. `click`: a click on the target shows or hides\nit. `manual`: `open` alone. Escape hides a `hover` or `click` tooltip."
|
|
50
50
|
},
|
|
51
51
|
"openDelay": {
|
|
52
52
|
"type": "number",
|
|
53
53
|
"required": false,
|
|
54
|
-
"description": "
|
|
54
|
+
"description": "Milliseconds from the pointer entering the target, or keyboard focus moving into it, until a hover tooltip shows."
|
|
55
55
|
},
|
|
56
56
|
"closeDelay": {
|
|
57
57
|
"type": "number",
|
|
58
58
|
"required": false,
|
|
59
|
-
"description": "
|
|
59
|
+
"description": "Milliseconds from the pointer and keyboard focus both leaving the target until a hover tooltip hides."
|
|
60
60
|
}
|
|
61
61
|
}
|
|
62
62
|
}
|
|
@@ -88,6 +88,11 @@
|
|
|
88
88
|
"type": "boolean",
|
|
89
89
|
"required": false,
|
|
90
90
|
"description": "Whether the ripple touch feedback is disabled."
|
|
91
|
+
},
|
|
92
|
+
"data-testid": {
|
|
93
|
+
"type": "string",
|
|
94
|
+
"required": false,
|
|
95
|
+
"description": "Test id of the root; `button`, or `button-link` for a link, unless given."
|
|
91
96
|
}
|
|
92
97
|
}
|
|
93
98
|
}
|
|
@@ -55,6 +55,11 @@
|
|
|
55
55
|
"type": "\"primary\" | \"secondary\" | \"error\" | \"success\" | \"warning\" | \"info\"",
|
|
56
56
|
"required": false,
|
|
57
57
|
"description": "Semantic color propagated to child buttons."
|
|
58
|
+
},
|
|
59
|
+
"data-testid": {
|
|
60
|
+
"type": "string",
|
|
61
|
+
"required": false,
|
|
62
|
+
"description": "Test id of the root `<div>`; `button-group` unless given."
|
|
58
63
|
}
|
|
59
64
|
}
|
|
60
65
|
}
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
"readOnly": {
|
|
38
38
|
"type": "boolean",
|
|
39
39
|
"required": false,
|
|
40
|
-
"description": "
|
|
40
|
+
"description": "Keeps the checkbox as it is: clicks on it or its label and Space change nothing, and `onChange` is not called.\nIt stays focusable, and its input tells assistive technology it is read-only (`aria-readonly`)."
|
|
41
41
|
},
|
|
42
42
|
"required": {
|
|
43
43
|
"type": "boolean",
|
|
@@ -57,7 +57,7 @@
|
|
|
57
57
|
"indeterminate": {
|
|
58
58
|
"type": "boolean",
|
|
59
59
|
"required": false,
|
|
60
|
-
"description": "
|
|
60
|
+
"description": "Shows the checkbox as partly checked, as for a \"select all\" over a partial selection: drawn with a dash and\nannounced as \"mixed\" by screen readers, whatever `checked` is. A click does not clear it: the click toggles\n`checked` as usual and `onChange` reports the new `checked`, while the checkbox stays mixed until this prop turns\nfalse."
|
|
61
61
|
},
|
|
62
62
|
"className": {
|
|
63
63
|
"type": "string",
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
"readOnly": {
|
|
39
39
|
"type": "boolean",
|
|
40
40
|
"required": false,
|
|
41
|
-
"description": "
|
|
41
|
+
"description": "Keeps the radio as it is: clicks on it or its label, Space and the arrow keys of its group do not check it, and\n`onChange` is not called. It stays focusable.\n\nThe input does not tell assistive technology it is read-only: ARIA has no read-only state for a single radio,\nonly for its group. Put `role=\"radiogroup\"`, a name and `aria-readonly=\"true\"` on the element around the radios."
|
|
42
42
|
},
|
|
43
43
|
"required": {
|
|
44
44
|
"type": "boolean",
|
|
@@ -84,6 +84,11 @@
|
|
|
84
84
|
"type": "( event: React.ChangeEvent<HTMLInputElement>, value: string | number | readonly string[] | boolean | undefined, data: RadioButtonProps ) => void",
|
|
85
85
|
"required": false,
|
|
86
86
|
"description": "Unified handler: `(event, value, data)` where `value` is the radio's value (or checked state)."
|
|
87
|
+
},
|
|
88
|
+
"data-testid": {
|
|
89
|
+
"type": "string",
|
|
90
|
+
"required": false,
|
|
91
|
+
"description": "Test id of the `<input>`; `radio` unless given."
|
|
87
92
|
}
|
|
88
93
|
}
|
|
89
94
|
}
|
|
@@ -92,7 +92,17 @@
|
|
|
92
92
|
"id": {
|
|
93
93
|
"type": "string",
|
|
94
94
|
"required": false,
|
|
95
|
-
"description": "
|
|
95
|
+
"description": "Id of the control: the slider, or the image of a read-only rating."
|
|
96
|
+
},
|
|
97
|
+
"aria-label": {
|
|
98
|
+
"type": "string",
|
|
99
|
+
"required": false,
|
|
100
|
+
"description": "What is rated: the accessible name of the slider, \"Rating\" by default. A read-only rating is an image named by\nits value (\"3 of 5\"), after this label."
|
|
101
|
+
},
|
|
102
|
+
"aria-describedby": {
|
|
103
|
+
"type": "string",
|
|
104
|
+
"required": false,
|
|
105
|
+
"description": "Ids of more elements that describe the control, after its helper text."
|
|
96
106
|
},
|
|
97
107
|
"onChange": {
|
|
98
108
|
"type": "(value: number) => void",
|
|
@@ -106,6 +106,51 @@
|
|
|
106
106
|
"type": "number",
|
|
107
107
|
"required": false,
|
|
108
108
|
"description": "Row height (px) used when `virtualized`."
|
|
109
|
+
},
|
|
110
|
+
"listboxId": {
|
|
111
|
+
"type": "string",
|
|
112
|
+
"required": false,
|
|
113
|
+
"description": "Id of the listbox; the options' ids follow from it (`dropdownOptionId`)."
|
|
114
|
+
},
|
|
115
|
+
"labelledBy": {
|
|
116
|
+
"type": "string",
|
|
117
|
+
"required": false,
|
|
118
|
+
"description": "Ids of the elements that name the listbox and the search box in the menu."
|
|
119
|
+
},
|
|
120
|
+
"label": {
|
|
121
|
+
"type": "string",
|
|
122
|
+
"required": false,
|
|
123
|
+
"description": "Names the listbox and the search box in the menu when no element does."
|
|
124
|
+
},
|
|
125
|
+
"multiple": {
|
|
126
|
+
"type": "boolean",
|
|
127
|
+
"required": false,
|
|
128
|
+
"description": "Several options can be selected (`aria-multiselectable`)."
|
|
129
|
+
},
|
|
130
|
+
"activeIndex": {
|
|
131
|
+
"type": "number",
|
|
132
|
+
"required": false,
|
|
133
|
+
"description": "Index of the active option, counting `items` and then the create option; -1 for none."
|
|
134
|
+
},
|
|
135
|
+
"showActive": {
|
|
136
|
+
"type": "boolean",
|
|
137
|
+
"required": false,
|
|
138
|
+
"description": "Marks the active option and keeps it in view: the keyboard moved to it."
|
|
139
|
+
},
|
|
140
|
+
"searchInputProps": {
|
|
141
|
+
"type": "React.InputHTMLAttributes<HTMLInputElement>",
|
|
142
|
+
"required": false,
|
|
143
|
+
"description": "Attributes and handlers of the search box in the menu, which the field makes a combobox."
|
|
144
|
+
},
|
|
145
|
+
"searchInputRef": {
|
|
146
|
+
"type": "React.Ref<HTMLInputElement>",
|
|
147
|
+
"required": false,
|
|
148
|
+
"description": "Search Input Ref. Optional. Type: React.Ref<HTMLInputElement>."
|
|
149
|
+
},
|
|
150
|
+
"menuRef": {
|
|
151
|
+
"type": "React.Ref<HTMLDivElement>",
|
|
152
|
+
"required": false,
|
|
153
|
+
"description": "The menu's root element."
|
|
109
154
|
}
|
|
110
155
|
}
|
|
111
156
|
}
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
"value": {
|
|
34
34
|
"type": "null | string | number | (string | number | undefined | null)[]",
|
|
35
35
|
"required": false,
|
|
36
|
-
"description": "
|
|
36
|
+
"description": "The selected value, or the values of a `multiple` field. Any value but\n`undefined` makes the field controlled: it shows this value and nothing\nelse, and a pick, a chip delete or a clear only asks for a change through\n`onChange`. `null` means nothing is selected. While `value` is `undefined`,\nthe field keeps its own value, starting from `defaultValue`."
|
|
37
37
|
},
|
|
38
38
|
"defaultValue": {
|
|
39
39
|
"type": "null | string | number | (string | number)[]",
|
|
@@ -88,7 +88,7 @@
|
|
|
88
88
|
"search": {
|
|
89
89
|
"type": "true | false | \"menu\"",
|
|
90
90
|
"required": false,
|
|
91
|
-
"description": "
|
|
91
|
+
"description": "A search box for the options: `true` puts it in the field, where it takes\nthe focus and is the combobox; `\"menu\"` puts it at the top of the menu,\nwhich moves the focus into it when it opens."
|
|
92
92
|
},
|
|
93
93
|
"chips": {
|
|
94
94
|
"type": "boolean",
|
|
@@ -113,7 +113,7 @@
|
|
|
113
113
|
"label": {
|
|
114
114
|
"type": "string",
|
|
115
115
|
"required": false,
|
|
116
|
-
"description": "Visible label text."
|
|
116
|
+
"description": "Visible label, drawn above the field (an `inline` field draws none). It\nnames the combobox, whose value is the selected text: \"Country\", \"Russia\".\nWith `chips` the chips' texts follow it in the name: \"Labels Backend Docs\"."
|
|
117
117
|
},
|
|
118
118
|
"variant": {
|
|
119
119
|
"type": "\"outlined\" | \"filled\"",
|
|
@@ -168,7 +168,7 @@
|
|
|
168
168
|
"optionRenderer": {
|
|
169
169
|
"type": "(args: MenuItemProps) => React.ReactNode",
|
|
170
170
|
"required": false,
|
|
171
|
-
"description": "
|
|
171
|
+
"description": "Draws an option in place of the default one. It gets the option's props\nand returns its `<li>`: pass `id`, `role`, `aria-selected`, `aria-disabled`,\n`className` and `onClick` on to it, so the option can be reached from the\nkeyboard, read out and picked."
|
|
172
172
|
},
|
|
173
173
|
"clearable": {
|
|
174
174
|
"type": "boolean",
|
|
@@ -198,12 +198,12 @@
|
|
|
198
198
|
"aria-label": {
|
|
199
199
|
"type": "string",
|
|
200
200
|
"required": false,
|
|
201
|
-
"description": "Accessible
|
|
201
|
+
"description": "Accessible name of the combobox. Replaces the name the visible `label`\ngives it; a field without a drawn label needs it."
|
|
202
202
|
},
|
|
203
203
|
"id": {
|
|
204
204
|
"type": "string",
|
|
205
205
|
"required": false,
|
|
206
|
-
"description": "
|
|
206
|
+
"description": "Id of the control, the part of the field that holds the selected text. It is\nthe combobox, unless `search` puts a search box in it: then the box is."
|
|
207
207
|
}
|
|
208
208
|
}
|
|
209
209
|
}
|
|
@@ -71,7 +71,7 @@
|
|
|
71
71
|
"valueField": {
|
|
72
72
|
"type": "boolean",
|
|
73
73
|
"required": false,
|
|
74
|
-
"description": "
|
|
74
|
+
"description": "Draws a number field beside the slider for typing the value; a single\n`discrete` slider only. The field is named as the slider is (see `label`\nand `aria-label`)."
|
|
75
75
|
},
|
|
76
76
|
"withTicks": {
|
|
77
77
|
"type": "boolean",
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
"label": {
|
|
82
82
|
"type": "string",
|
|
83
83
|
"required": false,
|
|
84
|
-
"description": "Visible label
|
|
84
|
+
"description": "Visible label, drawn above the slider. It names the slider; each thumb of a\nrange adds its own word: with `label=\"Price\"` they read \"Price minimum\" and\n\"Price maximum\"."
|
|
85
85
|
},
|
|
86
86
|
"helperText": {
|
|
87
87
|
"type": "React.ReactNode",
|
|
@@ -121,7 +121,12 @@
|
|
|
121
121
|
"aria-label": {
|
|
122
122
|
"type": "string",
|
|
123
123
|
"required": false,
|
|
124
|
-
"description": "Accessible
|
|
124
|
+
"description": "Accessible name of the slider. Replaces the name the visible `label` gives\nit; a slider without a label needs it or `aria-labelledby`. Each thumb of a\nrange adds its own word, as with `label`."
|
|
125
|
+
},
|
|
126
|
+
"aria-labelledby": {
|
|
127
|
+
"type": "string",
|
|
128
|
+
"required": false,
|
|
129
|
+
"description": "Ids of the elements whose text names the slider. It goes on the range input,\nnot the root, and replaces the name the visible `label` gives it; as on any\nelement, it also wins over `aria-label`. Each thumb of a range adds its own\nword, as with `label`."
|
|
125
130
|
},
|
|
126
131
|
"getAriaValueText": {
|
|
127
132
|
"type": "(value: number) => string",
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
"label": {
|
|
25
25
|
"type": "string",
|
|
26
26
|
"required": false,
|
|
27
|
-
"description": "Visible label
|
|
27
|
+
"description": "Visible label; it points to the `<input>`, so it also names the field. Not drawn for an `inline` field."
|
|
28
28
|
},
|
|
29
29
|
"helperText": {
|
|
30
30
|
"type": "React.ReactNode",
|
|
@@ -59,7 +59,7 @@
|
|
|
59
59
|
"className": {
|
|
60
60
|
"type": "string",
|
|
61
61
|
"required": false,
|
|
62
|
-
"description": "
|
|
62
|
+
"description": "Class name(s) for the root wrapper `<div>`. `style` and `data-*` attributes go to the wrapper too (a `data-testid`\nreplaces its default `text-field`); every other HTML attribute (`aria-*`, `autoFocus`, `maxLength`, event handlers)\ngoes to the `<input>`."
|
|
63
63
|
},
|
|
64
64
|
"placeholder": {
|
|
65
65
|
"type": "string",
|
|
@@ -119,7 +119,7 @@
|
|
|
119
119
|
"id": {
|
|
120
120
|
"type": "string",
|
|
121
121
|
"required": false,
|
|
122
|
-
"description": "
|
|
122
|
+
"description": "Id of the `<input>`; the label points to it. Generated when not given."
|
|
123
123
|
},
|
|
124
124
|
"inline": {
|
|
125
125
|
"type": "boolean",
|
|
@@ -31,6 +31,11 @@
|
|
|
31
31
|
"required": false,
|
|
32
32
|
"description": "Supplementary hint text displayed below the control."
|
|
33
33
|
},
|
|
34
|
+
"helperTextId": {
|
|
35
|
+
"type": "string",
|
|
36
|
+
"required": false,
|
|
37
|
+
"description": "Id of the helper text, for the control's `aria-describedby`. Only shown helper text takes it: not the blank line\ndrawn without helper text, and an inline field shows none."
|
|
38
|
+
},
|
|
34
39
|
"variant": {
|
|
35
40
|
"type": "\"outlined\" | \"filled\"",
|
|
36
41
|
"required": false,
|
|
@@ -74,7 +79,12 @@
|
|
|
74
79
|
"htmlFor": {
|
|
75
80
|
"type": "string",
|
|
76
81
|
"required": false,
|
|
77
|
-
"description": "
|
|
82
|
+
"description": "Id of the control the label names. Without it, the label names nothing."
|
|
83
|
+
},
|
|
84
|
+
"labelId": {
|
|
85
|
+
"type": "string",
|
|
86
|
+
"required": false,
|
|
87
|
+
"description": "Id of the `<label>`. A control that `htmlFor` cannot label (one that is not\na form element, such as SelectField's `role=\"button\"`) points\n`aria-labelledby` at it."
|
|
78
88
|
},
|
|
79
89
|
"shrink": {
|
|
80
90
|
"type": "boolean",
|
|
@@ -100,6 +110,11 @@
|
|
|
100
110
|
"type": "boolean",
|
|
101
111
|
"required": false,
|
|
102
112
|
"description": "Inline. Optional. Type: boolean."
|
|
113
|
+
},
|
|
114
|
+
"data-testid": {
|
|
115
|
+
"type": "string",
|
|
116
|
+
"required": false,
|
|
117
|
+
"description": "Test id of the root `<div>`; `text-field` unless given."
|
|
103
118
|
}
|
|
104
119
|
}
|
|
105
120
|
}
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
"readOnly": {
|
|
34
34
|
"type": "boolean",
|
|
35
35
|
"required": false,
|
|
36
|
-
"description": "
|
|
36
|
+
"description": "Keeps the switch as it is: clicks on it or its label and Space change nothing, and `onChange` is not called.\nIt stays focusable, and its input tells assistive technology it is read-only (`aria-readonly`)."
|
|
37
37
|
},
|
|
38
38
|
"required": {
|
|
39
39
|
"type": "boolean",
|
|
@@ -22,6 +22,16 @@
|
|
|
22
22
|
"importExample": "@import (less) \"node_modules/@smwb/ui-styles/less/foundation.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/theme.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/valueSlider/valueSlider.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/slider/slider.entry.less\";"
|
|
23
23
|
},
|
|
24
24
|
"props": {
|
|
25
|
+
"label": {
|
|
26
|
+
"type": "string",
|
|
27
|
+
"required": false,
|
|
28
|
+
"description": "Label text, drawn in the header row beside the readout. It names the slider,\nas `Slider`'s label does; each thumb of a range adds its own word: with\n`label=\"Price\"` they read \"Price minimum\" and \"Price maximum\"."
|
|
29
|
+
},
|
|
30
|
+
"aria-label": {
|
|
31
|
+
"type": "string",
|
|
32
|
+
"required": false,
|
|
33
|
+
"description": "Accessible name of the slider. Replaces the name the header `label` gives\nit; a ValueSlider without a label needs it or `aria-labelledby`. Each thumb\nof a range adds its own word, as with `label`."
|
|
34
|
+
},
|
|
25
35
|
"readout": {
|
|
26
36
|
"type": "boolean | ((value: SliderValue | undefined) => string)",
|
|
27
37
|
"required": false,
|
|
@@ -90,18 +100,13 @@
|
|
|
90
100
|
"valueField": {
|
|
91
101
|
"type": "boolean",
|
|
92
102
|
"required": false,
|
|
93
|
-
"description": "
|
|
103
|
+
"description": "Draws a number field beside the slider for typing the value; a single\n`discrete` slider only. The field is named as the slider is (see `label`\nand `aria-label`)."
|
|
94
104
|
},
|
|
95
105
|
"withTicks": {
|
|
96
106
|
"type": "boolean",
|
|
97
107
|
"required": false,
|
|
98
108
|
"description": "With Ticks. Optional. Type: boolean."
|
|
99
109
|
},
|
|
100
|
-
"label": {
|
|
101
|
-
"type": "string",
|
|
102
|
-
"required": false,
|
|
103
|
-
"description": "Visible label text."
|
|
104
|
-
},
|
|
105
110
|
"helperText": {
|
|
106
111
|
"type": "React.ReactNode",
|
|
107
112
|
"required": false,
|
|
@@ -137,10 +142,10 @@
|
|
|
137
142
|
"required": false,
|
|
138
143
|
"description": "Show ticks/marks. `true` derives marks from `step`; an array gives explicit positions/labels."
|
|
139
144
|
},
|
|
140
|
-
"aria-
|
|
145
|
+
"aria-labelledby": {
|
|
141
146
|
"type": "string",
|
|
142
147
|
"required": false,
|
|
143
|
-
"description": "
|
|
148
|
+
"description": "Ids of the elements whose text names the slider. It goes on the range input,\nnot the root, and replaces the name the visible `label` gives it; as on any\nelement, it also wins over `aria-label`. Each thumb of a range adds its own\nword, as with `label`."
|
|
144
149
|
},
|
|
145
150
|
"getAriaValueText": {
|
|
146
151
|
"type": "(value: number) => string",
|
|
@@ -87,6 +87,11 @@
|
|
|
87
87
|
"type": "string",
|
|
88
88
|
"required": false,
|
|
89
89
|
"description": "Additional CSS class name(s) for the root element."
|
|
90
|
+
},
|
|
91
|
+
"data-testid": {
|
|
92
|
+
"type": "string",
|
|
93
|
+
"required": false,
|
|
94
|
+
"description": "Test id of the root `<div>`; `app-layout` unless given."
|
|
90
95
|
}
|
|
91
96
|
}
|
|
92
97
|
}
|
|
@@ -55,6 +55,11 @@
|
|
|
55
55
|
"type": "boolean",
|
|
56
56
|
"required": false,
|
|
57
57
|
"description": "Stretch to fill a flex container along the cross axis."
|
|
58
|
+
},
|
|
59
|
+
"data-testid": {
|
|
60
|
+
"type": "string",
|
|
61
|
+
"required": false,
|
|
62
|
+
"description": "Test id of the root `<div>`; `divider` unless given."
|
|
58
63
|
}
|
|
59
64
|
}
|
|
60
65
|
}
|
|
@@ -193,6 +193,11 @@
|
|
|
193
193
|
"type": "string",
|
|
194
194
|
"required": false,
|
|
195
195
|
"description": "Accessible label when no visible title is present."
|
|
196
|
+
},
|
|
197
|
+
"data-testid": {
|
|
198
|
+
"type": "string",
|
|
199
|
+
"required": false,
|
|
200
|
+
"description": "Test id of the window's root `<div>`; `floating-window` unless given."
|
|
196
201
|
}
|
|
197
202
|
}
|
|
198
203
|
}
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
"rendering": "universal"
|
|
7
7
|
},
|
|
8
8
|
"extends": [
|
|
9
|
-
"React.HTMLAttributes<HTMLDivElement> & {\n /** Ширина на точке остановы: 1–12 из 12, `\"auto\"` (по контенту) или `true` (заполнить). */\n xs?: BreakpointType;\n sm?: BreakpointType;\n md?: BreakpointType;\n lg?: BreakpointType;\n xl?: BreakpointType;\n /** Сдвиг (пустые ведущие колонки) на точке остановы, 0–11. */\n xsOffset?: OffsetType;\n smOffset?: OffsetType;\n mdOffset?: OffsetType;\n lgOffset?: OffsetType;\n xlOffset?: OffsetType;\n /** Скрыть колонку: булево (всегда) или по точкам остановы `{ xs:true, md:false }`. */\n hidden?: ResponsiveBool;\n}"
|
|
9
|
+
"React.HTMLAttributes<HTMLDivElement> & {\n /** Ширина на точке остановы: 1–12 из 12, `\"auto\"` (по контенту) или `true` (заполнить). */\n xs?: BreakpointType;\n sm?: BreakpointType;\n md?: BreakpointType;\n lg?: BreakpointType;\n xl?: BreakpointType;\n /** Сдвиг (пустые ведущие колонки) на точке остановы, 0–11. */\n xsOffset?: OffsetType;\n smOffset?: OffsetType;\n mdOffset?: OffsetType;\n lgOffset?: OffsetType;\n xlOffset?: OffsetType;\n /** Скрыть колонку: булево (всегда) или по точкам остановы `{ xs:true, md:false }`. */\n hidden?: ResponsiveBool;\n /** Test id of the root `<div>`; `grid-col` unless given. */\n \"data-testid\"?: string;\n}"
|
|
10
10
|
],
|
|
11
11
|
"inheritedAttributes": "Also accepts standard HTML attributes for the underlying element (see extends clause in TypeScript).",
|
|
12
12
|
"styles": {
|
|
@@ -30,6 +30,11 @@
|
|
|
30
30
|
"type": "boolean",
|
|
31
31
|
"required": false,
|
|
32
32
|
"description": "Remove horizontal gutters."
|
|
33
|
+
},
|
|
34
|
+
"data-testid": {
|
|
35
|
+
"type": "string",
|
|
36
|
+
"required": false,
|
|
37
|
+
"description": "Test id of the root `<div>`; `grid-container` unless given."
|
|
33
38
|
}
|
|
34
39
|
}
|
|
35
40
|
}
|
|
@@ -45,6 +45,11 @@
|
|
|
45
45
|
"type": "number",
|
|
46
46
|
"required": false,
|
|
47
47
|
"description": "Spacing between stacked children."
|
|
48
|
+
},
|
|
49
|
+
"data-testid": {
|
|
50
|
+
"type": "string",
|
|
51
|
+
"required": false,
|
|
52
|
+
"description": "Test id of the root `<div>`; `grid-row` unless given."
|
|
48
53
|
}
|
|
49
54
|
}
|
|
50
55
|
}
|
|
@@ -40,6 +40,11 @@
|
|
|
40
40
|
"type": "string",
|
|
41
41
|
"required": false,
|
|
42
42
|
"description": "Additional CSS class name(s) for the root element."
|
|
43
|
+
},
|
|
44
|
+
"data-testid": {
|
|
45
|
+
"type": "string",
|
|
46
|
+
"required": false,
|
|
47
|
+
"description": "Test id of the root element; `page` unless given."
|
|
43
48
|
}
|
|
44
49
|
}
|
|
45
50
|
}
|
|
@@ -52,6 +52,11 @@
|
|
|
52
52
|
"type": "string",
|
|
53
53
|
"required": false,
|
|
54
54
|
"description": "Additional CSS class name(s) for the root element."
|
|
55
|
+
},
|
|
56
|
+
"data-testid": {
|
|
57
|
+
"type": "string",
|
|
58
|
+
"required": false,
|
|
59
|
+
"description": "Test id of the root `<header>`; `page-header` unless given."
|
|
55
60
|
}
|
|
56
61
|
}
|
|
57
62
|
}
|
|
@@ -63,6 +63,11 @@
|
|
|
63
63
|
"type": "ReactNode",
|
|
64
64
|
"required": false,
|
|
65
65
|
"description": "A line under the title."
|
|
66
|
+
},
|
|
67
|
+
"data-testid": {
|
|
68
|
+
"type": "string",
|
|
69
|
+
"required": false,
|
|
70
|
+
"description": "Test id of the root `<header>`; `section-header` unless given."
|
|
66
71
|
}
|
|
67
72
|
}
|
|
68
73
|
}
|
|
@@ -115,6 +115,11 @@
|
|
|
115
115
|
"type": "string",
|
|
116
116
|
"required": false,
|
|
117
117
|
"description": "Accessible label when no visible title is present."
|
|
118
|
+
},
|
|
119
|
+
"data-testid": {
|
|
120
|
+
"type": "string",
|
|
121
|
+
"required": false,
|
|
122
|
+
"description": "Test id of the sheet panel (the dialog); `sheet` unless given."
|
|
118
123
|
}
|
|
119
124
|
}
|
|
120
125
|
}
|
|
@@ -55,6 +55,11 @@
|
|
|
55
55
|
"type": "string",
|
|
56
56
|
"required": false,
|
|
57
57
|
"description": "Additional CSS class name(s) for the root element."
|
|
58
|
+
},
|
|
59
|
+
"data-testid": {
|
|
60
|
+
"type": "string",
|
|
61
|
+
"required": false,
|
|
62
|
+
"description": "Test id of the root `<div>`; `stack` unless given."
|
|
58
63
|
}
|
|
59
64
|
}
|
|
60
65
|
}
|
|
@@ -75,6 +75,11 @@
|
|
|
75
75
|
"type": "AppBarColor",
|
|
76
76
|
"required": false,
|
|
77
77
|
"description": "Semantic background color."
|
|
78
|
+
},
|
|
79
|
+
"data-testid": {
|
|
80
|
+
"type": "string",
|
|
81
|
+
"required": false,
|
|
82
|
+
"description": "Test id of the root (`<header>`, or `<footer>` at the bottom); `app-bar` unless given."
|
|
78
83
|
}
|
|
79
84
|
}
|
|
80
85
|
}
|
|
@@ -60,6 +60,11 @@
|
|
|
60
60
|
"type": "string",
|
|
61
61
|
"required": false,
|
|
62
62
|
"description": "Accessible label for the expand button."
|
|
63
|
+
},
|
|
64
|
+
"data-testid": {
|
|
65
|
+
"type": "string",
|
|
66
|
+
"required": false,
|
|
67
|
+
"description": "Test id of the root `<nav>`; `breadcrumbs` unless given."
|
|
63
68
|
}
|
|
64
69
|
}
|
|
65
70
|
}
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"note": "The trigger renders on the server; the menu surface mounts on the client."
|
|
8
8
|
},
|
|
9
9
|
"extends": [
|
|
10
|
-
"MenuFloatingProps &\n React.HTMLAttributes<HTMLElement> & {\n variant?: \"static\" | \"floating\";\n dense?: boolean;\n }"
|
|
10
|
+
"MenuFloatingProps &\n React.HTMLAttributes<HTMLElement> & {\n variant?: \"static\" | \"floating\";\n dense?: boolean;\n /**\n * Role of the list inside the menu, `menu` by default. A component that draws\n * a list of its own on the menu's surface sets `presentation`: SelectField's\n * options are a `listbox` inside it.\n */\n listRole?: React.AriaRole;\n }"
|
|
11
11
|
],
|
|
12
12
|
"inheritedAttributes": "Also accepts standard HTML attributes for the underlying element (see extends clause in TypeScript).",
|
|
13
13
|
"styles": {
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"disabled": {
|
|
27
27
|
"type": "boolean",
|
|
28
28
|
"required": false,
|
|
29
|
-
"description": "
|
|
29
|
+
"description": "Greys the item out and marks it `aria-disabled`. It takes no focus, the arrow keys\nskip it, and neither a click nor Enter or Space chooses it."
|
|
30
30
|
},
|
|
31
31
|
"selected": {
|
|
32
32
|
"type": "boolean",
|
|
@@ -97,6 +97,11 @@
|
|
|
97
97
|
"type": "(page: number) => void",
|
|
98
98
|
"required": false,
|
|
99
99
|
"description": "Callback fired when the value changes."
|
|
100
|
+
},
|
|
101
|
+
"data-testid": {
|
|
102
|
+
"type": "string",
|
|
103
|
+
"required": false,
|
|
104
|
+
"description": "Test id of the root `<nav>`; `pagination` unless given."
|
|
100
105
|
}
|
|
101
106
|
}
|
|
102
107
|
}
|
|
@@ -52,6 +52,11 @@
|
|
|
52
52
|
"type": "(index: number) => void",
|
|
53
53
|
"required": false,
|
|
54
54
|
"description": "Makes steps clickable; receives the clicked step index."
|
|
55
|
+
},
|
|
56
|
+
"data-testid": {
|
|
57
|
+
"type": "string",
|
|
58
|
+
"required": false,
|
|
59
|
+
"description": "Test id of the stepper `<div>`; `stepper` unless given."
|
|
55
60
|
}
|
|
56
61
|
}
|
|
57
62
|
}
|
|
@@ -24,17 +24,17 @@
|
|
|
24
24
|
"value": {
|
|
25
25
|
"type": "number",
|
|
26
26
|
"required": true,
|
|
27
|
-
"description": "
|
|
27
|
+
"description": "Index of the selected tab. Tabs count in the order they render: a tab left out,\nsuch as `{show && <Tab />}` while `show` is false, takes no index."
|
|
28
28
|
},
|
|
29
29
|
"onChange": {
|
|
30
30
|
"type": "(e: React.MouseEvent<HTMLButtonElement>, index: number) => void",
|
|
31
31
|
"required": true,
|
|
32
|
-
"description": "
|
|
32
|
+
"description": "Called with the index of the clicked tab, counted as for `value`."
|
|
33
33
|
},
|
|
34
34
|
"indicatorContent": {
|
|
35
35
|
"type": "boolean",
|
|
36
36
|
"required": false,
|
|
37
|
-
"description": "
|
|
37
|
+
"description": "Draw the indicator as wide as the selected tab's label rather than the whole tab."
|
|
38
38
|
},
|
|
39
39
|
"scrollable": {
|
|
40
40
|
"type": "boolean",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@smwb/ui-mcp-react",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.8.0",
|
|
4
4
|
"description": "Model Context Protocol server exposing the @smwb/ui-react (React) component catalog and customization guide.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -28,8 +28,8 @@
|
|
|
28
28
|
"zod": "^4.4.3"
|
|
29
29
|
},
|
|
30
30
|
"devDependencies": {
|
|
31
|
-
"@smwb/ui-react": "^2.
|
|
32
|
-
"@smwb/ui-styles": "^1.
|
|
31
|
+
"@smwb/ui-react": "^2.8.0",
|
|
32
|
+
"@smwb/ui-styles": "^1.6.0",
|
|
33
33
|
"glob": "^13.0.6",
|
|
34
34
|
"typescript": "^6.0.3",
|
|
35
35
|
"vitest": "^2.1.9"
|