@smwb/ui-mcp-solid 0.2.2 → 0.4.0

package/README.md

@@ -11,7 +11,7 @@ guide to AI coding assistants (Cursor, Claude Desktop/Code, Copilot, …).
 | Tool | Purpose |
 | --- | --- |
 | `search_components` | Find components by name, id, description, or prop keywords |
-| `get_component_props` | Full metadata for one component: props (types, required, descriptions) + required LESS imports (`styles.base` / `styles.entries` / `styles.dependencies` / `styles.importExample`) |
+| `get_component_props` | Full metadata for one component: props (types, required, descriptions), SSR classification (`ssr.safe` / `ssr.rendering` / `ssr.note`) + required LESS imports (`styles.base` / `styles.entries` / `styles.dependencies` / `styles.importExample`) |
 | `search_customization` | Global theming options and per-component customization approaches |
 | `get_customization` | What and how to customize a component or a global topic |
 
@@ -45,6 +45,18 @@ Communicates over **stdio** only (no HTTP port); startup log goes to stderr.
 
 Component ids follow the metadata path, e.g. `dataDisplay/chat/chat`.
 
+## SSR
+
+Every component carries an `ssr` field (also surfaced in `search_components` results):
+
+- `safe` — always `true`: nothing in `@smwb/ui-solid` touches a browser global at module load or
+  during render, so `renderToString` never throws.
+- `rendering` — `"universal"` (emits meaningful static HTML on the server and hydrates) or
+  `"client"` (a pure overlay such as `Modal`/`Sheet` that renders nothing on the server and mounts
+  through a portal after hydration).
+- `note` — optional hint, e.g. that a picker's input renders on the server while its popup is
+  client-only.
+
 ## How the catalog is built
 
 Component metadata is generated from the `@smwb/ui-solid` TypeScript prop interfaces

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

@@ -1,6 +1,10 @@
 {
   "name": "AnimateHeight",
   "description": "Animated height transition wrapper for expandable content.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLDivElement>"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "Icon",
   "description": "Material Symbols icon wrapper with size, weight, fill, and semantic color tokens.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLSpanElement>"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "Ripple",
   "description": "Material-style ripple touch feedback container.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLSpanElement>"
   ],

package/component-meta/clickAwayListener/clickAwayListener.json

@@ -1,6 +1,10 @@
 {
   "name": "ClickAwayListener",
   "description": "Detects pointer events outside its child and invokes a callback.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "Accordion",
   "description": "Expandable panel with a clickable header and collapsible body.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "AvatarGroup",
   "description": "Cluster of overlapping avatars with optional surplus counter.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLDivElement>"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "Avatar",
   "description": "User avatar displaying an image or initials fallback.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLDivElement>"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "Badge",
   "description": "Small status or count indicator overlay.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLSpanElement>"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "Card",
   "description": "Surface container with optional header, footer, and click handling.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLDivElement>"
   ],

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

