@ds-mo/ui 12.7.0 → 12.8.0

package/dist/docs/components.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2026-07-26T22:57:55",
+  "timestamp": "2026-07-29T19:23:07",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.43.5",
@@ -3116,6 +3116,58 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "controls",
+          "type": "string | undefined",
+          "complexType": {
+            "original": "string | undefined",
+            "resolved": "string | undefined",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "controls",
+          "reflectToAttr": false,
+          "docs": "ID of the popup this button controls.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            },
+            {
+              "type": "undefined"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "expanded",
+          "type": "boolean | undefined",
+          "complexType": {
+            "original": "boolean | undefined",
+            "resolved": "boolean | undefined",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "expanded",
+          "reflectToAttr": false,
+          "docs": "Controlled open state of the popup this button triggers. Holds the pressed\nwash for the popup's rendered lifecycle. ButtonFilled has no selected state,\nso an open popup never promotes to an active treatment.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "boolean"
+            },
+            {
+              "type": "undefined"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "hasBorder",
           "type": "boolean",
@@ -3145,6 +3197,88 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "hasMenu",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "has-menu",
+          "reflectToAttr": false,
+          "docs": "This action *has* a menu: implies `aria-haspopup=\"menu\"` and adds the trailing\nchevron that carries the affordance.\n\nOnly `label` and `icon-label` are supported. A filled button is never the\noverflow / more-options control — that role belongs to ButtonUnfilled with an\n`Ellipses` glyph, which conveys the menu without a chevron.\n\nUse `haspopup` directly for non-menu popups.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "false"
+            }
+          ],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "haspopup",
+          "type": "\"dialog\" | \"grid\" | \"listbox\" | \"menu\" | \"tree\" | \"true\" | undefined",
+          "complexType": {
+            "original": "ButtonFilledPopup | undefined",
+            "resolved": "\"dialog\" | \"grid\" | \"listbox\" | \"menu\" | \"tree\" | \"true\" | undefined",
+            "references": {
+              "ButtonFilledPopup": {
+                "location": "local",
+                "path": "/home/runner/work/compomo/compomo/src/wc/components/ButtonFilled/ButtonFilled.tsx",
+                "id": "src/wc/components/ButtonFilled/ButtonFilled.tsx::ButtonFilledPopup"
+              }
+            }
+          },
+          "mutable": false,
+          "attr": "haspopup",
+          "reflectToAttr": false,
+          "docs": "Popup type exposed to assistive technology.",
+          "docsTags": [],
+          "values": [
+            {
+              "value": "dialog",
+              "type": "string"
+            },
+            {
+              "value": "grid",
+              "type": "string"
+            },
+            {
+              "value": "listbox",
+              "type": "string"
+            },
+            {
+              "value": "menu",
+              "type": "string"
+            },
+            {
+              "value": "tree",
+              "type": "string"
+            },
+            {
+              "value": "true",
+              "type": "string"
+            },
+            {
+              "type": "undefined"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "icon",
           "type": "string",
@@ -3329,6 +3463,61 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "pressScale",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "press-scale",
+          "reflectToAttr": false,
+          "docs": "Scale down during a physical pointer press.\nDisable when an owning composite requires fixed child or background geometry.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "true"
+            }
+          ],
+          "default": "true",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "pressed",
+          "type": "boolean | undefined",
+          "complexType": {
+            "original": "boolean | undefined",
+            "resolved": "boolean | undefined",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "pressed",
+          "reflectToAttr": false,
+          "docs": "Pressed semantics for a toggle command that reports state elsewhere.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "boolean"
+            },
+            {
+              "type": "undefined"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "rounded",
           "type": "boolean",
@@ -3876,6 +4065,35 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "hasMenu",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "has-menu",
+          "reflectToAttr": false,
+          "docs": "Mark the button as a Menu trigger. Implies `aria-haspopup=\"menu\"` and covers\nboth menu-button shapes:\n\n- `label` / `icon-label` — the action *has* a menu; a trailing chevron carries\n  the affordance.\n- `icon` — the button *is* a menu, i.e. the overflow / more-options control.\n  No chevron is added, so the glyph must convey it on its own; use `Ellipses`.\n\nUse `haspopup` directly for non-menu popups.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "false"
+            }
+          ],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "haspopup",
           "type": "\"dialog\" | \"grid\" | \"listbox\" | \"menu\" | \"tree\" | \"true\" | undefined",
