@smwb/ui-mcp-react 2.6.3 → 2.8.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/headerCellRenderer.json

@@ -1,6 +1,6 @@
 {
   "name": "HeaderCellRenderer",
-  "description": "Default renderer for sortable table header cells.",
+  "description": "Header text that turns into an inline text field on click, to rename the column; in a sortable table that click does not sort.",
   "ssr": {
     "safe": true,
     "rendering": "universal"

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/accordion/accordion.json

@@ -25,9 +25,19 @@
       "description": "Additional CSS class name(s) for the root element."
     },
     "title": {
-      "type": "string",
+      "type": "ReactNode",
+      "required": false,
+      "description": "Header text or markup (a date, an author, a badge…)."
+    },
+    "subtitle": {
+      "type": "ReactNode",
+      "required": false,
+      "description": "Secondary line under the title."
+    },
+    "variant": {
+      "type": "AccordionVariant",
       "required": false,
-      "description": "Accessible title or tooltip text."
+      "description": "Visual style variant."
     },
     "isOpenByDefault": {
       "type": "boolean",
@@ -64,11 +74,26 @@
       "required": false,
       "description": "Start Adornment. Optional. Type: (isOpen: boolean) => React.ReactNode."
     },
+    "endAdornment": {
+      "type": "(isOpen: boolean) => React.ReactNode",
+      "required": false,
+      "description": "Rendered after the title, before the expand icon."
+    },
     "noIcon": {
       "type": "boolean",
       "required": false,
       "description": "No Icon. Optional. Type: boolean."
     },
+    "lazy": {
+      "type": "boolean",
+      "required": false,
+      "description": "Create the content on first open instead of up front."
+    },
+    "unmountOnExit": {
+      "type": "boolean",
+      "required": false,
+      "description": "Remove the content once the panel has collapsed (created again on open)."
+    },
     "onToggleClick": {
       "type": "(e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void",
       "required": false,

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

@@ -40,6 +40,21 @@
       "type": "() => void",
       "required": false,
       "description": "Click handler for the \"+N\" surplus chip."
+    },
+    "surplusAriaLabel": {
+      "type": "(count: number) => string",
+      "required": false,
+      "description": "Accessible name of the \"+N\" surplus chip."
+    },
+    "size": {
+      "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

@@ -0,0 +1,78 @@
+{
+  "name": "Chart",
+  "description": "An ECharts chart in the theme's palette (import from @smwb/ui-react/chart; echarts is an optional peer): option or option(palette), lazy-loaded ECharts or your own loader, a skeleton until it draws, redrawn on theme switches and resizes (not at zero size).",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal",
+    "note": "Renders a same-size skeleton and the summary on the server; ECharts loads and draws in the browser."
+  },
+  "extends": [
+    "Omit<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/chart/chart.entry.less"
+    ],
+    "dependencies": [
+      "@smwb/ui-styles/less/components/skeleton/skeleton.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/chart/chart.entry.less\";\n@import (less) \"node_modules/@smwb/ui-styles/less/components/skeleton/skeleton.entry.less\";"
+  },
+  "props": {
+    "className": {
+      "type": "string",
+      "required": false,
+      "description": "Additional CSS class name(s) for the root element."
+    },
+    "label": {
+      "type": "string",
+      "required": true,
+      "description": "What the chart shows: its accessible name."
+    },
+    "summary": {
+      "type": "string",
+      "required": false,
+      "description": "The chart in words, for screen readers; it is there before the chart draws, and on the server."
+    },
+    "option": {
+      "type": "ChartOption | ((palette: ChartPalette) => ChartOption)",
+      "required": true,
+      "description": "The ECharts option, or a function of the theme's palette that returns it.\nIt is applied whole whenever it or the theme changes; an equal option\npassed again (an inline object on a re-render) does not redraw."
+    },
+    "height": {
+      "type": "number | string",
+      "required": false,
+      "description": "The chart's height: a number of pixels or any CSS length; 240 by default. It fills the width."
+    },
+    "loader": {
+      "type": "() => Promise<ChartModule>",
+      "required": false,
+      "description": "Loads ECharts in the browser: `import(\"echarts\")` by default, the whole\nlibrary. For a smaller bundle pass `() => import(\"./my-echarts\")`, a module\nthat registers only the charts you use with `echarts/core`."
+    },
+    "renderer": {
+      "type": "\"canvas\" | \"svg\"",
+      "required": false,
+      "description": "How ECharts draws: \"canvas\" (default) or \"svg\". Read once, when the chart is created."
+    },
+    "onClick": {
+      "type": "(params: ChartEventParams) => void",
+      "required": false,
+      "description": "A click on an item: a bar, a point, a node."
+    },
+    "onReady": {
+      "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/chatLayout.json

@@ -89,6 +89,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

@@ -74,6 +74,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/descriptionList/descriptionList.descriptionItem.json

@@ -0,0 +1,35 @@
+{
+  "name": "DescriptionItem",
+  "description": "One term and its description inside a DescriptionList.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
+  "extends": [
+    "HTMLAttributes<HTMLDivElement>"
+  ],
+  "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/descriptionList/descriptionList.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/descriptionList/descriptionList.entry.less\";"
+  },
+  "props": {
+    "className": {
+      "type": "string",
+      "required": false,
+      "description": "Additional CSS class name(s) for the root element."
+    },
+    "term": {
+      "type": "ReactNode",
+      "required": true,
+      "description": "The field's name."
+    }
+  }
+}

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

@@ -0,0 +1,50 @@
+{
+  "name": "DescriptionList",
+  "description": "Field-value pairs (<dl>) from items or DescriptionItem children; side by side, stacking in a narrow container (container query).",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
+  "extends": [
+    "HTMLAttributes<HTMLDListElement>"
+  ],
+  "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/descriptionList/descriptionList.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/descriptionList/descriptionList.entry.less\";"
+  },
+  "props": {
+    "className": {
+      "type": "string",
+      "required": false,
+      "description": "Additional CSS class name(s) for the root element."
+    },
+    "items": {
+      "type": "DescriptionListEntry[]",
+      "required": false,
+      "description": "The pairs as data; `DescriptionItem` children work too, and come after them."
+    },
+    "layout": {
+      "type": "DescriptionListLayout",
+      "required": false,
+      "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",
+      "required": false,
+      "description": "Width of the term column in the row layout: px or any CSS track size. 30% of the list, at least 6rem, by default."
+    },
+    "dense": {
+      "type": "boolean",
+      "required": false,
+      "description": "Tighter spacing, for side panels."
+    }
+  }
+}

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

@@ -0,0 +1,40 @@
+{
+  "name": "Kanban",
+  "description": "A board of KanbanColumn children side by side, scrolling sideways (with snap) when they do not fit; columnWidth sets the narrowest column.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
+  "extends": [
+    "HTMLAttributes<HTMLDivElement>"
+  ],
+  "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/kanban/kanban.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/kanban/kanban.entry.less\";"
+  },
+  "props": {
+    "className": {
+      "type": "string",
+      "required": false,
+      "description": "Additional CSS class name(s) for the root element."
+    },
+    "columnWidth": {
+      "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

@@ -0,0 +1,50 @@
+{
+  "name": "KanbanCard",
+  "description": "A card on a Kanban board: a title clamped to titleLines lines (a link stretched over the card with href) and content below.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
+  "extends": [
+    "Omit<HTMLAttributes<HTMLLIElement>, \"title\">"
+  ],
+  "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/kanban/kanban.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/kanban/kanban.entry.less\";"
+  },
+  "props": {
+    "className": {
+      "type": "string",
+      "required": false,
+      "description": "Additional CSS class name(s) for the root element."
+    },
+    "title": {
+      "type": "ReactNode",
+      "required": false,
+      "description": "The card's title, clamped to `titleLines` lines."
+    },
+    "href": {
+      "type": "string",
+      "required": false,
+      "description": "Makes the title a link, and the whole card open it."
+    },
+    "titleLines": {
+      "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

@@ -0,0 +1,60 @@
+{
+  "name": "KanbanColumn",
+  "description": "A board column (role=group named by its title): a count, an accent stripe, KanbanCard children, an empty placeholder and a footer.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
+  "extends": [
+    "Omit<HTMLAttributes<HTMLDivElement>, \"title\">"
+  ],
+  "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/kanban/kanban.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/kanban/kanban.entry.less\";"
+  },
+  "props": {
+    "className": {
+      "type": "string",
+      "required": false,
+      "description": "Additional CSS class name(s) for the root element."
+    },
+    "title": {
+      "type": "ReactNode",
+      "required": true,
+      "description": "The column's name: text or a badge. It names the column for assistive technology."
+    },
+    "count": {
+      "type": "number | string | null",
+      "required": false,
+      "description": "How many cards the column holds (it may show fewer), beside the title. Nothing is shown for null."
+    },
+    "accent": {
+      "type": "string",
+      "required": false,
+      "description": "The column's colour, a stripe along its top: any CSS colour."
+    },
+    "empty": {
+      "type": "ReactNode",
+      "required": false,
+      "description": "Shown in place of the cards when there are none, e.g. \"Empty\"."
+    },
+    "footer": {
+      "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."
+    }
+  }
+}

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

@@ -35,6 +35,11 @@
       "type": "ReactNode",
       "required": false,
       "description": "Section subheader rendered before the items."
+    },
+    "data-testid": {
+      "type": "string",
+      "required": false,
+      "description": "Test id of the root `<ul>`; `list` unless given."
     }
   }
 }