@smwb/ui-mcp-react 2.7.0 → 2.9.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.
Files changed (75) hide show
  1. package/component-meta/base/icon/icon.json +6 -1
  2. package/component-meta/base/ripple/ripple.json +6 -1
  3. package/component-meta/connects/rt/table/table.json +1 -1
  4. package/component-meta/dataDisplay/avatar/avatar.avatarGroup.json +5 -0
  5. package/component-meta/dataDisplay/avatar/avatar.json +5 -0
  6. package/component-meta/dataDisplay/card/card.json +10 -5
  7. package/component-meta/dataDisplay/chart/chart.json +5 -0
  8. package/component-meta/dataDisplay/chat/chat.chatFooterComposer.json +24 -0
  9. package/component-meta/dataDisplay/chat/chat.json +24 -3
  10. package/component-meta/dataDisplay/chat/chatComposer.json +1 -1
  11. package/component-meta/dataDisplay/chat/chatLayout.json +7 -1
  12. package/component-meta/dataDisplay/chat/chatOverlayLayout.json +7 -1
  13. package/component-meta/dataDisplay/chip/chip.json +14 -4
  14. package/component-meta/dataDisplay/dagView/dagView.json +165 -0
  15. package/component-meta/dataDisplay/descriptionList/descriptionList.json +1 -1
  16. package/component-meta/dataDisplay/diffStat/diffStat.json +65 -0
  17. package/component-meta/dataDisplay/kanban/kanban.json +5 -0
  18. package/component-meta/dataDisplay/kanban/kanban.kanbanCard.json +5 -0
  19. package/component-meta/dataDisplay/kanban/kanban.kanbanColumn.json +5 -0
  20. package/component-meta/dataDisplay/kbd/kbd.json +55 -0
  21. package/component-meta/dataDisplay/list/list.json +5 -0
  22. package/component-meta/dataDisplay/list/listItem.json +18 -3
  23. package/component-meta/dataDisplay/meter/meter.json +5 -0
  24. package/component-meta/dataDisplay/personChip/personChip.json +5 -0
  25. package/component-meta/dataDisplay/qrCode/qrCode.json +60 -0
  26. package/component-meta/dataDisplay/stat/stat.json +5 -0
  27. package/component-meta/dataDisplay/statusDot/statusDot.json +60 -0
  28. package/component-meta/dataDisplay/swimlanes/swimlanes.json +90 -0
  29. package/component-meta/dataDisplay/table/table.json +1 -1
  30. package/component-meta/dataDisplay/table/tableCell.json +6 -1
  31. package/component-meta/dataDisplay/table/tableHeadCell.json +11 -1
  32. package/component-meta/dataDisplay/table/tableRow.json +5 -0
  33. package/component-meta/dataDisplay/thumbCard/thumbCard.json +16 -6
  34. package/component-meta/dataDisplay/treeView/treeView.json +21 -1
  35. package/component-meta/feedBack/emptyState/emptyState.json +5 -0
  36. package/component-meta/feedBack/message/message.json +5 -0
  37. package/component-meta/feedBack/skeleton/skeleton.json +7 -2
  38. package/component-meta/feedBack/tooltip/tooltip.json +4 -4
  39. package/component-meta/inputs/button/button.json +15 -0
  40. package/component-meta/inputs/buttonGroups/buttonGroup.json +5 -0
  41. package/component-meta/inputs/checkbox/checkbox.json +2 -2
  42. package/component-meta/inputs/composer/composer.json +222 -0
  43. package/component-meta/inputs/radioButton/radioButton.json +6 -1
  44. package/component-meta/inputs/rating/rating.json +11 -1
  45. package/component-meta/inputs/selectField/dropdownMenu.json +45 -0
  46. package/component-meta/inputs/selectField/selectField.json +6 -6
  47. package/component-meta/inputs/slider/slider.json +8 -3
  48. package/component-meta/inputs/textField/textField.json +3 -3
  49. package/component-meta/inputs/textField/textFieldWrapper.json +16 -1
  50. package/component-meta/inputs/toggle/toggle.json +1 -1
  51. package/component-meta/inputs/valueSlider/valueSlider.json +13 -8
  52. package/component-meta/layout/appLayout/appLayout.json +5 -0
  53. package/component-meta/layout/divider/divider.json +5 -0
  54. package/component-meta/layout/floatingWindow/floatingWindow.json +5 -0
  55. package/component-meta/layout/grid/grid.column.json +1 -1
  56. package/component-meta/layout/grid/grid.container.json +5 -0
  57. package/component-meta/layout/grid/grid.row.json +5 -0
  58. package/component-meta/layout/page/page.json +5 -0
  59. package/component-meta/layout/pageHeader/pageHeader.json +5 -0
  60. package/component-meta/layout/sectionHeader/sectionHeader.json +5 -0
  61. package/component-meta/layout/sheet/sheet.json +25 -0
  62. package/component-meta/layout/stack/stack.json +5 -0
  63. package/component-meta/layout/tabGroups/tabGroups.json +101 -0
  64. package/component-meta/navigation/appBar/appBar.json +20 -0
  65. package/component-meta/navigation/breadcrumbs/breadcrumbs.json +5 -0
  66. package/component-meta/navigation/commandPalette/commandPalette.json +161 -0
  67. package/component-meta/navigation/menu/menu.json +1 -1
  68. package/component-meta/navigation/menu/menuItem.json +1 -1
  69. package/component-meta/navigation/pagination/pagination.json +5 -0
  70. package/component-meta/navigation/sidebar/sidebar.json +5 -0
  71. package/component-meta/navigation/stepper/stepper.json +5 -0
  72. package/component-meta/navigation/tabs/tab/tab.json +30 -4
  73. package/component-meta/navigation/tabs/tabPanel/tabPanel.json +42 -0
  74. package/component-meta/navigation/tabs/tabs.json +40 -7
  75. package/package.json +3 -3
