@skdx/web-components-blocks 0.36.0 → 0.37.0

package/custom-elements.json

@@ -71,14 +71,6 @@
             "module": "./sign-in-page"
           }
         },
-        {
-          "kind": "js",
-          "name": "SkdxConfirmDialog",
-          "declaration": {
-            "name": "SkdxConfirmDialog",
-            "module": "./confirm-dialog"
-          }
-        },
         {
           "kind": "js",
           "name": "SkdxEmptyState",
@@ -371,390 +363,227 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/comment/Comment.ts",
+      "path": "src/chat-composer/ChatComposer.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "One collaboration comment: author, avatar, timestamp, edited indicator,\narbitrary content, attachments and actions such as reply, edit and react.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-comment` on the host, then `__avatar`, `__main`, `__header`,\n`__author`, `__metadata`, `__time`, `__edited`, `__content`, `__attachments`\nand `__actions`.",
-          "name": "SkdxComment",
+          "description": "Message composer block: an auto-growing Textarea and a send Button inside a\nfield, with consumer-supplied attachment, leading, trailing and footer\nregions and configurable Enter-to-send behaviour.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-chat-composer` on the host, then `__attachments`, `__field`,\n`__leading`, `__textarea`, `__trailing`, `__send` and `__footer`.\n`data-state` on the host reads `pending` while a send is in flight.",
+          "name": "SkdxChatComposer",
           "slots": [
             {
-              "description": "The comment content, the consumer-supplied body text or markup.",
-              "name": ""
+              "description": "Controls rendered inside the field before the textarea, such as an attach button.",
+              "name": "leading"
             },
             {
-              "description": "Decorative avatar rendered beside the author, always `aria-hidden`.",
-              "name": "avatar"
+              "description": "Controls rendered inside the field after the textarea, such as a model picker.",
+              "name": "trailing"
             },
             {
-              "description": "Badges or supplementary text rendered beside the author.",
-              "name": "metadata"
+              "description": "Attached files or chips rendered in a row above the field.",
+              "name": "attachments"
             },
             {
-              "description": "Files or links attached to the comment, below the content.",
-              "name": "attachments"
+              "description": "Usage counters or hints rendered in a row below the field.",
+              "name": "footer"
             },
             {
-              "description": "Controls such as reply, edit and react, below the attachments.",
-              "name": "actions"
+              "description": "Glyph rendered inside the send button in place of its text, making it icon-only.",
+              "name": "send-icon"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "author",
+              "name": "value",
+              "type": {
+                "text": "string | undefined | undefined"
+              },
+              "description": "Current message text, for controlled usage paired with `value-change`.",
+              "default": "undefined",
+              "attribute": "value"
+            },
+            {
+              "kind": "field",
+              "name": "defaultValue",
               "type": {
                 "text": "string"
               },
-              "description": "Name of the person or system that wrote the comment, rendered as visible text.",
-              "attribute": "author",
-              "required": true
+              "default": "''",
+              "description": "Initial message text for uncontrolled usage, read only on mount.",
+              "attribute": "default-value"
             },
             {
               "kind": "field",
-              "name": "timestamp",
+              "name": "placeholder",
               "type": {
-                "text": "Date | string | undefined | undefined"
+                "text": "string | undefined | undefined"
               },
-              "description": "Instant the comment was posted, rendered through a composed Time.",
+              "description": "Hint text shown in the empty textarea, rendered as the native placeholder.",
               "default": "undefined",
-              "attribute": "timestamp"
+              "attribute": "placeholder"
             },
             {
               "kind": "field",
-              "name": "now",
+              "name": "label",
               "type": {
-                "text": "Date | number | undefined | undefined"
+                "text": "string"
               },
-              "description": "Reference instant `timestamp` renders relative to, forwarded to Time.",
-              "default": "undefined"
+              "default": "'Message'",
+              "description": "Accessible name of the message textarea, read by assistive technology.",
+              "attribute": "label"
             },
             {
               "kind": "field",
-              "name": "edited",
+              "name": "sendLabel",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false",
-              "description": "Marks the comment as edited since it was first posted.",
-              "attribute": "edited"
+              "default": "'Send'",
+              "description": "Text of the send button, and its accessible name when the `send-icon` slot is filled.",
+              "attribute": "send-label"
             },
             {
               "kind": "field",
-              "name": "editedLabel",
+              "name": "submitKey",
               "type": {
-                "text": "string"
+                "text": "SkdxChatComposerSubmitKey"
               },
-              "default": "'Edited'",
-              "description": "Text of the edited indicator, shown only when `edited` is set.",
-              "attribute": "edited-label"
-            }
-          ],
-          "attributes": [
+              "default": "'enter'",
+              "description": "Which key sends from the textarea; the other Enter presses insert a newline.",
+              "attribute": "submit-key"
+            },
             {
-              "name": "author",
+              "kind": "field",
+              "name": "maxRows",
               "type": {
-                "text": "string"
+                "text": "number"
               },
-              "description": "Name of the person or system that wrote the comment, rendered as visible text.",
-              "fieldName": "author",
-              "required": true
+              "default": "8",
+              "description": "Caps how far the auto-growing textarea grows, in rows, before it scrolls.",
+              "attribute": "max-rows"
             },
             {
-              "name": "timestamp",
+              "kind": "field",
+              "name": "maxLength",
               "type": {
-                "text": "Date | string | undefined | undefined"
+                "text": "number | undefined | undefined"
               },
-              "description": "Instant the comment was posted, rendered through a composed Time.",
+              "description": "Native `maxlength` of the textarea — the longest message it accepts.",
               "default": "undefined",
-              "fieldName": "timestamp"
+              "attribute": "max-length"
             },
             {
-              "name": "edited",
+              "kind": "field",
+              "name": "disabled",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Marks the comment as edited since it was first posted.",
-              "fieldName": "edited"
+              "description": "Disables the textarea and the send button, blocking every send path.",
+              "attribute": "disabled"
             },
             {
-              "name": "edited-label",
+              "kind": "field",
+              "name": "pending",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "'Edited'",
-              "description": "Text of the edited indicator, shown only when `edited` is set.",
-              "fieldName": "editedLabel"
+              "default": "false",
+              "description": "Marks a send in flight: the button is busy and inert, the textarea stays editable.",
+              "attribute": "pending"
             }
           ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "skdx-comment",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkdxComment",
-          "declaration": {
-            "name": "SkdxComment",
-            "module": "src/comment/Comment.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "skdx-comment",
-          "declaration": {
-            "name": "SkdxComment",
-            "module": "src/comment/Comment.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/comment/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkdxComment",
-          "declaration": {
-            "name": "SkdxComment",
-            "module": "./Comment"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/confirm-dialog/ConfirmDialog.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "Confirmation dialog block for a destructive, irreversible or sensitive\naction, composing the core dialog primitives as an alert dialog with an\nexternally controlled pending state that disables both buttons and blocks\ndismissal while the confirmed request is in flight.\n\nA synchronous confirmation with no pending state is served by the core\n`<skdx-dialog role=\"alertdialog\">` recipe alone.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-confirm-dialog` on the host, then `__title`,\n`__description`, `__body`, `__footer`, `__cancel` and `__confirm`.",
-          "name": "SkdxConfirmDialog",
-          "slots": [
+          "events": [
             {
-              "description": "Extra content rendered between the description and the footer buttons.",
-              "name": ""
+              "description": "Fires with the new text on every edit, including the clear that follows an uncontrolled send.",
+              "name": "value-change"
             },
             {
-              "description": "Content of the button that opens the dialog; no trigger renders without it.",
-              "name": "trigger"
+              "description": "Fires with the message text when the send button is activated or the configured submit key is pressed.",
+              "name": "send"
             }
           ],
-          "members": [
+          "attributes": [
             {
-              "kind": "field",
-              "name": "open",
+              "name": "value",
               "type": {
-                "text": "boolean | undefined | undefined"
+                "text": "string | undefined | undefined"
               },
-              "description": "Whether the dialog is open, for controlled usage; pair it with `open-change`.",
+              "description": "Current message text, for controlled usage paired with `value-change`.",
               "default": "undefined",
-              "attribute": "open"
-            },
-            {
-              "kind": "field",
-              "name": "defaultOpen",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Whether the dialog starts open, for uncontrolled usage.",
-              "attribute": "default-open"
+              "fieldName": "value"
             },
             {
-              "kind": "field",
-              "name": "title",
+              "name": "default-value",
               "type": {
                 "text": "string"
               },
-              "description": "Heading text rendered into the panel's title, naming and labelling the dialog.",
-              "attribute": "title",
-              "required": true
+              "default": "''",
+              "description": "Initial message text for uncontrolled usage, read only on mount.",
+              "fieldName": "defaultValue"
             },
             {
-              "kind": "field",
-              "name": "description",
+              "name": "placeholder",
               "type": {
                 "text": "string | undefined | undefined"
               },
-              "description": "Supporting sentence rendered into the panel's description, read alongside the title.",
+              "description": "Hint text shown in the empty textarea, rendered as the native placeholder.",
               "default": "undefined",
-              "attribute": "description"
+              "fieldName": "placeholder"
             },
             {
-              "kind": "field",
-              "name": "confirmLabel",
+              "name": "label",
               "type": {
                 "text": "string"
               },
-              "default": "'Confirm'",
-              "description": "Text of the button that carries out the confirmed action.",
-              "attribute": "confirm-label"
+              "default": "'Message'",
+              "description": "Accessible name of the message textarea, read by assistive technology.",
+              "fieldName": "label"
             },
             {
-              "kind": "field",
-              "name": "cancelLabel",
+              "name": "send-label",
               "type": {
                 "text": "string"
               },
-              "default": "'Cancel'",
-              "description": "Text of the button that abandons the action.",
-              "attribute": "cancel-label"
+              "default": "'Send'",
+              "description": "Text of the send button, and its accessible name when the `send-icon` slot is filled.",
+              "fieldName": "sendLabel"
+            },
+            {
+              "name": "submit-key",
+              "type": {
+                "text": "SkdxChatComposerSubmitKey"
+              },
+              "default": "'enter'",
+              "description": "Which key sends from the textarea; the other Enter presses insert a newline.",
+              "fieldName": "submitKey"
             },
             {
-              "kind": "field",
-              "name": "destructive",
+              "name": "max-rows",
               "type": {
-                "text": "boolean"
+                "text": "number"
               },
-              "default": "false",
-              "description": "Colours the confirm button and the panel danger, for an irreversible or destructive action.",
-              "attribute": "destructive"
+              "default": "8",
+              "description": "Caps how far the auto-growing textarea grows, in rows, before it scrolls.",
+              "fieldName": "maxRows"
             },
             {
-              "kind": "field",
-              "name": "pending",
+              "name": "max-length",
               "type": {
-                "text": "boolean"
+                "text": "number | undefined | undefined"
               },
-              "default": "false",
-              "description": "Marks the confirmed request as in flight: disables both buttons, marks the confirm button loading, and blocks Escape dismissal until it clears.",
-              "attribute": "pending"
+              "description": "Native `maxlength` of the textarea — the longest message it accepts.",
+              "default": "undefined",
+              "fieldName": "maxLength"
             },
             {
-              "kind": "field",
               "name": "disabled",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Disables the confirm button on its own, independent of `pending` — for example until a typed confirmation matches.",
-              "attribute": "disabled"
-            },
-            {
-              "kind": "field",
-              "name": "size",
-              "type": {
-                "text": "'sm' | 'md' | 'lg' | (string & {}) | undefined | undefined"
-              },
-              "description": "Panel width rung the skin reads, fed to the underlying dialog panel.",
-              "default": "undefined",
-              "attribute": "size"
-            }
-          ],
-          "events": [
-            {
-              "description": "Fires with the new open state whenever the dialog opens or closes, controlled or not.",
-              "name": "open-change"
-            },
-            {
-              "description": "Fires with the new open state once the panel's enter or exit animation has settled.",
-              "name": "open-change-complete"
-            },
-            {
-              "description": "Fires with the click when the confirm button is activated, before the dialog closes; `preventDefault()` holds the panel open.",
-              "name": "confirm"
-            },
-            {
-              "description": "Fires with the click when the cancel button is activated, before the dialog closes; `preventDefault()` keeps the panel open.",
-              "name": "cancel"
-            },
-            {
-              "description": "Fires when Escape is pressed while the panel is open; `preventDefault()` keeps it open.",
-              "name": "escape-key-down"
-            },
-            {
-              "description": "Fires on a pointer-down outside the panel while open; an alert dialog never closes on one.",
-              "name": "pointer-down-outside"
-            },
-            {
-              "description": "Fires when focus moves outside the panel while open; an alert dialog never closes on one.",
-              "name": "focus-outside"
-            },
-            {
-              "description": "Fires for either kind of outside interaction, just before the specific event.",
-              "name": "interact-outside"
-            },
-            {
-              "description": "Fires before focus moves into the panel on open; `preventDefault()` leaves focus where it is.",
-              "name": "open-auto-focus"
-            },
-            {
-              "description": "Fires before focus returns to the trigger on close; `preventDefault()` suppresses that return.",
-              "name": "close-auto-focus"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "open",
-              "type": {
-                "text": "boolean | undefined | undefined"
-              },
-              "description": "Whether the dialog is open, for controlled usage; pair it with `open-change`.",
-              "default": "undefined",
-              "fieldName": "open"
-            },
-            {
-              "name": "default-open",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Whether the dialog starts open, for uncontrolled usage.",
-              "fieldName": "defaultOpen"
-            },
-            {
-              "name": "title",
-              "type": {
-                "text": "string"
-              },
-              "description": "Heading text rendered into the panel's title, naming and labelling the dialog.",
-              "fieldName": "title",
-              "required": true
-            },
-            {
-              "name": "description",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Supporting sentence rendered into the panel's description, read alongside the title.",
-              "default": "undefined",
-              "fieldName": "description"
-            },
-            {
-              "name": "confirm-label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Confirm'",
-              "description": "Text of the button that carries out the confirmed action.",
-              "fieldName": "confirmLabel"
-            },
-            {
-              "name": "cancel-label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Cancel'",
-              "description": "Text of the button that abandons the action.",
-              "fieldName": "cancelLabel"
-            },
-            {
-              "name": "destructive",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Colours the confirm button and the panel danger, for an irreversible or destructive action.",
-              "fieldName": "destructive"
+              "description": "Disables the textarea and the send button, blocking every send path.",
+              "fieldName": "disabled"
             },
             {
               "name": "pending",
@@ -762,66 +591,72 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Marks the confirmed request as in flight: disables both buttons, marks the confirm button loading, and blocks Escape dismissal until it clears.",
+              "description": "Marks a send in flight: the button is busy and inert, the textarea stays editable.",
               "fieldName": "pending"
-            },
-            {
-              "name": "disabled",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Disables the confirm button on its own, independent of `pending` — for example until a typed confirmation matches.",
-              "fieldName": "disabled"
-            },
-            {
-              "name": "size",
-              "type": {
-                "text": "'sm' | 'md' | 'lg' | (string & {}) | undefined | undefined"
-              },
-              "description": "Panel width rung the skin reads, fed to the underlying dialog panel.",
-              "default": "undefined",
-              "fieldName": "size"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "skdx-confirm-dialog",
+          "tagName": "skdx-chat-composer",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxConfirmDialog",
+          "name": "SkdxChatComposer",
           "declaration": {
-            "name": "SkdxConfirmDialog",
-            "module": "src/confirm-dialog/ConfirmDialog.ts"
+            "name": "SkdxChatComposer",
+            "module": "src/chat-composer/ChatComposer.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "skdx-confirm-dialog",
+          "name": "skdx-chat-composer",
           "declaration": {
-            "name": "SkdxConfirmDialog",
-            "module": "src/confirm-dialog/ConfirmDialog.ts"
+            "name": "SkdxChatComposer",
+            "module": "src/chat-composer/ChatComposer.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/confirm-dialog/index.ts",
+      "path": "src/chat-composer/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxConfirmDialog",
+          "name": "SkdxChatComposer",
+          "declaration": {
+            "name": "SkdxChatComposer",
+            "module": "./ChatComposer"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "SkdxChatComposerSendDetail",
+          "declaration": {
+            "name": "SkdxChatComposerSendDetail",
+            "module": "./ChatComposer"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "SkdxChatComposerSubmitKey",
+          "declaration": {
+            "name": "SkdxChatComposerSubmitKey",
+            "module": "./ChatComposer"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "SkdxChatComposerValueChangeDetail",
           "declaration": {
-            "name": "SkdxConfirmDialog",
-            "module": "./ConfirmDialog"
+            "name": "SkdxChatComposerValueChangeDetail",
+            "module": "./ChatComposer"
           }
         }
       ]
@@ -1008,894 +843,430 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/comment-thread/CommentThread.ts",
+      "path": "src/comment/Comment.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "A root comment with its replies, indented one level, collapsible with the\nconsumer's own labels, plus regions for a load-more control and a composer.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-comment-thread` on the host, then `__comment`, `__toggle`,\n`__replies`, `__load-more` and `__composer`. `data-state` on the host reads\n`expanded` or `collapsed`.",
-          "name": "SkdxCommentThread",
+          "description": "One collaboration comment: author, avatar, timestamp, edited indicator,\narbitrary content, attachments and actions such as reply, edit and react.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-comment` on the host, then `__avatar`, `__main`, `__header`,\n`__author`, `__metadata`, `__time`, `__edited`, `__content`, `__attachments`\nand `__actions`.",
+          "name": "SkdxComment",
           "slots": [
             {
-              "description": "The root comment this thread replies to.",
+              "description": "The comment content, the consumer-supplied body text or markup.",
               "name": ""
             },
             {
-              "description": "The reply comments, indented one level below the root comment.",
-              "name": "replies"
+              "description": "Decorative avatar rendered beside the author, always `aria-hidden`.",
+              "name": "avatar"
             },
             {
-              "description": "Control that requests more replies, below the replies region.",
-              "name": "load-more"
+              "description": "Badges or supplementary text rendered beside the author.",
+              "name": "metadata"
             },
             {
-              "description": "Reply composer rendered at the end of the thread.",
-              "name": "composer"
+              "description": "Files or links attached to the comment, below the content.",
+              "name": "attachments"
+            },
+            {
+              "description": "Controls such as reply, edit and react, below the attachments.",
+              "name": "actions"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "expanded",
+              "name": "author",
               "type": {
-                "text": "boolean | undefined | undefined"
+                "text": "string"
               },
-              "description": "Whether the replies are shown, for controlled usage paired with `expanded-change`.",
-              "default": "undefined",
-              "attribute": "expanded"
+              "description": "Name of the person or system that wrote the comment, rendered as visible text.",
+              "attribute": "author",
+              "required": true
             },
             {
               "kind": "field",
-              "name": "defaultExpanded",
+              "name": "timestamp",
               "type": {
-                "text": "boolean"
+                "text": "Date | string | undefined | undefined"
               },
-              "default": "true",
-              "description": "Whether the replies start shown, used only while uncontrolled.",
-              "attribute": "default-expanded"
+              "description": "Instant the comment was posted, rendered through a composed Time.",
+              "default": "undefined",
+              "attribute": "timestamp"
             },
             {
               "kind": "field",
-              "name": "showRepliesLabel",
+              "name": "now",
               "type": {
-                "text": "string | undefined | undefined"
+                "text": "Date | number | undefined | undefined"
               },
-              "description": "Text of the toggle button while the replies are hidden; a toggle only renders when this is given.",
-              "default": "undefined",
-              "attribute": "show-replies-label"
+              "description": "Reference instant `timestamp` renders relative to, forwarded to Time.",
+              "default": "undefined"
             },
             {
               "kind": "field",
-              "name": "hideRepliesLabel",
+              "name": "edited",
               "type": {
-                "text": "string | undefined | undefined"
+                "text": "boolean"
               },
-              "description": "Text of the toggle button while the replies are shown.",
-              "default": "undefined",
-              "attribute": "hide-replies-label"
-            }
-          ],
-          "events": [
+              "default": "false",
+              "description": "Marks the comment as edited since it was first posted.",
+              "attribute": "edited"
+            },
             {
-              "description": "Fires with the new expanded state whenever the replies toggle is activated.",
-              "name": "expanded-change"
+              "kind": "field",
+              "name": "editedLabel",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Edited'",
+              "description": "Text of the edited indicator, shown only when `edited` is set.",
+              "attribute": "edited-label"
             }
           ],
           "attributes": [
             {
-              "name": "expanded",
+              "name": "author",
               "type": {
-                "text": "boolean | undefined | undefined"
+                "text": "string"
               },
-              "description": "Whether the replies are shown, for controlled usage paired with `expanded-change`.",
-              "default": "undefined",
-              "fieldName": "expanded"
+              "description": "Name of the person or system that wrote the comment, rendered as visible text.",
+              "fieldName": "author",
+              "required": true
             },
             {
-              "name": "default-expanded",
+              "name": "timestamp",
               "type": {
-                "text": "boolean"
+                "text": "Date | string | undefined | undefined"
               },
-              "default": "true",
-              "description": "Whether the replies start shown, used only while uncontrolled.",
-              "fieldName": "defaultExpanded"
+              "description": "Instant the comment was posted, rendered through a composed Time.",
+              "default": "undefined",
+              "fieldName": "timestamp"
             },
             {
-              "name": "show-replies-label",
+              "name": "edited",
               "type": {
-                "text": "string | undefined | undefined"
+                "text": "boolean"
               },
-              "description": "Text of the toggle button while the replies are hidden; a toggle only renders when this is given.",
-              "default": "undefined",
-              "fieldName": "showRepliesLabel"
+              "default": "false",
+              "description": "Marks the comment as edited since it was first posted.",
+              "fieldName": "edited"
             },
             {
-              "name": "hide-replies-label",
+              "name": "edited-label",
               "type": {
-                "text": "string | undefined | undefined"
+                "text": "string"
               },
-              "description": "Text of the toggle button while the replies are shown.",
-              "default": "undefined",
-              "fieldName": "hideRepliesLabel"
+              "default": "'Edited'",
+              "description": "Text of the edited indicator, shown only when `edited` is set.",
+              "fieldName": "editedLabel"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "skdx-comment-thread",
+          "tagName": "skdx-comment",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxCommentThread",
+          "name": "SkdxComment",
           "declaration": {
-            "name": "SkdxCommentThread",
-            "module": "src/comment-thread/CommentThread.ts"
+            "name": "SkdxComment",
+            "module": "src/comment/Comment.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "skdx-comment-thread",
+          "name": "skdx-comment",
           "declaration": {
-            "name": "SkdxCommentThread",
-            "module": "src/comment-thread/CommentThread.ts"
+            "name": "SkdxComment",
+            "module": "src/comment/Comment.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/comment-thread/index.ts",
+      "path": "src/comment/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxCommentThread",
+          "name": "SkdxComment",
           "declaration": {
-            "name": "SkdxCommentThread",
-            "module": "./CommentThread"
+            "name": "SkdxComment",
+            "module": "./Comment"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/dashboard-layout/DashboardLayout.ts",
+      "path": "src/comment-thread/CommentThread.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "Application shell block: an app bar, a collapsible side navigation and the content region.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-dashboard-layout` on the host, then `__app-bar`,\n`__nav-toggle`, `__branding`, `__title`, `__actions`, `__body`, `__nav`,\n`__nav-list`, `__nav-item`, `__nav-header`, `__nav-divider` and `__content`.\n`data-nav-open` sits on the host while the navigation is shown.",
-          "name": "SkdxDashboardLayout",
+          "description": "A root comment with its replies, indented one level, collapsible with the\nconsumer's own labels, plus regions for a load-more control and a composer.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-comment-thread` on the host, then `__comment`, `__toggle`,\n`__replies`, `__load-more` and `__composer`. `data-state` on the host reads\n`expanded` or `collapsed`.",
+          "name": "SkdxCommentThread",
           "slots": [
             {
-              "description": "The page content rendered inside the `<main>` region.",
+              "description": "The root comment this thread replies to.",
               "name": ""
             },
             {
-              "description": "Logo or product mark at the start of the app bar.",
-              "name": "branding"
+              "description": "The reply comments, indented one level below the root comment.",
+              "name": "replies"
             },
             {
-              "description": "Controls at the end of the app bar.",
-              "name": "actions"
+              "description": "Control that requests more replies, below the replies region.",
+              "name": "load-more"
+            },
+            {
+              "description": "Reply composer rendered at the end of the thread.",
+              "name": "composer"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "title",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "Application title shown in the app bar after the branding, shadowing the native tooltip attribute.",
-              "attribute": "title"
-            },
-            {
-              "kind": "field",
-              "name": "navigation",
-              "type": {
-                "text": "readonly SkdxDashboardNavigationItem[]"
-              },
-              "description": "The side navigation, one entry per row, nested through each entry's `children`.",
-              "required": true
-            },
-            {
-              "kind": "field",
-              "name": "navOpen",
+              "name": "expanded",
               "type": {
-                "text": "boolean | undefined"
+                "text": "boolean | undefined | undefined"
               },
-              "description": "Whether the side navigation is shown, for controlled usage.",
+              "description": "Whether the replies are shown, for controlled usage paired with `expanded-change`.",
               "default": "undefined",
-              "attribute": "nav-open"
+              "attribute": "expanded"
             },
             {
               "kind": "field",
-              "name": "defaultNavOpen",
+              "name": "defaultExpanded",
               "type": {
                 "text": "boolean"
               },
               "default": "true",
-              "description": "Whether the side navigation starts shown, for uncontrolled usage.",
-              "attribute": "default-nav-open"
+              "description": "Whether the replies start shown, used only while uncontrolled.",
+              "attribute": "default-expanded"
             },
             {
               "kind": "field",
-              "name": "navLabel",
+              "name": "showRepliesLabel",
               "type": {
-                "text": "string"
+                "text": "string | undefined | undefined"
               },
-              "default": "'Main navigation'",
-              "description": "Accessible name of the side navigation landmark.",
-              "attribute": "nav-label"
+              "description": "Text of the toggle button while the replies are hidden; a toggle only renders when this is given.",
+              "default": "undefined",
+              "attribute": "show-replies-label"
             },
             {
               "kind": "field",
-              "name": "navToggleLabel",
+              "name": "hideRepliesLabel",
               "type": {
-                "text": "string"
+                "text": "string | undefined | undefined"
               },
-              "default": "'Toggle navigation'",
-              "description": "Accessible name of the icon-only button that shows and hides the navigation.",
-              "attribute": "nav-toggle-label"
+              "description": "Text of the toggle button while the replies are shown.",
+              "default": "undefined",
+              "attribute": "hide-replies-label"
             }
           ],
           "events": [
             {
-              "description": "Fires with the new open state whenever the navigation toggle is activated.",
-              "name": "nav-open-change"
+              "description": "Fires with the new expanded state whenever the replies toggle is activated.",
+              "name": "expanded-change"
             }
           ],
           "attributes": [
             {
-              "name": "title",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "Application title shown in the app bar after the branding, shadowing the native tooltip attribute.",
-              "fieldName": "title"
-            },
-            {
-              "name": "nav-open",
+              "name": "expanded",
               "type": {
-                "text": "boolean | undefined"
+                "text": "boolean | undefined | undefined"
               },
-              "description": "Whether the side navigation is shown, for controlled usage.",
+              "description": "Whether the replies are shown, for controlled usage paired with `expanded-change`.",
               "default": "undefined",
-              "fieldName": "navOpen"
+              "fieldName": "expanded"
             },
             {
-              "name": "default-nav-open",
+              "name": "default-expanded",
               "type": {
                 "text": "boolean"
               },
               "default": "true",
-              "description": "Whether the side navigation starts shown, for uncontrolled usage.",
-              "fieldName": "defaultNavOpen"
+              "description": "Whether the replies start shown, used only while uncontrolled.",
+              "fieldName": "defaultExpanded"
             },
             {
-              "name": "nav-label",
+              "name": "show-replies-label",
               "type": {
-                "text": "string"
+                "text": "string | undefined | undefined"
               },
-              "default": "'Main navigation'",
-              "description": "Accessible name of the side navigation landmark.",
-              "fieldName": "navLabel"
+              "description": "Text of the toggle button while the replies are hidden; a toggle only renders when this is given.",
+              "default": "undefined",
+              "fieldName": "showRepliesLabel"
             },
             {
-              "name": "nav-toggle-label",
+              "name": "hide-replies-label",
               "type": {
-                "text": "string"
+                "text": "string | undefined | undefined"
               },
-              "default": "'Toggle navigation'",
-              "description": "Accessible name of the icon-only button that shows and hides the navigation.",
-              "fieldName": "navToggleLabel"
+              "description": "Text of the toggle button while the replies are shown.",
+              "default": "undefined",
+              "fieldName": "hideRepliesLabel"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "skdx-dashboard-layout",
+          "tagName": "skdx-comment-thread",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxDashboardLayout",
+          "name": "SkdxCommentThread",
           "declaration": {
-            "name": "SkdxDashboardLayout",
-            "module": "src/dashboard-layout/DashboardLayout.ts"
+            "name": "SkdxCommentThread",
+            "module": "src/comment-thread/CommentThread.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "skdx-dashboard-layout",
+          "name": "skdx-comment-thread",
           "declaration": {
-            "name": "SkdxDashboardLayout",
-            "module": "src/dashboard-layout/DashboardLayout.ts"
+            "name": "SkdxCommentThread",
+            "module": "src/comment-thread/CommentThread.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/dashboard-layout/index.ts",
+      "path": "src/comment-thread/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxDashboardLayout",
-          "declaration": {
-            "name": "SkdxDashboardLayout",
-            "module": "./DashboardLayout"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "SkdxDashboardNavigationItem",
+          "name": "SkdxCommentThread",
           "declaration": {
-            "name": "SkdxDashboardNavigationItem",
-            "module": "./DashboardLayout"
+            "name": "SkdxCommentThread",
+            "module": "./CommentThread"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/empty-state/EmptyState.ts",
+      "path": "src/conversation-list/ConversationList.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "Placeholder block for a region with nothing to show — no content yet, no\nresults, first use, or disconnected — composing a Heading, a Text\ndescription and consumer-supplied icon and actions.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-empty-state` on the host, then `__icon`, `__title`,\n`__description`, `__content` and `__actions`. `data-size` and `data-align`\nsit on the host for the skin to read.",
-          "name": "SkdxEmptyState",
-          "slots": [
-            {
-              "description": "Extra content rendered between the description and the actions region.",
-              "name": ""
-            },
-            {
-              "description": "Decorative illustration or glyph rendered above the title.",
-              "name": "icon"
-            },
-            {
-              "description": "Primary and secondary controls rendered below the content.",
-              "name": "actions"
-            }
-          ],
+          "description": "Conversation navigation block: a single-select listbox of threads with a\ntitle, preview, relative timestamp, unread mark and badge, plus grouping and\nits own loading and empty states. It routes nowhere — it reports the chosen\nconversation and the consumer navigates.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-conversation-list` on the host, then `__loading`, `__empty`,\n`__list`, `__group`, `__group-label`, `__item`, `__leading`, `__body`,\n`__title`, `__preview`, `__meta`, `__time` and `__badge`. `data-unread` sits\non a row that has not been read.",
+          "name": "SkdxConversationList",
           "members": [
             {
               "kind": "field",
-              "name": "title",
+              "name": "items",
               "type": {
-                "text": "string"
+                "text": "readonly SkdxConversationListItem[]"
               },
-              "description": "Heading text naming the empty region, rendered into a derived Heading.",
-              "attribute": "title",
+              "description": "The conversations to render, in order, each one a selectable option keyed by its id.",
               "required": true
             },
             {
               "kind": "field",
-              "name": "description",
+              "name": "value",
               "type": {
                 "text": "string | undefined | undefined"
               },
-              "description": "Supporting copy rendered below the title, explaining why the region is empty.",
+              "description": "Selected conversation's id, for controlled usage paired with `value-change`.",
               "default": "undefined",
-              "attribute": "description"
+              "attribute": "value"
             },
             {
               "kind": "field",
-              "name": "headingLevel",
+              "name": "defaultValue",
               "type": {
-                "text": "1 | 2 | 3 | 4 | 5 | 6"
+                "text": "string | undefined | undefined"
               },
-              "default": "3",
-              "description": "Outline level of the derived title heading, lowered or raised to fit the surrounding outline.",
-              "attribute": "heading-level"
+              "description": "Conversation selected on first render, used only while uncontrolled.",
+              "default": "undefined",
+              "attribute": "default-value"
             },
             {
               "kind": "field",
-              "name": "size",
+              "name": "label",
               "type": {
-                "text": "'sm' | 'md' | 'lg' | (string & {}) | undefined | undefined"
+                "text": "string"
               },
-              "description": "Visual size rung, written to `data-size` on the host; the skin scales the icon, spacing and title by it.",
-              "default": "undefined",
-              "attribute": "size"
+              "default": "'Conversations'",
+              "description": "Accessible name of the derived listbox holding the conversation rows.",
+              "attribute": "label"
             },
             {
               "kind": "field",
-              "name": "align",
+              "name": "unreadLabel",
               "type": {
-                "text": "'center' | 'start' | (string & {})"
+                "text": "string"
               },
-              "default": "'center'",
-              "description": "Text and content alignment rung, written to `data-align` on the host.",
-              "attribute": "align"
-            }
-          ],
-          "attributes": [
+              "default": "'Unread'",
+              "description": "Visually hidden text appended to an unread row's title, so the mark is spoken.",
+              "attribute": "unread-label"
+            },
             {
-              "name": "title",
+              "kind": "field",
+              "name": "emptyTitle",
               "type": {
                 "text": "string"
               },
-              "description": "Heading text naming the empty region, rendered into a derived Heading.",
-              "fieldName": "title",
-              "required": true
-            },
-            {
-              "name": "description",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Supporting copy rendered below the title, explaining why the region is empty.",
-              "default": "undefined",
-              "fieldName": "description"
-            },
-            {
-              "name": "heading-level",
-              "type": {
-                "text": "1 | 2 | 3 | 4 | 5 | 6"
-              },
-              "default": "3",
-              "description": "Outline level of the derived title heading, lowered or raised to fit the surrounding outline.",
-              "fieldName": "headingLevel"
-            },
-            {
-              "name": "size",
-              "type": {
-                "text": "'sm' | 'md' | 'lg' | (string & {}) | undefined | undefined"
-              },
-              "description": "Visual size rung, written to `data-size` on the host; the skin scales the icon, spacing and title by it.",
-              "default": "undefined",
-              "fieldName": "size"
-            },
-            {
-              "name": "align",
-              "type": {
-                "text": "'center' | 'start' | (string & {})"
-              },
-              "default": "'center'",
-              "description": "Text and content alignment rung, written to `data-align` on the host.",
-              "fieldName": "align"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "skdx-empty-state",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkdxEmptyState",
-          "declaration": {
-            "name": "SkdxEmptyState",
-            "module": "src/empty-state/EmptyState.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "skdx-empty-state",
-          "declaration": {
-            "name": "SkdxEmptyState",
-            "module": "src/empty-state/EmptyState.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/empty-state/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkdxEmptyState",
-          "declaration": {
-            "name": "SkdxEmptyState",
-            "module": "./EmptyState"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/filter-bar/FilterBar.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "Filtering surface above a table, list, card grid or report: a search field,\nthe consumer's filter controls, the applied filters as removable tags, and a\nclear action. Composes TextField, TagGroup and Button.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-filter-bar` on the host, then `__search`, `__filters`,\n`__actions`, `__active`, `__tags` and `__clear`.",
-          "name": "SkdxFilterBar",
-          "slots": [
-            {
-              "description": "The consumer's filter controls, laid out in the filters region.",
-              "name": ""
-            },
-            {
-              "description": "Controls rendered at the end of the bar, such as a \"Save view\" button.",
-              "name": "actions"
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Filters'",
-              "description": "Accessible name of the root region, written to `aria-label`.",
-              "attribute": "label"
-            },
-            {
-              "kind": "field",
-              "name": "searchLabel",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Accessible name of the search field; providing it renders the search region.",
-              "default": "undefined",
-              "attribute": "search-label"
-            },
-            {
-              "kind": "field",
-              "name": "searchPlaceholder",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Placeholder shown in the empty search field.",
-              "default": "undefined",
-              "attribute": "search-placeholder"
+              "default": "'No conversations'",
+              "description": "Heading of the derived EmptyState shown when there is nothing to list.",
+              "attribute": "empty-title"
             },
             {
               "kind": "field",
-              "name": "searchValue",
+              "name": "emptyDescription",
               "type": {
                 "text": "string | undefined | undefined"
               },
-              "description": "Current search text, for controlled usage; pair it with `search-value-change`.",
+              "description": "Supporting copy under the empty state's heading, explaining the gap.",
               "default": "undefined",
-              "attribute": "search-value"
-            },
-            {
-              "kind": "field",
-              "name": "defaultSearchValue",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "Initial search text, for uncontrolled usage — seeds the internally tracked value.",
-              "attribute": "default-search-value"
+              "attribute": "empty-description"
             },
             {
               "kind": "field",
-              "name": "clearSearchLabel",
+              "name": "loading",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "'Clear search'",
-              "description": "Accessible name of the search field's clear button.",
-              "attribute": "clear-search-label"
+              "default": "false",
+              "description": "Replaces the rows with decorative placeholder lines and marks the host `aria-busy`.",
+              "attribute": "loading"
             },
             {
               "kind": "field",
-              "name": "activeFilters",
+              "name": "now",
               "type": {
-                "text": "readonly SkdxFilterBarFilter[] | undefined | undefined"
+                "text": "Date | number | undefined | undefined"
               },
-              "description": "The applied filters, in display order, rendered as removable tags.",
+              "description": "Reference instant the relative row timestamps are measured from.",
               "default": "undefined"
             },
             {
               "kind": "field",
-              "name": "activeFiltersLabel",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Active filters'",
-              "description": "Accessible name of the active-filters tag list.",
-              "attribute": "active-filters-label"
-            },
-            {
-              "kind": "field",
-              "name": "clearLabel",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Clear filters'",
-              "description": "Text rendered on the clear-filters button.",
-              "attribute": "clear-label"
-            }
-          ],
-          "events": [
-            {
-              "description": "Fires with the new text whenever the search field changes, controlled or not.",
-              "name": "search-value-change"
-            },
-            {
-              "description": "Fires with the removed filter when its tag's remove control is activated.",
-              "name": "remove-filter"
-            },
-            {
-              "description": "Fires when the clear-filters button is activated while filters are shown.",
-              "name": "clear"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Filters'",
-              "description": "Accessible name of the root region, written to `aria-label`.",
-              "fieldName": "label"
-            },
-            {
-              "name": "search-label",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Accessible name of the search field; providing it renders the search region.",
-              "default": "undefined",
-              "fieldName": "searchLabel"
-            },
-            {
-              "name": "search-placeholder",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Placeholder shown in the empty search field.",
-              "default": "undefined",
-              "fieldName": "searchPlaceholder"
-            },
-            {
-              "name": "search-value",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Current search text, for controlled usage; pair it with `search-value-change`.",
-              "default": "undefined",
-              "fieldName": "searchValue"
-            },
-            {
-              "name": "default-search-value",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "Initial search text, for uncontrolled usage — seeds the internally tracked value.",
-              "fieldName": "defaultSearchValue"
-            },
-            {
-              "name": "clear-search-label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Clear search'",
-              "description": "Accessible name of the search field's clear button.",
-              "fieldName": "clearSearchLabel"
-            },
-            {
-              "name": "active-filters-label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Active filters'",
-              "description": "Accessible name of the active-filters tag list.",
-              "fieldName": "activeFiltersLabel"
-            },
-            {
-              "name": "clear-label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Clear filters'",
-              "description": "Text rendered on the clear-filters button.",
-              "fieldName": "clearLabel"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "skdx-filter-bar",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkdxFilterBar",
-          "declaration": {
-            "name": "SkdxFilterBar",
-            "module": "src/filter-bar/FilterBar.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "skdx-filter-bar",
-          "declaration": {
-            "name": "SkdxFilterBar",
-            "module": "src/filter-bar/FilterBar.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/filter-bar/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkdxFilterBar",
-          "declaration": {
-            "name": "SkdxFilterBar",
-            "module": "./FilterBar"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "SkdxFilterBarFilter",
-          "declaration": {
-            "name": "SkdxFilterBarFilter",
-            "module": "./FilterBar"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/chat-composer/ChatComposer.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "Message composer block: an auto-growing Textarea and a send Button inside a\nfield, with consumer-supplied attachment, leading, trailing and footer\nregions and configurable Enter-to-send behaviour.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-chat-composer` on the host, then `__attachments`, `__field`,\n`__leading`, `__textarea`, `__trailing`, `__send` and `__footer`.\n`data-state` on the host reads `pending` while a send is in flight.",
-          "name": "SkdxChatComposer",
-          "slots": [
-            {
-              "description": "Controls rendered inside the field before the textarea, such as an attach button.",
-              "name": "leading"
-            },
-            {
-              "description": "Controls rendered inside the field after the textarea, such as a model picker.",
-              "name": "trailing"
-            },
-            {
-              "description": "Attached files or chips rendered in a row above the field.",
-              "name": "attachments"
-            },
-            {
-              "description": "Usage counters or hints rendered in a row below the field.",
-              "name": "footer"
-            },
-            {
-              "description": "Glyph rendered inside the send button in place of its text, making it icon-only.",
-              "name": "send-icon"
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "value",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Current message text, for controlled usage paired with `value-change`.",
-              "default": "undefined",
-              "attribute": "value"
-            },
-            {
-              "kind": "field",
-              "name": "defaultValue",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "Initial message text for uncontrolled usage, read only on mount.",
-              "attribute": "default-value"
-            },
-            {
-              "kind": "field",
-              "name": "placeholder",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Hint text shown in the empty textarea, rendered as the native placeholder.",
-              "default": "undefined",
-              "attribute": "placeholder"
-            },
-            {
-              "kind": "field",
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Message'",
-              "description": "Accessible name of the message textarea, read by assistive technology.",
-              "attribute": "label"
-            },
-            {
-              "kind": "field",
-              "name": "sendLabel",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Send'",
-              "description": "Text of the send button, and its accessible name when the `send-icon` slot is filled.",
-              "attribute": "send-label"
-            },
-            {
-              "kind": "field",
-              "name": "submitKey",
-              "type": {
-                "text": "SkdxChatComposerSubmitKey"
-              },
-              "default": "'enter'",
-              "description": "Which key sends from the textarea; the other Enter presses insert a newline.",
-              "attribute": "submit-key"
-            },
-            {
-              "kind": "field",
-              "name": "maxRows",
-              "type": {
-                "text": "number"
-              },
-              "default": "8",
-              "description": "Caps how far the auto-growing textarea grows, in rows, before it scrolls.",
-              "attribute": "max-rows"
-            },
-            {
-              "kind": "field",
-              "name": "maxLength",
-              "type": {
-                "text": "number | undefined | undefined"
-              },
-              "description": "Native `maxlength` of the textarea — the longest message it accepts.",
-              "default": "undefined",
-              "attribute": "max-length"
-            },
-            {
-              "kind": "field",
-              "name": "disabled",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Disables the textarea and the send button, blocking every send path.",
-              "attribute": "disabled"
-            },
-            {
-              "kind": "field",
-              "name": "pending",
+              "name": "renderLeading",
               "type": {
-                "text": "boolean"
+                "text": "((item: SkdxConversationListItem) => unknown) | undefined | undefined"
               },
-              "default": "false",
-              "description": "Marks a send in flight: the button is busy and inert, the textarea stays editable.",
-              "attribute": "pending"
+              "description": "Renders a decorative leading region for one row, such as an avatar or a status dot.",
+              "default": "undefined"
             }
           ],
           "events": [
             {
-              "description": "Fires with the new text on every edit, including the clear that follows an uncontrolled send.",
+              "description": "Fires with `{ value, previousValue, reason }` whenever the selection moves by pointer or keyboard.",
               "name": "value-change"
-            },
-            {
-              "description": "Fires with the message text when the send button is activated or the configured submit key is pressed.",
-              "name": "send"
             }
           ],
           "attributes": [
@@ -1904,173 +1275,142 @@
               "type": {
                 "text": "string | undefined | undefined"
               },
-              "description": "Current message text, for controlled usage paired with `value-change`.",
+              "description": "Selected conversation's id, for controlled usage paired with `value-change`.",
               "default": "undefined",
               "fieldName": "value"
             },
             {
               "name": "default-value",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "Initial message text for uncontrolled usage, read only on mount.",
-              "fieldName": "defaultValue"
-            },
-            {
-              "name": "placeholder",
               "type": {
                 "text": "string | undefined | undefined"
               },
-              "description": "Hint text shown in the empty textarea, rendered as the native placeholder.",
+              "description": "Conversation selected on first render, used only while uncontrolled.",
               "default": "undefined",
-              "fieldName": "placeholder"
+              "fieldName": "defaultValue"
             },
             {
               "name": "label",
               "type": {
                 "text": "string"
               },
-              "default": "'Message'",
-              "description": "Accessible name of the message textarea, read by assistive technology.",
+              "default": "'Conversations'",
+              "description": "Accessible name of the derived listbox holding the conversation rows.",
               "fieldName": "label"
             },
             {
-              "name": "send-label",
+              "name": "unread-label",
               "type": {
                 "text": "string"
               },
-              "default": "'Send'",
-              "description": "Text of the send button, and its accessible name when the `send-icon` slot is filled.",
-              "fieldName": "sendLabel"
-            },
-            {
-              "name": "submit-key",
-              "type": {
-                "text": "SkdxChatComposerSubmitKey"
-              },
-              "default": "'enter'",
-              "description": "Which key sends from the textarea; the other Enter presses insert a newline.",
-              "fieldName": "submitKey"
-            },
-            {
-              "name": "max-rows",
-              "type": {
-                "text": "number"
-              },
-              "default": "8",
-              "description": "Caps how far the auto-growing textarea grows, in rows, before it scrolls.",
-              "fieldName": "maxRows"
+              "default": "'Unread'",
+              "description": "Visually hidden text appended to an unread row's title, so the mark is spoken.",
+              "fieldName": "unreadLabel"
             },
             {
-              "name": "max-length",
+              "name": "empty-title",
               "type": {
-                "text": "number | undefined | undefined"
+                "text": "string"
               },
-              "description": "Native `maxlength` of the textarea — the longest message it accepts.",
-              "default": "undefined",
-              "fieldName": "maxLength"
+              "default": "'No conversations'",
+              "description": "Heading of the derived EmptyState shown when there is nothing to list.",
+              "fieldName": "emptyTitle"
             },
             {
-              "name": "disabled",
+              "name": "empty-description",
               "type": {
-                "text": "boolean"
+                "text": "string | undefined | undefined"
               },
-              "default": "false",
-              "description": "Disables the textarea and the send button, blocking every send path.",
-              "fieldName": "disabled"
+              "description": "Supporting copy under the empty state's heading, explaining the gap.",
+              "default": "undefined",
+              "fieldName": "emptyDescription"
             },
             {
-              "name": "pending",
+              "name": "loading",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Marks a send in flight: the button is busy and inert, the textarea stays editable.",
-              "fieldName": "pending"
+              "description": "Replaces the rows with decorative placeholder lines and marks the host `aria-busy`.",
+              "fieldName": "loading"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "skdx-chat-composer",
+          "tagName": "skdx-conversation-list",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxChatComposer",
+          "name": "SkdxConversationList",
           "declaration": {
-            "name": "SkdxChatComposer",
-            "module": "src/chat-composer/ChatComposer.ts"
+            "name": "SkdxConversationList",
+            "module": "src/conversation-list/ConversationList.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "skdx-chat-composer",
+          "name": "skdx-conversation-list",
           "declaration": {
-            "name": "SkdxChatComposer",
-            "module": "src/chat-composer/ChatComposer.ts"
+            "name": "SkdxConversationList",
+            "module": "src/conversation-list/ConversationList.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/chat-composer/index.ts",
+      "path": "src/conversation-list/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxChatComposer",
-          "declaration": {
-            "name": "SkdxChatComposer",
-            "module": "./ChatComposer"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "SkdxChatComposerSendDetail",
+          "name": "SkdxConversationList",
           "declaration": {
-            "name": "SkdxChatComposerSendDetail",
-            "module": "./ChatComposer"
+            "name": "SkdxConversationList",
+            "module": "./ConversationList"
           }
         },
         {
           "kind": "js",
-          "name": "SkdxChatComposerSubmitKey",
+          "name": "SkdxConversationListItem",
           "declaration": {
-            "name": "SkdxChatComposerSubmitKey",
-            "module": "./ChatComposer"
+            "name": "SkdxConversationListItem",
+            "module": "./ConversationList"
           }
         },
         {
           "kind": "js",
-          "name": "SkdxChatComposerValueChangeDetail",
+          "name": "SkdxConversationListValueChangeDetail",
           "declaration": {
-            "name": "SkdxChatComposerValueChangeDetail",
-            "module": "./ChatComposer"
+            "name": "SkdxConversationListValueChangeDetail",
+            "module": "./ConversationList"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/form-section/FormSection.ts",
+      "path": "src/dashboard-layout/DashboardLayout.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "Titled group inside a larger form: a heading, supporting text, the group's\nfields and a footer for the group's own actions, composing Heading and Text\naround consumer-supplied fields.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-form-section` on the host, then `__header`, `__title`,\n`__description`, `__content` and `__footer`. `data-variant` sits on the host\nfor the skin to read.",
-          "name": "SkdxFormSection",
+          "description": "Application shell block: an app bar, a collapsible side navigation and the content region.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-dashboard-layout` on the host, then `__app-bar`,\n`__nav-toggle`, `__branding`, `__title`, `__actions`, `__body`, `__nav`,\n`__nav-list`, `__nav-item`, `__nav-header`, `__nav-divider` and `__content`.\n`data-nav-open` sits on the host while the navigation is shown.",
+          "name": "SkdxDashboardLayout",
           "slots": [
             {
-              "description": "The group's fields, rendered into the content region.",
+              "description": "The page content rendered inside the `<main>` region.",
               "name": ""
             },
             {
-              "description": "Save, cancel or other controls rendered in the footer below the fields.",
+              "description": "Logo or product mark at the start of the app bar.",
+              "name": "branding"
+            },
+            {
+              "description": "Controls at the end of the app bar.",
               "name": "actions"
             }
           ],
@@ -2081,39 +1421,64 @@
               "type": {
                 "text": "string"
               },
-              "description": "Heading text naming the group, rendered into a derived Heading that names the section.",
-              "attribute": "title",
+              "default": "''",
+              "description": "Application title shown in the app bar after the branding, shadowing the native tooltip attribute.",
+              "attribute": "title"
+            },
+            {
+              "kind": "field",
+              "name": "navigation",
+              "type": {
+                "text": "readonly SkdxDashboardNavigationItem[]"
+              },
+              "description": "The side navigation, one entry per row, nested through each entry's `children`.",
               "required": true
             },
             {
               "kind": "field",
-              "name": "description",
+              "name": "navOpen",
               "type": {
-                "text": "string | undefined | undefined"
+                "text": "boolean | undefined"
               },
-              "description": "Supporting copy rendered below the title, explaining the group's fields.",
+              "description": "Whether the side navigation is shown, for controlled usage.",
               "default": "undefined",
-              "attribute": "description"
+              "attribute": "nav-open"
             },
             {
               "kind": "field",
-              "name": "headingLevel",
+              "name": "defaultNavOpen",
               "type": {
-                "text": "1 | 2 | 3 | 4 | 5 | 6"
+                "text": "boolean"
               },
-              "default": "2",
-              "description": "Outline level of the derived title heading, lowered or raised to fit the surrounding form outline.",
-              "attribute": "heading-level"
+              "default": "true",
+              "description": "Whether the side navigation starts shown, for uncontrolled usage.",
+              "attribute": "default-nav-open"
             },
             {
               "kind": "field",
-              "name": "variant",
+              "name": "navLabel",
               "type": {
-                "text": "'bordered' | 'split' | (string & {}) | undefined | undefined"
+                "text": "string"
               },
-              "description": "Layout rung written to `data-variant`; `bordered` draws a bounded panel and `split` places the header beside the content.",
-              "default": "undefined",
-              "attribute": "variant"
+              "default": "'Main navigation'",
+              "description": "Accessible name of the side navigation landmark.",
+              "attribute": "nav-label"
+            },
+            {
+              "kind": "field",
+              "name": "navToggleLabel",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Toggle navigation'",
+              "description": "Accessible name of the icon-only button that shows and hides the navigation.",
+              "attribute": "nav-toggle-label"
+            }
+          ],
+          "events": [
+            {
+              "description": "Fires with the new open state whenever the navigation toggle is activated.",
+              "name": "nav-open-change"
             }
           ],
           "attributes": [
@@ -2122,501 +1487,503 @@
               "type": {
                 "text": "string"
               },
-              "description": "Heading text naming the group, rendered into a derived Heading that names the section.",
-              "fieldName": "title",
-              "required": true
+              "default": "''",
+              "description": "Application title shown in the app bar after the branding, shadowing the native tooltip attribute.",
+              "fieldName": "title"
             },
             {
-              "name": "description",
+              "name": "nav-open",
               "type": {
-                "text": "string | undefined | undefined"
+                "text": "boolean | undefined"
               },
-              "description": "Supporting copy rendered below the title, explaining the group's fields.",
+              "description": "Whether the side navigation is shown, for controlled usage.",
               "default": "undefined",
-              "fieldName": "description"
+              "fieldName": "navOpen"
             },
             {
-              "name": "heading-level",
+              "name": "default-nav-open",
               "type": {
-                "text": "1 | 2 | 3 | 4 | 5 | 6"
+                "text": "boolean"
               },
-              "default": "2",
-              "description": "Outline level of the derived title heading, lowered or raised to fit the surrounding form outline.",
-              "fieldName": "headingLevel"
+              "default": "true",
+              "description": "Whether the side navigation starts shown, for uncontrolled usage.",
+              "fieldName": "defaultNavOpen"
             },
             {
-              "name": "variant",
+              "name": "nav-label",
               "type": {
-                "text": "'bordered' | 'split' | (string & {}) | undefined | undefined"
+                "text": "string"
               },
-              "description": "Layout rung written to `data-variant`; `bordered` draws a bounded panel and `split` places the header beside the content.",
-              "default": "undefined",
-              "fieldName": "variant"
+              "default": "'Main navigation'",
+              "description": "Accessible name of the side navigation landmark.",
+              "fieldName": "navLabel"
+            },
+            {
+              "name": "nav-toggle-label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Toggle navigation'",
+              "description": "Accessible name of the icon-only button that shows and hides the navigation.",
+              "fieldName": "navToggleLabel"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "skdx-form-section",
+          "tagName": "skdx-dashboard-layout",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxFormSection",
+          "name": "SkdxDashboardLayout",
           "declaration": {
-            "name": "SkdxFormSection",
-            "module": "src/form-section/FormSection.ts"
+            "name": "SkdxDashboardLayout",
+            "module": "src/dashboard-layout/DashboardLayout.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "skdx-form-section",
+          "name": "skdx-dashboard-layout",
           "declaration": {
-            "name": "SkdxFormSection",
-            "module": "src/form-section/FormSection.ts"
+            "name": "SkdxDashboardLayout",
+            "module": "src/dashboard-layout/DashboardLayout.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/form-section/index.ts",
+      "path": "src/dashboard-layout/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxFormSection",
+          "name": "SkdxDashboardLayout",
           "declaration": {
-            "name": "SkdxFormSection",
-            "module": "./FormSection"
+            "name": "SkdxDashboardLayout",
+            "module": "./DashboardLayout"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "SkdxDashboardNavigationItem",
+          "declaration": {
+            "name": "SkdxDashboardNavigationItem",
+            "module": "./DashboardLayout"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/conversation-list/ConversationList.ts",
+      "path": "src/empty-state/EmptyState.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "Conversation navigation block: a single-select listbox of threads with a\ntitle, preview, relative timestamp, unread mark and badge, plus grouping and\nits own loading and empty states. It routes nowhere — it reports the chosen\nconversation and the consumer navigates.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-conversation-list` on the host, then `__loading`, `__empty`,\n`__list`, `__group`, `__group-label`, `__item`, `__leading`, `__body`,\n`__title`, `__preview`, `__meta`, `__time` and `__badge`. `data-unread` sits\non a row that has not been read.",
-          "name": "SkdxConversationList",
-          "members": [
-            {
-              "kind": "field",
-              "name": "items",
-              "type": {
-                "text": "readonly SkdxConversationListItem[]"
-              },
-              "description": "The conversations to render, in order, each one a selectable option keyed by its id.",
-              "required": true
-            },
-            {
-              "kind": "field",
-              "name": "value",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Selected conversation's id, for controlled usage paired with `value-change`.",
-              "default": "undefined",
-              "attribute": "value"
-            },
-            {
-              "kind": "field",
-              "name": "defaultValue",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Conversation selected on first render, used only while uncontrolled.",
-              "default": "undefined",
-              "attribute": "default-value"
-            },
-            {
-              "kind": "field",
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Conversations'",
-              "description": "Accessible name of the derived listbox holding the conversation rows.",
-              "attribute": "label"
-            },
+          "description": "Placeholder block for a region with nothing to show — no content yet, no\nresults, first use, or disconnected — composing a Heading, a Text\ndescription and consumer-supplied icon and actions.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-empty-state` on the host, then `__icon`, `__title`,\n`__description`, `__content` and `__actions`. `data-size` and `data-align`\nsit on the host for the skin to read.",
+          "name": "SkdxEmptyState",
+          "slots": [
             {
-              "kind": "field",
-              "name": "unreadLabel",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Unread'",
-              "description": "Visually hidden text appended to an unread row's title, so the mark is spoken.",
-              "attribute": "unread-label"
+              "description": "Extra content rendered between the description and the actions region.",
+              "name": ""
+            },
+            {
+              "description": "Decorative illustration or glyph rendered above the title.",
+              "name": "icon"
             },
+            {
+              "description": "Primary and secondary controls rendered below the content.",
+              "name": "actions"
+            }
+          ],
+          "members": [
             {
               "kind": "field",
-              "name": "emptyTitle",
+              "name": "title",
               "type": {
                 "text": "string"
               },
-              "default": "'No conversations'",
-              "description": "Heading of the derived EmptyState shown when there is nothing to list.",
-              "attribute": "empty-title"
+              "description": "Heading text naming the empty region, rendered into a derived Heading.",
+              "attribute": "title",
+              "required": true
             },
             {
               "kind": "field",
-              "name": "emptyDescription",
+              "name": "description",
               "type": {
                 "text": "string | undefined | undefined"
               },
-              "description": "Supporting copy under the empty state's heading, explaining the gap.",
+              "description": "Supporting copy rendered below the title, explaining why the region is empty.",
               "default": "undefined",
-              "attribute": "empty-description"
+              "attribute": "description"
             },
             {
               "kind": "field",
-              "name": "loading",
+              "name": "headingLevel",
               "type": {
-                "text": "boolean"
+                "text": "1 | 2 | 3 | 4 | 5 | 6"
               },
-              "default": "false",
-              "description": "Replaces the rows with decorative placeholder lines and marks the host `aria-busy`.",
-              "attribute": "loading"
+              "default": "3",
+              "description": "Outline level of the derived title heading, lowered or raised to fit the surrounding outline.",
+              "attribute": "heading-level"
             },
             {
               "kind": "field",
-              "name": "now",
+              "name": "size",
               "type": {
-                "text": "Date | number | undefined | undefined"
+                "text": "'sm' | 'md' | 'lg' | (string & {}) | undefined | undefined"
               },
-              "description": "Reference instant the relative row timestamps are measured from.",
-              "default": "undefined"
+              "description": "Visual size rung, written to `data-size` on the host; the skin scales the icon, spacing and title by it.",
+              "default": "undefined",
+              "attribute": "size"
             },
             {
               "kind": "field",
-              "name": "renderLeading",
+              "name": "align",
               "type": {
-                "text": "((item: SkdxConversationListItem) => unknown) | undefined | undefined"
+                "text": "'center' | 'start' | (string & {})"
               },
-              "description": "Renders a decorative leading region for one row, such as an avatar or a status dot.",
-              "default": "undefined"
-            }
-          ],
-          "events": [
-            {
-              "description": "Fires with `{ value, previousValue, reason }` whenever the selection moves by pointer or keyboard.",
-              "name": "value-change"
+              "default": "'center'",
+              "description": "Text and content alignment rung, written to `data-align` on the host.",
+              "attribute": "align"
             }
           ],
           "attributes": [
             {
-              "name": "value",
+              "name": "title",
               "type": {
-                "text": "string | undefined | undefined"
+                "text": "string"
               },
-              "description": "Selected conversation's id, for controlled usage paired with `value-change`.",
-              "default": "undefined",
-              "fieldName": "value"
+              "description": "Heading text naming the empty region, rendered into a derived Heading.",
+              "fieldName": "title",
+              "required": true
             },
             {
-              "name": "default-value",
+              "name": "description",
               "type": {
                 "text": "string | undefined | undefined"
               },
-              "description": "Conversation selected on first render, used only while uncontrolled.",
+              "description": "Supporting copy rendered below the title, explaining why the region is empty.",
               "default": "undefined",
-              "fieldName": "defaultValue"
-            },
-            {
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Conversations'",
-              "description": "Accessible name of the derived listbox holding the conversation rows.",
-              "fieldName": "label"
-            },
-            {
-              "name": "unread-label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Unread'",
-              "description": "Visually hidden text appended to an unread row's title, so the mark is spoken.",
-              "fieldName": "unreadLabel"
+              "fieldName": "description"
             },
             {
-              "name": "empty-title",
+              "name": "heading-level",
               "type": {
-                "text": "string"
+                "text": "1 | 2 | 3 | 4 | 5 | 6"
               },
-              "default": "'No conversations'",
-              "description": "Heading of the derived EmptyState shown when there is nothing to list.",
-              "fieldName": "emptyTitle"
+              "default": "3",
+              "description": "Outline level of the derived title heading, lowered or raised to fit the surrounding outline.",
+              "fieldName": "headingLevel"
             },
             {
-              "name": "empty-description",
+              "name": "size",
               "type": {
-                "text": "string | undefined | undefined"
+                "text": "'sm' | 'md' | 'lg' | (string & {}) | undefined | undefined"
               },
-              "description": "Supporting copy under the empty state's heading, explaining the gap.",
+              "description": "Visual size rung, written to `data-size` on the host; the skin scales the icon, spacing and title by it.",
               "default": "undefined",
-              "fieldName": "emptyDescription"
+              "fieldName": "size"
             },
             {
-              "name": "loading",
+              "name": "align",
               "type": {
-                "text": "boolean"
+                "text": "'center' | 'start' | (string & {})"
               },
-              "default": "false",
-              "description": "Replaces the rows with decorative placeholder lines and marks the host `aria-busy`.",
-              "fieldName": "loading"
+              "default": "'center'",
+              "description": "Text and content alignment rung, written to `data-align` on the host.",
+              "fieldName": "align"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "skdx-conversation-list",
+          "tagName": "skdx-empty-state",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxConversationList",
+          "name": "SkdxEmptyState",
           "declaration": {
-            "name": "SkdxConversationList",
-            "module": "src/conversation-list/ConversationList.ts"
+            "name": "SkdxEmptyState",
+            "module": "src/empty-state/EmptyState.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "skdx-conversation-list",
+          "name": "skdx-empty-state",
           "declaration": {
-            "name": "SkdxConversationList",
-            "module": "src/conversation-list/ConversationList.ts"
+            "name": "SkdxEmptyState",
+            "module": "src/empty-state/EmptyState.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/conversation-list/index.ts",
+      "path": "src/empty-state/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxConversationList",
-          "declaration": {
-            "name": "SkdxConversationList",
-            "module": "./ConversationList"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "SkdxConversationListItem",
-          "declaration": {
-            "name": "SkdxConversationListItem",
-            "module": "./ConversationList"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "SkdxConversationListValueChangeDetail",
+          "name": "SkdxEmptyState",
           "declaration": {
-            "name": "SkdxConversationListValueChangeDetail",
-            "module": "./ConversationList"
+            "name": "SkdxEmptyState",
+            "module": "./EmptyState"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/onboarding-checklist/OnboardingChecklist.ts",
+      "path": "src/filter-bar/FilterBar.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "Progress checklist block: a header naming the checklist with an overall\nProgress meter, above an ordered list of tasks each carrying its own\ncompletion state and an optional action.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-onboarding-checklist` on the host, then `__header`,\n`__title`, `__description`, `__progress`, `__list`, `__item`, `__indicator`,\n`__body`, `__item-title`, `__optional`, `__item-description` and `__action`.\n`data-state` sits on each item for the skin to read.",
-          "name": "SkdxOnboardingChecklist",
+          "description": "Filtering surface above a table, list, card grid or report: a search field,\nthe consumer's filter controls, the applied filters as removable tags, and a\nclear action. Composes TextField, TagGroup and Button.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-filter-bar` on the host, then `__search`, `__filters`,\n`__actions`, `__active`, `__tags` and `__clear`.",
+          "name": "SkdxFilterBar",
+          "slots": [
+            {
+              "description": "The consumer's filter controls, laid out in the filters region.",
+              "name": ""
+            },
+            {
+              "description": "Controls rendered at the end of the bar, such as a \"Save view\" button.",
+              "name": "actions"
+            }
+          ],
           "members": [
             {
               "kind": "field",
-              "name": "title",
+              "name": "label",
               "type": {
                 "text": "string"
               },
-              "description": "Heading text naming the checklist, rendered into a derived Heading that names the section.",
-              "attribute": "title",
-              "required": true
+              "default": "'Filters'",
+              "description": "Accessible name of the root region, written to `aria-label`.",
+              "attribute": "label"
             },
             {
               "kind": "field",
-              "name": "description",
+              "name": "searchLabel",
               "type": {
                 "text": "string | undefined | undefined"
               },
-              "description": "Supporting copy rendered below the title, explaining what the checklist covers.",
+              "description": "Accessible name of the search field; providing it renders the search region.",
               "default": "undefined",
-              "attribute": "description"
+              "attribute": "search-label"
             },
             {
               "kind": "field",
-              "name": "headingLevel",
+              "name": "searchPlaceholder",
               "type": {
-                "text": "1 | 2 | 3 | 4 | 5 | 6"
+                "text": "string | undefined | undefined"
               },
-              "default": "2",
-              "description": "Outline level of the derived title heading, lowered or raised to fit the surrounding outline.",
-              "attribute": "heading-level"
+              "description": "Placeholder shown in the empty search field.",
+              "default": "undefined",
+              "attribute": "search-placeholder"
             },
             {
               "kind": "field",
-              "name": "items",
+              "name": "searchValue",
               "type": {
-                "text": "readonly SkdxOnboardingChecklistItem[]"
+                "text": "string | undefined | undefined"
               },
-              "description": "The tasks to complete, in render order, each with its own state, optional flag and action label.",
-              "required": true
+              "description": "Current search text, for controlled usage; pair it with `search-value-change`.",
+              "default": "undefined",
+              "attribute": "search-value"
             },
             {
               "kind": "field",
-              "name": "getProgressLabel",
+              "name": "defaultSearchValue",
               "type": {
-                "text": "(complete: number, total: number) => string | undefined"
+                "text": "string"
               },
-              "description": "Formats the overall progress meter's readout from the completed and total item counts.",
-              "default": "defaultGetProgressLabel"
+              "default": "''",
+              "description": "Initial search text, for uncontrolled usage — seeds the internally tracked value.",
+              "attribute": "default-search-value"
             },
             {
               "kind": "field",
-              "name": "completeLabel",
+              "name": "clearSearchLabel",
               "type": {
                 "text": "string"
               },
-              "default": "'Completed'",
-              "description": "Visually hidden text appended after a completed item's title, announcing its completion.",
-              "attribute": "complete-label"
+              "default": "'Clear search'",
+              "description": "Accessible name of the search field's clear button.",
+              "attribute": "clear-search-label"
             },
             {
               "kind": "field",
-              "name": "optionalLabel",
+              "name": "activeFilters",
+              "type": {
+                "text": "readonly SkdxFilterBarFilter[] | undefined | undefined"
+              },
+              "description": "The applied filters, in display order, rendered as removable tags.",
+              "default": "undefined"
+            },
+            {
+              "kind": "field",
+              "name": "activeFiltersLabel",
               "type": {
                 "text": "string"
               },
-              "default": "'Optional'",
-              "description": "Text rendered beside an optional item's title.",
-              "attribute": "optional-label"
+              "default": "'Active filters'",
+              "description": "Accessible name of the active-filters tag list.",
+              "attribute": "active-filters-label"
+            },
+            {
+              "kind": "field",
+              "name": "clearLabel",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Clear filters'",
+              "description": "Text rendered on the clear-filters button.",
+              "attribute": "clear-label"
             }
           ],
           "events": [
             {
-              "description": "Fires when an item's action button is activated, carrying the full item that was acted on.",
-              "name": "action"
+              "description": "Fires with the new text whenever the search field changes, controlled or not.",
+              "name": "search-value-change"
+            },
+            {
+              "description": "Fires with the removed filter when its tag's remove control is activated.",
+              "name": "remove-filter"
+            },
+            {
+              "description": "Fires when the clear-filters button is activated while filters are shown.",
+              "name": "clear"
             }
           ],
           "attributes": [
             {
-              "name": "title",
+              "name": "label",
               "type": {
                 "text": "string"
               },
-              "description": "Heading text naming the checklist, rendered into a derived Heading that names the section.",
-              "fieldName": "title",
-              "required": true
+              "default": "'Filters'",
+              "description": "Accessible name of the root region, written to `aria-label`.",
+              "fieldName": "label"
             },
             {
-              "name": "description",
+              "name": "search-label",
               "type": {
                 "text": "string | undefined | undefined"
               },
-              "description": "Supporting copy rendered below the title, explaining what the checklist covers.",
+              "description": "Accessible name of the search field; providing it renders the search region.",
               "default": "undefined",
-              "fieldName": "description"
+              "fieldName": "searchLabel"
             },
             {
-              "name": "heading-level",
+              "name": "search-placeholder",
               "type": {
-                "text": "1 | 2 | 3 | 4 | 5 | 6"
+                "text": "string | undefined | undefined"
               },
-              "default": "2",
-              "description": "Outline level of the derived title heading, lowered or raised to fit the surrounding outline.",
-              "fieldName": "headingLevel"
+              "description": "Placeholder shown in the empty search field.",
+              "default": "undefined",
+              "fieldName": "searchPlaceholder"
             },
             {
-              "name": "complete-label",
+              "name": "search-value",
+              "type": {
+                "text": "string | undefined | undefined"
+              },
+              "description": "Current search text, for controlled usage; pair it with `search-value-change`.",
+              "default": "undefined",
+              "fieldName": "searchValue"
+            },
+            {
+              "name": "default-search-value",
               "type": {
                 "text": "string"
               },
-              "default": "'Completed'",
-              "description": "Visually hidden text appended after a completed item's title, announcing its completion.",
-              "fieldName": "completeLabel"
+              "default": "''",
+              "description": "Initial search text, for uncontrolled usage — seeds the internally tracked value.",
+              "fieldName": "defaultSearchValue"
             },
             {
-              "name": "optional-label",
+              "name": "clear-search-label",
               "type": {
                 "text": "string"
               },
-              "default": "'Optional'",
-              "description": "Text rendered beside an optional item's title.",
-              "fieldName": "optionalLabel"
+              "default": "'Clear search'",
+              "description": "Accessible name of the search field's clear button.",
+              "fieldName": "clearSearchLabel"
+            },
+            {
+              "name": "active-filters-label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Active filters'",
+              "description": "Accessible name of the active-filters tag list.",
+              "fieldName": "activeFiltersLabel"
+            },
+            {
+              "name": "clear-label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Clear filters'",
+              "description": "Text rendered on the clear-filters button.",
+              "fieldName": "clearLabel"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "skdx-onboarding-checklist",
+          "tagName": "skdx-filter-bar",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxOnboardingChecklist",
+          "name": "SkdxFilterBar",
           "declaration": {
-            "name": "SkdxOnboardingChecklist",
-            "module": "src/onboarding-checklist/OnboardingChecklist.ts"
+            "name": "SkdxFilterBar",
+            "module": "src/filter-bar/FilterBar.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "skdx-onboarding-checklist",
+          "name": "skdx-filter-bar",
           "declaration": {
-            "name": "SkdxOnboardingChecklist",
-            "module": "src/onboarding-checklist/OnboardingChecklist.ts"
+            "name": "SkdxFilterBar",
+            "module": "src/filter-bar/FilterBar.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/onboarding-checklist/index.ts",
+      "path": "src/filter-bar/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxOnboardingChecklist",
-          "declaration": {
-            "name": "SkdxOnboardingChecklist",
-            "module": "./OnboardingChecklist"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "SkdxOnboardingChecklistItem",
+          "name": "SkdxFilterBar",
           "declaration": {
-            "name": "SkdxOnboardingChecklistItem",
-            "module": "./OnboardingChecklist"
+            "name": "SkdxFilterBar",
+            "module": "./FilterBar"
           }
         },
         {
           "kind": "js",
-          "name": "SkdxOnboardingChecklistItemState",
+          "name": "SkdxFilterBarFilter",
           "declaration": {
-            "name": "SkdxOnboardingChecklistItemState",
-            "module": "./OnboardingChecklist"
+            "name": "SkdxFilterBarFilter",
+            "module": "./FilterBar"
           }
         }
       ]
@@ -2746,88 +2113,228 @@
               "fieldName": "error"
             },
             {
-              "name": "success",
+              "name": "success",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Confirmation rendered into a derived success Alert that replaces the form entirely.",
+              "default": "undefined",
+              "fieldName": "success"
+            },
+            {
+              "name": "pending",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Marks the request in flight, making the submit button busy while the email field stays editable.",
+              "fieldName": "pending"
+            },
+            {
+              "name": "email-label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Email'",
+              "description": "Label of the email field the reset link is requested for.",
+              "fieldName": "emailLabel"
+            },
+            {
+              "name": "submit-label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Send reset link'",
+              "description": "Text of the form's submit button.",
+              "fieldName": "submitLabel"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "skdx-forgot-password-page",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SkdxForgotPasswordPage",
+          "declaration": {
+            "name": "SkdxForgotPasswordPage",
+            "module": "src/forgot-password-page/ForgotPasswordPage.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "skdx-forgot-password-page",
+          "declaration": {
+            "name": "SkdxForgotPasswordPage",
+            "module": "src/forgot-password-page/ForgotPasswordPage.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/forgot-password-page/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SkdxForgotPasswordPage",
+          "declaration": {
+            "name": "SkdxForgotPasswordPage",
+            "module": "./ForgotPasswordPage"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "SkdxForgotPasswordDetail",
+          "declaration": {
+            "name": "SkdxForgotPasswordDetail",
+            "module": "./ForgotPasswordPage"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/form-section/FormSection.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "Titled group inside a larger form: a heading, supporting text, the group's\nfields and a footer for the group's own actions, composing Heading and Text\naround consumer-supplied fields.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-form-section` on the host, then `__header`, `__title`,\n`__description`, `__content` and `__footer`. `data-variant` sits on the host\nfor the skin to read.",
+          "name": "SkdxFormSection",
+          "slots": [
+            {
+              "description": "The group's fields, rendered into the content region.",
+              "name": ""
+            },
+            {
+              "description": "Save, cancel or other controls rendered in the footer below the fields.",
+              "name": "actions"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "title",
+              "type": {
+                "text": "string"
+              },
+              "description": "Heading text naming the group, rendered into a derived Heading that names the section.",
+              "attribute": "title",
+              "required": true
+            },
+            {
+              "kind": "field",
+              "name": "description",
+              "type": {
+                "text": "string | undefined | undefined"
+              },
+              "description": "Supporting copy rendered below the title, explaining the group's fields.",
+              "default": "undefined",
+              "attribute": "description"
+            },
+            {
+              "kind": "field",
+              "name": "headingLevel",
+              "type": {
+                "text": "1 | 2 | 3 | 4 | 5 | 6"
+              },
+              "default": "2",
+              "description": "Outline level of the derived title heading, lowered or raised to fit the surrounding form outline.",
+              "attribute": "heading-level"
+            },
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "'bordered' | 'split' | (string & {}) | undefined | undefined"
+              },
+              "description": "Layout rung written to `data-variant`; `bordered` draws a bounded panel and `split` places the header beside the content.",
+              "default": "undefined",
+              "attribute": "variant"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "title",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "description": "Confirmation rendered into a derived success Alert that replaces the form entirely.",
-              "default": "undefined",
-              "fieldName": "success"
+              "description": "Heading text naming the group, rendered into a derived Heading that names the section.",
+              "fieldName": "title",
+              "required": true
             },
             {
-              "name": "pending",
+              "name": "description",
               "type": {
-                "text": "boolean"
+                "text": "string | undefined | undefined"
               },
-              "default": "false",
-              "description": "Marks the request in flight, making the submit button busy while the email field stays editable.",
-              "fieldName": "pending"
+              "description": "Supporting copy rendered below the title, explaining the group's fields.",
+              "default": "undefined",
+              "fieldName": "description"
             },
             {
-              "name": "email-label",
+              "name": "heading-level",
               "type": {
-                "text": "string"
+                "text": "1 | 2 | 3 | 4 | 5 | 6"
               },
-              "default": "'Email'",
-              "description": "Label of the email field the reset link is requested for.",
-              "fieldName": "emailLabel"
+              "default": "2",
+              "description": "Outline level of the derived title heading, lowered or raised to fit the surrounding form outline.",
+              "fieldName": "headingLevel"
             },
             {
-              "name": "submit-label",
+              "name": "variant",
               "type": {
-                "text": "string"
+                "text": "'bordered' | 'split' | (string & {}) | undefined | undefined"
               },
-              "default": "'Send reset link'",
-              "description": "Text of the form's submit button.",
-              "fieldName": "submitLabel"
+              "description": "Layout rung written to `data-variant`; `bordered` draws a bounded panel and `split` places the header beside the content.",
+              "default": "undefined",
+              "fieldName": "variant"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "skdx-forgot-password-page",
+          "tagName": "skdx-form-section",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxForgotPasswordPage",
+          "name": "SkdxFormSection",
           "declaration": {
-            "name": "SkdxForgotPasswordPage",
-            "module": "src/forgot-password-page/ForgotPasswordPage.ts"
+            "name": "SkdxFormSection",
+            "module": "src/form-section/FormSection.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "skdx-forgot-password-page",
+          "name": "skdx-form-section",
           "declaration": {
-            "name": "SkdxForgotPasswordPage",
-            "module": "src/forgot-password-page/ForgotPasswordPage.ts"
+            "name": "SkdxFormSection",
+            "module": "src/form-section/FormSection.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/forgot-password-page/index.ts",
+      "path": "src/form-section/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxForgotPasswordPage",
-          "declaration": {
-            "name": "SkdxForgotPasswordPage",
-            "module": "./ForgotPasswordPage"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "SkdxForgotPasswordDetail",
+          "name": "SkdxFormSection",
           "declaration": {
-            "name": "SkdxForgotPasswordDetail",
-            "module": "./ForgotPasswordPage"
+            "name": "SkdxFormSection",
+            "module": "./FormSection"
           }
         }
       ]
@@ -3161,26 +2668,215 @@
         },
         {
           "kind": "js",
-          "name": "SkdxNotificationCenterItem",
+          "name": "SkdxNotificationCenterItem",
+          "declaration": {
+            "name": "SkdxNotificationCenterItem",
+            "module": "./NotificationCenter"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "SkdxNotificationCenterReadChangeDetail",
+          "declaration": {
+            "name": "SkdxNotificationCenterReadChangeDetail",
+            "module": "./NotificationCenter"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "SkdxNotificationCenterSelectDetail",
+          "declaration": {
+            "name": "SkdxNotificationCenterSelectDetail",
+            "module": "./NotificationCenter"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/onboarding-checklist/OnboardingChecklist.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "Progress checklist block: a header naming the checklist with an overall\nProgress meter, above an ordered list of tasks each carrying its own\ncompletion state and an optional action.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-onboarding-checklist` on the host, then `__header`,\n`__title`, `__description`, `__progress`, `__list`, `__item`, `__indicator`,\n`__body`, `__item-title`, `__optional`, `__item-description` and `__action`.\n`data-state` sits on each item for the skin to read.",
+          "name": "SkdxOnboardingChecklist",
+          "members": [
+            {
+              "kind": "field",
+              "name": "title",
+              "type": {
+                "text": "string"
+              },
+              "description": "Heading text naming the checklist, rendered into a derived Heading that names the section.",
+              "attribute": "title",
+              "required": true
+            },
+            {
+              "kind": "field",
+              "name": "description",
+              "type": {
+                "text": "string | undefined | undefined"
+              },
+              "description": "Supporting copy rendered below the title, explaining what the checklist covers.",
+              "default": "undefined",
+              "attribute": "description"
+            },
+            {
+              "kind": "field",
+              "name": "headingLevel",
+              "type": {
+                "text": "1 | 2 | 3 | 4 | 5 | 6"
+              },
+              "default": "2",
+              "description": "Outline level of the derived title heading, lowered or raised to fit the surrounding outline.",
+              "attribute": "heading-level"
+            },
+            {
+              "kind": "field",
+              "name": "items",
+              "type": {
+                "text": "readonly SkdxOnboardingChecklistItem[]"
+              },
+              "description": "The tasks to complete, in render order, each with its own state, optional flag and action label.",
+              "required": true
+            },
+            {
+              "kind": "field",
+              "name": "getProgressLabel",
+              "type": {
+                "text": "(complete: number, total: number) => string | undefined"
+              },
+              "description": "Formats the overall progress meter's readout from the completed and total item counts.",
+              "default": "defaultGetProgressLabel"
+            },
+            {
+              "kind": "field",
+              "name": "completeLabel",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Completed'",
+              "description": "Visually hidden text appended after a completed item's title, announcing its completion.",
+              "attribute": "complete-label"
+            },
+            {
+              "kind": "field",
+              "name": "optionalLabel",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Optional'",
+              "description": "Text rendered beside an optional item's title.",
+              "attribute": "optional-label"
+            }
+          ],
+          "events": [
+            {
+              "description": "Fires when an item's action button is activated, carrying the full item that was acted on.",
+              "name": "action"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "title",
+              "type": {
+                "text": "string"
+              },
+              "description": "Heading text naming the checklist, rendered into a derived Heading that names the section.",
+              "fieldName": "title",
+              "required": true
+            },
+            {
+              "name": "description",
+              "type": {
+                "text": "string | undefined | undefined"
+              },
+              "description": "Supporting copy rendered below the title, explaining what the checklist covers.",
+              "default": "undefined",
+              "fieldName": "description"
+            },
+            {
+              "name": "heading-level",
+              "type": {
+                "text": "1 | 2 | 3 | 4 | 5 | 6"
+              },
+              "default": "2",
+              "description": "Outline level of the derived title heading, lowered or raised to fit the surrounding outline.",
+              "fieldName": "headingLevel"
+            },
+            {
+              "name": "complete-label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Completed'",
+              "description": "Visually hidden text appended after a completed item's title, announcing its completion.",
+              "fieldName": "completeLabel"
+            },
+            {
+              "name": "optional-label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Optional'",
+              "description": "Text rendered beside an optional item's title.",
+              "fieldName": "optionalLabel"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "skdx-onboarding-checklist",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SkdxOnboardingChecklist",
+          "declaration": {
+            "name": "SkdxOnboardingChecklist",
+            "module": "src/onboarding-checklist/OnboardingChecklist.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "skdx-onboarding-checklist",
+          "declaration": {
+            "name": "SkdxOnboardingChecklist",
+            "module": "src/onboarding-checklist/OnboardingChecklist.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/onboarding-checklist/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SkdxOnboardingChecklist",
           "declaration": {
-            "name": "SkdxNotificationCenterItem",
-            "module": "./NotificationCenter"
+            "name": "SkdxOnboardingChecklist",
+            "module": "./OnboardingChecklist"
           }
         },
         {
           "kind": "js",
-          "name": "SkdxNotificationCenterReadChangeDetail",
+          "name": "SkdxOnboardingChecklistItem",
           "declaration": {
-            "name": "SkdxNotificationCenterReadChangeDetail",
-            "module": "./NotificationCenter"
+            "name": "SkdxOnboardingChecklistItem",
+            "module": "./OnboardingChecklist"
           }
         },
         {
           "kind": "js",
-          "name": "SkdxNotificationCenterSelectDetail",
+          "name": "SkdxOnboardingChecklistItemState",
           "declaration": {
-            "name": "SkdxNotificationCenterSelectDetail",
-            "module": "./NotificationCenter"
+            "name": "SkdxOnboardingChecklistItemState",
+            "module": "./OnboardingChecklist"
           }
         }
       ]
@@ -3311,33 +3007,267 @@
         },
         {
           "kind": "custom-element-definition",
-          "name": "skdx-page-container",
+          "name": "skdx-page-container",
+          "declaration": {
+            "name": "SkdxPageContainer",
+            "module": "src/page-container/PageContainer.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/page-container/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SkdxPageContainer",
+          "declaration": {
+            "name": "SkdxPageContainer",
+            "module": "./PageContainer"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "SkdxPageContainerBreadcrumb",
+          "declaration": {
+            "name": "SkdxPageContainerBreadcrumb",
+            "module": "./PageContainer"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/reset-password-page/ResetPasswordPage.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "Reset-password block: a new-password field with its rules, an optional\nconfirmation matched against it, and a submit button, replaced entirely by a\nsuccess alert once the change is accepted.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-reset-password-page` on the host, then `__panel`, `__title`,\n`__error`, `__success`, `__form`, `__field`, `__requirements`, `__submit`\nand `__footer`.",
+          "name": "SkdxResetPasswordPage",
+          "slots": [
+            {
+              "description": "Extra fields rendered inside the form, above the submit button.",
+              "name": ""
+            },
+            {
+              "description": "Password rules used as the new-password field's description.",
+              "name": "requirements"
+            },
+            {
+              "description": "Navigation below the form, such as a link back to the sign-in page.",
+              "name": "footer"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "title",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Choose a new password'",
+              "description": "Heading text, rendered into a derived `<h1>` that names the section.",
+              "attribute": "title"
+            },
+            {
+              "kind": "field",
+              "name": "error",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Message rendered into a derived error Alert above the form. The block never clears it.",
+              "default": "undefined",
+              "attribute": "error"
+            },
+            {
+              "kind": "field",
+              "name": "success",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Confirmation rendered into a derived success Alert that replaces the form entirely.",
+              "default": "undefined",
+              "attribute": "success"
+            },
+            {
+              "kind": "field",
+              "name": "pending",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Marks the request in flight, making the submit button busy while both fields stay editable.",
+              "attribute": "pending"
+            },
+            {
+              "kind": "field",
+              "name": "passwordLabel",
+              "type": {
+                "text": "string"
+              },
+              "default": "'New password'",
+              "description": "Label of the field where the new password is typed.",
+              "attribute": "password-label"
+            },
+            {
+              "kind": "field",
+              "name": "confirmPasswordLabel",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Label of the confirmation field; supplying it is what turns password matching on.",
+              "default": "undefined",
+              "attribute": "confirm-password-label"
+            },
+            {
+              "kind": "field",
+              "name": "passwordMismatchMessage",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Passwords do not match'",
+              "description": "Validation message pushed onto the confirmation field when the two passwords differ.",
+              "attribute": "password-mismatch-message"
+            },
+            {
+              "kind": "field",
+              "name": "submitLabel",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Update password'",
+              "description": "Text of the form's submit button.",
+              "attribute": "submit-label"
+            }
+          ],
+          "events": [
+            {
+              "description": "Fires with `{ password }` when the form submits with a valid password that matches the confirmation.",
+              "name": "reset-password"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "title",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Choose a new password'",
+              "description": "Heading text, rendered into a derived `<h1>` that names the section.",
+              "fieldName": "title"
+            },
+            {
+              "name": "error",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Message rendered into a derived error Alert above the form. The block never clears it.",
+              "default": "undefined",
+              "fieldName": "error"
+            },
+            {
+              "name": "success",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Confirmation rendered into a derived success Alert that replaces the form entirely.",
+              "default": "undefined",
+              "fieldName": "success"
+            },
+            {
+              "name": "pending",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Marks the request in flight, making the submit button busy while both fields stay editable.",
+              "fieldName": "pending"
+            },
+            {
+              "name": "password-label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'New password'",
+              "description": "Label of the field where the new password is typed.",
+              "fieldName": "passwordLabel"
+            },
+            {
+              "name": "confirm-password-label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Label of the confirmation field; supplying it is what turns password matching on.",
+              "default": "undefined",
+              "fieldName": "confirmPasswordLabel"
+            },
+            {
+              "name": "password-mismatch-message",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Passwords do not match'",
+              "description": "Validation message pushed onto the confirmation field when the two passwords differ.",
+              "fieldName": "passwordMismatchMessage"
+            },
+            {
+              "name": "submit-label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Update password'",
+              "description": "Text of the form's submit button.",
+              "fieldName": "submitLabel"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "skdx-reset-password-page",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SkdxResetPasswordPage",
+          "declaration": {
+            "name": "SkdxResetPasswordPage",
+            "module": "src/reset-password-page/ResetPasswordPage.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "skdx-reset-password-page",
           "declaration": {
-            "name": "SkdxPageContainer",
-            "module": "src/page-container/PageContainer.ts"
+            "name": "SkdxResetPasswordPage",
+            "module": "src/reset-password-page/ResetPasswordPage.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/page-container/index.ts",
+      "path": "src/reset-password-page/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "SkdxPageContainer",
+          "name": "SkdxResetPasswordPage",
           "declaration": {
-            "name": "SkdxPageContainer",
-            "module": "./PageContainer"
+            "name": "SkdxResetPasswordPage",
+            "module": "./ResetPasswordPage"
           }
         },
         {
           "kind": "js",
-          "name": "SkdxPageContainerBreadcrumb",
+          "name": "SkdxResetPasswordDetail",
           "declaration": {
-            "name": "SkdxPageContainerBreadcrumb",
-            "module": "./PageContainer"
+            "name": "SkdxResetPasswordDetail",
+            "module": "./ResetPasswordPage"
           }
         }
       ]
@@ -3859,240 +3789,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/reset-password-page/ResetPasswordPage.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "Reset-password block: a new-password field with its rules, an optional\nconfirmation matched against it, and a submit button, replaced entirely by a\nsuccess alert once the change is accepted.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-reset-password-page` on the host, then `__panel`, `__title`,\n`__error`, `__success`, `__form`, `__field`, `__requirements`, `__submit`\nand `__footer`.",
-          "name": "SkdxResetPasswordPage",
-          "slots": [
-            {
-              "description": "Extra fields rendered inside the form, above the submit button.",
-              "name": ""
-            },
-            {
-              "description": "Password rules used as the new-password field's description.",
-              "name": "requirements"
-            },
-            {
-              "description": "Navigation below the form, such as a link back to the sign-in page.",
-              "name": "footer"
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "title",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Choose a new password'",
-              "description": "Heading text, rendered into a derived `<h1>` that names the section.",
-              "attribute": "title"
-            },
-            {
-              "kind": "field",
-              "name": "error",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Message rendered into a derived error Alert above the form. The block never clears it.",
-              "default": "undefined",
-              "attribute": "error"
-            },
-            {
-              "kind": "field",
-              "name": "success",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Confirmation rendered into a derived success Alert that replaces the form entirely.",
-              "default": "undefined",
-              "attribute": "success"
-            },
-            {
-              "kind": "field",
-              "name": "pending",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Marks the request in flight, making the submit button busy while both fields stay editable.",
-              "attribute": "pending"
-            },
-            {
-              "kind": "field",
-              "name": "passwordLabel",
-              "type": {
-                "text": "string"
-              },
-              "default": "'New password'",
-              "description": "Label of the field where the new password is typed.",
-              "attribute": "password-label"
-            },
-            {
-              "kind": "field",
-              "name": "confirmPasswordLabel",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Label of the confirmation field; supplying it is what turns password matching on.",
-              "default": "undefined",
-              "attribute": "confirm-password-label"
-            },
-            {
-              "kind": "field",
-              "name": "passwordMismatchMessage",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Passwords do not match'",
-              "description": "Validation message pushed onto the confirmation field when the two passwords differ.",
-              "attribute": "password-mismatch-message"
-            },
-            {
-              "kind": "field",
-              "name": "submitLabel",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Update password'",
-              "description": "Text of the form's submit button.",
-              "attribute": "submit-label"
-            }
-          ],
-          "events": [
-            {
-              "description": "Fires with `{ password }` when the form submits with a valid password that matches the confirmation.",
-              "name": "reset-password"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "title",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Choose a new password'",
-              "description": "Heading text, rendered into a derived `<h1>` that names the section.",
-              "fieldName": "title"
-            },
-            {
-              "name": "error",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Message rendered into a derived error Alert above the form. The block never clears it.",
-              "default": "undefined",
-              "fieldName": "error"
-            },
-            {
-              "name": "success",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Confirmation rendered into a derived success Alert that replaces the form entirely.",
-              "default": "undefined",
-              "fieldName": "success"
-            },
-            {
-              "name": "pending",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Marks the request in flight, making the submit button busy while both fields stay editable.",
-              "fieldName": "pending"
-            },
-            {
-              "name": "password-label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'New password'",
-              "description": "Label of the field where the new password is typed.",
-              "fieldName": "passwordLabel"
-            },
-            {
-              "name": "confirm-password-label",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Label of the confirmation field; supplying it is what turns password matching on.",
-              "default": "undefined",
-              "fieldName": "confirmPasswordLabel"
-            },
-            {
-              "name": "password-mismatch-message",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Passwords do not match'",
-              "description": "Validation message pushed onto the confirmation field when the two passwords differ.",
-              "fieldName": "passwordMismatchMessage"
-            },
-            {
-              "name": "submit-label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Update password'",
-              "description": "Text of the form's submit button.",
-              "fieldName": "submitLabel"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "skdx-reset-password-page",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkdxResetPasswordPage",
-          "declaration": {
-            "name": "SkdxResetPasswordPage",
-            "module": "src/reset-password-page/ResetPasswordPage.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "skdx-reset-password-page",
-          "declaration": {
-            "name": "SkdxResetPasswordPage",
-            "module": "src/reset-password-page/ResetPasswordPage.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/reset-password-page/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkdxResetPasswordPage",
-          "declaration": {
-            "name": "SkdxResetPasswordPage",
-            "module": "./ResetPasswordPage"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "SkdxResetPasswordDetail",
-          "declaration": {
-            "name": "SkdxResetPasswordDetail",
-            "module": "./ResetPasswordPage"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/stat-card/StatCard.ts",
@@ -4531,12 +4227,262 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/usage-card/usage.ts",
-      "declarations": [],
-      "exports": []
-    },
+    {
+      "kind": "javascript-module",
+      "path": "src/usage-card/usage.ts",
+      "declarations": [],
+      "exports": []
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/user-menu/UserMenu.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "The signed-in user's menu: a derived trigger showing an avatar, name and\ndescription that opens a panel repeating the identity above the\napplication's own entries.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-user-menu` on the host, then `__avatar`, `__identity`,\n`__name`, `__description`, `__content` and `__header`. `data-variant` sits on\nthe host while the derived trigger renders.",
+          "name": "SkdxUserMenu",
+          "slots": [
+            {
+              "description": "The application's own menu entries, rendered below the repeated identity header.",
+              "name": ""
+            },
+            {
+              "description": "Content that replaces the derived avatar-and-identity trigger entirely.",
+              "name": "trigger"
+            },
+            {
+              "description": "An extra indicator rendered after the identity in the trigger.",
+              "name": "status"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "description": "The signed-in user's name, rendered in the trigger and repeated in the menu header.",
+              "attribute": "name",
+              "required": true
+            },
+            {
+              "kind": "field",
+              "name": "description",
+              "type": {
+                "text": "string | undefined | undefined"
+              },
+              "description": "Secondary text such as an email or role, rendered below the name in the trigger and the header.",
+              "default": "undefined",
+              "attribute": "description"
+            },
+            {
+              "kind": "field",
+              "name": "avatarSrc",
+              "type": {
+                "text": "string | undefined | undefined"
+              },
+              "description": "Source of the identity image, passed straight through to the derived Avatar.",
+              "default": "undefined",
+              "attribute": "avatar-src"
+            },
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "'compact' | (string & {}) | undefined | undefined"
+              },
+              "description": "Visual rung written to `data-variant`; `'compact'` visually hides the identity text while keeping it as the accessible name.",
+              "default": "undefined",
+              "attribute": "variant"
+            },
+            {
+              "kind": "field",
+              "name": "open",
+              "type": {
+                "text": "boolean | undefined | undefined"
+              },
+              "description": "Whether the menu is open, for controlled usage paired with `open-change`.",
+              "default": "undefined",
+              "attribute": "open"
+            },
+            {
+              "kind": "field",
+              "name": "defaultOpen",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Whether the menu starts open, for uncontrolled usage.",
+              "attribute": "default-open"
+            },
+            {
+              "kind": "field",
+              "name": "side",
+              "type": {
+                "text": "'top' | 'right' | 'bottom' | 'left'"
+              },
+              "default": "'bottom'",
+              "description": "Which side of the trigger the menu panel opens on.",
+              "attribute": "side"
+            },
+            {
+              "kind": "field",
+              "name": "align",
+              "type": {
+                "text": "'start' | 'center' | 'end'"
+              },
+              "default": "'end'",
+              "description": "Alignment of the menu panel relative to the side it opens on.",
+              "attribute": "align"
+            }
+          ],
+          "events": [
+            {
+              "description": "Fires with the new open state whenever the trigger opens or closes the menu.",
+              "name": "open-change"
+            },
+            {
+              "description": "Fires with the new open state once the panel's enter or exit animation has settled.",
+              "name": "open-change-complete"
+            },
+            {
+              "description": "Fires when Escape is pressed while the menu is open; `preventDefault()` keeps it open.",
+              "name": "escape-key-down"
+            },
+            {
+              "description": "Fires on a pointer-down outside the panel while open; `preventDefault()` keeps it open.",
+              "name": "pointer-down-outside"
+            },
+            {
+              "description": "Fires when focus moves outside the panel while open; `preventDefault()` keeps it open.",
+              "name": "focus-outside"
+            },
+            {
+              "description": "Fires for either kind of outside interaction, just before the specific event.",
+              "name": "interact-outside"
+            },
+            {
+              "description": "Fires before focus returns to the trigger on close; `preventDefault()` suppresses that return.",
+              "name": "close-auto-focus"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "description": "The signed-in user's name, rendered in the trigger and repeated in the menu header.",
+              "fieldName": "name",
+              "required": true
+            },
+            {
+              "name": "description",
+              "type": {
+                "text": "string | undefined | undefined"
+              },
+              "description": "Secondary text such as an email or role, rendered below the name in the trigger and the header.",
+              "default": "undefined",
+              "fieldName": "description"
+            },
+            {
+              "name": "avatar-src",
+              "type": {
+                "text": "string | undefined | undefined"
+              },
+              "description": "Source of the identity image, passed straight through to the derived Avatar.",
+              "default": "undefined",
+              "fieldName": "avatarSrc"
+            },
+            {
+              "name": "variant",
+              "type": {
+                "text": "'compact' | (string & {}) | undefined | undefined"
+              },
+              "description": "Visual rung written to `data-variant`; `'compact'` visually hides the identity text while keeping it as the accessible name.",
+              "default": "undefined",
+              "fieldName": "variant"
+            },
+            {
+              "name": "open",
+              "type": {
+                "text": "boolean | undefined | undefined"
+              },
+              "description": "Whether the menu is open, for controlled usage paired with `open-change`.",
+              "default": "undefined",
+              "fieldName": "open"
+            },
+            {
+              "name": "default-open",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Whether the menu starts open, for uncontrolled usage.",
+              "fieldName": "defaultOpen"
+            },
+            {
+              "name": "side",
+              "type": {
+                "text": "'top' | 'right' | 'bottom' | 'left'"
+              },
+              "default": "'bottom'",
+              "description": "Which side of the trigger the menu panel opens on.",
+              "fieldName": "side"
+            },
+            {
+              "name": "align",
+              "type": {
+                "text": "'start' | 'center' | 'end'"
+              },
+              "default": "'end'",
+              "description": "Alignment of the menu panel relative to the side it opens on.",
+              "fieldName": "align"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "skdx-user-menu",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SkdxUserMenu",
+          "declaration": {
+            "name": "SkdxUserMenu",
+            "module": "src/user-menu/UserMenu.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "skdx-user-menu",
+          "declaration": {
+            "name": "SkdxUserMenu",
+            "module": "src/user-menu/UserMenu.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/user-menu/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SkdxUserMenu",
+          "declaration": {
+            "name": "SkdxUserMenu",
+            "module": "./UserMenu"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/verification-page/VerificationPage.ts",
@@ -5222,256 +5168,6 @@
           }
         }
       ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/user-menu/UserMenu.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "The signed-in user's menu: a derived trigger showing an avatar, name and\ndescription that opens a panel repeating the identity above the\napplication's own entries.\n\nRenders light DOM, so its parts are classes rather than shadow `::part()`\ntargets: `.skdx-user-menu` on the host, then `__avatar`, `__identity`,\n`__name`, `__description`, `__content` and `__header`. `data-variant` sits on\nthe host while the derived trigger renders.",
-          "name": "SkdxUserMenu",
-          "slots": [
-            {
-              "description": "The application's own menu entries, rendered below the repeated identity header.",
-              "name": ""
-            },
-            {
-              "description": "Content that replaces the derived avatar-and-identity trigger entirely.",
-              "name": "trigger"
-            },
-            {
-              "description": "An extra indicator rendered after the identity in the trigger.",
-              "name": "status"
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "name",
-              "type": {
-                "text": "string"
-              },
-              "description": "The signed-in user's name, rendered in the trigger and repeated in the menu header.",
-              "attribute": "name",
-              "required": true
-            },
-            {
-              "kind": "field",
-              "name": "description",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Secondary text such as an email or role, rendered below the name in the trigger and the header.",
-              "default": "undefined",
-              "attribute": "description"
-            },
-            {
-              "kind": "field",
-              "name": "avatarSrc",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Source of the identity image, passed straight through to the derived Avatar.",
-              "default": "undefined",
-              "attribute": "avatar-src"
-            },
-            {
-              "kind": "field",
-              "name": "variant",
-              "type": {
-                "text": "'compact' | (string & {}) | undefined | undefined"
-              },
-              "description": "Visual rung written to `data-variant`; `'compact'` visually hides the identity text while keeping it as the accessible name.",
-              "default": "undefined",
-              "attribute": "variant"
-            },
-            {
-              "kind": "field",
-              "name": "open",
-              "type": {
-                "text": "boolean | undefined | undefined"
-              },
-              "description": "Whether the menu is open, for controlled usage paired with `open-change`.",
-              "default": "undefined",
-              "attribute": "open"
-            },
-            {
-              "kind": "field",
-              "name": "defaultOpen",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Whether the menu starts open, for uncontrolled usage.",
-              "attribute": "default-open"
-            },
-            {
-              "kind": "field",
-              "name": "side",
-              "type": {
-                "text": "'top' | 'right' | 'bottom' | 'left'"
-              },
-              "default": "'bottom'",
-              "description": "Which side of the trigger the menu panel opens on.",
-              "attribute": "side"
-            },
-            {
-              "kind": "field",
-              "name": "align",
-              "type": {
-                "text": "'start' | 'center' | 'end'"
-              },
-              "default": "'end'",
-              "description": "Alignment of the menu panel relative to the side it opens on.",
-              "attribute": "align"
-            }
-          ],
-          "events": [
-            {
-              "description": "Fires with the new open state whenever the trigger opens or closes the menu.",
-              "name": "open-change"
-            },
-            {
-              "description": "Fires with the new open state once the panel's enter or exit animation has settled.",
-              "name": "open-change-complete"
-            },
-            {
-              "description": "Fires when Escape is pressed while the menu is open; `preventDefault()` keeps it open.",
-              "name": "escape-key-down"
-            },
-            {
-              "description": "Fires on a pointer-down outside the panel while open; `preventDefault()` keeps it open.",
-              "name": "pointer-down-outside"
-            },
-            {
-              "description": "Fires when focus moves outside the panel while open; `preventDefault()` keeps it open.",
-              "name": "focus-outside"
-            },
-            {
-              "description": "Fires for either kind of outside interaction, just before the specific event.",
-              "name": "interact-outside"
-            },
-            {
-              "description": "Fires before focus returns to the trigger on close; `preventDefault()` suppresses that return.",
-              "name": "close-auto-focus"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "name",
-              "type": {
-                "text": "string"
-              },
-              "description": "The signed-in user's name, rendered in the trigger and repeated in the menu header.",
-              "fieldName": "name",
-              "required": true
-            },
-            {
-              "name": "description",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Secondary text such as an email or role, rendered below the name in the trigger and the header.",
-              "default": "undefined",
-              "fieldName": "description"
-            },
-            {
-              "name": "avatar-src",
-              "type": {
-                "text": "string | undefined | undefined"
-              },
-              "description": "Source of the identity image, passed straight through to the derived Avatar.",
-              "default": "undefined",
-              "fieldName": "avatarSrc"
-            },
-            {
-              "name": "variant",
-              "type": {
-                "text": "'compact' | (string & {}) | undefined | undefined"
-              },
-              "description": "Visual rung written to `data-variant`; `'compact'` visually hides the identity text while keeping it as the accessible name.",
-              "default": "undefined",
-              "fieldName": "variant"
-            },
-            {
-              "name": "open",
-              "type": {
-                "text": "boolean | undefined | undefined"
-              },
-              "description": "Whether the menu is open, for controlled usage paired with `open-change`.",
-              "default": "undefined",
-              "fieldName": "open"
-            },
-            {
-              "name": "default-open",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Whether the menu starts open, for uncontrolled usage.",
-              "fieldName": "defaultOpen"
-            },
-            {
-              "name": "side",
-              "type": {
-                "text": "'top' | 'right' | 'bottom' | 'left'"
-              },
-              "default": "'bottom'",
-              "description": "Which side of the trigger the menu panel opens on.",
-              "fieldName": "side"
-            },
-            {
-              "name": "align",
-              "type": {
-                "text": "'start' | 'center' | 'end'"
-              },
-              "default": "'end'",
-              "description": "Alignment of the menu panel relative to the side it opens on.",
-              "fieldName": "align"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "skdx-user-menu",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkdxUserMenu",
-          "declaration": {
-            "name": "SkdxUserMenu",
-            "module": "src/user-menu/UserMenu.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "skdx-user-menu",
-          "declaration": {
-            "name": "SkdxUserMenu",
-            "module": "src/user-menu/UserMenu.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/user-menu/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkdxUserMenu",
-          "declaration": {
-            "name": "SkdxUserMenu",
-            "module": "./UserMenu"
-          }
-        }
-      ]
     }
   ]
 }