@ds-mo/ui 6.0.0 → 7.0.0

package/dist/docs/components.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2026-07-14T00:06:04",
+  "timestamp": "2026-07-15T18:43:58",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.43.5",
@@ -416,11 +416,11 @@
       "parts": [],
       "states": [],
       "dependents": [
+        "ds-bar-nav",
         "ds-button-unfilled",
         "ds-menu",
         "ds-panel-nav",
-        "ds-tab-group",
-        "ds-tab-group-nav"
+        "ds-tab-group"
       ],
       "dependencies": [
         "ds-text"
@@ -429,6 +429,9 @@
         "ds-badge": [
           "ds-text"
         ],
+        "ds-bar-nav": [
+          "ds-badge"
+        ],
         "ds-button-unfilled": [
           "ds-badge"
         ],
@@ -440,9 +443,6 @@
         ],
         "ds-tab-group": [
           "ds-badge"
-        ],
-        "ds-tab-group-nav": [
-          "ds-badge"
         ]
       }
     },
@@ -1028,26 +1028,23 @@
       "states": [],
       "dependents": [],
       "dependencies": [
-        "ds-tab-group-nav",
         "ds-text",
+        "ds-badge",
         "ds-button-unfilled",
         "ds-menu"
       ],
       "dependencyGraph": {
         "ds-bar-nav": [
-          "ds-tab-group-nav",
           "ds-text",
+          "ds-badge",
           "ds-button-unfilled",
           "ds-menu"
         ],
-        "ds-tab-group-nav": [
-          "ds-text",
-          "ds-badge"
-        ],
         "ds-badge": [
           "ds-text"
         ],
         "ds-button-unfilled": [
+          "ds-loader",
           "ds-icon",
           "ds-badge",
           "ds-text"
@@ -1277,6 +1274,35 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "isLoading",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "is-loading",
+          "reflectToAttr": false,
+          "docs": "Shows an inline loader and prevents interaction without applying inactive opacity.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "false"
+            }
+          ],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "label",
           "type": "string",