@@ -0,0 +1,55 @@
1
+ {
2
+ "name": "Kbd",
3
+ "description": "A keyboard shortcut as key caps (<kbd>): `Mod` is Command on macOS and Ctrl elsewhere, Mac names become symbols; for a tooltip, a menu item or a command palette.",
4
+ "ssr": {
5
+ "safe": true,
6
+ "rendering": "universal"
7
+ },
8
+ "extends": [
9
+ "Omit<HTMLAttributes<HTMLElement>, \"children\">"
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/kbd/kbd.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/kbd/kbd.entry.less\";"
22
+ },
23
+ "props": {
24
+ "className": {
25
+ "type": "string",
26
+ "required": false,
27
+ "description": "Additional CSS class name(s) for the root element."
28
+ },
29
+ "keys": {
30
+ "type": "string[]",
31
+ "required": true,
32
+ "description": "The keys of the shortcut in order, e.g. `[\"Mod\", \"K\"]` or `[\"Shift\", \"Enter\"]`. `Mod` is the\nCommand key on macOS and Ctrl elsewhere. On macOS, `Shift`, `Alt`/`Option`, `Ctrl`/`Control`,\n`Meta`/`Cmd`/`Command`, `Enter`, `Escape`, `Tab`, `Backspace` and `Delete` are drawn as the\nsymbols of the Mac keyboard; elsewhere the same names are drawn as Ctrl, Alt, Shift, Meta, Enter,\nEsc, Tab, Backspace and Del, whatever their case. `\" \"` and `Space` are the Space key, `+` and\n`Plus` the plus key.\nArrow names (`ArrowUp` or `Up`, …) are arrows everywhere; any other key is drawn as given\n(a single letter in upper case)."
33
+ },
34
+ "platform": {
35
+ "type": "KbdPlatform",
36
+ "required": false,
37
+ "description": "The platform whose keys are drawn. Without it the browser's own is used: `other` on the\nserver and in the first client render (so that hydration matches), `mac` right after on a Mac.\nSet it for a fixed look, in stories and in tests."
38
+ },
39
+ "separator": {
40
+ "type": "string",
41
+ "required": false,
42
+ "description": "Drawn between the key caps. By default `+` on `other` and nothing on `mac`, where the symbols\nstand side by side; `\"\"` draws none. It is for the eye only; assistive technology reads `label`."
43
+ },
44
+ "label": {
45
+ "type": "string",
46
+ "required": false,
47
+ "description": "What assistive technology reads instead of the key caps. By default the key names, joined\nwith `+` on `other` (\"Ctrl+K\") and with a space on `mac` (\"Command K\")."
48
+ },
49
+ "data-testid": {
50
+ "type": "string",
51
+ "required": false,
52
+ "description": "Test id of the root `<kbd>`; `kbd` unless given."
53
+ }
54
+ }
55
+ }
@@ -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
  }