@@ -1,6 +1,11 @@
 {
   "name": "Carousel",
   "description": "Scrollable media carousel with navigation and autoplay.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal",
+    "note": "Renders inline on the server; the fullscreen lightbox is portaled on the client."
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "Chat",
   "description": "Chat dialog with layout modes, infinite scroll, attachments, and delivery statuses.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "ParentProps",
     "Omit<ChatMessageRenderContext, \"showAvatars\" | \"showAttachments\">"

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

@@ -1,6 +1,11 @@
 {
   "name": "ChatAttachmentImage",
   "description": "Clickable chat image attachment with fullscreen preview.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal",
+    "note": "Renders the thumbnail on the server; the fullscreen preview is portaled on the client."
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatAttachments",
   "description": "List of file or image attachments inside a message bubble.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatComposer",
   "description": "Chat Composer component from the dataDisplay module.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatHeader",
   "description": "Chat title area with layout mode controls and close action.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatIconButton",
   "description": "Chat Icon Button component from the dataDisplay module.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.ButtonHTMLAttributes<HTMLButtonElement>"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatLayoutChat",
   "description": "Chat Layout Chat component from the dataDisplay module.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "Omit<\n  ChatProps,\n  | \"class\"\n  | \"embedded\"\n  | \"floatingTrigger\"\n  | \"anchor\"\n  | \"allowedLayouts\"\n  | \"layout\"\n  | \"defaultLayout\"\n  | \"open\"\n  | \"defaultOpen\"\n  | \"onOpenChange\"\n  | \"onLayoutChange\"\n>"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatLayout",
   "description": "Page layout with a full-height docked chat panel and collapse-to-floating behavior.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "ParentProps",
     "JSX.HTMLAttributes<HTMLDivElement>"

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatMessageAvatar",
   "description": "Optional author avatar shown beside a chat message.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatMessageBubble",
   "description": "Shared bubble layout for incoming and outgoing messages.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatMessageIncoming",
   "description": "Incoming chat message bubble aligned to the start.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "ChatMessageRenderContext"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatMessageItem",
   "description": "Router that renders a chat message by variant or custom renderer.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "ChatMessageRenderContext"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatMessageOutgoing",
   "description": "Outgoing chat message bubble aligned to the end.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "ChatMessageRenderContext"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatMessageSkeleton",
   "description": "Loading placeholder shaped like a chat message.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatMessageStatus",
   "description": "Delivery status icon or custom status renderer for outgoing messages.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatMessageSystem",
   "description": "Centered system notice message.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatMessages",
   "description": "Scrollable message list with infinite scroll and loading skeletons.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "ChatMessageRenderContext"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatOverlayLayoutChat",
   "description": "Chat Overlay Layout Chat component from the dataDisplay module.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "Omit<\n  ChatProps,\n  | \"class\"\n  | \"overlayContext\"\n  | \"embedded\"\n  | \"floatingTrigger\"\n  | \"anchor\"\n  | \"allowedLayouts\"\n  | \"layout\"\n  | \"defaultLayout\"\n  | \"onLayoutChange\"\n  | \"open\"\n  | \"defaultOpen\"\n  | \"onOpenChange\"\n>"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "ChatOverlayLayout",
   "description": "Chat Overlay Layout component from the dataDisplay module.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "ParentProps",
     "JSX.HTMLAttributes<HTMLDivElement>"

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

@@ -1,6 +1,11 @@
 {
   "name": "ChatShell",
   "description": "Positioned chat container shell with header, body, and footer slots.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal",
+    "note": "Renders inline on the server; the fullscreen layout is portaled on the client."
+  },
   "extends": [
     "ParentProps"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "Chip",
   "description": "Compact label or filter tag, optionally dismissible or clickable.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLSpanElement | HTMLAnchorElement>"
   ],

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

@@ -1,6 +1,11 @@
 {
   "name": "ExpansionPanel",
   "description": "Panel with customizable controls and responsive fullscreen mode.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal",
+    "note": "Renders inline on the server; fullscreen mode is portaled on the client."
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "ImagesList",
   "description": "Responsive masonry-style image grid.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

package/component-meta/dataDisplay/imagesList/imagesListItem/imagesListItem.json

@@ -1,6 +1,11 @@
 {
   "name": "ImagesListItem",
   "description": "Single tile inside an ImagesList grid.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal",
+    "note": "Renders the tile on the server; the fullscreen modal is portaled on the client."
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

package/component-meta/dataDisplay/imagesList/imagesListItem/imagesListItemModal.json

@@ -1,6 +1,11 @@
 {
   "name": "ImagesListItemModal",
   "description": "Fullscreen modal viewer for an ImagesList item.",
+  "ssr": {
+    "safe": true,
+    "rendering": "client",
+    "note": "Fullscreen viewer portaled on the client; nothing is emitted during SSR."
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "List",
   "description": "Vertical list container with optional subheader.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLUListElement>"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "ListItem",
   "description": "Single row inside a List.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

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

@@ -1,6 +1,10 @@
 {
   "name": "Table",
   "description": "Table wrapper with optional pagination settings.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLDivElement>"
   ],

package/component-meta/dataDisplay/table/tableBody.json

@@ -1,6 +1,10 @@
 {
   "name": "TableBody",
   "description": "Table body section wrapper.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLTableSectionElement>"
   ],

package/component-meta/dataDisplay/table/tableCell.json

@@ -1,6 +1,10 @@
 {
   "name": "TableCell",
   "description": "Standard table data cell.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.TdHTMLAttributes<HTMLTableCellElement>"
   ],

package/component-meta/dataDisplay/table/tableHead.json

@@ -1,6 +1,10 @@
 {
   "name": "TableHead",
   "description": "Table head section wrapper.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLTableSectionElement>"
   ],

package/component-meta/dataDisplay/table/tableHeadCell.json

@@ -1,6 +1,10 @@
 {
   "name": "TableHeadCell",
   "description": "Table header cell with optional sorting affordance.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.ThHTMLAttributes<HTMLTableCellElement>"
   ],

package/component-meta/dataDisplay/table/tablePagination/tablePagination.baseTablePagination.json

@@ -1,6 +1,10 @@
 {
   "name": "BaseTablePagination",
   "description": "Base Table Pagination component from the dataDisplay module.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

package/component-meta/dataDisplay/table/tablePagination/tablePagination.json

@@ -1,6 +1,10 @@
 {
   "name": "TablePagination",
   "description": "Pagination controls for tabular data.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "WithTotalCount | WithHasNextPage"
   ],

package/component-meta/dataDisplay/table/tableRow.json

@@ -1,6 +1,10 @@
 {
   "name": "TableRow",
   "description": "Table row wrapper.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLTableRowElement>"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "TreeView",
   "description": "Hierarchical tree with expand, collapse, and selection.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "Omit<JSX.HTMLAttributes<HTMLDivElement>, \"onSelect\">"
   ],

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

@@ -1,6 +1,10 @@
 {
   "name": "Typography",
   "description": "Text renderer mapped to semantic HTML tags and design tokens.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLElement>"
   ],

package/component-meta/feedBack/message/message.json

@@ -1,6 +1,10 @@
 {
   "name": "Message",
   "description": "Inline feedback message with severity styling and optional dismiss action.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "extends": [
     "JSX.HTMLAttributes<HTMLDivElement>"
   ],

package/component-meta/feedBack/modal/modal.json

@@ -1,6 +1,11 @@
 {
   "name": "Modal",
   "description": "Dialog overlay with focus trap and composable header, content, and footer.",
+  "ssr": {
+    "safe": true,
+    "rendering": "client",
+    "note": "Renders nothing on the server; the dialog is portaled into <body> on the client after hydration."
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

package/component-meta/feedBack/modal/modal.modalSlot.json

@@ -1,6 +1,10 @@
 {
   "name": "ModalSlot",
   "description": "Modal Slot component from the feedBack module.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",

package/component-meta/feedBack/progressIndicator/progressIndicator.circularProgress.json

@@ -1,6 +1,10 @@
 {
   "name": "CircularProgress",
   "description": "Circular indeterminate or determinate progress indicator.",
+  "ssr": {
+    "safe": true,
+    "rendering": "universal"
+  },
   "styles": {
     "base": [
       "@smwb/ui-styles/less/foundation.less",