@@ -4074,6 +4292,35 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "pressScale",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "press-scale",
+          "reflectToAttr": false,
+          "docs": "Scale down during a physical pointer press.\nDisable when an owning composite requires fixed child or background geometry.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "true"
+            }
+          ],
+          "default": "true",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "pressed",
           "type": "boolean | undefined",
@@ -4921,6 +5168,314 @@
         ]
       }
     },
+    {
+      "filePath": "src/wc/components/CardOverview/CardOverview.tsx",
+      "encapsulation": "scoped",
+      "tag": "ds-card-overview",
+      "docs": "",
+      "docsTags": [],
+      "usage": {},
+      "props": [
+        {
+          "name": "comparisonLabel",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "comparison-label",
+          "reflectToAttr": false,
+          "docs": "Comparison caption, for example `vs. previous score period`.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "''"
+            }
+          ],
+          "default": "''",
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "isLoading",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "is-loading",
+          "reflectToAttr": false,
+          "docs": "Replace the score and metrics with skeletons while data resolves.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "false"
+            }
+          ],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "metricMinWidth",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "metric-min-width",
+          "reflectToAttr": false,
+          "docs": "Width a metric cell may shrink to before the grid drops a column. The grid\nreflows and then stacks from this alone, so no measurement is required.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "'var(--dimension-menu-width-xs)'"
+            }
+          ],
+          "default": "'var(--dimension-menu-width-xs)'",
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "metrics",
+          "type": "OverviewMetric[]",
+          "complexType": {
+            "original": "OverviewMetric[]",
+            "resolved": "OverviewMetric[]",
+            "references": {
+              "OverviewMetric": {
+                "location": "import",
+                "path": "./card-overview-types",
+                "id": "src/wc/components/CardOverview/card-overview-types.ts::OverviewMetric",
+                "referenceLocation": "OverviewMetric"
+              }
+            }
+          },
+          "mutable": false,
+          "reflectToAttr": false,
+          "docs": "Measures rendered in the responsive grid.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "[]"
+            }
+          ],
+          "default": "[]",
+          "values": [
+            {
+              "type": "OverviewMetric[]"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "overviewLabel",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "overview-label",
+          "reflectToAttr": false,
+          "docs": "Accessible name for the region.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "'Overview'"
+            }
+          ],
+          "default": "'Overview'",
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "periodLabel",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "period-label",
+          "reflectToAttr": false,
+          "docs": "Current reporting period, for example `Jun 29, 2026 – Jul 26, 2026`.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "''"
+            }
+          ],
+          "default": "''",
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "score",
+          "type": "OverviewScore | undefined",
+          "complexType": {
+            "original": "OverviewScore | undefined",
+            "resolved": "OverviewScore | undefined",
+            "references": {
+              "OverviewScore": {
+                "location": "import",
+                "path": "./card-overview-types",
+                "id": "src/wc/components/CardOverview/card-overview-types.ts::OverviewScore",
+                "referenceLocation": "OverviewScore"
+              }
+            }
+          },
+          "mutable": false,
+          "reflectToAttr": false,
+          "docs": "Leading summary block. Omit to render the bar without a headline figure.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "OverviewScore"
+            },
+            {
+              "type": "undefined"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "scoreErrorMessage",
+          "type": "string | undefined",
+          "complexType": {
+            "original": "string | undefined",
+            "resolved": "string | undefined",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "score-error-message",
+          "reflectToAttr": false,
+          "docs": "Message shown in place of the score when its figure cannot be resolved.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            },
+            {
+              "type": "undefined"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        }
+      ],
+      "methods": [],
+      "events": [
+        {
+          "event": "dsMetricSelect",
+          "detail": "OverviewMetric",
+          "bubbles": true,
+          "complexType": {
+            "original": "OverviewMetric",
+            "resolved": "OverviewMetric",
+            "references": {
+              "OverviewMetric": {
+                "location": "import",
+                "path": "./card-overview-types",
+                "id": "src/wc/components/CardOverview/card-overview-types.ts::OverviewMetric",
+                "referenceLocation": "OverviewMetric"
+              }
+            }
+          },
+          "cancelable": true,
+          "composed": true,
+          "docs": "Emitted when a metric that is not inactive is activated.",
+          "docsTags": []
+        }
+      ],
+      "listeners": [],
+      "styles": [],
+      "slots": [],
+      "parts": [
+        {
+          "name": "metric",
+          "docs": ""
+        },
+        {
+          "name": "metrics",
+          "docs": ""
+        },
+        {
+          "name": "score",
+          "docs": ""
+        }
+      ],
+      "states": [],
+      "dependents": [],
+      "dependencies": [
+        "ds-skeleton",
+        "ds-text",
+        "ds-icon",
+        "ds-tooltip"
+      ],
+      "dependencyGraph": {
+        "ds-card-overview": [
+          "ds-skeleton",
+          "ds-text",
+          "ds-icon",
+          "ds-tooltip"
+        ],
+        "ds-tooltip": [
+          "ds-text"
+        ]
+      }
+    },
     {
       "filePath": "src/wc/components/CardSetting/CardSetting.tsx",
       "encapsulation": "scoped",
@@ -5329,7 +5884,7 @@
           "mutable": false,
           "attr": "height",
           "reflectToAttr": false,
-          "docs": "",
+          "docs": "Standalone intrinsic height. Container constraints reflow the plot at rendered pixel size.",
           "docsTags": [
             {
               "name": "default",
@@ -5358,7 +5913,7 @@
           "mutable": false,
           "attr": "width",
           "reflectToAttr": false,
-          "docs": "",
+          "docs": "Standalone intrinsic width. Container constraints reflow the plot at rendered pixel size.",
           "docsTags": [
             {
               "name": "default",
@@ -5435,7 +5990,7 @@
           "mutable": false,
           "attr": "height",
           "reflectToAttr": false,
-          "docs": "",
+          "docs": "Standalone intrinsic height. Container constraints reflow the plot at rendered pixel size.",
           "docsTags": [
             {
               "name": "default",
@@ -5539,7 +6094,7 @@
           "mutable": false,
           "attr": "width",
           "reflectToAttr": false,
-          "docs": "",
+          "docs": "Standalone intrinsic width. Container constraints reflow the plot at rendered pixel size.",
           "docsTags": [
             {
               "name": "default",
@@ -6293,7 +6848,7 @@
           "mutable": false,
           "attr": "height",
           "reflectToAttr": false,
-          "docs": "",
+          "docs": "Standalone intrinsic height. Container constraints reflow the plot at rendered pixel size.",
           "docsTags": [
             {
               "name": "default",
@@ -6386,7 +6941,7 @@
           "mutable": false,
           "attr": "width",
           "reflectToAttr": false,
-          "docs": "",
+          "docs": "Standalone intrinsic width. Container constraints reflow the plot at rendered pixel size.",
           "docsTags": [
             {
               "name": "default",
@@ -8591,6 +9146,7 @@
         "ds-bar-title",
         "ds-button-filled",
         "ds-button-unfilled",
+        "ds-card-overview",
         "ds-chip",
         "ds-empty-state",
         "ds-input",
@@ -8629,6 +9185,9 @@
         "ds-button-unfilled": [
           "ds-icon"
         ],
+        "ds-card-overview": [
+          "ds-icon"
+        ],
         "ds-chip": [
           "ds-icon"
         ],
@@ -20508,9 +21067,15 @@
       "slots": [],
       "parts": [],
       "states": [],
-      "dependents": [],
+      "dependents": [
+        "ds-card-overview"
+      ],
       "dependencies": [],
-      "dependencyGraph": {}
+      "dependencyGraph": {
+        "ds-card-overview": [
+          "ds-skeleton"
+        ]
+      }
     },
     {
       "filePath": "src/wc/components/Slider/Slider.tsx",
@@ -23337,6 +23902,7 @@
         "ds-breadcrumb",
         "ds-button-filled",
         "ds-button-unfilled",
+        "ds-card-overview",
         "ds-card-setting",
         "ds-card-shell-data-viz",
         "ds-chart-legend",
@@ -23404,6 +23970,9 @@
         "ds-button-unfilled": [
           "ds-text"
         ],
+        "ds-card-overview": [
+          "ds-text"
+        ],
         "ds-card-setting": [
           "ds-text"
         ],
@@ -24157,6 +24726,7 @@
       "dependents": [
         "ds-bar-title",
         "ds-bar-workflow",
+        "ds-card-overview",
         "ds-code-block",
         "ds-message-composer",
         "ds-message-scroller",
@@ -24183,6 +24753,9 @@
         "ds-bar-workflow": [
           "ds-tooltip"
         ],
+        "ds-card-overview": [
+          "ds-tooltip"
+        ],
         "ds-code-block": [
           "ds-tooltip"
         ],
@@ -24515,6 +25088,11 @@
       "docstring": "",
       "path": "src/wc/components/ButtonFilled/ButtonFilled.tsx"
     },
+    "src/wc/components/ButtonFilled/ButtonFilled.tsx::ButtonFilledPopup": {
+      "declaration": "export type ButtonFilledPopup = 'true' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog';",
+      "docstring": "",
+      "path": "src/wc/components/ButtonFilled/ButtonFilled.tsx"
+    },
     "src/wc/components/ButtonUnfilled/ButtonUnfilled.tsx::ButtonUnfilledVariant": {
       "declaration": "export type ButtonUnfilledVariant = 'icon' | 'label' | 'icon-label';",
       "docstring": "",
@@ -24681,12 +25259,12 @@
       "path": "src/wc/components/Menu/menu-types.ts"
     },
     "src/wc/components/Menu/menu-position.ts::MenuSide": {
-      "declaration": "export type AnchoredPopupSide = 'top' | 'right' | 'bottom' | 'left';",
+      "declaration": "export type AnchoredSide = 'top' | 'right' | 'bottom' | 'left';",
       "docstring": "",
       "path": "src/wc/components/Menu/menu-position.ts"
     },
     "src/wc/components/Menu/menu-position.ts::MenuAlign": {
-      "declaration": "export type AnchoredPopupAlign = 'start' | 'center' | 'end';",
+      "declaration": "export type AnchoredAlign = 'start' | 'center' | 'end';",
       "docstring": "",
       "path": "src/wc/components/Menu/menu-position.ts"
     },
@@ -24990,6 +25568,16 @@
       "docstring": "",
       "path": "src/wc/shell/shell-responsive.ts"
     },
+    "src/wc/components/CardOverview/card-overview-types.ts::OverviewScore": {
+      "declaration": "export interface OverviewScore {\n  /** Category above the figure, for example `Safety score`. */\n  label: string;\n  /** Display-ready headline figure. */\n  value: string | number;\n  /** Change against the comparison period. Omit when there is nothing to report. */\n  trend?: MetricTrend;\n  /** Qualitative band beneath the figure, for example `Good (67–83)`. */\n  band?: string;\n}",
+      "docstring": "Leading summary block — the headline figure the rest of the bar contextualises.\n\nDerive `trend` with `resolveMetricTrend` so whether a rise reads well stays a\nproduct decision rather than a design-system one.",
+      "path": "src/wc/components/CardOverview/card-overview-types.ts"
+    },
+    "src/wc/components/CardOverview/card-overview-types.ts::OverviewMetric": {
+      "declaration": "export interface OverviewMetric {\n  /** Stable identity for keyed rendering and selection events. */\n  id: string;\n  label: string;\n  /** Display-ready value; format compactly before passing it in. */\n  value: string | number;\n  /** Change against the comparison period. Omit when there is nothing to report. */\n  trend?: MetricTrend;\n  /** Present the measure without making it selectable. */\n  isInactive?: boolean;\n  /** Supplementary explanation for the label. */\n  labelTooltip?: string;\n}",
+      "docstring": "One measure in the overview grid.",
+      "path": "src/wc/components/CardOverview/card-overview-types.ts"
+    },
     "src/wc/utils/chart-types.ts::ChartDatum": {
       "declaration": "export interface ChartDatum {\n  label: string;\n  value: number;\n  /** CSS color override; defaults to the next `--color-data-category-*` token. */\n  color?: string;\n}",
       "docstring": "Shared data shapes for `ds-chart-*` components — kept minimal for the initial scaffold, expect these to grow per component once design is finalized.",