@smwb/ui-mcp-react 2.7.0 → 2.9.0

package/component-meta/base/icon/icon.json

@@ -59,12 +59,17 @@
     "title": {
       "type": "string",
       "required": false,
-      "description": "Accessible name. When provided the icon is exposed as\n`role=\"img\"`; otherwise it is `aria-hidden` (decorative)."
+      "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`."
     },
     "source": {
       "type": "IconSource",
       "required": false,
       "description": "Overrides the icon source for this icon only. See IconSource."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the root `<span>`; `icon` unless given."
     }
   }
 }

package/component-meta/base/ripple/ripple.json

@@ -29,7 +29,7 @@
     "classes": {
       "type": "RippleClasses",
       "required": false,
-      "description": "Classes. Optional. Type: RippleClasses."
+      "description": "Extra classes: `ripple` for the root, `child` for each ripple."
     },
     "center": {
       "type": "boolean",
@@ -45,6 +45,11 @@
       "type": "string",
       "required": false,
       "description": "Ripple color (any CSS color). Defaults to inherited currentColor."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the root `<span>`; `ripple` unless given."
     }
   }
 }

package/component-meta/connects/rt/table/table.json

@@ -6,7 +6,7 @@
     "rendering": "universal"
   },
   "extends": [
-    "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}"
+    "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}"
   ],
   "styles": {
     "base": [

package/component-meta/dataDisplay/avatar/avatar.avatarGroup.json

@@ -50,6 +50,11 @@
       "type": "AvatarSize | number",
       "required": false,
       "description": "Size of the \"+N\" surplus chip: match the avatars in the group."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the root `<div>`; `avatar-group` unless given."
     }
   }
 }

package/component-meta/dataDisplay/avatar/avatar.json

@@ -55,6 +55,11 @@
       "type": "ImgHTMLAttributes<HTMLImageElement>",
       "required": false,
       "description": "Extra attributes forwarded to the underlying <img> (srcSet, loading…)."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the root `<div>`; `avatar` unless given."
     }
   }
 }

package/component-meta/dataDisplay/card/card.json

@@ -24,7 +24,7 @@
     "className": {
       "type": "string",
       "required": false,
-      "description": "Additional CSS class name(s) for the root element."
+      "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."
     },
     "variant": {
       "type": "\"filled\" | \"elevated\" | \"outlined\"",
@@ -34,22 +34,27 @@
     "disabled": {
       "type": "boolean",
       "required": false,
-      "description": "Whether the control is disabled and non-interactive."
+      "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."
     },
     "title": {
       "type": "string",
       "required": false,
-      "description": "Accessible title or tooltip text."
+      "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."
     },
     "footer": {
       "type": "ReactNode",
       "required": false,
-      "description": "Footer slot rendered after the content."
+      "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`."
     },
     "onClick": {
       "type": "React.MouseEventHandler<HTMLDivElement>",
       "required": false,
-      "description": "Makes the card interactive (role=button, keyboard, focus ring)."
+      "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."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the root `<div>`; `card` unless given."
     }
   }
 }

package/component-meta/dataDisplay/chart/chart.json

@@ -68,6 +68,11 @@
       "type": "(chart: ChartInstance) => void",
       "required": false,
       "description": "The ECharts instance, once it has drawn — for other events and actions. Called again if a theme change re-creates it."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the root `<div>`; `chart` unless given."
     }
   }
 }

package/component-meta/dataDisplay/chat/chat.chatFooterComposer.json

@@ -0,0 +1,24 @@
+{
+  "name": "ChatFooterComposer",
+  "description": "Props for the `Composer` Chat draws as its footer. The props Chat owns itself — `onSendMessage` (the composer's\n`onSend`), `busy`, `onStop`, `composerPlaceholder` (`placeholder`), `composerDisabled` (`disabled`), the file upload\nprops (`onAttach`, `accept`, `multiple`, `maxFiles`) and `dropTarget` (always `false`: the Chat shell is the drop\ntarget) — are left out, Chat passes them and does not let a caller override them.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
+  "extends": [
+    "Omit<\n  ComposerProps,\n  | \"onSend\"\n  | \"busy\"\n  | \"onStop\"\n  | \"disabled\"\n  | \"placeholder\"\n  | \"onAttach\"\n  | \"accept\"\n  | \"multiple\"\n  | \"maxFiles\"\n  | \"dropTarget\"\n>"
+  ],
+  "inheritedAttributes": "Also accepts standard HTML attributes for the underlying element (see extends clause in TypeScript).",
+  "styles": {
+    "base": [
+      "@smwb/ui-styles/less/foundation.less",
+      "@smwb/ui-styles/less/theme.less"
+    ],
+    "entries": [
+      "@smwb/ui-styles/less/components/chat/chat.entry.less"
+    ],
+    "dependencies": [],
+    "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/chat/chat.entry.less\";"
+  },
+  "props": {}
+}