@@ -1527,11 +1553,13 @@
         "ds-card-setting"
       ],
       "dependencies": [
+        "ds-loader",
         "ds-icon",
         "ds-text"
       ],
       "dependencyGraph": {
         "ds-button-filled": [
+          "ds-loader",
           "ds-icon",
           "ds-text"
         ],
@@ -1611,10 +1639,10 @@
         },
         {
           "name": "background",
-          "type": "\"always-dark\" | \"navigation\" | undefined",
+          "type": "\"always-dark\" | \"bold\" | \"faint\" | \"inverted\" | \"media\" | \"medium\" | \"strong\" | \"translucent\" | undefined",
           "complexType": {
             "original": "ButtonUnfilledBackground | undefined",
-            "resolved": "\"always-dark\" | \"navigation\" | undefined",
+            "resolved": "\"always-dark\" | \"bold\" | \"faint\" | \"inverted\" | \"media\" | \"medium\" | \"strong\" | \"translucent\" | undefined",
             "references": {
               "ButtonUnfilledBackground": {
                 "location": "local",
@@ -1626,7 +1654,7 @@
           "mutable": false,
           "attr": "background",
           "reflectToAttr": false,
-          "docs": "Parent surface context for navigation and always-dark chrome.",
+          "docs": "Actual parent surface context. Omit on primary and secondary surfaces.",
           "docsTags": [],
           "values": [
             {
@@ -1634,44 +1662,19 @@
               "type": "string"
             },
             {
-              "value": "navigation",
+              "value": "bold",
               "type": "string"
             },
             {
-              "type": "undefined"
-            }
-          ],
-          "optional": false,
-          "required": false,
-          "getter": false,
-          "setter": false
-        },
-        {
-          "name": "backgroundContrast",
-          "type": "\"bold\" | \"default\" | \"medium\" | \"strong\" | undefined",
-          "complexType": {
-            "original": "ButtonUnfilledOnBackgroundContrast",
-            "resolved": "\"bold\" | \"default\" | \"medium\" | \"strong\" | undefined",
-            "references": {
-              "ButtonUnfilledOnBackgroundContrast": {
-                "location": "local",
-                "path": "/home/runner/work/compomo/compomo/src/wc/components/ButtonUnfilled/ButtonUnfilled.tsx",
-                "id": "src/wc/components/ButtonUnfilled/ButtonUnfilled.tsx::ButtonUnfilledOnBackgroundContrast"
-              }
-            }
-          },
-          "mutable": false,
-          "attr": "on-background-contrast",
-          "reflectToAttr": false,
-          "docs": "Foreground and interaction tokens when the button sits on a contrasting parent\nbackground (default, medium, bold, or strong).",
-          "docsTags": [],
-          "values": [
+              "value": "faint",
+              "type": "string"
+            },
             {
-              "value": "bold",
+              "value": "inverted",
               "type": "string"
             },
             {
-              "value": "default",
+              "value": "media",
               "type": "string"
             },
             {
@@ -1682,11 +1685,15 @@
               "value": "strong",
               "type": "string"
             },
+            {
+              "value": "translucent",
+              "type": "string"
+            },
             {
               "type": "undefined"
             }
           ],
-          "optional": true,
+          "optional": false,
           "required": false,
           "getter": false,
           "setter": false
@@ -1940,6 +1947,35 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "isLoading",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "is-loading",
+          "reflectToAttr": false,
+          "docs": "Shows an inline loader and prevents interaction without applying inactive opacity.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "false"
+            }
+          ],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "label",
           "type": "string",
@@ -2234,12 +2270,14 @@
         "ds-panel-tools"
       ],
       "dependencies": [
+        "ds-loader",
         "ds-icon",
         "ds-badge",
         "ds-text"
       ],
       "dependencyGraph": {
         "ds-button-unfilled": [
+          "ds-loader",
           "ds-icon",
           "ds-badge",
           "ds-text"
@@ -2547,6 +2585,7 @@
           "ds-text"
         ],
         "ds-button-unfilled": [
+          "ds-loader",
           "ds-icon",
           "ds-badge",
           "ds-text"
@@ -2786,6 +2825,7 @@
           "ds-text"
         ],
         "ds-button-unfilled": [
+          "ds-loader",
           "ds-icon",
           "ds-badge",
           "ds-text"
@@ -2794,6 +2834,7 @@
           "ds-text"
         ],
         "ds-button-filled": [
+          "ds-loader",
           "ds-icon",
           "ds-text"
         ]
@@ -3953,55 +3994,6 @@
       "docsTags": [],
       "usage": {},
       "props": [
-        {
-          "name": "background",
-          "type": "\"always-dark\" | \"bold\" | \"faint\" | \"medium\" | \"strong\" | undefined",
-          "complexType": {
-            "original": "ChipBackground | undefined",
-            "resolved": "\"always-dark\" | \"bold\" | \"faint\" | \"medium\" | \"strong\" | undefined",
-            "references": {
-              "ChipBackground": {
-                "location": "local",
-                "path": "/home/runner/work/compomo/compomo/src/wc/components/Chip/Chip.tsx",
-                "id": "src/wc/components/Chip/Chip.tsx::ChipBackground"
-              }
-            }
-          },
-          "mutable": false,
-          "attr": "background",
-          "reflectToAttr": false,
-          "docs": "Surface context for interaction-fill tokens when the chip sits on a non-default surface.",
-          "docsTags": [],
-          "values": [
-            {
-              "value": "always-dark",
-              "type": "string"
-            },
-            {
-              "value": "bold",
-              "type": "string"
-            },
-            {
-              "value": "faint",
-              "type": "string"
-            },
-            {
-              "value": "medium",
-              "type": "string"
-            },
-            {
-              "value": "strong",
-              "type": "string"
-            },
-            {
-              "type": "undefined"
-            }
-          ],
-          "optional": false,
-          "required": false,
-          "getter": false,
-          "setter": false
-        },
         {
           "name": "isInactive",
           "type": "boolean",
@@ -4083,35 +4075,6 @@
           "getter": false,
           "setter": false
         },
-        {
-          "name": "removable",
-          "type": "boolean",
-          "complexType": {
-            "original": "boolean",
-            "resolved": "boolean",
-            "references": {}
-          },
-          "mutable": false,
-          "attr": "removable",
-          "reflectToAttr": false,
-          "docs": "When true (default), shows the trailing dismiss control.",
-          "docsTags": [
-            {
-              "name": "default",
-              "text": "true"
-            }
-          ],
-          "default": "true",
-          "values": [
-            {
-              "type": "boolean"
-            }
-          ],
-          "optional": false,
-          "required": false,
-          "getter": false,
-          "setter": false
-        },
         {
           "name": "removeLabel",
           "type": "string",
@@ -5198,7 +5161,8 @@
         "ds-button-unfilled",
         "ds-chip",
         "ds-panel-nav",
-        "ds-select"
+        "ds-select",
+        "ds-tab-group"
       ],
       "dependencies": [],
       "dependencyGraph": {
@@ -5216,6 +5180,9 @@
         ],
         "ds-select": [
           "ds-icon"
+        ],
+        "ds-tab-group": [
+          "ds-icon"
         ]
       }
     },
@@ -6079,9 +6046,19 @@
       "slots": [],
       "parts": [],
       "states": [],
-      "dependents": [],
+      "dependents": [
+        "ds-button-filled",
+        "ds-button-unfilled"
+      ],
       "dependencies": [],