@@ -30,7 +30,7 @@
30
30
  "selected": {
31
31
  "type": "boolean",
32
32
  "required": false,
33
- "description": "Controlled selected tab index or value."
33
+ "description": "Paints the row as the current one. On a link row (with `href`) it also marks the link as the current page\nwith `aria-current=\"page\"`, because `aria-selected` is not a state a list item can have; on another row it\nstays `aria-selected`."
34
34
  },
35
35
  "dense": {
36
36
  "type": "boolean",
@@ -50,12 +50,27 @@
50
50
  "endAdornment": {
51
51
  "type": "React.ReactNode",
52
52
  "required": false,
53
- "description": "End Adornment. Optional. Type: React.ReactNode."
53
+ "description": "Trailing content. On a link row (with `href`) it sits beside the link, not inside it, so it can hold a control\n(a pin button, a toggle) without nesting it in the `<a>`; a click on it does not reach `onClick`."
54
+ },
55
+ "href": {
56
+ "type": "string",
57
+ "required": false,
58
+ "description": "Makes the row a link: the `startAdornment` and the children sit in an `<a href>` that fills the row, so it can be\nfocused with Tab, opened with middle click or copied. Keep the `startAdornment` non-interactive; a control\nbelongs in the `endAdornment`. A disabled row has no `href`. A router takes the\nplain click in `onClick` with `event.preventDefault()`, and leaves a modified one (Ctrl, Meta, Shift,\nAlt, or a button other than the main one) to the browser, as a router's `Link` does."
59
+ },
60
+ "target": {
61
+ "type": "string | null",
62
+ "required": false,
63
+ "description": "Where the link (with `href`) opens. By default `\"_blank\"`: a new tab, as for `Button`. Pass `null` for an\ninternal link: the `target` attribute is left out and the link opens in place. An empty string does the same; any other\nstring is used as is."
64
+ },
65
+ "rel": {
66
+ "type": "string",
67
+ "required": false,
68
+ "description": "The `rel` of the link (with `href`). By default `\"noreferrer\"` for a link that opens another tab or window,\nand none for one that opens in place. Your own value replaces the default, so add `noreferrer` yourself\nif you still want it; an empty string drops the attribute."
54
69
  },
55
70
  "onClick": {
56
71
  "type": "React.MouseEventHandler<HTMLLIElement>",
57
72
  "required": false,
58
- "description": "Callback fired when the element is clicked."
73
+ "description": "Click handler of the row. With an `href` it runs for a click on the link (not on the `endAdornment`), before the\nbrowser follows it, so `event.preventDefault()` cancels the navigation; the row then is not a Tab stop of its\nown, the link is."
59
74
  }
60
75
  }
61
76
  }
@@ -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
  }
@@ -0,0 +1,60 @@
1
+ {
2
+ "name": "QrCode",
3
+ "description": "QR code of a value as an SVG image (role=img), dark modules on white in every theme, with a quiet zone, size, caption and error-correction level.",
4
+ "ssr": {
5
+ "safe": true,
6
+ "rendering": "universal"
7
+ },
8
+ "extends": [
9
+ "Omit<React.HTMLAttributes<HTMLElement>, \"children\" | \"role\">"
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/qrCode/qrCode.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/qrCode/qrCode.entry.less\";"
22
+ },
23
+ "props": {
24
+ "value": {
25
+ "type": "string",
26
+ "required": true,
27
+ "description": "Text encoded in the code (a URL, a pairing token). Encoded as UTF-8 bytes."
28
+ },
29
+ "size": {
30
+ "type": "number | undefined",
31
+ "required": false,
32
+ "description": "Side of the code, quiet zone included, in pixels. Default 192."
33
+ },
34
+ "caption": {
35
+ "type": "React.ReactNode",
36
+ "required": false,
37
+ "description": "Shown under the code (a `<figcaption>`), e.g. \"Scan with the phone app\"."
38
+ },
39
+ "label": {
40
+ "type": "string | undefined",
41
+ "required": false,
42
+ "description": "Accessible name of the image. Default \"QR code\"."
43
+ },
44
+ "errorCorrection": {
45
+ "type": "QrCodeErrorCorrection | undefined",
46
+ "required": false,
47
+ "description": "Error-correction level: L 7%, M 15% (default), Q 25%, H 30% of the code may be damaged or covered."
48
+ },
49
+ "quietZone": {
50
+ "type": "number | undefined",
51
+ "required": false,
52
+ "description": "Light margin around the code in modules. Default 4, the minimum the QR spec asks for; smaller values hurt scanning."
53
+ },
54
+ "data-testid": {
55
+ "type": "string | undefined",
56
+ "required": false,
57
+ "description": "Test id of the root; `qr-code` unless given."
58
+ }
59
+ }
60
+ }
@@ -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
  }