package/component-meta/dataDisplay/chat/chat.json

@@ -20,6 +20,7 @@
     ],
     "dependencies": [
       "@smwb/ui-styles/less/components/avatar/avatar.entry.less",
+      "@smwb/ui-styles/less/components/composer/composer.entry.less",
       "@smwb/ui-styles/less/components/floatingButton/floatingButton.entry.less",
       "@smwb/ui-styles/less/components/icon/icon.entry.less",
       "@smwb/ui-styles/less/components/ripple/ripple.entry.less",
@@ -27,7 +28,7 @@
       "@smwb/ui-styles/less/components/textField/textField.entry.less",
       "@smwb/ui-styles/less/components/typography/typography.entry.less"
     ],
-    "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/chat/chat.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/avatar/avatar.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/floatingButton/floatingButton.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\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/skeleton/skeleton.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/textField/textField.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/typography/typography.entry.less\";"
+    "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/chat/chat.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/avatar/avatar.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/composer/composer.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/floatingButton/floatingButton.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\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/skeleton/skeleton.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/textField/textField.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/typography/typography.entry.less\";"
   },
   "props": {
     "className": {
@@ -145,6 +146,26 @@
       "required": false,
       "description": "On Send Message. Optional. Type: (text: string) => void | Promise<void>."
     },
+    "busy": {
+      "type": "boolean",
+      "required": false,
+      "description": "The agent is replying: the composer's send button turns into Stop and calls `onStop`, the keys do not send, the\ntext stays editable. Not the same as `loading` (the message list skeleton). The default composer only."
+    },
+    "onStop": {
+      "type": "() => void",
+      "required": false,
+      "description": "Called when Stop is pressed while `busy` (and not `composerDisabled`). The default composer only."
+    },
+    "composerProps": {
+      "type": "ChatFooterComposerProps",
+      "required": false,
+      "description": "More props for the built-in `Composer`: `toolbar`, `attachments`, `maxLength`, `counter`, `minRows`, `maxRows`,\n`layout`, `sendKey` (default here `\"enter\"`), `value`/`defaultValue`/`onValueChange`, `clearOnSend`, `autoFocus`,\n`inputRef`, `aria-*`, `sendLabel`, `stopLabel`, `attachLabel`, `className`, `data-*`, … Chat's own props\n(`onSendMessage`, `busy`, `onStop`, `composerPlaceholder`, `composerDisabled`, the file upload props) win."
+    },
+    "legacyComposer": {
+      "type": "boolean",
+      "required": false,
+      "description": "Deprecated: draws the old `ChatComposer` (Enter sends, TextField DOM, `chat-composer*` test ids) instead of the\nbuilt-in `Composer`. Kept for the migration and removed with `ChatComposer` in the next major; `busy`, `onStop`\nand `composerProps` are ignored in this mode."
+    },
     "composerPlaceholder": {
       "type": "string",
       "required": false,
@@ -158,12 +179,12 @@
     "composerShiftEnterNewline": {
       "type": "boolean",
       "required": false,
-      "description": "Composer Shift Enter Newline. Optional. Type: boolean."
+      "description": "Deprecated: works with `legacyComposer` only — the built-in `Composer` always inserts a newline on Shift+Enter.\nPass it together with `legacyComposer` until that is removed."
     },
     "composerCtrlEnterNewline": {
       "type": "boolean",
       "required": false,
-      "description": "Composer Ctrl Enter Newline. Optional. Type: boolean."
+      "description": "Deprecated: works with `legacyComposer` only — with the built-in `Composer` Ctrl/⌘+Enter sends. Pass it together\nwith `legacyComposer` until that is removed."
     },
     "fileUpload": {
       "type": "boolean",

package/component-meta/dataDisplay/chat/chatComposer.json

@@ -1,6 +1,6 @@
 {
   "name": "ChatComposer",
-  "description": "Chat Composer component from the dataDisplay module.",
+  "description": "Deprecated: the old chat input (Enter sends, TextField-based). Use Composer; Chat draws a Composer by default (legacyComposer keeps this one during the migration).",
   "ssr": {
     "safe": true,
     "rendering": "universal"

package/component-meta/dataDisplay/chat/chatLayout.json

@@ -20,6 +20,7 @@
     ],
     "dependencies": [
       "@smwb/ui-styles/less/components/avatar/avatar.entry.less",
+      "@smwb/ui-styles/less/components/composer/composer.entry.less",
       "@smwb/ui-styles/less/components/floatingButton/floatingButton.entry.less",
       "@smwb/ui-styles/less/components/icon/icon.entry.less",
       "@smwb/ui-styles/less/components/ripple/ripple.entry.less",
@@ -27,7 +28,7 @@
       "@smwb/ui-styles/less/components/textField/textField.entry.less",
       "@smwb/ui-styles/less/components/typography/typography.entry.less"
     ],
-    "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/chat/chat.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/avatar/avatar.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/floatingButton/floatingButton.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\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/skeleton/skeleton.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/textField/textField.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/typography/typography.entry.less\";"
+    "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/chat/chat.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/avatar/avatar.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/composer/composer.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/floatingButton/floatingButton.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\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/skeleton/skeleton.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/textField/textField.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/typography/typography.entry.less\";"
   },
   "props": {
     "className": {
@@ -89,6 +90,11 @@
       "type": "ChatLayoutChatProps",
       "required": true,
       "description": "Chat configuration passed to ChatLayout."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the root `<div>`; `chat-layout` unless given."
     }
   }
 }

package/component-meta/dataDisplay/chat/chatOverlayLayout.json

@@ -20,6 +20,7 @@
     ],
     "dependencies": [
       "@smwb/ui-styles/less/components/avatar/avatar.entry.less",
+      "@smwb/ui-styles/less/components/composer/composer.entry.less",
       "@smwb/ui-styles/less/components/floatingButton/floatingButton.entry.less",
       "@smwb/ui-styles/less/components/icon/icon.entry.less",
       "@smwb/ui-styles/less/components/ripple/ripple.entry.less",
@@ -27,7 +28,7 @@
       "@smwb/ui-styles/less/components/textField/textField.entry.less",
       "@smwb/ui-styles/less/components/typography/typography.entry.less"
     ],
-    "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/chat/chat.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/avatar/avatar.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/floatingButton/floatingButton.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\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/skeleton/skeleton.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/textField/textField.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/typography/typography.entry.less\";"
+    "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/chat/chat.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/avatar/avatar.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/composer/composer.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/floatingButton/floatingButton.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\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/skeleton/skeleton.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/textField/textField.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/typography/typography.entry.less\";"
   },
   "props": {
     "className": {
@@ -74,6 +75,11 @@
       "type": "ChatOverlayLayoutChatProps",
       "required": true,
       "description": "Chat configuration passed to ChatLayout."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the root `<div>`; `chat-overlay-layout` unless given."
     }
   }
 }