-      "dependencyGraph": {}
+      "dependencyGraph": {
+        "ds-button-filled": [
+          "ds-loader"
+        ],
+        "ds-button-unfilled": [
+          "ds-loader"
+        ]
+      }
     },
     {
       "filePath": "src/wc/components/Menu/Menu.tsx",
@@ -7735,6 +7712,7 @@
           "ds-text"
         ],
         "ds-button-unfilled": [
+          "ds-loader",
           "ds-icon",
           "ds-badge",
           "ds-text"
@@ -7745,65 +7723,37 @@
       }
     },
     {
-      "filePath": "src/wc/components/PanelTools/PanelTools.tsx",
+      "filePath": "src/wc/components/PanelSubNav/PanelSubNav.tsx",
       "encapsulation": "scoped",
-      "tag": "ds-panel-tools",
+      "tag": "ds-panel-sub-nav",
       "docs": "",
       "docsTags": [],
       "usage": {},
       "props": [
         {
-          "name": "activeTool",
-          "type": "\"\" | \"activity\" | \"agents\" | \"help\" | \"messages\" | \"search\" | \"stacks\"",
+          "name": "ariaLabel",
+          "type": "null | string",
           "complexType": {
-            "original": "PanelToolsToolId | ''",
-            "resolved": "\"\" | \"activity\" | \"agents\" | \"help\" | \"messages\" | \"search\" | \"stacks\"",
-            "references": {
-              "PanelToolsToolId": {
-                "location": "import",
-                "path": "./panel-tools-types",
-                "id": "src/wc/components/PanelTools/panel-tools-types.ts::PanelToolsToolId",
-                "referenceLocation": "PanelToolsToolId"
-              }
-            }
+            "original": "string | null",
+            "resolved": "null | string",
+            "references": {}
           },
-          "mutable": true,
-          "attr": "active-tool",
-          "reflectToAttr": true,
-          "docs": "Active tool view — `search`, `agents`, `messages`, `stacks`, `activity`, or `help`.",
+          "mutable": false,
+          "attr": "aria-label",
+          "reflectToAttr": false,
+          "docs": "",
           "docsTags": [
             {
               "name": "default",
-              "text": "''"
+              "text": "null"
             }
           ],
-          "default": "''",
+          "default": "null",
           "values": [
             {
-              "type": "\"\""
-            },
-            {
-              "value": "activity",
-              "type": "string"
-            },
-            {
-              "value": "agents",
-              "type": "string"
-            },
-            {
-              "value": "help",
-              "type": "string"
-            },
-            {
-              "value": "messages",
-              "type": "string"
-            },
-            {
-              "value": "search",
-              "type": "string"
+              "type": "null"
             },
             {
-              "value": "stacks",
               "type": "string"
             }
           ],
@@ -7813,19 +7763,277 @@
           "setter": false
         },
         {
-          "name": "items",
-          "type": "PanelToolsItem[]",
+          "name": "ariaLabelledby",
+          "type": "string | undefined",
           "complexType": {
-            "original": "PanelToolsItem[]",
-            "resolved": "PanelToolsItem[]",
-            "references": {
-              "PanelToolsItem": {
-                "location": "import",
-                "path": "./panel-tools-types",
-                "id": "src/wc/components/PanelTools/panel-tools-types.ts::PanelToolsItem",
-                "referenceLocation": "PanelToolsItem"
-              }
-            }
+            "original": "string | undefined",
+            "resolved": "string | undefined",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "aria-labelledby",
+          "reflectToAttr": false,
+          "docs": "",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            },
+            {
+              "type": "undefined"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "background",
+          "type": "\"always-dark\" | \"bold\" | \"faint\" | \"inverted\" | \"media\" | \"medium\" | \"strong\" | \"translucent\" | undefined",
+          "complexType": {
+            "original": "PanelSubNavBackground | undefined",
+            "resolved": "\"always-dark\" | \"bold\" | \"faint\" | \"inverted\" | \"media\" | \"medium\" | \"strong\" | \"translucent\" | undefined",
+            "references": {
+              "PanelSubNavBackground": {
+                "location": "local",
+                "path": "/home/runner/work/compomo/compomo/src/wc/components/PanelSubNav/PanelSubNav.tsx",
+                "id": "src/wc/components/PanelSubNav/PanelSubNav.tsx::PanelSubNavBackground"
+              }
+            }
+          },
+          "mutable": false,
+          "attr": "background",
+          "reflectToAttr": false,
+          "docs": "Actual parent surface context. Omit on primary and secondary surfaces.",
+          "docsTags": [],
+          "values": [
+            {
+              "value": "always-dark",
+              "type": "string"
+            },
+            {
+              "value": "bold",
+              "type": "string"
+            },
+            {
+              "value": "faint",
+              "type": "string"
+            },
+            {
+              "value": "inverted",
+              "type": "string"
+            },
+            {
+              "value": "media",
+              "type": "string"
+            },
+            {
+              "value": "medium",
+              "type": "string"
+            },
+            {
+              "value": "strong",
+              "type": "string"
+            },
+            {
+              "value": "translucent",
+              "type": "string"
+            },
+            {
+              "type": "undefined"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "items",
+          "type": "PanelSubNavItem[]",
+          "complexType": {
+            "original": "PanelSubNavItem[]",
+            "resolved": "PanelSubNavItem[]",
+            "references": {
+              "PanelSubNavItem": {
+                "location": "import",
+                "path": "./panel-sub-nav-types",
+                "id": "src/wc/components/PanelSubNav/panel-sub-nav-types.ts::PanelSubNavItem",
+                "referenceLocation": "PanelSubNavItem"
+              }
+            }
+          },
+          "mutable": false,
+          "reflectToAttr": false,
+          "docs": "Local panel tabs. Assign this array through the JavaScript property.\nReplace the array reference when items change.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "[]"
+            }
+          ],
+          "default": "[]",
+          "values": [
+            {
+              "type": "PanelSubNavItem[]"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "value",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": true,
+          "attr": "value",
+          "reflectToAttr": false,
+          "docs": "Required selected item id when enabled items exist. Keep synchronized with the visible panel.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "''"
+            }
+          ],
+          "default": "''",
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        }
+      ],
+      "methods": [],
+      "events": [
+        {
+          "event": "dsChange",
+          "detail": "string",
+          "bubbles": true,
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "cancelable": true,
+          "composed": true,
+          "docs": "",
+          "docsTags": []
+        }
+      ],
+      "listeners": [
+        {
+          "event": "keydown",
+          "capture": false,
+          "passive": false
+        }
+      ],
+      "styles": [],
+      "slots": [],
+      "parts": [],
+      "states": [],
+      "dependents": [],
+      "dependencies": [
+        "ds-text"
+      ],
+      "dependencyGraph": {
+        "ds-panel-sub-nav": [
+          "ds-text"
+        ]
+      }
+    },
+    {
+      "filePath": "src/wc/components/PanelTools/PanelTools.tsx",
+      "encapsulation": "scoped",
+      "tag": "ds-panel-tools",
+      "docs": "",
+      "docsTags": [],
+      "usage": {},
+      "props": [
+        {
+          "name": "activeTool",
+          "type": "\"\" | \"activity\" | \"agents\" | \"help\" | \"messages\" | \"search\" | \"stacks\"",
+          "complexType": {
+            "original": "PanelToolsToolId | ''",
+            "resolved": "\"\" | \"activity\" | \"agents\" | \"help\" | \"messages\" | \"search\" | \"stacks\"",
+            "references": {
+              "PanelToolsToolId": {
+                "location": "import",
+                "path": "./panel-tools-types",
+                "id": "src/wc/components/PanelTools/panel-tools-types.ts::PanelToolsToolId",
+                "referenceLocation": "PanelToolsToolId"
+              }
+            }
+          },
+          "mutable": true,
+          "attr": "active-tool",
+          "reflectToAttr": true,
+          "docs": "Active tool view — `search`, `agents`, `messages`, `stacks`, `activity`, or `help`.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "''"
+            }
+          ],
+          "default": "''",
+          "values": [
+            {
+              "type": "\"\""
+            },
+            {
+              "value": "activity",
+              "type": "string"
+            },
+            {
+              "value": "agents",
+              "type": "string"
+            },
+            {
+              "value": "help",
+              "type": "string"
+            },
+            {
+              "value": "messages",
+              "type": "string"
+            },
+            {
+              "value": "search",
+              "type": "string"
+            },
+            {
+              "value": "stacks",
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "items",
+          "type": "PanelToolsItem[]",
+          "complexType": {
+            "original": "PanelToolsItem[]",
+            "resolved": "PanelToolsItem[]",
+            "references": {
+              "PanelToolsItem": {
+                "location": "import",
+                "path": "./panel-tools-types",
+                "id": "src/wc/components/PanelTools/panel-tools-types.ts::PanelToolsItem",
+                "referenceLocation": "PanelToolsItem"
+              }
+            }
           },
           "mutable": false,
           "reflectToAttr": false,
@@ -8143,6 +8351,7 @@
           "ds-text"
         ],
         "ds-button-unfilled": [
+          "ds-loader",
           "ds-icon",
           "ds-badge",
           "ds-text"
@@ -10447,10 +10656,10 @@
         },
         {
           "name": "background",
-          "type": "\"always-dark\" | \"bold\" | \"faint\" | \"medium\" | \"strong\" | undefined",
+          "type": "\"always-dark\" | \"bold\" | \"faint\" | \"inverted\" | \"media\" | \"medium\" | \"strong\" | \"translucent\" | undefined",
           "complexType": {
             "original": "TabBackground | undefined",
-            "resolved": "\"always-dark\" | \"bold\" | \"faint\" | \"medium\" | \"strong\" | undefined",
+            "resolved": "\"always-dark\" | \"bold\" | \"faint\" | \"inverted\" | \"media\" | \"medium\" | \"strong\" | \"translucent\" | undefined",
             "references": {
               "TabBackground": {
                 "location": "local",
@@ -10477,6 +10686,14 @@
               "value": "faint",
               "type": "string"
             },
+            {
+              "value": "inverted",
+              "type": "string"
+            },
+            {
+              "value": "media",
+              "type": "string"
+            },
             {
               "value": "medium",
               "type": "string"
@@ -10485,6 +10702,10 @@
               "value": "strong",
               "type": "string"
             },
+            {
+              "value": "translucent",
+              "type": "string"
+            },
             {
               "type": "undefined"
             }
@@ -10494,52 +10715,18 @@
           "getter": false,
           "setter": false
         },
-        {
-          "name": "orientation",
-          "type": "\"horizontal\" | \"vertical\"",
-          "complexType": {
-            "original": "'horizontal' | 'vertical'",
-            "resolved": "\"horizontal\" | \"vertical\"",
-            "references": {}
-          },
-          "mutable": false,
-          "attr": "orientation",
-          "reflectToAttr": false,
-          "docs": "",
-          "docsTags": [
-            {
-              "name": "default",
-              "text": "'horizontal'"
-            }
-          ],
-          "default": "'horizontal'",
-          "values": [
-            {
-              "value": "horizontal",
-              "type": "string"
-            },
-            {
-              "value": "vertical",
-              "type": "string"
-            }
-          ],
-          "optional": false,
-          "required": false,
-          "getter": false,
-          "setter": false
-        },
         {
           "name": "tabs",
-          "type": "TabItem[]",
+          "type": "TabGroupItem[]",
           "complexType": {
-            "original": "TabItem[]",
-            "resolved": "TabItem[]",
+            "original": "TabGroupItem[]",
+            "resolved": "TabGroupItem[]",
             "references": {
-              "TabItem": {
+              "TabGroupItem": {
                 "location": "import",
                 "path": "./tab-item-utils",
-                "id": "src/wc/components/TabGroup/tab-item-utils.ts::TabItem",
-                "referenceLocation": "TabItem"
+                "id": "src/wc/components/TabGroup/tab-item-utils.ts::TabGroupItem",
+                "referenceLocation": "TabGroupItem"
               }
             }
           },
@@ -10555,7 +10742,7 @@
           "default": "[]",
           "values": [
             {
-              "type": "TabItem[]"
+              "type": "TabGroupItem[]"
             }
           ],
           "optional": false,
@@ -10623,11 +10810,13 @@
       "states": [],
       "dependents": [],
       "dependencies": [
+        "ds-icon",
         "ds-text",
         "ds-badge"
       ],
       "dependencyGraph": {
         "ds-tab-group": [
+          "ds-icon",
           "ds-text",
           "ds-badge"
         ],
@@ -10636,427 +10825,6 @@
         ]
       }
     },
-    {
-      "filePath": "src/wc/components/TabGroupNav/TabGroupNav.tsx",
-      "encapsulation": "scoped",
-      "tag": "ds-tab-group-nav",
-      "docs": "",
-      "docsTags": [],
-      "usage": {},
-      "props": [
-        {
-          "name": "ariaLabel",
-          "type": "null | string",
-          "complexType": {
-            "original": "string | null",
-            "resolved": "null | string",
-            "references": {}
-          },
-          "mutable": false,
-          "attr": "aria-label",
-          "reflectToAttr": false,
-          "docs": "",
-          "docsTags": [
-            {
-              "name": "default",
-              "text": "null"
-            }
-          ],
-          "default": "null",
-          "values": [
-            {
-              "type": "null"
-            },
-            {
-              "type": "string"
-            }
-          ],
-          "optional": false,
-          "required": false,
-          "getter": false,
-          "setter": false
-        },
-        {
-          "name": "ariaLabelledby",
-          "type": "string | undefined",
-          "complexType": {
-            "original": "string | undefined",
-            "resolved": "string | undefined",
-            "references": {}
-          },
-          "mutable": false,
-          "attr": "aria-labelledby",
-          "reflectToAttr": false,
-          "docs": "",
-          "docsTags": [],
-          "values": [
-            {
-              "type": "string"
-            },
-            {
-              "type": "undefined"
-            }
-          ],
-          "optional": false,
-          "required": false,
-          "getter": false,
-          "setter": false
-        },
-        {
-          "name": "background",
-          "type": "\"always-dark\" | \"bold\" | \"faint\" | \"medium\" | \"navigation\" | \"strong\" | undefined",
-          "complexType": {
-            "original": "TabGroupNavBackground | undefined",
-            "resolved": "\"always-dark\" | \"bold\" | \"faint\" | \"medium\" | \"navigation\" | \"strong\" | undefined",
-            "references": {
-              "TabGroupNavBackground": {
-                "location": "local",
-                "path": "/home/runner/work/compomo/compomo/src/wc/components/TabGroupNav/TabGroupNav.tsx",
-                "id": "src/wc/components/TabGroupNav/TabGroupNav.tsx::TabGroupNavBackground"
-              }
-            }
-          },
-          "mutable": false,
-          "attr": "background",
-          "reflectToAttr": false,
-          "docs": "",
-          "docsTags": [],
-          "values": [
-            {
-              "value": "always-dark",
-              "type": "string"
-            },
-            {
-              "value": "bold",
-              "type": "string"
-            },
-            {
-              "value": "faint",
-              "type": "string"
-            },
-            {
-              "value": "medium",
-              "type": "string"
-            },
-            {
-              "value": "navigation",
-              "type": "string"
-            },
-            {
-              "value": "strong",
-              "type": "string"
-            },
-            {
-              "type": "undefined"
-            }
-          ],
-          "optional": false,
-          "required": false,
-          "getter": false,
-          "setter": false
-        },
-        {
-          "name": "orientation",
-          "type": "\"horizontal\" | \"vertical\"",
-          "complexType": {
-            "original": "'horizontal' | 'vertical'",
-            "resolved": "\"horizontal\" | \"vertical\"",
-            "references": {}
-          },
-          "mutable": false,
-          "attr": "orientation",
-          "reflectToAttr": false,
-          "docs": "",
-          "docsTags": [
-            {
-              "name": "default",
-              "text": "'horizontal'"
-            }
-          ],
-          "default": "'horizontal'",
-          "values": [
-            {
-              "value": "horizontal",
-              "type": "string"
-            },
-            {
-              "value": "vertical",
-              "type": "string"
-            }
-          ],
-          "optional": false,
-          "required": false,
-          "getter": false,
-          "setter": false
-        },
-        {
-          "name": "rovingEnabled",
-          "type": "boolean",
-          "complexType": {
-            "original": "boolean",
-            "resolved": "boolean",
-            "references": {}
-          },
-          "mutable": false,
-          "attr": "roving-enabled",
-          "reflectToAttr": false,
-          "docs": "When `false`, every tab uses `tabindex=\"-1\"` (another chrome control owns the tab stop).",
-          "docsTags": [
-            {
-              "name": "default",
-              "text": "true"
-            }
-          ],
-          "default": "true",
-          "values": [
-            {
-              "type": "boolean"
-            }
-          ],
-          "optional": false,
-          "required": false,
-          "getter": false,
-          "setter": false
-        },
-        {
-          "name": "selectionFollowsFocus",
-          "type": "boolean",
-          "complexType": {
-            "original": "boolean",
-            "resolved": "boolean",
-            "references": {}
-          },
-          "mutable": false,
-          "attr": "selection-follows-focus",
-          "reflectToAttr": false,
-          "docs": "When `false`, arrow keys move focus only — Space/Enter (or click) commits selection.\nUsed by bar nav where each tab is a full page transition.",
-          "docsTags": [
-            {
-              "name": "default",
-              "text": "true"
-            }
-          ],
-          "default": "true",
-          "values": [
-            {
-              "type": "boolean"
-            }
-          ],
-          "optional": false,
-          "required": false,
-          "getter": false,
-          "setter": false
-        },
-        {
-          "name": "tabs",
-          "type": "TabItem[]",
-          "complexType": {
-            "original": "TabItem[]",
-            "resolved": "TabItem[]",
-            "references": {
-              "TabItem": {
-                "location": "import",
-                "path": "../TabGroup/tab-item-utils",
-                "id": "src/wc/components/TabGroup/tab-item-utils.ts::TabItem",
-                "referenceLocation": "TabItem"
-              }
-            }
-          },
-          "mutable": false,
-          "reflectToAttr": false,
-          "docs": "",
-          "docsTags": [
-            {
-              "name": "default",
-              "text": "[]"
-            }
-          ],
-          "default": "[]",
-          "values": [
-            {
-              "type": "TabItem[]"
-            }
-          ],
-          "optional": false,
-          "required": false,
-          "getter": false,
-          "setter": false
-        },
-        {
-          "name": "value",
-          "type": "string",
-          "complexType": {
-            "original": "string",
-            "resolved": "string",
-            "references": {}
-          },
-          "mutable": true,
-          "attr": "value",
-          "reflectToAttr": false,
-          "docs": "",
-          "docsTags": [
-            {
-              "name": "default",
-              "text": "''"
-            }
-          ],
-          "default": "''",
-          "values": [
-            {
-              "type": "string"
-            }
-          ],
-          "optional": false,
-          "required": false,
-          "getter": false,
-          "setter": false
-        }
-      ],
-      "methods": [
-        {
-          "name": "focusFirstTab",
-          "returns": {
-            "type": "Promise<void>",
-            "docs": ""
-          },
-          "complexType": {
-            "signature": "() => Promise<void>",
-            "parameters": [],
-            "references": {
-              "Promise": {
-                "location": "global",
-                "id": "global::Promise"
-              }
-            },
-            "return": "Promise<void>"
-          },
-          "signature": "focusFirstTab() => Promise<void>",
-          "parameters": [],
-          "docs": "",
-          "docsTags": []
-        },
-        {
-          "name": "focusLastTab",
-          "returns": {
-            "type": "Promise<void>",
-            "docs": ""
-          },
-          "complexType": {
-            "signature": "() => Promise<void>",
-            "parameters": [],
-            "references": {
-              "Promise": {
-                "location": "global",
-                "id": "global::Promise"
-              }
-            },
-            "return": "Promise<void>"
-          },
-          "signature": "focusLastTab() => Promise<void>",
-          "parameters": [],
-          "docs": "",
-          "docsTags": []
-        },
-        {
-          "name": "focusTab",
-          "returns": {
-            "type": "Promise<void>",
-            "docs": ""
-          },
-          "complexType": {
-            "signature": "(id: string) => Promise<void>",
-            "parameters": [
-              {
-                "name": "id",
-                "type": "string",
-                "docs": ""
-              }
-            ],
-            "references": {
-              "Promise": {
-                "location": "global",
-                "id": "global::Promise"
-              },
-              "HTMLElement": {
-                "location": "global",
-                "id": "global::HTMLElement"
-              }
-            },
-            "return": "Promise<void>"
-          },
-          "signature": "focusTab(id: string) => Promise<void>",
-          "parameters": [
-            {
-              "name": "id",
-              "type": "string",
-              "docs": ""
-            }
-          ],
-          "docs": "",
-          "docsTags": []
-        }
-      ],
-      "events": [
-        {
-          "event": "dsChange",
-          "detail": "string",
-          "bubbles": true,
-          "complexType": {
-            "original": "string",
-            "resolved": "string",
-            "references": {}
-          },
-          "cancelable": true,
-          "composed": true,
-          "docs": "",
-          "docsTags": []
-        },
-        {
-          "event": "dsRovingExit",
-          "detail": "\"end\" | \"start\"",
-          "bubbles": true,
-          "complexType": {
-            "original": "'start' | 'end'",
-            "resolved": "\"end\" | \"start\"",
-            "references": {}
-          },
-          "cancelable": true,
-          "composed": true,
-          "docs": "Fired when arrow navigation reaches the first/last tab in manual selection mode.",
-          "docsTags": []
-        }
-      ],
-      "listeners": [
-        {
-          "event": "keydown",
-          "capture": false,
-          "passive": false
-        }
-      ],
-      "styles": [],
-      "slots": [],
-      "parts": [],
-      "states": [],
-      "dependents": [
-        "ds-bar-nav"
-      ],
-      "dependencies": [
-        "ds-text",
-        "ds-badge"
-      ],
-      "dependencyGraph": {
-        "ds-tab-group-nav": [
-          "ds-text",
-          "ds-badge"
-        ],
-        "ds-badge": [
-          "ds-text"
-        ],
-        "ds-bar-nav": [
-          "ds-tab-group-nav"
-        ]
-      }
-    },
     {
       "filePath": "src/wc/components/Table/Table.tsx",
       "encapsulation": "scoped",
@@ -12387,12 +12155,12 @@
         "ds-modal",
         "ds-pagination",
         "ds-panel-nav",
+        "ds-panel-sub-nav",
         "ds-panel-tools",
         "ds-radio-group",
         "ds-select",
         "ds-slider",
         "ds-tab-group",
-        "ds-tab-group-nav",
         "ds-table",
         "ds-tag",
         "ds-tooltip",
@@ -12448,6 +12216,9 @@
         "ds-panel-nav": [
           "ds-text"
         ],
+        "ds-panel-sub-nav": [
+          "ds-text"
+        ],
         "ds-panel-tools": [
           "ds-text"
         ],
@@ -12463,9 +12234,6 @@
         "ds-tab-group": [
           "ds-text"
         ],
-        "ds-tab-group-nav": [
-          "ds-text"
-        ],
         "ds-table": [
           "ds-text"
         ],
@@ -13074,13 +12842,8 @@
       "docstring": "",
       "path": "src/wc/components/ButtonUnfilled/ButtonUnfilled.tsx"
     },
-    "src/wc/components/ButtonUnfilled/ButtonUnfilled.tsx::ButtonUnfilledOnBackgroundContrast": {
-      "declaration": "export type ButtonUnfilledOnBackgroundContrast = 'default' | 'medium' | 'bold' | 'strong';",
-      "docstring": "",
-      "path": "src/wc/components/ButtonUnfilled/ButtonUnfilled.tsx"
-    },
     "src/wc/components/ButtonUnfilled/ButtonUnfilled.tsx::ButtonUnfilledBackground": {
-      "declaration": "export type ButtonUnfilledBackground = 'always-dark' | 'navigation';",
+      "declaration": "export type ButtonUnfilledBackground =\n  | 'faint'\n  | 'medium'\n  | 'bold'\n  | 'strong'\n  | 'translucent'\n  | 'inverted'\n  | 'media'\n  | 'always-dark';",
       "docstring": "",
       "path": "src/wc/components/ButtonUnfilled/ButtonUnfilled.tsx"
     },
@@ -13124,11 +12887,6 @@
       "docstring": "",
       "path": "src/wc/components/Chip/Chip.tsx"
     },
-    "src/wc/components/Chip/Chip.tsx::ChipBackground": {
-      "declaration": "export type ChipBackground = 'faint' | 'medium' | 'bold' | 'strong' | 'always-dark';",
-      "docstring": "",
-      "path": "src/wc/components/Chip/Chip.tsx"
-    },
     "src/wc/components/Divider/Divider.tsx::DividerOrientation": {
       "declaration": "export type DividerOrientation = 'horizontal' | 'vertical';",
       "docstring": "",
@@ -13184,6 +12942,16 @@
       "docstring": "",
       "path": "src/wc/components/Modal/Modal.tsx"
     },
+    "src/wc/components/PanelSubNav/panel-sub-nav-types.ts::PanelSubNavItem": {
+      "declaration": "export interface PanelSubNavItem {\n  /** Unique tab id. Also used by the controlled panel's aria-labelledby. */\n  id: string;\n  label: string;\n  /** ID of the tabpanel controlled by this item. */\n  panelId: string;\n  /** Prevent selection and remove the item from keyboard navigation. */\n  isInactive?: boolean;\n}",
+      "docstring": "",
+      "path": "src/wc/components/PanelSubNav/panel-sub-nav-types.ts"
+    },
+    "src/wc/components/PanelSubNav/PanelSubNav.tsx::PanelSubNavBackground": {
+      "declaration": "export type PanelSubNavBackground =\n  | 'faint'\n  | 'medium'\n  | 'bold'\n  | 'strong'\n  | 'translucent'\n  | 'inverted'\n  | 'media'\n  | 'always-dark';",
+      "docstring": "",
+      "path": "src/wc/components/PanelSubNav/PanelSubNav.tsx"
+    },
     "src/wc/components/RadioGroup/RadioGroup.tsx::RadioOption": {
       "declaration": "export interface RadioOption {\n  label: string;\n  value: string;\n  isInactive?: boolean;\n}",
       "docstring": "",
@@ -13229,21 +12997,16 @@
       "docstring": "",
       "path": "src/wc/components/Switch/Switch.tsx"
     },
-    "src/wc/components/TabGroup/tab-item-utils.ts::TabItem": {
-      "declaration": "export type TabItem = TabItemTab | TabItemDivider;",
+    "src/wc/components/TabGroup/tab-item-utils.ts::TabGroupItem": {
+      "declaration": "export type TabGroupItem =\n  | TabGroupItemLabel\n  | TabGroupItemIcon\n  | TabGroupItemIconLabel\n  | TabItemDivider;",
       "docstring": "",
       "path": "src/wc/components/TabGroup/tab-item-utils.ts"
     },
     "src/wc/components/TabGroup/TabGroup.tsx::TabBackground": {
-      "declaration": "export type TabBackground = 'faint' | 'medium' | 'bold' | 'strong' | 'always-dark';",
+      "declaration": "export type TabBackground =\n  | 'faint'\n  | 'medium'\n  | 'bold'\n  | 'strong'\n  | 'translucent'\n  | 'inverted'\n  | 'media'\n  | 'always-dark';",
       "docstring": "",
       "path": "src/wc/components/TabGroup/TabGroup.tsx"
     },
-    "src/wc/components/TabGroupNav/TabGroupNav.tsx::TabGroupNavBackground": {
-      "declaration": "export type TabGroupNavBackground = 'faint' | 'medium' | 'bold' | 'strong' | 'always-dark' | 'navigation';",
-      "docstring": "",
-      "path": "src/wc/components/TabGroupNav/TabGroupNav.tsx"
-    },
     "src/wc/components/Table/Table.tsx::TableColumn": {
       "declaration": "export interface TableColumn<T = unknown> {\n  id: string;\n  header: string;\n  accessorKey?: string;\n  accessor?: (row: T) => unknown;\n  sortable?: boolean;\n  align?: 'left' | 'right' | 'center';\n  width?: string | number;\n  minWidth?: string | number;\n  hide?: boolean;\n}",
       "docstring": "",