@@ -0,0 +1,60 @@
1
+ {
2
+ "name": "StatusDot",
3
+ "description": "Small status marker dot coloured by status or theme colour, with a pulse for active (role=img).",
4
+ "ssr": {
5
+ "safe": true,
6
+ "rendering": "universal"
7
+ },
8
+ "extends": [
9
+ "Omit<HTMLAttributes<HTMLSpanElement>, \"role\" | \"children\" | \"aria-label\">"
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/statusDot/statusDot.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/statusDot/statusDot.entry.less\";"
22
+ },
23
+ "props": {
24
+ "className": {
25
+ "type": "string",
26
+ "required": false,
27
+ "description": "Class name(s) for the dot's root `<span>`."
28
+ },
29
+ "status": {
30
+ "type": "StatusDotStatus | undefined",
31
+ "required": false,
32
+ "description": "What the dot says, and so its colour: `active` info, `attention` warning, `idle` neutral, `done` success,\n`error` error. `unknown` is a ring in the outline colour. Without `status` (and without `color`) the dot is\n`unknown`."
33
+ },
34
+ "color": {
35
+ "type": "StatusDotColor | undefined",
36
+ "required": false,
37
+ "description": "A theme colour instead of the status's own, or on its own with no `status` (a plain disc). Given with a\n`status`, the status still sets the shape."
38
+ },
39
+ "size": {
40
+ "type": "StatusDotSize | undefined",
41
+ "required": false,
42
+ "description": "`md` (12px) unless given; `sm` is 8px."
43
+ },
44
+ "pulse": {
45
+ "type": "boolean | undefined",
46
+ "required": false,
47
+ "description": "A ring spreads from the dot. On unless given for `active`, off for every other status. Never drawn while the\nuser prefers reduced motion."
48
+ },
49
+ "label": {
50
+ "type": "string",
51
+ "required": true,
52
+ "description": "What the dot means in words, e.g. \"Working\": the accessible name, read by assistive technology."
53
+ },
54
+ "data-testid": {
55
+ "type": "string | undefined",
56
+ "required": false,
57
+ "description": "Test id of the root; `status-dot` unless given."
58
+ }
59
+ }
60
+ }
@@ -0,0 +1,90 @@
1
+ {
2
+ "name": "Swimlanes",
3
+ "description": "Participant lanes: a virtualised grid (role=grid) with one row per lane, a fixed rowheader column (avatar, name, role) and a content cell that scrolls sideways; fixed rowHeight, single selection (selectedId/defaultSelectedId/onSelectedChange), arrow/Home/End/Page keys with one Tab stop.",
4
+ "ssr": {
5
+ "safe": true,
6
+ "rendering": "universal"
7
+ },
8
+ "extends": [
9
+ "Omit<React.HTMLAttributes<HTMLDivElement>, \"onSelect\" | \"role\" | \"children\">"
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/swimlanes/swimlanes.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/swimlanes/swimlanes.entry.less\";"
22
+ },
23
+ "props": {
24
+ "lanes": {
25
+ "type": "readonly SwimlanesLane[]",
26
+ "required": true,
27
+ "description": "The lanes, one row each, in the order they are drawn."
28
+ },
29
+ "label": {
30
+ "type": "string | undefined",
31
+ "required": false,
32
+ "description": "Accessible name of the grid (aria-label); `aria-labelledby` wins when given."
33
+ },
34
+ "selectedId": {
35
+ "type": "string | null | undefined",
36
+ "required": false,
37
+ "description": "The selected lane's id (controlled); null selects nothing."
38
+ },
39
+ "defaultSelectedId": {
40
+ "type": "string | null | undefined",
41
+ "required": false,
42
+ "description": "The lane selected at first (uncontrolled)."
43
+ },
44
+ "onSelectedChange": {
45
+ "type": "((id: string | null) => void) | undefined",
46
+ "required": false,
47
+ "description": "A lane was selected (its id) or the selection was cleared (null)."
48
+ },
49
+ "selectable": {
50
+ "type": "boolean | undefined",
51
+ "required": false,
52
+ "description": "Whether lanes can be selected; true by default. False: no aria-selected, no selected look,\nand Enter, Space, Escape and a click select nothing; a `selectedId` given anyway is ignored."
53
+ },
54
+ "rowHeight": {
55
+ "type": "number | undefined",
56
+ "required": false,
57
+ "description": "Row height in px (every lane is this tall; virtualisation needs a fixed height). 64 by default."
58
+ },
59
+ "headerWidth": {
60
+ "type": "number | string | undefined",
61
+ "required": false,
62
+ "description": "Width of the fixed header column: px or any CSS length; 240px by default from the stylesheet."
63
+ },
64
+ "contentMinWidth": {
65
+ "type": "number | string | undefined",
66
+ "required": false,
67
+ "description": "Narrowest width of the content column; when the grid is narrower, it scrolls sideways. 0 by default."
68
+ },
69
+ "height": {
70
+ "type": "number | string | undefined",
71
+ "required": false,
72
+ "description": "The grid's height (the scroller): a number of pixels or any CSS length; 480\nby default, from the stylesheet, so a height in `style` works too."
73
+ },
74
+ "overscan": {
75
+ "type": "number | undefined",
76
+ "required": false,
77
+ "description": "Lanes rendered above and below the visible ones. 4 by default."
78
+ },
79
+ "emptyLabel": {
80
+ "type": "React.ReactNode",
81
+ "required": false,
82
+ "description": "Shown instead of the grid when `lanes` is empty."
83
+ },
84
+ "data-testid": {
85
+ "type": "string | undefined",
86
+ "required": false,
87
+ "description": "Test id of the root `<div>`; `swimlanes` unless given."
88
+ }
89
+ }
90
+ }
@@ -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. Labels come from `TableCell label`."
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 column's name, shown next to the value when the table stacks rows as cards (`Table stackBelow`)."
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": "Caption. Optional. Type: React.ReactNode."
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": "Controlled selected tab index or value."
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 selectable button (keyboard + `aria-pressed`)."
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": "Whether the control is disabled and non-interactive."
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",
@@ -71,22 +71,42 @@
71
71
  "selectable": {
72
72
  "type": "boolean",
73
73
  "required": false,
74
- "description": "Enables label click selection."
74
+ "description": "Enables row selection: a click, Enter or Space on a row toggles its selection. The chevron and the\nLeft/Right keys never change it."
75
75
  },