package/component-meta/dataDisplay/chip/chip.json

@@ -27,7 +27,7 @@
     "className": {
       "type": "string",
       "required": false,
-      "description": "Additional CSS class name(s) for the root element."
+      "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."
     },
     "variant": {
       "type": "\"filled\" | \"outlined\"",
@@ -47,7 +47,7 @@
     "onDelete": {
       "type": "(event: React.SyntheticEvent) => void",
       "required": false,
-      "description": "On Delete. Optional. Type: (event: React.SyntheticEvent) => void."
+      "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`."
     },
     "icon": {
       "type": "React.ReactNode",
@@ -67,7 +67,7 @@
     "onClick": {
       "type": "() => void",
       "required": false,
-      "description": "Callback fired when the element is clicked."
+      "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."
     },
     "onDeleteMouseDown": {
       "type": "React.MouseEventHandler",
@@ -77,7 +77,7 @@
     "disabled": {
       "type": "boolean",
       "required": false,
-      "description": "Whether the control is disabled and non-interactive."
+      "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."
     },
     "asLink": {
       "type": "boolean",
@@ -99,10 +99,20 @@
       "required": false,
       "description": "Controlled selected tab index or value."
     },
+    "labelId": {
+      "type": "string",
+      "required": false,
+      "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."
+    },
     "deleteAriaLabel": {
       "type": "string",
       "required": false,
       "description": "Accessible label for the delete control."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the root; `chip`, or `chip-link` for a link, unless given."
     }
   }
 }

package/component-meta/dataDisplay/dagView/dagView.json

@@ -0,0 +1,165 @@
+{
+  "name": "DagView",
+  "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).",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
+  "extends": [
+    "Omit<React.HTMLAttributes<HTMLDivElement>, \"onClick\">"
+  ],
+  "inheritedAttributes": "Also accepts standard HTML attributes for the underlying element (see extends clause in TypeScript).",
+  "styles": {
+    "base": [
+      "@smwb/ui-styles/less/foundation.less",
+      "@smwb/ui-styles/less/theme.less"
+    ],
+    "entries": [
+      "@smwb/ui-styles/less/components/dagView/dagView.entry.less"
+    ],
+    "dependencies": [],
+    "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\";"
+  },
+  "props": {
+    "label": {
+      "type": "string",
+      "required": true,
+      "description": "What the graph shows: its accessible name."
+    },
+    "summary": {
+      "type": "string | undefined",
+      "required": false,
+      "description": "The graph in words, for screen readers; it is there on the server too."
+    },
+    "nodes": {
+      "type": "readonly DagViewNode<T>[]",
+      "required": true,
+      "description": "The nodes. A change of status, label or data alone does not lay the graph out again."
+    },
+    "edges": {
+      "type": "readonly DagViewEdge[]",
+      "required": true,
+      "description": "The edges, from the node depended on to the node that depends on it."
+    },
+    "renderNode": {
+      "type": "((node: DagViewNode<T>, state: DagViewNodeState) => React.ReactNode) | undefined",
+      "required": false,
+      "description": "Draws a node's content inside its box; the default shows a status dot,\nthe label and the status word. `node` and `state` are a snapshot of the\nrender they are passed to. Keep the content non-interactive where you can:\na node is an ARIA option, whose content assistive technology may read as\nplain text, and a click in it also selects the node. Links and buttons in\nit are left out of the Tab order except in the node that is the graph's\nTab stop."
+    },
+    "direction": {
+      "type": "DagDirection | undefined",
+      "required": false,
+      "description": "Which way the layers run: \"LR\" (left to right, default) or \"TB\" (top to bottom)."
+    },
+    "nodeWidth": {
+      "type": "number | undefined",
+      "required": false,
+      "description": "A node's width in pixels, unless the node sets its own; 180 by default."
+    },
+    "nodeHeight": {
+      "type": "number | undefined",
+      "required": false,
+      "description": "A node's height in pixels, unless the node sets its own; 56 by default."
+    },
+    "rankGap": {
+      "type": "number | undefined",
+      "required": false,
+      "description": "The space between layers in pixels; 64 by default."
+    },
+    "nodeGap": {
+      "type": "number | undefined",
+      "required": false,
+      "description": "The space between nodes in a layer in pixels; 24 by default."
+    },
+    "layout": {
+      "type": "((input: DagLayoutInput) => DagLayoutResult) | undefined",
+      "required": false,
+      "description": "Lays the graph out in place of the built-in layout, e.g. with dagre or elk. It must be\nsynchronous. The layout re-runs when the graph's shape changes; swapping this function\nalone does not."
+    },
+    "selectedId": {
+      "type": "string | null | undefined",
+      "required": false,
+      "description": "The selected node's id (controlled); null selects nothing."
+    },
+    "defaultSelectedId": {
+      "type": "string | null | undefined",
+      "required": false,
+      "description": "The node selected at first (uncontrolled)."
+    },
+    "onSelectedChange": {
+      "type": "((id: string | null) => void) | undefined",
+      "required": false,
+      "description": "A node was selected (its id) or the selection was cleared (null)."
+    },
+    "onNodeClick": {
+      "type": "((node: DagViewNode<T>, event: React.MouseEvent | React.KeyboardEvent) => void) | undefined",
+      "required": false,
+      "description": "A node was clicked, or chosen with Enter or Space. Not called for a disabled node."
+    },
+    "dimUnrelated": {
+      "type": "boolean | undefined",
+      "required": false,
+      "description": "Fades the nodes and edges that are not next to the selected node."
+    },
+    "viewport": {
+      "type": "DagViewViewport | undefined",
+      "required": false,
+      "description": "Where the graph is (controlled)."
+    },
+    "defaultViewport": {
+      "type": "DagViewViewport | undefined",
+      "required": false,
+      "description": "Where the graph is at first (uncontrolled); with `fit={false}` the page does not move after it loads."
+    },
+    "onViewportChange": {
+      "type": "((viewport: DagViewViewport) => void) | undefined",
+      "required": false,
+      "description": "The view moved or zoomed: at most once per frame during a gesture."
+    },
+    "fit": {
+      "type": "boolean | undefined",
+      "required": false,
+      "description": "Fits the graph in view once it is in the page, and again when its nodes or edges change; true by default."
+    },
+    "minZoom": {
+      "type": "number | undefined",
+      "required": false,
+      "description": "The smallest zoom; 0.1 by default."
+    },
+    "maxZoom": {
+      "type": "number | undefined",
+      "required": false,
+      "description": "The largest zoom; 2 by default."
+    },
+    "wheel": {
+      "type": "\"zoom\" | \"pan\" | \"none\" | undefined",
+      "required": false,
+      "description": "What a plain mouse wheel does: \"zoom\" (default), \"pan\", or \"none\" (the page scrolls). Ctrl+wheel and a trackpad pinch always zoom."
+    },
+    "controls": {
+      "type": "boolean | undefined",
+      "required": false,
+      "description": "Shows the zoom in, zoom out and fit buttons; true by default."
+    },
+    "labels": {
+      "type": "Partial<DagViewLabels> | undefined",
+      "required": false,
+      "description": "Texts for assistive technology and the buttons, over the English defaults."
+    },
+    "height": {
+      "type": "number | string | undefined",
+      "required": false,
+      "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."
+    },
+    "apiRef": {
+      "type": "((api: DagViewApi) => void) | undefined",
+      "required": false,
+      "description": "Gets the functions that move the view from outside."
+    },
+    "data-testid": {
+      "type": "string | undefined",
+      "required": false,
+      "description": "Test id of the root `<div>`; `dag-view` unless given."
+    }
+  }
+}

package/component-meta/dataDisplay/descriptionList/descriptionList.json

@@ -34,7 +34,7 @@
     "layout": {
       "type": "DescriptionListLayout",
       "required": false,
-      "description": "Current chat shell layout mode."
+      "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."
     },
     "termWidth": {
       "type": "number | string",

package/component-meta/dataDisplay/diffStat/diffStat.json

@@ -0,0 +1,65 @@
+{
+  "name": "DiffStat",
+  "description": "The size of a change: \"+N −M\" (U+2212 minus) in the theme's success and error, with an optional five-cell bar of the same proportions and a compact tab variant; one accessible name (\"added N, removed M\", overridable with format) instead of the digits read twice (role=img).",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
+  "extends": [
+    "Omit<HTMLAttributes<HTMLSpanElement>, \"role\">"
+  ],
+  "inheritedAttributes": "Also accepts standard HTML attributes for the underlying element (see extends clause in TypeScript).",
+  "styles": {
+    "base": [
+      "@smwb/ui-styles/less/foundation.less",
+      "@smwb/ui-styles/less/theme.less"
+    ],
+    "entries": [
+      "@smwb/ui-styles/less/components/diffStat/diffStat.entry.less"
+    ],
+    "dependencies": [],
+    "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/diffStat/diffStat.entry.less\";"
+  },
+  "props": {
+    "className": {
+      "type": "string",
+      "required": false,
+      "description": "Additional CSS class name(s) for the root element."
+    },
+    "added": {
+      "type": "number",
+      "required": true,
+      "description": "Lines added; the figure behind \"+N\". NaN, `undefined`, Infinity and negatives count as 0."
+    },
+    "removed": {
+      "type": "number",
+      "required": true,
+      "description": "Lines removed; the figure behind \"−M\". NaN, `undefined`, Infinity and negatives count as 0."
+    },
+    "bar": {
+      "type": "boolean",
+      "required": false,
+      "description": "The five cells beside the figures. Shown by default, hidden in `compact`; set it either way."
+    },
+    "compact": {
+      "type": "boolean",
+      "required": false,
+      "description": "The tab variant: smaller figures, and no bar unless `bar` asks for one."
+    },
+    "format": {
+      "type": "DiffStatFormat",
+      "required": false,
+      "description": "How the accessible name is made from the two counts, as numbers: `DEFAULT_DIFF_STAT_FORMAT` unless given."
+    },
+    "group": {
+      "type": "(value: number) => string",
+      "required": false,
+      "description": "How each figure is written (it gets the count as `diffStatCount` takes it): `groupDiffStatCount` — three digits per group — unless given."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the root `<span>`; `diff-stat` unless given."
+    }
+  }
+}

package/component-meta/dataDisplay/kanban/kanban.json

@@ -30,6 +30,11 @@
       "type": "number | string",
       "required": false,
       "description": "The narrowest a column gets before the board scrolls sideways: a number of\npixels or any CSS length. 15.5rem by default."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the root `<div>`; `kanban` unless given."
     }
   }
 }

package/component-meta/dataDisplay/kanban/kanban.kanbanCard.json

@@ -40,6 +40,11 @@
       "type": "number",
       "required": false,
       "description": "Lines the title is clamped to: 3 by default."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the card's `<li>`; `kanban-card` unless given."
     }
   }
 }

package/component-meta/dataDisplay/kanban/kanban.kanbanColumn.json

@@ -50,6 +50,11 @@
       "type": "ReactNode",
       "required": false,
       "description": "Under the cards, e.g. a link to the rest as a list."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the column's `<div>`; `kanban-column` unless given."
     }
   }
 }