@smwb/ui-mcp-solid 0.12.1 → 0.13.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 +18 -3
- 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 +18 -3
- package/component-meta/dataDisplay/dagView/dagView.json +170 -0
- 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 +7 -2
- 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 +12 -2
- package/component-meta/inputs/selectField/dropdownMenu.json +47 -2
- package/component-meta/inputs/selectField/selectField.json +9 -8
- package/component-meta/inputs/slider/slider.json +11 -6
- package/component-meta/inputs/textField/textField.json +8 -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 +15 -10
- 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 +5 -0
- 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/menu/menuList.json +5 -0
- package/component-meta/navigation/menu/menuSubmenu.json +14 -3
- 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
|
@@ -54,13 +54,18 @@
|
|
|
54
54
|
"title": {
|
|
55
55
|
"type": "string",
|
|
56
56
|
"required": false,
|
|
57
|
-
"description": "Accessible name.
|
|
57
|
+
"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`."
|
|
58
58
|
},
|
|
59
59
|
"source": {
|
|
60
60
|
"type": "IconSource",
|
|
61
61
|
"required": false,
|
|
62
62
|
"description": "Overrides the icon source for this icon only. See IconSource."
|
|
63
63
|
},
|
|
64
|
+
"data-testid": {
|
|
65
|
+
"type": "string | undefined",
|
|
66
|
+
"required": false,
|
|
67
|
+
"description": "Test id of the root `<span>`; `icon` unless given."
|
|
68
|
+
},
|
|
64
69
|
"ref": {
|
|
65
70
|
"type": "Ref<HTMLSpanElement>",
|
|
66
71
|
"required": false,
|
|
@@ -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 | undefined",
|
|
@@ -46,6 +46,11 @@
|
|
|
46
46
|
"required": false,
|
|
47
47
|
"description": "Ripple color (any CSS color). Defaults to inherited currentColor."
|
|
48
48
|
},
|
|
49
|
+
"data-testid": {
|
|
50
|
+
"type": "string | undefined",
|
|
51
|
+
"required": false,
|
|
52
|
+
"description": "Test id of the root `<span>`; `ripple` unless given."
|
|
53
|
+
},
|
|
49
54
|
"ref": {
|
|
50
55
|
"type": "Ref<HTMLSpanElement>",
|
|
51
56
|
"required": false,
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
"columns": {
|
|
29
29
|
"type": "ColumnDef<TData, TValue>[]",
|
|
30
30
|
"required": true,
|
|
31
|
-
"description": "
|
|
31
|
+
"description": "TanStack column definitions. A column's `meta` may add `headerActions`\n(controls drawn beside the sort control in its head cell), `label` (its\nname on stacked rows) and `cellProps` (attributes of its body cells)."
|
|
32
32
|
},
|
|
33
33
|
"sortable": {
|
|
34
34
|
"type": "boolean",
|
|
@@ -46,6 +46,11 @@
|
|
|
46
46
|
"required": false,
|
|
47
47
|
"description": "Size of the \"+N\" surplus chip: match the avatars in the group."
|
|
48
48
|
},
|
|
49
|
+
"data-testid": {
|
|
50
|
+
"type": "string | undefined",
|
|
51
|
+
"required": false,
|
|
52
|
+
"description": "Test id of the root `<div>`; `avatar-group` unless given."
|
|
53
|
+
},
|
|
49
54
|
"ref": {
|
|
50
55
|
"type": "Ref<HTMLDivElement>",
|
|
51
56
|
"required": false,
|
|
@@ -51,6 +51,11 @@
|
|
|
51
51
|
"required": false,
|
|
52
52
|
"description": "Extra attributes forwarded to the underlying <img> (srcSet, loading…)."
|
|
53
53
|
},
|
|
54
|
+
"data-testid": {
|
|
55
|
+
"type": "string | undefined",
|
|
56
|
+
"required": false,
|
|
57
|
+
"description": "Test id of the root `<div>`; `avatar` unless given."
|
|
58
|
+
},
|
|
54
59
|
"ref": {
|
|
55
60
|
"type": "Ref<HTMLDivElement>",
|
|
56
61
|
"required": false,
|
|
@@ -21,6 +21,11 @@
|
|
|
21
21
|
"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/card/card.entry.less\";"
|
|
22
22
|
},
|
|
23
23
|
"props": {
|
|
24
|
+
"class": {
|
|
25
|
+
"type": "string | undefined",
|
|
26
|
+
"required": false,
|
|
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
|
+
},
|
|
24
29
|
"variant": {
|
|
25
30
|
"type": "\"filled\" | \"elevated\" | \"outlined\"",
|
|
26
31
|
"required": false,
|
|
@@ -29,17 +34,27 @@
|
|
|
29
34
|
"disabled": {
|
|
30
35
|
"type": "boolean",
|
|
31
36
|
"required": false,
|
|
32
|
-
"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."
|
|
33
38
|
},
|
|
34
39
|
"title": {
|
|
35
40
|
"type": "string",
|
|
36
41
|
"required": false,
|
|
37
|
-
"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
|
+
},
|
|
44
|
+
"onClick": {
|
|
45
|
+
"type": "JSX.EventHandlerUnion<HTMLDivElement, MouseEvent> | undefined",
|
|
46
|
+
"required": false,
|
|
47
|
+
"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."
|
|
38
48
|
},
|
|
39
49
|
"footer": {
|
|
40
50
|
"type": "JSX.Element",
|
|
41
51
|
"required": false,
|
|
42
|
-
"description": "Footer slot rendered after the content."
|
|
52
|
+
"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`."
|
|
53
|
+
},
|
|
54
|
+
"data-testid": {
|
|
55
|
+
"type": "string | undefined",
|
|
56
|
+
"required": false,
|
|
57
|
+
"description": "Test id of the root `<div>`; `card` unless given."
|
|
43
58
|
},
|
|
44
59
|
"ref": {
|
|
45
60
|
"type": "Ref<HTMLDivElement>",
|
|
@@ -64,6 +64,11 @@
|
|
|
64
64
|
"required": false,
|
|
65
65
|
"description": "The ECharts instance, once it has drawn — for other events and actions. Called again if a theme change re-creates it."
|
|
66
66
|
},
|
|
67
|
+
"data-testid": {
|
|
68
|
+
"type": "string | undefined",
|
|
69
|
+
"required": false,
|
|
70
|
+
"description": "Test id of the root `<div>`; `chart` unless given."
|
|
71
|
+
},
|
|
67
72
|
"ref": {
|
|
68
73
|
"type": "Ref<HTMLDivElement>",
|
|
69
74
|
"required": false,
|
|
@@ -84,6 +84,11 @@
|
|
|
84
84
|
"type": "ChatLayoutChatProps",
|
|
85
85
|
"required": true,
|
|
86
86
|
"description": "Chat configuration passed to ChatLayout."
|
|
87
|
+
},
|
|
88
|
+
"data-testid": {
|
|
89
|
+
"type": "string | undefined",
|
|
90
|
+
"required": false,
|
|
91
|
+
"description": "Test id of the root `<div>`; `chat-layout` unless given."
|
|
87
92
|
}
|
|
88
93
|
}
|
|
89
94
|
}
|
|
@@ -69,6 +69,11 @@
|
|
|
69
69
|
"type": "ChatOverlayLayoutChatProps",
|
|
70
70
|
"required": true,
|
|
71
71
|
"description": "Chat configuration passed to ChatLayout."
|
|
72
|
+
},
|
|
73
|
+
"data-testid": {
|
|
74
|
+
"type": "string | undefined",
|
|
75
|
+
"required": false,
|
|
76
|
+
"description": "Test id of the root `<div>`; `chat-overlay-layout` unless given."
|
|
72
77
|
}
|
|
73
78
|
}
|
|
74
79
|
}
|
|
@@ -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/chip/chip.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/icon/icon.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/ripple/ripple.entry.less\";"
|
|
25
25
|
},
|
|
26
26
|
"props": {
|
|
27
|
+
"class": {
|
|
28
|
+
"type": "string | undefined",
|
|
29
|
+
"required": false,
|
|
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
|
+
},
|
|
27
32
|
"variant": {
|
|
28
33
|
"type": "\"filled\" | \"outlined\"",
|
|
29
34
|
"required": false,
|
|
@@ -42,7 +47,7 @@
|
|
|
42
47
|
"onDelete": {
|
|
43
48
|
"type": "(event: MouseEvent & { currentTarget: HTMLButtonElement; target: Element }) => void",
|
|
44
49
|
"required": false,
|
|
45
|
-
"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`."
|
|
46
51
|
},
|
|
47
52
|
"icon": {
|
|
48
53
|
"type": "JSX.Element",
|
|
@@ -62,7 +67,7 @@
|
|
|
62
67
|
"onClick": {
|
|
63
68
|
"type": "() => void",
|
|
64
69
|
"required": false,
|
|
65
|
-
"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."
|
|
66
71
|
},
|
|
67
72
|
"onDeleteMouseDown": {
|
|
68
73
|
"type": "JSX.EventHandlerUnion<HTMLButtonElement, MouseEvent>",
|
|
@@ -72,7 +77,7 @@
|
|
|
72
77
|
"disabled": {
|
|
73
78
|
"type": "boolean",
|
|
74
79
|
"required": false,
|
|
75
|
-
"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."
|
|
76
81
|
},
|
|
77
82
|
"asLink": {
|
|
78
83
|
"type": "boolean",
|
|
@@ -94,11 +99,21 @@
|
|
|
94
99
|
"required": false,
|
|
95
100
|
"description": "Controlled selected tab index or value."
|
|
96
101
|
},
|
|
102
|
+
"labelId": {
|
|
103
|
+
"type": "string | undefined",
|
|
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
|
+
},
|
|
97
107
|
"deleteAriaLabel": {
|
|
98
108
|
"type": "string",
|
|
99
109
|
"required": false,
|
|
100
110
|
"description": "Accessible label for the delete control."
|
|
101
111
|
},
|
|
112
|
+
"data-testid": {
|
|
113
|
+
"type": "string | undefined",
|
|
114
|
+
"required": false,
|
|
115
|
+
"description": "Test id of the root; `chip`, or `chip-link` for a link, unless given."
|
|
116
|
+
},
|
|
102
117
|
"ref": {
|
|
103
118
|
"type": "Ref<HTMLSpanElement | HTMLAnchorElement>",
|
|
104
119
|
"required": false,
|
|
@@ -0,0 +1,170 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "DagView",
|
|
3
|
+
"description": "A dependency graph (DAG): nodes laid out in layers (LR or TB) with arrowed edges, status colours from theme tokens, any node content through renderNode, single selection that lights the selected node's edges, and pan/zoom by mouse, wheel, trackpad, touch and keyboard (role=listbox of options).",
|
|
4
|
+
"ssr": {
|
|
5
|
+
"safe": true,
|
|
6
|
+
"rendering": "universal"
|
|
7
|
+
},
|
|
8
|
+
"extends": [
|
|
9
|
+
"Omit<JSX.HTMLAttributes<HTMLDivElement>, \"onClick\">"
|
|
10
|
+
],
|
|
11
|
+
"inheritedAttributes": "Also accepts standard HTML attributes for the underlying element (see extends clause in TypeScript).",
|
|
12
|
+
"styles": {
|
|
13
|
+
"base": [
|
|
14
|
+
"@smwb/ui-styles/less/foundation.less",
|
|
15
|
+
"@smwb/ui-styles/less/theme.less"
|
|
16
|
+
],
|
|
17
|
+
"entries": [
|
|
18
|
+
"@smwb/ui-styles/less/components/dagView/dagView.entry.less"
|
|
19
|
+
],
|
|
20
|
+
"dependencies": [],
|
|
21
|
+
"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/dagView/dagView.entry.less\";"
|
|
22
|
+
},
|
|
23
|
+
"props": {
|
|
24
|
+
"label": {
|
|
25
|
+
"type": "string",
|
|
26
|
+
"required": true,
|
|
27
|
+
"description": "What the graph shows: its accessible name."
|
|
28
|
+
},
|
|
29
|
+
"summary": {
|
|
30
|
+
"type": "string | undefined",
|
|
31
|
+
"required": false,
|
|
32
|
+
"description": "The graph in words, for screen readers; it is there on the server too."
|
|
33
|
+
},
|
|
34
|
+
"nodes": {
|
|
35
|
+
"type": "readonly DagViewNode<T>[]",
|
|
36
|
+
"required": true,
|
|
37
|
+
"description": "The nodes. A change of status, label or data alone does not lay the graph out again."
|
|
38
|
+
},
|
|
39
|
+
"edges": {
|
|
40
|
+
"type": "readonly DagViewEdge[]",
|
|
41
|
+
"required": true,
|
|
42
|
+
"description": "The edges, from the node depended on to the node that depends on it."
|
|
43
|
+
},
|
|
44
|
+
"renderNode": {
|
|
45
|
+
"type": "((node: DagViewNode<T>, state: DagViewNodeState) => JSX.Element) | undefined",
|
|
46
|
+
"required": false,
|
|
47
|
+
"description": "Draws a node's content inside its box; the default shows a status dot,\nthe label and the status word. Called once per node: `node` and `state`\nare reactive, so read their fields in JSX. Keep the content\nnon-interactive where you can: a node is an ARIA option, whose content\nassistive technology may read as plain text, and a click in it also\nselects the node. Links and buttons in it are left out of the Tab order\nexcept in the node that is the graph's Tab stop."
|
|
48
|
+
},
|
|
49
|
+
"direction": {
|
|
50
|
+
"type": "DagDirection | undefined",
|
|
51
|
+
"required": false,
|
|
52
|
+
"description": "Which way the layers run: \"LR\" (left to right, default) or \"TB\" (top to bottom)."
|
|
53
|
+
},
|
|
54
|
+
"nodeWidth": {
|
|
55
|
+
"type": "number | undefined",
|
|
56
|
+
"required": false,
|
|
57
|
+
"description": "A node's width in pixels, unless the node sets its own; 180 by default."
|
|
58
|
+
},
|
|
59
|
+
"nodeHeight": {
|
|
60
|
+
"type": "number | undefined",
|
|
61
|
+
"required": false,
|
|
62
|
+
"description": "A node's height in pixels, unless the node sets its own; 56 by default."
|
|
63
|
+
},
|
|
64
|
+
"rankGap": {
|
|
65
|
+
"type": "number | undefined",
|
|
66
|
+
"required": false,
|
|
67
|
+
"description": "The space between layers in pixels; 64 by default."
|
|
68
|
+
},
|
|
69
|
+
"nodeGap": {
|
|
70
|
+
"type": "number | undefined",
|
|
71
|
+
"required": false,
|
|
72
|
+
"description": "The space between nodes in a layer in pixels; 24 by default."
|
|
73
|
+
},
|
|
74
|
+
"layout": {
|
|
75
|
+
"type": "((input: DagLayoutInput) => DagLayoutResult) | undefined",
|
|
76
|
+
"required": false,
|
|
77
|
+
"description": "Lays the graph out in place of the built-in layout, e.g. with dagre or elk. It must be synchronous."
|
|
78
|
+
},
|
|
79
|
+
"selectedId": {
|
|
80
|
+
"type": "string | null | undefined",
|
|
81
|
+
"required": false,
|
|
82
|
+
"description": "The selected node's id (controlled); null selects nothing."
|
|
83
|
+
},
|
|
84
|
+
"defaultSelectedId": {
|
|
85
|
+
"type": "string | null | undefined",
|
|
86
|
+
"required": false,
|
|
87
|
+
"description": "The node selected at first (uncontrolled)."
|
|
88
|
+
},
|
|
89
|
+
"onSelectedChange": {
|
|
90
|
+
"type": "((id: string | null) => void) | undefined",
|
|
91
|
+
"required": false,
|
|
92
|
+
"description": "A node was selected (its id) or the selection was cleared (null)."
|
|
93
|
+
},
|
|
94
|
+
"onNodeClick": {
|
|
95
|
+
"type": "((node: DagViewNode<T>, event: MouseEvent | KeyboardEvent) => void) | undefined",
|
|
96
|
+
"required": false,
|
|
97
|
+
"description": "A node was clicked, or chosen with Enter or Space. Not called for a disabled node."
|
|
98
|
+
},
|
|
99
|
+
"dimUnrelated": {
|
|
100
|
+
"type": "boolean | undefined",
|
|
101
|
+
"required": false,
|
|
102
|
+
"description": "Fades the nodes and edges that are not next to the selected node."
|
|
103
|
+
},
|
|
104
|
+
"viewport": {
|
|
105
|
+
"type": "DagViewViewport | undefined",
|
|
106
|
+
"required": false,
|
|
107
|
+
"description": "Where the graph is (controlled)."
|
|
108
|
+
},
|
|
109
|
+
"defaultViewport": {
|
|
110
|
+
"type": "DagViewViewport | undefined",
|
|
111
|
+
"required": false,
|
|
112
|
+
"description": "Where the graph is at first (uncontrolled); with `fit={false}` the page does not move after it loads."
|
|
113
|
+
},
|
|
114
|
+
"onViewportChange": {
|
|
115
|
+
"type": "((viewport: DagViewViewport) => void) | undefined",
|
|
116
|
+
"required": false,
|
|
117
|
+
"description": "The view moved or zoomed: at most once per frame during a gesture."
|
|
118
|
+
},
|
|
119
|
+
"fit": {
|
|
120
|
+
"type": "boolean | undefined",
|
|
121
|
+
"required": false,
|
|
122
|
+
"description": "Fits the graph in view once it is in the page, and again when its nodes or edges change; true by default."
|
|
123
|
+
},
|
|
124
|
+
"minZoom": {
|
|
125
|
+
"type": "number | undefined",
|
|
126
|
+
"required": false,
|
|
127
|
+
"description": "The smallest zoom; 0.1 by default."
|
|
128
|
+
},
|
|
129
|
+
"maxZoom": {
|
|
130
|
+
"type": "number | undefined",
|
|
131
|
+
"required": false,
|
|
132
|
+
"description": "The largest zoom; 2 by default."
|
|
133
|
+
},
|
|
134
|
+
"wheel": {
|
|
135
|
+
"type": "\"zoom\" | \"pan\" | \"none\" | undefined",
|
|
136
|
+
"required": false,
|
|
137
|
+
"description": "What a plain mouse wheel does: \"zoom\" (default), \"pan\", or \"none\" (the page scrolls). Ctrl+wheel and a trackpad pinch always zoom."
|
|
138
|
+
},
|
|
139
|
+
"controls": {
|
|
140
|
+
"type": "boolean | undefined",
|
|
141
|
+
"required": false,
|
|
142
|
+
"description": "Shows the zoom in, zoom out and fit buttons; true by default."
|
|
143
|
+
},
|
|
144
|
+
"labels": {
|
|
145
|
+
"type": "Partial<DagViewLabels> | undefined",
|
|
146
|
+
"required": false,
|
|
147
|
+
"description": "Texts for assistive technology and the buttons, over the English defaults."
|
|
148
|
+
},
|
|
149
|
+
"height": {
|
|
150
|
+
"type": "number | string | undefined",
|
|
151
|
+
"required": false,
|
|
152
|
+
"description": "The graph's height: a number of pixels or any CSS length; 480 by default,\nfrom the stylesheet, so a height in `style` works too. It fills the width."
|
|
153
|
+
},
|
|
154
|
+
"apiRef": {
|
|
155
|
+
"type": "((api: DagViewApi) => void) | undefined",
|
|
156
|
+
"required": false,
|
|
157
|
+
"description": "Gets the functions that move the view from outside."
|
|
158
|
+
},
|
|
159
|
+
"data-testid": {
|
|
160
|
+
"type": "string | undefined",
|
|
161
|
+
"required": false,
|
|
162
|
+
"description": "Test id of the root `<div>`; `dag-view` unless given."
|
|
163
|
+
},
|
|
164
|
+
"ref": {
|
|
165
|
+
"type": "Ref<HTMLDivElement>",
|
|
166
|
+
"required": false,
|
|
167
|
+
"description": "Ref. Optional. Type: Ref<HTMLDivElement>."
|
|
168
|
+
}
|
|
169
|
+
}
|
|
170
|
+
}
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"layout": {
|
|
30
30
|
"type": "DescriptionListLayout",
|
|
31
31
|
"required": false,
|
|
32
|
-
"description": "
|
|
32
|
+
"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."
|
|
33
33
|
},
|
|
34
34
|
"termWidth": {
|
|
35
35
|
"type": "number | string",
|
|
@@ -26,6 +26,11 @@
|
|
|
26
26
|
"required": false,
|
|
27
27
|
"description": "The narrowest a column gets before the board scrolls sideways: a number of\npixels or any CSS length. 15.5rem by default."
|
|
28
28
|
},
|
|
29
|
+
"data-testid": {
|
|
30
|
+
"type": "string | undefined",
|
|
31
|
+
"required": false,
|
|
32
|
+
"description": "Test id of the root `<div>`; `kanban` unless given."
|
|
33
|
+
},
|
|
29
34
|
"ref": {
|
|
30
35
|
"type": "Ref<HTMLDivElement>",
|
|
31
36
|
"required": false,
|
|
@@ -36,6 +36,11 @@
|
|
|
36
36
|
"required": false,
|
|
37
37
|
"description": "Lines the title is clamped to: 3 by default."
|
|
38
38
|
},
|
|
39
|
+
"data-testid": {
|
|
40
|
+
"type": "string | undefined",
|
|
41
|
+
"required": false,
|
|
42
|
+
"description": "Test id of the card's `<li>`; `kanban-card` unless given."
|
|
43
|
+
},
|
|
39
44
|
"ref": {
|
|
40
45
|
"type": "Ref<HTMLLIElement>",
|
|
41
46
|
"required": false,
|
|
@@ -46,6 +46,11 @@
|
|
|
46
46
|
"required": false,
|
|
47
47
|
"description": "Under the cards, e.g. a link to the rest as a list."
|
|
48
48
|
},
|
|
49
|
+
"data-testid": {
|
|
50
|
+
"type": "string | undefined",
|
|
51
|
+
"required": false,
|
|
52
|
+
"description": "Test id of the column's `<div>`; `kanban-column` unless given."
|
|
53
|
+
},
|
|
49
54
|
"ref": {
|
|
50
55
|
"type": "Ref<HTMLDivElement>",
|
|
51
56
|
"required": false,
|
|
@@ -31,6 +31,11 @@
|
|
|
31
31
|
"required": false,
|
|
32
32
|
"description": "Section subheader rendered before the items."
|
|
33
33
|
},
|
|
34
|
+
"data-testid": {
|
|
35
|
+
"type": "string | undefined",
|
|
36
|
+
"required": false,
|
|
37
|
+
"description": "Test id of the root `<ul>`; `list` unless given."
|
|
38
|
+
},
|
|
34
39
|
"ref": {
|
|
35
40
|
"type": "Ref<HTMLUListElement>",
|
|
36
41
|
"required": false,
|
|
@@ -61,6 +61,11 @@
|
|
|
61
61
|
"required": false,
|
|
62
62
|
"description": "The bar only; the text stays available to assistive technology."
|
|
63
63
|
},
|
|
64
|
+
"data-testid": {
|
|
65
|
+
"type": "string | undefined",
|
|
66
|
+
"required": false,
|
|
67
|
+
"description": "Test id of the root `<div>`; `meter` unless given."
|
|
68
|
+
},
|
|
64
69
|
"ref": {
|
|
65
70
|
"type": "Ref<HTMLDivElement>",
|
|
66
71
|
"required": false,
|
|
@@ -63,6 +63,11 @@
|
|
|
63
63
|
"required": false,
|
|
64
64
|
"description": "A second line under the name: a role, a date."
|
|
65
65
|
},
|
|
66
|
+
"data-testid": {
|
|
67
|
+
"type": "string | undefined",
|
|
68
|
+
"required": false,
|
|
69
|
+
"description": "Test id of the root; `person-chip` unless given."
|
|
70
|
+
},
|
|
66
71
|
"ref": {
|
|
67
72
|
"type": "Ref<HTMLElement>",
|
|
68
73
|
"required": false,
|
|
@@ -58,6 +58,11 @@
|
|
|
58
58
|
"required": false,
|
|
59
59
|
"description": "Make the whole stat a link to what the figure is made of."
|
|
60
60
|
},
|
|
61
|
+
"data-testid": {
|
|
62
|
+
"type": "string | undefined",
|
|
63
|
+
"required": false,
|
|
64
|
+
"description": "Test id of the root; `stat` unless given."
|
|
65
|
+
},
|
|
61
66
|
"ref": {
|
|
62
67
|
"type": "Ref<HTMLElement>",
|
|
63
68
|
"required": false,
|
|
@@ -52,7 +52,7 @@
|
|
|
52
52
|
"stackBelow": {
|
|
53
53
|
"type": "\"sm\" | \"md\" | \"lg\"",
|
|
54
54
|
"required": false,
|
|
55
|
-
"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
|
|
55
|
+
"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. The cells\nand rows count as they are drawn, the ones a component renders included."
|
|
56
56
|
},
|
|
57
57
|
"paginationSettings": {
|
|
58
58
|
"type": "TablePaginationProps",
|
|
@@ -27,9 +27,14 @@
|
|
|
27
27
|
"description": "Cell Align. Optional. Type: \"left\" | \"right\" | \"center\"."
|
|
28
28
|
},
|
|
29
29
|
"label": {
|
|
30
|
-
"type": "string",
|
|
30
|
+
"type": "string | false",
|
|
31
31
|
"required": false,
|
|
32
|
-
"description": "The column's name, shown next to the value when the table stacks rows as
|
|
32
|
+
"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."
|
|
33
|
+
},
|
|
34
|
+
"data-label": {
|
|
35
|
+
"type": "string | undefined",
|
|
36
|
+
"required": false,
|
|
37
|
+
"description": "The cell's label written by hand, as the attribute the stacked layout shows; `label` replaces it."
|
|
33
38
|
},
|
|
34
39
|
"ref": {
|
|
35
40
|
"type": "Ref<HTMLTableCellElement>",
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
"sortable": {
|
|
42
42
|
"type": "boolean",
|
|
43
43
|
"required": false,
|
|
44
|
-
"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."
|
|
44
|
+
"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."
|
|
45
45
|
},
|
|
46
46
|
"sortDirection": {
|
|
47
47
|
"type": "SortDirection",
|
|
@@ -53,6 +53,16 @@
|
|
|
53
53
|
"required": false,
|
|
54
54
|
"description": "Invoked when the user activates the sort control."
|
|
55
55
|
},
|
|
56
|
+
"actions": {
|
|
57
|
+
"type": "JSX.Element",
|
|
58
|
+
"required": false,
|
|
59
|
+
"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."
|
|
60
|
+
},
|
|
61
|
+
"label": {
|
|
62
|
+
"type": "string",
|
|
63
|
+
"required": false,
|
|
64
|
+
"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) or more than the\nname, or where their text changes inside markup: the text of markup is read\nwhen it is created. An empty `label` leaves the column's cells unlabelled, so\nthey fill the card's width."
|
|
65
|
+
},
|
|
56
66
|
"ref": {
|
|
57
67
|
"type": "Ref<HTMLTableCellElement>",
|
|
58
68
|
"required": false,
|
|
@@ -31,6 +31,11 @@
|
|
|
31
31
|
"required": false,
|
|
32
32
|
"description": "Reflects expandable-row state (adds aria-expanded + styling)."
|
|
33
33
|
},
|
|
34
|
+
"data-testid": {
|
|
35
|
+
"type": "string | undefined",
|
|
36
|
+
"required": false,
|
|
37
|
+
"description": "Test id of the `<tr>`; `table-row` unless given."
|
|
38
|
+
},
|
|
34
39
|
"ref": {
|
|
35
40
|
"type": "Ref<HTMLTableRowElement>",
|
|
36
41
|
"required": false,
|
|
@@ -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
|
+
"class": {
|
|
28
|
+
"type": "string | undefined",
|
|
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": "JSX.Element",
|
|
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": "JSX.EventHandlerUnion<HTMLDivElement, MouseEvent> | 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": "JSX.Element",
|
|
@@ -57,12 +67,12 @@
|
|
|
57
67
|
"topStart": {
|
|
58
68
|
"type": "JSX.Element",
|
|
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": "JSX.Element",
|
|
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",
|