76
76
  "checkboxes": {
77
77
  "type": "boolean",
78
78
  "required": false,
79
79
  "description": "Renders a checkbox per node bound to selection."
80
80
  },
81
+ "toggleOnRowClick": {
82
+ "type": "boolean",
83
+ "required": false,
84
+ "description": "Whether a click, Enter or Space on a row also expands or collapses its children. The chevron and the\nRight/Left keys always do. Defaults to `true` while the tree is not `selectable` (a row has nothing else to\ndo) and to `false` otherwise, so that selecting a row leaves it open or closed."
85
+ },
81
86
  "renderLabel": {
82
87
  "type": "(item: ITreeNodeItem, nodeId: string) => ReactNode",
83
88
  "required": false,
84
89
  "description": "Custom node renderer."
85
90
  },
91
+ "renderActions": {
92
+ "type": "(item: ITreeNodeItem, nodeId: string) => ReactNode",
93
+ "required": false,
94
+ "description": "Per-node actions (buttons, a menu trigger), drawn at the end of the row. They sit beside the row's\nbutton, not inside it, so they take their own clicks, Enter and Space, focus and accessible names."
95
+ },
96
+ "loadingText": {
97
+ "type": "string",
98
+ "required": false,
99
+ "description": "Text shown while `loadChildren` is pending; \"Loading…\" unless given."
100
+ },
86
101
  "loadChildren": {
87
102
  "type": "(item: ITreeNodeItem, nodeId: string) => Promise<ITreeNodeItem[]>",
88
103
  "required": false,
89
104
  "description": "Lazily resolves children the first time a node is expanded."
105
+ },
106
+ "data-testid": {
107
+ "type": "string",
108
+ "required": false,
109
+ "description": "Test id of the root `<div>`; `tree-view` unless given."
90
110
  }
91
111
  }
92
112
  }
@@ -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": "Root element."
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": "Chat message data object."
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): show on pointer enter; click: toggle; manual: use open only."
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": "Open Delay. Optional. Type: number."
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": "Close Delay. Optional. Type: number."
59
+ "description": "Milliseconds from the pointer and keyboard focus both leaving the target until a hover tooltip hides."
60
60
  }
61
61
  }
62
62
  }