@flanksource/clicky-ui 0.3.45 → 0.3.47

package/dist/data/test-runner/TestFilterBar.js

@@ -1,34 +1,60 @@
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import { Icon } from "../Icon.js";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "../../lib/utils.js";
-import { frameworkIcon } from "./frameworkIcon.js";
-import { formatCount, STATUS_LABELS } from "./status.js";
-import { cycleFilterState } from "./filterState.js";
-import { UiAdd } from "../../icons/components/UiAdd.js";
-import { UiRemove } from "../../icons/components/UiRemove.js";
-const STATUS_BADGES = {
-  failed: "bg-red-500",
-  warned: "bg-amber-400",
-  timedout: "bg-amber-500",
-  passed: "bg-green-500",
-  skipped: "bg-yellow-400",
-  running: "bg-blue-500",
-  pending: "bg-muted-foreground",
-  total: "bg-muted-foreground"
-};
-const STATUS_DEFS = STATUS_LABELS.map((d) => ({
-  ...d,
-  badge: STATUS_BADGES[d.key]
-}));
-function pillClass(mode) {
-  if (mode === "include") return "bg-accent border-border font-medium text-foreground";
-  if (mode === "exclude") return "bg-foreground text-background border-foreground font-medium";
-  return "border-border text-muted-foreground hover:bg-accent";
-}
-function StateMarker({ mode }) {
-  if (mode === "include") return /* @__PURE__ */ jsx(Icon, { icon: UiAdd, className: "text-xs" });
-  if (mode === "exclude") return /* @__PURE__ */ jsx(Icon, { icon: UiRemove, className: "text-xs" });
-  return /* @__PURE__ */ jsx("span", { className: "h-2 w-2 rounded-full bg-current opacity-30", "aria-hidden": true });
+import { Icon } from "../Icon.js";
+import { DropdownMenu } from "../../overlay/DropdownMenu.js";
+import { FilterBarContext } from "../../components/filter-bar-context.js";
+import { MultiFilterPanel } from "../../components/filter-bar-multi.js";
+import { summarizeMultiFilter } from "../../components/filter-bar-field-utils.js";
+import { OutcomeIcon, ToolIcon } from "./MarkIcons.js";
+import { toolMark } from "./marks.js";
+import { STATUS_LABELS } from "./status.js";
+import { UiChevronDown } from "../../icons/components/UiChevronDown.js";
+const COMMIT_IMMEDIATELY = { autoSubmit: false, compact: false };
+function Facet({
+  label,
+  options,
+  state,
+  onChange
+}) {
+  const value = Object.fromEntries(state);
+  const active = state.size > 0;
+  return /* @__PURE__ */ jsx(
+    DropdownMenu,
+    {
+      align: "right",
+      menuLabel: label,
+      menuClassName: "p-2",
+      trigger: /* @__PURE__ */ jsxs(
+        "span",
+        {
+          role: "button",
+          tabIndex: 0,
+          className: cn(
+            "inline-flex h-6 items-center gap-0.5 rounded px-1.5 text-xs transition-colors",
+            active ? "bg-muted font-medium text-foreground" : "text-muted-foreground hover:bg-muted/60 hover:text-foreground"
+          ),
+          children: [
+            summarizeMultiFilter(label, value),
+            /* @__PURE__ */ jsx(Icon, { icon: UiChevronDown, className: "text-[10px] opacity-60" })
+          ]
+        }
+      ),
+      children: () => /* @__PURE__ */ jsx(FilterBarContext.Provider, { value: COMMIT_IMMEDIATELY, children: /* @__PURE__ */ jsx(
+        MultiFilterPanel,
+        {
+          chrome: "embedded",
+          filter: {
+            key: label,
+            kind: "multi",
+            label,
+            options,
+            value,
+            onChange: (v) => onChange(new Map(Object.entries(v)))
+          }
+        }
+      ) })
+    }
+  );
 }
 function TestFilterBar({
   filters,
@@ -37,72 +63,40 @@ function TestFilterBar({
   frameworks,
   className
 }) {
-  const hasActive = filters.status.size > 0 || filters.framework.size > 0;
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-wrap items-center gap-1.5", className), children: [
-    STATUS_DEFS.map((sf) => {
-      const count = counts[sf.key];
-      if (count === 0) return null;
-      const mode = filters.status.get(sf.key);
-      return /* @__PURE__ */ jsxs(
-        "button",
-        {
-          type: "button",
-          className: cn(
-            "inline-flex items-center gap-1.5 rounded-full border px-2 py-0.5 text-xs transition-colors",
-            pillClass(mode)
-          ),
-          onClick: () => onChange({ ...filters, status: cycleFilterState(filters.status, sf.key) }),
-          title: `${sf.label}: ${mode ?? "neutral"}`,
-          children: [
-            /* @__PURE__ */ jsx(
-              "span",
-              {
-                className: cn(
-                  "inline-flex h-4 min-w-4 items-center justify-center rounded-full px-1 text-[10px] font-bold text-white",
-                  sf.badge
-                ),
-                children: formatCount(count)
-              }
-            ),
-            /* @__PURE__ */ jsx(StateMarker, { mode }),
-            sf.label
-          ]
-        },
-        sf.key
-      );
-    }),
-    frameworks.length > 1 && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx("span", { className: "mx-0.5 text-border", children: "|" }),
-      frameworks.map((fw) => {
-        const icon = frameworkIcon(fw);
-        const mode = filters.framework.get(fw);
-        return /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            className: cn(
-              "inline-flex items-center gap-1 rounded-full border px-2 py-0.5 text-xs transition-colors",
-              pillClass(mode)
-            ),
-            onClick: () => onChange({ ...filters, framework: cycleFilterState(filters.framework, fw) }),
-            title: `${fw}: ${mode ?? "neutral"}`,
-            children: [
-              /* @__PURE__ */ jsx(StateMarker, { mode }),
-              icon && /* @__PURE__ */ jsx(Icon, { icon, className: "text-sm" }),
-              fw
-            ]
-          },
-          fw
-        );
-      })
-    ] }),
-    hasActive && /* @__PURE__ */ jsx(
-      "button",
+  const statusOptions = STATUS_LABELS.filter((d) => counts[d.key] > 0).map(
+    (d) => ({
+      value: d.key,
+      label: d.label,
+      icon: /* @__PURE__ */ jsx(OutcomeIcon, { outcome: d.key }),
+      count: counts[d.key]
+    })
+  );
+  const toolOptions = frameworks.map((fw) => {
+    var _a;
+    return {
+      value: fw,
+      label: ((_a = toolMark(fw)) == null ? void 0 : _a.label) ?? fw,
+      title: fw,
+      icon: /* @__PURE__ */ jsx(ToolIcon, { tool: fw })
+    };
+  });
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-0.5", className), children: [
+    /* @__PURE__ */ jsx(
+      Facet,
+      {
+        label: "Status",
+        options: statusOptions,
+        state: filters.status,
+        onChange: (status) => onChange({ ...filters, status })
+      }
+    ),
+    frameworks.length > 1 && /* @__PURE__ */ jsx(
+      Facet,
       {
-        type: "button",
-        className: "ml-1 text-xs text-muted-foreground hover:text-foreground",
-        onClick: () => onChange({ status: /* @__PURE__ */ new Map(), framework: /* @__PURE__ */ new Map() }),
-        children: "Clear"
+        label: "Tool",
+        options: toolOptions,
+        state: filters.framework,
+        onChange: (framework) => onChange({ ...filters, framework })
       }
     )
   ] });

package/dist/data/test-runner/TestFilterBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"TestFilterBar.js","sources":["../../../src/data/test-runner/TestFilterBar.tsx"],"sourcesContent":["import { Icon } from \"../Icon\";\nimport { cn } from \"../../lib/utils\";\nimport { UiAdd, UiRemove } from \"../../icons\";\nimport { frameworkIcon } from \"./frameworkIcon\";\nimport { formatCount, STATUS_LABELS, type StatusCounts } from \"./status\";\nimport { cycleFilterState, type FilterMode, type TestFilters } from \"./filterState\";\n\nexport type TestFilterBarProps = {\n  filters: TestFilters;\n  onChange: (next: TestFilters) => void;\n  counts: StatusCounts;\n  frameworks: string[];\n  className?: string;\n};\n\ntype StatusDef = { key: keyof StatusCounts; label: string; badge: string };\n\nconst STATUS_BADGES: Record<keyof StatusCounts, string> = {\n  failed: \"bg-red-500\",\n  warned: \"bg-amber-400\",\n  timedout: \"bg-amber-500\",\n  passed: \"bg-green-500\",\n  skipped: \"bg-yellow-400\",\n  running: \"bg-blue-500\",\n  pending: \"bg-muted-foreground\",\n  total: \"bg-muted-foreground\",\n};\n\nconst STATUS_DEFS: StatusDef[] = STATUS_LABELS.map((d) => ({\n  ...d,\n  badge: STATUS_BADGES[d.key],\n}));\n\nfunction pillClass(mode: FilterMode | undefined): string {\n  if (mode === \"include\") return \"bg-accent border-border font-medium text-foreground\";\n  if (mode === \"exclude\") return \"bg-foreground text-background border-foreground font-medium\";\n  return \"border-border text-muted-foreground hover:bg-accent\";\n}\n\nfunction StateMarker({ mode }: { mode: FilterMode | undefined }) {\n  if (mode === \"include\") return <Icon icon={UiAdd} className=\"text-xs\" />;\n  if (mode === \"exclude\") return <Icon icon={UiRemove} className=\"text-xs\" />;\n  return <span className=\"h-2 w-2 rounded-full bg-current opacity-30\" aria-hidden />;\n}\n\n/**\n * Tri-state status + framework filter pills. Named TestFilterBar to avoid the\n * pre-existing generic `FilterBar` export in clicky-ui/components.\n */\nexport function TestFilterBar({\n  filters,\n  onChange,\n  counts,\n  frameworks,\n  className,\n}: TestFilterBarProps) {\n  const hasActive = filters.status.size > 0 || filters.framework.size > 0;\n\n  return (\n    <div className={cn(\"flex flex-wrap items-center gap-1.5\", className)}>\n      {STATUS_DEFS.map((sf) => {\n        const count = counts[sf.key];\n        if (count === 0) return null;\n        const mode = filters.status.get(sf.key);\n        return (\n          <button\n            key={sf.key}\n            type=\"button\"\n            className={cn(\n              \"inline-flex items-center gap-1.5 rounded-full border px-2 py-0.5 text-xs transition-colors\",\n              pillClass(mode),\n            )}\n            onClick={() => onChange({ ...filters, status: cycleFilterState(filters.status, sf.key) })}\n            title={`${sf.label}: ${mode ?? \"neutral\"}`}\n          >\n            <span\n              className={cn(\n                \"inline-flex h-4 min-w-4 items-center justify-center rounded-full px-1 text-[10px] font-bold text-white\",\n                sf.badge,\n              )}\n            >\n              {formatCount(count)}\n            </span>\n            <StateMarker mode={mode} />\n            {sf.label}\n          </button>\n        );\n      })}\n\n      {frameworks.length > 1 && (\n        <>\n          <span className=\"mx-0.5 text-border\">|</span>\n          {frameworks.map((fw) => {\n            const icon = frameworkIcon(fw);\n            const mode = filters.framework.get(fw);\n            return (\n              <button\n                key={fw}\n                type=\"button\"\n                className={cn(\n                  \"inline-flex items-center gap-1 rounded-full border px-2 py-0.5 text-xs transition-colors\",\n                  pillClass(mode),\n                )}\n                onClick={() =>\n                  onChange({ ...filters, framework: cycleFilterState(filters.framework, fw) })\n                }\n                title={`${fw}: ${mode ?? \"neutral\"}`}\n              >\n                <StateMarker mode={mode} />\n                {icon && <Icon icon={icon} className=\"text-sm\" />}\n                {fw}\n              </button>\n            );\n          })}\n        </>\n      )}\n\n      {hasActive && (\n        <button\n          type=\"button\"\n          className=\"ml-1 text-xs text-muted-foreground hover:text-foreground\"\n          onClick={() => onChange({ status: new Map(), framework: new Map() })}\n        >\n          Clear\n        </button>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;AAiBA,MAAM,gBAAoD;AAAA,EACxD,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AACT;AAEA,MAAM,cAA2B,cAAc,IAAI,CAAC,OAAO;AAAA,EACzD,GAAG;AAAA,EACH,OAAO,cAAc,EAAE,GAAG;AAC5B,EAAE;AAEF,SAAS,UAAU,MAAsC;AACvD,MAAI,SAAS,UAAW,QAAO;AAC/B,MAAI,SAAS,UAAW,QAAO;AAC/B,SAAO;AACT;AAEA,SAAS,YAAY,EAAE,QAA0C;AAC/D,MAAI,SAAS,UAAW,QAAO,oBAAC,QAAK,MAAM,OAAO,WAAU,WAAU;AACtE,MAAI,SAAS,UAAW,QAAO,oBAAC,QAAK,MAAM,UAAU,WAAU,WAAU;AACzE,SAAO,oBAAC,QAAA,EAAK,WAAU,8CAA6C,eAAW,MAAC;AAClF;AAMO,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAuB;AACrB,QAAM,YAAY,QAAQ,OAAO,OAAO,KAAK,QAAQ,UAAU,OAAO;AAEtE,8BACG,OAAA,EAAI,WAAW,GAAG,uCAAuC,SAAS,GAChE,UAAA;AAAA,IAAA,YAAY,IAAI,CAAC,OAAO;AACvB,YAAM,QAAQ,OAAO,GAAG,GAAG;AAC3B,UAAI,UAAU,EAAG,QAAO;AACxB,YAAM,OAAO,QAAQ,OAAO,IAAI,GAAG,GAAG;AACtC,aACE;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,MAAK;AAAA,UACL,WAAW;AAAA,YACT;AAAA,YACA,UAAU,IAAI;AAAA,UAAA;AAAA,UAEhB,SAAS,MAAM,SAAS,EAAE,GAAG,SAAS,QAAQ,iBAAiB,QAAQ,QAAQ,GAAG,GAAG,GAAG;AAAA,UACxF,OAAO,GAAG,GAAG,KAAK,KAAK,QAAQ,SAAS;AAAA,UAExC,UAAA;AAAA,YAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAW;AAAA,kBACT;AAAA,kBACA,GAAG;AAAA,gBAAA;AAAA,gBAGJ,sBAAY,KAAK;AAAA,cAAA;AAAA,YAAA;AAAA,YAEpB,oBAAC,eAAY,MAAY;AAAA,YACxB,GAAG;AAAA,UAAA;AAAA,QAAA;AAAA,QAlBC,GAAG;AAAA,MAAA;AAAA,IAqBd,CAAC;AAAA,IAEA,WAAW,SAAS,KACnB,qBAAA,UAAA,EACE,UAAA;AAAA,MAAA,oBAAC,QAAA,EAAK,WAAU,sBAAqB,UAAA,KAAC;AAAA,MACrC,WAAW,IAAI,CAAC,OAAO;AACtB,cAAM,OAAO,cAAc,EAAE;AAC7B,cAAM,OAAO,QAAQ,UAAU,IAAI,EAAE;AACrC,eACE;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,MAAK;AAAA,YACL,WAAW;AAAA,cACT;AAAA,cACA,UAAU,IAAI;AAAA,YAAA;AAAA,YAEhB,SAAS,MACP,SAAS,EAAE,GAAG,SAAS,WAAW,iBAAiB,QAAQ,WAAW,EAAE,GAAG;AAAA,YAE7E,OAAO,GAAG,EAAE,KAAK,QAAQ,SAAS;AAAA,YAElC,UAAA;AAAA,cAAA,oBAAC,eAAY,MAAY;AAAA,cACxB,QAAQ,oBAAC,MAAA,EAAK,MAAY,WAAU,WAAU;AAAA,cAC9C;AAAA,YAAA;AAAA,UAAA;AAAA,UAbI;AAAA,QAAA;AAAA,MAgBX,CAAC;AAAA,IAAA,GACH;AAAA,IAGD,aACC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,SAAS,MAAM,SAAS,EAAE,QAAQ,oBAAI,IAAA,GAAO,WAAW,oBAAI,IAAA,GAAO;AAAA,QACpE,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAED,GAEJ;AAEJ;"}
+{"version":3,"file":"TestFilterBar.js","sources":["../../../src/data/test-runner/TestFilterBar.tsx"],"sourcesContent":["import { cn } from \"../../lib/utils\";\nimport { Icon } from \"../Icon\";\nimport { UiChevronDown } from \"../../icons\";\nimport { DropdownMenu } from \"../../overlay/DropdownMenu\";\nimport { FilterBarContext } from \"../../components/filter-bar-context\";\nimport { MultiFilterPanel } from \"../../components/filter-bar-multi\";\nimport { summarizeMultiFilter } from \"../../components/filter-bar-field-utils\";\nimport type { MultiSelectOption } from \"../../components/MultiSelect\";\nimport { OutcomeIcon, ToolIcon } from \"./MarkIcons\";\nimport { toolMark } from \"./marks\";\nimport { STATUS_LABELS, type StatusCounts, type TestOutcome } from \"./status\";\nimport type { FilterMode, FilterState, TestFilters } from \"./filterState\";\n\nexport type TestFilterBarProps = {\n  filters: TestFilters;\n  onChange: (next: TestFilters) => void;\n  counts: StatusCounts;\n  frameworks: string[];\n  className?: string;\n};\n\n// Picks commit straight away: the runner, not a form, owns the filter state.\nconst COMMIT_IMMEDIATELY = { autoSubmit: false, compact: false };\n\nfunction Facet({\n  label,\n  options,\n  state,\n  onChange,\n}: {\n  label: string;\n  options: MultiSelectOption[];\n  state: FilterState<string>;\n  onChange: (next: FilterState<string>) => void;\n}) {\n  const value: Record<string, FilterMode> = Object.fromEntries(state);\n  const active = state.size > 0;\n  return (\n    <DropdownMenu\n      align=\"right\"\n      menuLabel={label}\n      menuClassName=\"p-2\"\n      trigger={\n        <span\n          role=\"button\"\n          tabIndex={0}\n          className={cn(\n            \"inline-flex h-6 items-center gap-0.5 rounded px-1.5 text-xs transition-colors\",\n            active\n              ? \"bg-muted font-medium text-foreground\"\n              : \"text-muted-foreground hover:bg-muted/60 hover:text-foreground\",\n          )}\n        >\n          {summarizeMultiFilter(label, value)}\n          <Icon icon={UiChevronDown} className=\"text-[10px] opacity-60\" />\n        </span>\n      }\n    >\n      {() => (\n        <FilterBarContext.Provider value={COMMIT_IMMEDIATELY}>\n          <MultiFilterPanel\n            chrome=\"embedded\"\n            filter={{\n              key: label,\n              kind: \"multi\",\n              label,\n              options,\n              value,\n              onChange: (v) => onChange(new Map(Object.entries(v))),\n            }}\n          />\n        </FilterBarContext.Provider>\n      )}\n    </DropdownMenu>\n  );\n}\n\n/**\n * Status and tool facets as compact, muted menu triggers sized for the tree\n * toolbar; each opens a tri-state (include / exclude) option list. Named\n * TestFilterBar to avoid the generic `FilterBar` export in clicky-ui/components.\n */\nexport function TestFilterBar({\n  filters,\n  onChange,\n  counts,\n  frameworks,\n  className,\n}: TestFilterBarProps) {\n  const statusOptions: MultiSelectOption[] = STATUS_LABELS.filter((d) => counts[d.key] > 0).map(\n    (d) => ({\n      value: d.key,\n      label: d.label,\n      icon: <OutcomeIcon outcome={d.key as TestOutcome} />,\n      count: counts[d.key],\n    }),\n  );\n  const toolOptions: MultiSelectOption[] = frameworks.map((fw) => ({\n    value: fw,\n    label: toolMark(fw)?.label ?? fw,\n    title: fw,\n    icon: <ToolIcon tool={fw} />,\n  }));\n\n  return (\n    <div className={cn(\"flex items-center gap-0.5\", className)}>\n      <Facet\n        label=\"Status\"\n        options={statusOptions}\n        state={filters.status}\n        onChange={(status) => onChange({ ...filters, status })}\n      />\n      {frameworks.length > 1 && (\n        <Facet\n          label=\"Tool\"\n          options={toolOptions}\n          state={filters.framework}\n          onChange={(framework) => onChange({ ...filters, framework })}\n        />\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAsBA,MAAM,qBAAqB,EAAE,YAAY,OAAO,SAAS,MAAA;AAEzD,SAAS,MAAM;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;AACD,QAAM,QAAoC,OAAO,YAAY,KAAK;AAClE,QAAM,SAAS,MAAM,OAAO;AAC5B,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,WAAW;AAAA,MACX,eAAc;AAAA,MACd,SACE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU;AAAA,UACV,WAAW;AAAA,YACT;AAAA,YACA,SACI,yCACA;AAAA,UAAA;AAAA,UAGL,UAAA;AAAA,YAAA,qBAAqB,OAAO,KAAK;AAAA,YAClC,oBAAC,MAAA,EAAK,MAAM,eAAe,WAAU,yBAAA,CAAyB;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAIjE,gBACC,oBAAC,iBAAiB,UAAjB,EAA0B,OAAO,oBAChC,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,QAAO;AAAA,UACP,QAAQ;AAAA,YACN,KAAK;AAAA,YACL,MAAM;AAAA,YACN;AAAA,YACA;AAAA,YACA;AAAA,YACA,UAAU,CAAC,MAAM,SAAS,IAAI,IAAI,OAAO,QAAQ,CAAC,CAAC,CAAC;AAAA,UAAA;AAAA,QACtD;AAAA,MAAA,EACF,CACF;AAAA,IAAA;AAAA,EAAA;AAIR;AAOO,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAuB;AACrB,QAAM,gBAAqC,cAAc,OAAO,CAAC,MAAM,OAAO,EAAE,GAAG,IAAI,CAAC,EAAE;AAAA,IACxF,CAAC,OAAO;AAAA,MACN,OAAO,EAAE;AAAA,MACT,OAAO,EAAE;AAAA,MACT,MAAM,oBAAC,aAAA,EAAY,SAAS,EAAE,KAAoB;AAAA,MAClD,OAAO,OAAO,EAAE,GAAG;AAAA,IAAA;AAAA,EACrB;AAEF,QAAM,cAAmC,WAAW,IAAI,CAAC,OAAA;;AAAQ;AAAA,MAC/D,OAAO;AAAA,MACP,SAAO,cAAS,EAAE,MAAX,mBAAc,UAAS;AAAA,MAC9B,OAAO;AAAA,MACP,MAAM,oBAAC,UAAA,EAAS,MAAM,GAAA,CAAI;AAAA,IAAA;AAAA,GAC1B;AAEF,8BACG,OAAA,EAAI,WAAW,GAAG,6BAA6B,SAAS,GACvD,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,SAAS;AAAA,QACT,OAAO,QAAQ;AAAA,QACf,UAAU,CAAC,WAAW,SAAS,EAAE,GAAG,SAAS,QAAQ;AAAA,MAAA;AAAA,IAAA;AAAA,IAEtD,WAAW,SAAS,KACnB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,SAAS;AAAA,QACT,OAAO,QAAQ;AAAA,QACf,UAAU,CAAC,cAAc,SAAS,EAAE,GAAG,SAAS,WAAW;AAAA,MAAA;AAAA,IAAA;AAAA,EAC7D,GAEJ;AAEJ;"}

package/dist/data/test-runner/TestRunSummary.cjs

@@ -5,8 +5,9 @@ const Icon = require("../Icon.cjs");
 const ProgressBar = require("../ProgressBar.cjs");
 const utils = require("../../lib/utils.cjs");
 const status = require("./status.cjs");
+const marks = require("./marks.cjs");
+const MarkIcons = require("./MarkIcons.cjs");
 const UiClock = require("../../icons/components/UiClock.cjs");
-const UiCheck = require("../../icons/components/UiCheck.cjs");
 const UiLoader = require("../../icons/components/UiLoader.cjs");
 function pct(part, total) {
   return total > 0 ? Math.round(part / total * 100) : 0;
@@ -29,18 +30,37 @@ function TestRunSummary({
     { count: t.passed, color: "bg-green-500", label: "passed" },
     { count: t.skipped, color: "bg-yellow-400", label: "skipped" },
     { count: t.failed, color: "bg-red-500", label: "failed" },
+    { count: t.warned, color: "bg-amber-400", label: "warned" },
     { count: t.timedout, color: "bg-amber-500", label: "timed out" },
     { count: t.running, color: "bg-blue-400", label: "running" },
     { count: t.pending, color: "bg-muted-foreground/40", label: "queued" }
   ];
   const chips = [
-    { n: t.passed, label: "passed", tone: "text-green-600 dark:text-green-400" },
-    { n: t.failed, label: "failed", tone: "text-red-600 dark:text-red-400" },
-    { n: t.timedout, label: "timed out", tone: "text-amber-600 dark:text-amber-400" },
-    { n: t.skipped, label: "skipped", tone: "text-yellow-700 dark:text-yellow-500" },
-    { n: t.running, label: "running", tone: "text-blue-600 dark:text-blue-400" },
-    { n: t.pending, label: "queued", tone: "text-muted-foreground" }
+    { n: t.passed, label: "passed", outcome: "passed" },
+    { n: t.failed, label: "failed", outcome: "failed" },
+    { n: t.warned, label: "warned", outcome: "warned" },
+    { n: t.timedout, label: "timed out", outcome: "timedout" },
+    { n: t.skipped, label: "skipped", outcome: "skipped" },
+    { n: t.running, label: "running", outcome: "running" },
+    { n: t.pending, label: "queued", outcome: "pending" }
   ];
+  const chipRow = chips.filter((c) => c.n > 0).map((c) => /* @__PURE__ */ jsxRuntime.jsxs(
+    "span",
+    {
+      className: utils.cn(
+        "inline-flex items-center gap-0.5 tabular-nums",
+        marks.TEST_OUTCOMES[c.outcome].className
+      ),
+      "aria-label": `${c.n} ${c.label}`,
+      title: `${c.n} ${c.label}`,
+      "data-summary-outcome": c.outcome,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(MarkIcons.OutcomeIcon, { outcome: c.outcome }),
+        c.n
+      ]
+    },
+    c.label
+  ));
   if (compact) {
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
@@ -52,14 +72,11 @@ function TestRunSummary({
         children: [
           /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-medium text-foreground", children: [
             t.total,
-            " tests",
+            " ",
+            t.total === 1 ? "test" : "tests",
             (runMeta == null ? void 0 : runMeta.kind) === "rerun" ? ` · rerun #${runMeta.sequence}` : ""
           ] }),
-          chips.filter((c) => c.n > 0).map((c) => /* @__PURE__ */ jsxRuntime.jsxs("span", { className: c.tone, children: [
-            c.n,
-            " ",
-            c.label
-          ] }, c.label)),
+          chipRow,
           elapsed && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1", children: [
             /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiClock.UiClock, className: "text-xs" }),
             elapsed
@@ -71,7 +88,7 @@ function TestRunSummary({
               "%"
             ] })
           ] }),
-          done ? /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiCheck.UiCheck, className: "text-green-600 dark:text-green-400" }) : /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiLoader.UiLoader, className: "animate-spin text-blue-500" })
+          !done && /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiLoader.UiLoader, className: "animate-spin text-blue-500" })
         ]
       }
     );
@@ -80,19 +97,16 @@ function TestRunSummary({
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center justify-end gap-x-3 gap-y-0.5 text-sm text-muted-foreground", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-medium text-foreground", children: [
         t.total,
-        " tests",
+        " ",
+        t.total === 1 ? "test" : "tests",
         (runMeta == null ? void 0 : runMeta.kind) === "rerun" ? ` · rerun #${runMeta.sequence}` : ""
       ] }),
-      chips.filter((c) => c.n > 0).map((c) => /* @__PURE__ */ jsxRuntime.jsxs("span", { className: c.tone, children: [
-        c.n,
-        " ",
-        c.label
-      ] }, c.label)),
+      chipRow,
       elapsed && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1", children: [
         /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiClock.UiClock, className: "text-xs" }),
         elapsed
       ] }),
-      done ? /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiCheck.UiCheck, className: "text-green-600 dark:text-green-400" }) : /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiLoader.UiLoader, className: "animate-spin text-blue-500" })
+      !done && /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiLoader.UiLoader, className: "animate-spin text-blue-500" })
     ] }),
     t.total > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-72 items-center gap-2", children: [
       /* @__PURE__ */ jsxRuntime.jsx(ProgressBar.ProgressBar, { className: "flex-1", segments, total: t.total, height: "h-2" }),

package/dist/data/test-runner/TestRunSummary.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TestRunSummary.cjs","sources":["../../../src/data/test-runner/TestRunSummary.tsx"],"sourcesContent":["import { Icon } from \"../Icon\";\nimport { ProgressBar, type ProgressSegment } from \"../ProgressBar\";\nimport { cn } from \"../../lib/utils\";\nimport { UiCheck, UiClock, UiLoader } from \"../../icons\";\nimport type { RunMeta, Test } from \"./types\";\nimport { aggregateStatusCounts } from \"./status\";\n\nexport type TestRunSummaryProps = {\n  tests: Test[];\n  /** Run start, epoch ms (host-provided). */\n  startTime?: number | null | undefined;\n  /** Run end, epoch ms; falls back to `now` while running. */\n  endTime?: number | null | undefined;\n  done: boolean;\n  /** Injected clock (epoch ms) so the component stays pure. */\n  now?: number | undefined;\n  runMeta?: RunMeta | undefined;\n  /**\n   * Single-line layout for embedding in a host header (e.g. a dialog header):\n   * counts + a short inline progress bar on one row, instead of the default\n   * two-line right-aligned column.\n   */\n  compact?: boolean | undefined;\n  className?: string | undefined;\n};\n\nfunction pct(part: number, total: number): number {\n  return total > 0 ? Math.round((part / total) * 100) : 0;\n}\n\n/**\n * Header summary: per-status counts, elapsed time, a stacked progress bar, and\n * pass/fail/pending gauge cards. Pure — elapsed time comes from injected `now`.\n */\nexport function TestRunSummary({\n  tests,\n  startTime,\n  endTime,\n  done,\n  now,\n  runMeta,\n  compact = false,\n  className,\n}: TestRunSummaryProps) {\n  const t = aggregateStatusCounts(tests);\n  const clock = now ?? 0;\n  const end = done && endTime ? endTime : clock;\n  const elapsed = startTime && end >= startTime ? `${((end - startTime) / 1000).toFixed(1)}s` : \"\";\n\n  const segments: ProgressSegment[] = [\n    { count: t.passed, color: \"bg-green-500\", label: \"passed\" },\n    { count: t.skipped, color: \"bg-yellow-400\", label: \"skipped\" },\n    { count: t.failed, color: \"bg-red-500\", label: \"failed\" },\n    { count: t.timedout, color: \"bg-amber-500\", label: \"timed out\" },\n    { count: t.running, color: \"bg-blue-400\", label: \"running\" },\n    { count: t.pending, color: \"bg-muted-foreground/40\", label: \"queued\" },\n  ];\n\n  // Each status appears once, as a coloured count chip — no separate gauge-card\n  // row repeating the same numbers as percentages.\n  const chips: { n: number; label: string; tone: string }[] = [\n    { n: t.passed, label: \"passed\", tone: \"text-green-600 dark:text-green-400\" },\n    { n: t.failed, label: \"failed\", tone: \"text-red-600 dark:text-red-400\" },\n    { n: t.timedout, label: \"timed out\", tone: \"text-amber-600 dark:text-amber-400\" },\n    { n: t.skipped, label: \"skipped\", tone: \"text-yellow-700 dark:text-yellow-500\" },\n    { n: t.running, label: \"running\", tone: \"text-blue-600 dark:text-blue-400\" },\n    { n: t.pending, label: \"queued\", tone: \"text-muted-foreground\" },\n  ];\n\n  if (compact) {\n    return (\n      <div\n        className={cn(\n          \"flex flex-wrap items-center gap-x-3 gap-y-0.5 text-sm text-muted-foreground\",\n          className,\n        )}\n      >\n        <span className=\"font-medium text-foreground\">\n          {t.total} tests\n          {runMeta?.kind === \"rerun\" ? ` · rerun #${runMeta.sequence}` : \"\"}\n        </span>\n        {chips\n          .filter((c) => c.n > 0)\n          .map((c) => (\n            <span key={c.label} className={c.tone}>\n              {c.n} {c.label}\n            </span>\n          ))}\n        {elapsed && (\n          <span className=\"inline-flex items-center gap-1\">\n            <Icon icon={UiClock} className=\"text-xs\" />\n            {elapsed}\n          </span>\n        )}\n        {t.total > 0 && (\n          <span className=\"inline-flex items-center gap-1.5\">\n            <ProgressBar className=\"w-24\" segments={segments} total={t.total} height=\"h-1.5\" />\n            <span className=\"text-xs font-medium text-green-600 dark:text-green-400\">\n              {pct(t.passed, t.total)}%\n            </span>\n          </span>\n        )}\n        {done ? (\n          <Icon icon={UiCheck} className=\"text-green-600 dark:text-green-400\" />\n        ) : (\n          <Icon icon={UiLoader} className=\"animate-spin text-blue-500\" />\n        )}\n      </div>\n    );\n  }\n\n  return (\n    <div className={cn(\"flex min-w-[18rem] flex-col items-end gap-1.5\", className)}>\n      <div className=\"flex flex-wrap items-center justify-end gap-x-3 gap-y-0.5 text-sm text-muted-foreground\">\n        <span className=\"font-medium text-foreground\">\n          {t.total} tests\n          {runMeta?.kind === \"rerun\" ? ` · rerun #${runMeta.sequence}` : \"\"}\n        </span>\n        {chips\n          .filter((c) => c.n > 0)\n          .map((c) => (\n            <span key={c.label} className={c.tone}>\n              {c.n} {c.label}\n            </span>\n          ))}\n        {elapsed && (\n          <span className=\"inline-flex items-center gap-1\">\n            <Icon icon={UiClock} className=\"text-xs\" />\n            {elapsed}\n          </span>\n        )}\n        {done ? (\n          <Icon icon={UiCheck} className=\"text-green-600 dark:text-green-400\" />\n        ) : (\n          <Icon icon={UiLoader} className=\"animate-spin text-blue-500\" />\n        )}\n      </div>\n\n      {t.total > 0 && (\n        <div className=\"flex w-72 items-center gap-2\">\n          <ProgressBar className=\"flex-1\" segments={segments} total={t.total} height=\"h-2\" />\n          <span className=\"shrink-0 text-xs font-medium text-green-600 dark:text-green-400\">\n            {pct(t.passed, t.total)}%\n          </span>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["aggregateStatusCounts","jsxs","cn","jsx","Icon","UiClock","ProgressBar","UiCheck","UiLoader"],"mappings":"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"}
+{"version":3,"file":"TestRunSummary.cjs","sources":["../../../src/data/test-runner/TestRunSummary.tsx"],"sourcesContent":["import { Icon } from \"../Icon\";\nimport { ProgressBar, type ProgressSegment } from \"../ProgressBar\";\nimport { cn } from \"../../lib/utils\";\nimport { UiClock, UiLoader } from \"../../icons\";\nimport type { RunMeta, Test } from \"./types\";\nimport { aggregateStatusCounts, type TestOutcome } from \"./status\";\nimport { TEST_OUTCOMES } from \"./marks\";\nimport { OutcomeIcon } from \"./MarkIcons\";\n\nexport type TestRunSummaryProps = {\n  tests: Test[];\n  /** Run start, epoch ms (host-provided). */\n  startTime?: number | null | undefined;\n  /** Run end, epoch ms; falls back to `now` while running. */\n  endTime?: number | null | undefined;\n  done: boolean;\n  /** Injected clock (epoch ms) so the component stays pure. */\n  now?: number | undefined;\n  runMeta?: RunMeta | undefined;\n  /**\n   * Single-line layout for embedding in a host header (e.g. a dialog header):\n   * counts + a short inline progress bar on one row, instead of the default\n   * two-line right-aligned column.\n   */\n  compact?: boolean | undefined;\n  className?: string | undefined;\n};\n\nfunction pct(part: number, total: number): number {\n  return total > 0 ? Math.round((part / total) * 100) : 0;\n}\n\n/**\n * Header summary: per-status counts, elapsed time, a stacked progress bar, and\n * pass/fail/pending gauge cards. Pure — elapsed time comes from injected `now`.\n */\nexport function TestRunSummary({\n  tests,\n  startTime,\n  endTime,\n  done,\n  now,\n  runMeta,\n  compact = false,\n  className,\n}: TestRunSummaryProps) {\n  const t = aggregateStatusCounts(tests);\n  const clock = now ?? 0;\n  const end = done && endTime ? endTime : clock;\n  const elapsed = startTime && end >= startTime ? `${((end - startTime) / 1000).toFixed(1)}s` : \"\";\n\n  const segments: ProgressSegment[] = [\n    { count: t.passed, color: \"bg-green-500\", label: \"passed\" },\n    { count: t.skipped, color: \"bg-yellow-400\", label: \"skipped\" },\n    { count: t.failed, color: \"bg-red-500\", label: \"failed\" },\n    { count: t.warned, color: \"bg-amber-400\", label: \"warned\" },\n    { count: t.timedout, color: \"bg-amber-500\", label: \"timed out\" },\n    { count: t.running, color: \"bg-blue-400\", label: \"running\" },\n    { count: t.pending, color: \"bg-muted-foreground/40\", label: \"queued\" },\n  ];\n\n  // Each status appears once, as its outcome mark and a count — the same\n  // glyphs the tree uses, so the header reads in the tree's vocabulary.\n  const chips: { n: number; label: string; outcome: TestOutcome }[] = [\n    { n: t.passed, label: \"passed\", outcome: \"passed\" },\n    { n: t.failed, label: \"failed\", outcome: \"failed\" },\n    { n: t.warned, label: \"warned\", outcome: \"warned\" },\n    { n: t.timedout, label: \"timed out\", outcome: \"timedout\" },\n    { n: t.skipped, label: \"skipped\", outcome: \"skipped\" },\n    { n: t.running, label: \"running\", outcome: \"running\" },\n    { n: t.pending, label: \"queued\", outcome: \"pending\" },\n  ];\n  const chipRow = chips\n    .filter((c) => c.n > 0)\n    .map((c) => (\n      <span\n        key={c.label}\n        className={cn(\n          \"inline-flex items-center gap-0.5 tabular-nums\",\n          TEST_OUTCOMES[c.outcome].className,\n        )}\n        aria-label={`${c.n} ${c.label}`}\n        title={`${c.n} ${c.label}`}\n        data-summary-outcome={c.outcome}\n      >\n        <OutcomeIcon outcome={c.outcome} />\n        {c.n}\n      </span>\n    ));\n\n  if (compact) {\n    return (\n      <div\n        className={cn(\n          \"flex flex-wrap items-center gap-x-3 gap-y-0.5 text-sm text-muted-foreground\",\n          className,\n        )}\n      >\n        <span className=\"font-medium text-foreground\">\n          {t.total} {t.total === 1 ? \"test\" : \"tests\"}\n          {runMeta?.kind === \"rerun\" ? ` · rerun #${runMeta.sequence}` : \"\"}\n        </span>\n        {chipRow}\n        {elapsed && (\n          <span className=\"inline-flex items-center gap-1\">\n            <Icon icon={UiClock} className=\"text-xs\" />\n            {elapsed}\n          </span>\n        )}\n        {t.total > 0 && (\n          <span className=\"inline-flex items-center gap-1.5\">\n            <ProgressBar className=\"w-24\" segments={segments} total={t.total} height=\"h-1.5\" />\n            <span className=\"text-xs font-medium text-green-600 dark:text-green-400\">\n              {pct(t.passed, t.total)}%\n            </span>\n          </span>\n        )}\n        {!done && <Icon icon={UiLoader} className=\"animate-spin text-blue-500\" />}\n      </div>\n    );\n  }\n\n  return (\n    <div className={cn(\"flex min-w-[18rem] flex-col items-end gap-1.5\", className)}>\n      <div className=\"flex flex-wrap items-center justify-end gap-x-3 gap-y-0.5 text-sm text-muted-foreground\">\n        <span className=\"font-medium text-foreground\">\n          {t.total} {t.total === 1 ? \"test\" : \"tests\"}\n          {runMeta?.kind === \"rerun\" ? ` · rerun #${runMeta.sequence}` : \"\"}\n        </span>\n        {chipRow}\n        {elapsed && (\n          <span className=\"inline-flex items-center gap-1\">\n            <Icon icon={UiClock} className=\"text-xs\" />\n            {elapsed}\n          </span>\n        )}\n        {!done && <Icon icon={UiLoader} className=\"animate-spin text-blue-500\" />}\n      </div>\n\n      {t.total > 0 && (\n        <div className=\"flex w-72 items-center gap-2\">\n          <ProgressBar className=\"flex-1\" segments={segments} total={t.total} height=\"h-2\" />\n          <span className=\"shrink-0 text-xs font-medium text-green-600 dark:text-green-400\">\n            {pct(t.passed, t.total)}%\n          </span>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["aggregateStatusCounts","jsxs","cn","TEST_OUTCOMES","jsx","OutcomeIcon","Icon","UiClock","ProgressBar","UiLoader"],"mappings":"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"}

package/dist/data/test-runner/TestRunSummary.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TestRunSummary.d.ts","sourceRoot":"","sources":["../../../src/data/test-runner/TestRunSummary.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAG7C,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACtC,4DAA4D;IAC5D,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACpC,IAAI,EAAE,OAAO,CAAC;IACd,6DAA6D;IAC7D,GAAG,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC,CAAC;AAMF;;;GAGG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,SAAS,EACT,OAAO,EACP,IAAI,EACJ,GAAG,EACH,OAAO,EACP,OAAe,EACf,SAAS,GACV,EAAE,mBAAmB,+BAyGrB"}
+{"version":3,"file":"TestRunSummary.d.ts","sourceRoot":"","sources":["../../../src/data/test-runner/TestRunSummary.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAK7C,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACtC,4DAA4D;IAC5D,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACpC,IAAI,EAAE,OAAO,CAAC;IACd,6DAA6D;IAC7D,GAAG,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC,CAAC;AAMF;;;GAGG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,SAAS,EACT,OAAO,EACP,IAAI,EACJ,GAAG,EACH,OAAO,EACP,OAAe,EACf,SAAS,GACV,EAAE,mBAAmB,+BAwGrB"}

package/dist/data/test-runner/TestRunSummary.js

@@ -3,8 +3,9 @@ import { Icon } from "../Icon.js";
 import { ProgressBar } from "../ProgressBar.js";
 import { cn } from "../../lib/utils.js";
 import { aggregateStatusCounts } from "./status.js";
+import { TEST_OUTCOMES } from "./marks.js";
+import { OutcomeIcon } from "./MarkIcons.js";
 import { UiClock } from "../../icons/components/UiClock.js";
-import { UiCheck } from "../../icons/components/UiCheck.js";
 import { UiLoader } from "../../icons/components/UiLoader.js";
 function pct(part, total) {
   return total > 0 ? Math.round(part / total * 100) : 0;
@@ -27,18 +28,37 @@ function TestRunSummary({
     { count: t.passed, color: "bg-green-500", label: "passed" },
     { count: t.skipped, color: "bg-yellow-400", label: "skipped" },
     { count: t.failed, color: "bg-red-500", label: "failed" },
+    { count: t.warned, color: "bg-amber-400", label: "warned" },
     { count: t.timedout, color: "bg-amber-500", label: "timed out" },
     { count: t.running, color: "bg-blue-400", label: "running" },
     { count: t.pending, color: "bg-muted-foreground/40", label: "queued" }
   ];
   const chips = [
-    { n: t.passed, label: "passed", tone: "text-green-600 dark:text-green-400" },
-    { n: t.failed, label: "failed", tone: "text-red-600 dark:text-red-400" },
-    { n: t.timedout, label: "timed out", tone: "text-amber-600 dark:text-amber-400" },
-    { n: t.skipped, label: "skipped", tone: "text-yellow-700 dark:text-yellow-500" },
-    { n: t.running, label: "running", tone: "text-blue-600 dark:text-blue-400" },
-    { n: t.pending, label: "queued", tone: "text-muted-foreground" }
+    { n: t.passed, label: "passed", outcome: "passed" },
+    { n: t.failed, label: "failed", outcome: "failed" },
+    { n: t.warned, label: "warned", outcome: "warned" },
+    { n: t.timedout, label: "timed out", outcome: "timedout" },
+    { n: t.skipped, label: "skipped", outcome: "skipped" },
+    { n: t.running, label: "running", outcome: "running" },
+    { n: t.pending, label: "queued", outcome: "pending" }
   ];
+  const chipRow = chips.filter((c) => c.n > 0).map((c) => /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: cn(
+        "inline-flex items-center gap-0.5 tabular-nums",
+        TEST_OUTCOMES[c.outcome].className
+      ),
+      "aria-label": `${c.n} ${c.label}`,
+      title: `${c.n} ${c.label}`,
+      "data-summary-outcome": c.outcome,
+      children: [
+        /* @__PURE__ */ jsx(OutcomeIcon, { outcome: c.outcome }),
+        c.n
+      ]
+    },
+    c.label
+  ));
   if (compact) {
     return /* @__PURE__ */ jsxs(
       "div",
@@ -50,14 +70,11 @@ function TestRunSummary({
         children: [
           /* @__PURE__ */ jsxs("span", { className: "font-medium text-foreground", children: [
             t.total,
-            " tests",
+            " ",
+            t.total === 1 ? "test" : "tests",
             (runMeta == null ? void 0 : runMeta.kind) === "rerun" ? ` · rerun #${runMeta.sequence}` : ""
           ] }),
-          chips.filter((c) => c.n > 0).map((c) => /* @__PURE__ */ jsxs("span", { className: c.tone, children: [
-            c.n,
-            " ",
-            c.label
-          ] }, c.label)),
+          chipRow,
           elapsed && /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1", children: [
             /* @__PURE__ */ jsx(Icon, { icon: UiClock, className: "text-xs" }),
             elapsed
@@ -69,7 +86,7 @@ function TestRunSummary({
               "%"
             ] })
           ] }),
-          done ? /* @__PURE__ */ jsx(Icon, { icon: UiCheck, className: "text-green-600 dark:text-green-400" }) : /* @__PURE__ */ jsx(Icon, { icon: UiLoader, className: "animate-spin text-blue-500" })
+          !done && /* @__PURE__ */ jsx(Icon, { icon: UiLoader, className: "animate-spin text-blue-500" })
         ]
       }
     );
@@ -78,19 +95,16 @@ function TestRunSummary({
     /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-end gap-x-3 gap-y-0.5 text-sm text-muted-foreground", children: [
       /* @__PURE__ */ jsxs("span", { className: "font-medium text-foreground", children: [
         t.total,
-        " tests",
+        " ",
+        t.total === 1 ? "test" : "tests",
         (runMeta == null ? void 0 : runMeta.kind) === "rerun" ? ` · rerun #${runMeta.sequence}` : ""
       ] }),
-      chips.filter((c) => c.n > 0).map((c) => /* @__PURE__ */ jsxs("span", { className: c.tone, children: [
-        c.n,
-        " ",
-        c.label
-      ] }, c.label)),
+      chipRow,
       elapsed && /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1", children: [
         /* @__PURE__ */ jsx(Icon, { icon: UiClock, className: "text-xs" }),
         elapsed
       ] }),
-      done ? /* @__PURE__ */ jsx(Icon, { icon: UiCheck, className: "text-green-600 dark:text-green-400" }) : /* @__PURE__ */ jsx(Icon, { icon: UiLoader, className: "animate-spin text-blue-500" })
+      !done && /* @__PURE__ */ jsx(Icon, { icon: UiLoader, className: "animate-spin text-blue-500" })
     ] }),
     t.total > 0 && /* @__PURE__ */ jsxs("div", { className: "flex w-72 items-center gap-2", children: [
       /* @__PURE__ */ jsx(ProgressBar, { className: "flex-1", segments, total: t.total, height: "h-2" }),

package/dist/data/test-runner/TestRunSummary.js.map

@@ -1 +1 @@
-{"version":3,"file":"TestRunSummary.js","sources":["../../../src/data/test-runner/TestRunSummary.tsx"],"sourcesContent":["import { Icon } from \"../Icon\";\nimport { ProgressBar, type ProgressSegment } from \"../ProgressBar\";\nimport { cn } from \"../../lib/utils\";\nimport { UiCheck, UiClock, UiLoader } from \"../../icons\";\nimport type { RunMeta, Test } from \"./types\";\nimport { aggregateStatusCounts } from \"./status\";\n\nexport type TestRunSummaryProps = {\n  tests: Test[];\n  /** Run start, epoch ms (host-provided). */\n  startTime?: number | null | undefined;\n  /** Run end, epoch ms; falls back to `now` while running. */\n  endTime?: number | null | undefined;\n  done: boolean;\n  /** Injected clock (epoch ms) so the component stays pure. */\n  now?: number | undefined;\n  runMeta?: RunMeta | undefined;\n  /**\n   * Single-line layout for embedding in a host header (e.g. a dialog header):\n   * counts + a short inline progress bar on one row, instead of the default\n   * two-line right-aligned column.\n   */\n  compact?: boolean | undefined;\n  className?: string | undefined;\n};\n\nfunction pct(part: number, total: number): number {\n  return total > 0 ? Math.round((part / total) * 100) : 0;\n}\n\n/**\n * Header summary: per-status counts, elapsed time, a stacked progress bar, and\n * pass/fail/pending gauge cards. Pure — elapsed time comes from injected `now`.\n */\nexport function TestRunSummary({\n  tests,\n  startTime,\n  endTime,\n  done,\n  now,\n  runMeta,\n  compact = false,\n  className,\n}: TestRunSummaryProps) {\n  const t = aggregateStatusCounts(tests);\n  const clock = now ?? 0;\n  const end = done && endTime ? endTime : clock;\n  const elapsed = startTime && end >= startTime ? `${((end - startTime) / 1000).toFixed(1)}s` : \"\";\n\n  const segments: ProgressSegment[] = [\n    { count: t.passed, color: \"bg-green-500\", label: \"passed\" },\n    { count: t.skipped, color: \"bg-yellow-400\", label: \"skipped\" },\n    { count: t.failed, color: \"bg-red-500\", label: \"failed\" },\n    { count: t.timedout, color: \"bg-amber-500\", label: \"timed out\" },\n    { count: t.running, color: \"bg-blue-400\", label: \"running\" },\n    { count: t.pending, color: \"bg-muted-foreground/40\", label: \"queued\" },\n  ];\n\n  // Each status appears once, as a coloured count chip — no separate gauge-card\n  // row repeating the same numbers as percentages.\n  const chips: { n: number; label: string; tone: string }[] = [\n    { n: t.passed, label: \"passed\", tone: \"text-green-600 dark:text-green-400\" },\n    { n: t.failed, label: \"failed\", tone: \"text-red-600 dark:text-red-400\" },\n    { n: t.timedout, label: \"timed out\", tone: \"text-amber-600 dark:text-amber-400\" },\n    { n: t.skipped, label: \"skipped\", tone: \"text-yellow-700 dark:text-yellow-500\" },\n    { n: t.running, label: \"running\", tone: \"text-blue-600 dark:text-blue-400\" },\n    { n: t.pending, label: \"queued\", tone: \"text-muted-foreground\" },\n  ];\n\n  if (compact) {\n    return (\n      <div\n        className={cn(\n          \"flex flex-wrap items-center gap-x-3 gap-y-0.5 text-sm text-muted-foreground\",\n          className,\n        )}\n      >\n        <span className=\"font-medium text-foreground\">\n          {t.total} tests\n          {runMeta?.kind === \"rerun\" ? ` · rerun #${runMeta.sequence}` : \"\"}\n        </span>\n        {chips\n          .filter((c) => c.n > 0)\n          .map((c) => (\n            <span key={c.label} className={c.tone}>\n              {c.n} {c.label}\n            </span>\n          ))}\n        {elapsed && (\n          <span className=\"inline-flex items-center gap-1\">\n            <Icon icon={UiClock} className=\"text-xs\" />\n            {elapsed}\n          </span>\n        )}\n        {t.total > 0 && (\n          <span className=\"inline-flex items-center gap-1.5\">\n            <ProgressBar className=\"w-24\" segments={segments} total={t.total} height=\"h-1.5\" />\n            <span className=\"text-xs font-medium text-green-600 dark:text-green-400\">\n              {pct(t.passed, t.total)}%\n            </span>\n          </span>\n        )}\n        {done ? (\n          <Icon icon={UiCheck} className=\"text-green-600 dark:text-green-400\" />\n        ) : (\n          <Icon icon={UiLoader} className=\"animate-spin text-blue-500\" />\n        )}\n      </div>\n    );\n  }\n\n  return (\n    <div className={cn(\"flex min-w-[18rem] flex-col items-end gap-1.5\", className)}>\n      <div className=\"flex flex-wrap items-center justify-end gap-x-3 gap-y-0.5 text-sm text-muted-foreground\">\n        <span className=\"font-medium text-foreground\">\n          {t.total} tests\n          {runMeta?.kind === \"rerun\" ? ` · rerun #${runMeta.sequence}` : \"\"}\n        </span>\n        {chips\n          .filter((c) => c.n > 0)\n          .map((c) => (\n            <span key={c.label} className={c.tone}>\n              {c.n} {c.label}\n            </span>\n          ))}\n        {elapsed && (\n          <span className=\"inline-flex items-center gap-1\">\n            <Icon icon={UiClock} className=\"text-xs\" />\n            {elapsed}\n          </span>\n        )}\n        {done ? (\n          <Icon icon={UiCheck} className=\"text-green-600 dark:text-green-400\" />\n        ) : (\n          <Icon icon={UiLoader} className=\"animate-spin text-blue-500\" />\n        )}\n      </div>\n\n      {t.total > 0 && (\n        <div className=\"flex w-72 items-center gap-2\">\n          <ProgressBar className=\"flex-1\" segments={segments} total={t.total} height=\"h-2\" />\n          <span className=\"shrink-0 text-xs font-medium text-green-600 dark:text-green-400\">\n            {pct(t.passed, t.total)}%\n          </span>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"TestRunSummary.js","sources":["../../../src/data/test-runner/TestRunSummary.tsx"],"sourcesContent":["import { Icon } from \"../Icon\";\nimport { ProgressBar, type ProgressSegment } from \"../ProgressBar\";\nimport { cn } from \"../../lib/utils\";\nimport { UiClock, UiLoader } from \"../../icons\";\nimport type { RunMeta, Test } from \"./types\";\nimport { aggregateStatusCounts, type TestOutcome } from \"./status\";\nimport { TEST_OUTCOMES } from \"./marks\";\nimport { OutcomeIcon } from \"./MarkIcons\";\n\nexport type TestRunSummaryProps = {\n  tests: Test[];\n  /** Run start, epoch ms (host-provided). */\n  startTime?: number | null | undefined;\n  /** Run end, epoch ms; falls back to `now` while running. */\n  endTime?: number | null | undefined;\n  done: boolean;\n  /** Injected clock (epoch ms) so the component stays pure. */\n  now?: number | undefined;\n  runMeta?: RunMeta | undefined;\n  /**\n   * Single-line layout for embedding in a host header (e.g. a dialog header):\n   * counts + a short inline progress bar on one row, instead of the default\n   * two-line right-aligned column.\n   */\n  compact?: boolean | undefined;\n  className?: string | undefined;\n};\n\nfunction pct(part: number, total: number): number {\n  return total > 0 ? Math.round((part / total) * 100) : 0;\n}\n\n/**\n * Header summary: per-status counts, elapsed time, a stacked progress bar, and\n * pass/fail/pending gauge cards. Pure — elapsed time comes from injected `now`.\n */\nexport function TestRunSummary({\n  tests,\n  startTime,\n  endTime,\n  done,\n  now,\n  runMeta,\n  compact = false,\n  className,\n}: TestRunSummaryProps) {\n  const t = aggregateStatusCounts(tests);\n  const clock = now ?? 0;\n  const end = done && endTime ? endTime : clock;\n  const elapsed = startTime && end >= startTime ? `${((end - startTime) / 1000).toFixed(1)}s` : \"\";\n\n  const segments: ProgressSegment[] = [\n    { count: t.passed, color: \"bg-green-500\", label: \"passed\" },\n    { count: t.skipped, color: \"bg-yellow-400\", label: \"skipped\" },\n    { count: t.failed, color: \"bg-red-500\", label: \"failed\" },\n    { count: t.warned, color: \"bg-amber-400\", label: \"warned\" },\n    { count: t.timedout, color: \"bg-amber-500\", label: \"timed out\" },\n    { count: t.running, color: \"bg-blue-400\", label: \"running\" },\n    { count: t.pending, color: \"bg-muted-foreground/40\", label: \"queued\" },\n  ];\n\n  // Each status appears once, as its outcome mark and a count — the same\n  // glyphs the tree uses, so the header reads in the tree's vocabulary.\n  const chips: { n: number; label: string; outcome: TestOutcome }[] = [\n    { n: t.passed, label: \"passed\", outcome: \"passed\" },\n    { n: t.failed, label: \"failed\", outcome: \"failed\" },\n    { n: t.warned, label: \"warned\", outcome: \"warned\" },\n    { n: t.timedout, label: \"timed out\", outcome: \"timedout\" },\n    { n: t.skipped, label: \"skipped\", outcome: \"skipped\" },\n    { n: t.running, label: \"running\", outcome: \"running\" },\n    { n: t.pending, label: \"queued\", outcome: \"pending\" },\n  ];\n  const chipRow = chips\n    .filter((c) => c.n > 0)\n    .map((c) => (\n      <span\n        key={c.label}\n        className={cn(\n          \"inline-flex items-center gap-0.5 tabular-nums\",\n          TEST_OUTCOMES[c.outcome].className,\n        )}\n        aria-label={`${c.n} ${c.label}`}\n        title={`${c.n} ${c.label}`}\n        data-summary-outcome={c.outcome}\n      >\n        <OutcomeIcon outcome={c.outcome} />\n        {c.n}\n      </span>\n    ));\n\n  if (compact) {\n    return (\n      <div\n        className={cn(\n          \"flex flex-wrap items-center gap-x-3 gap-y-0.5 text-sm text-muted-foreground\",\n          className,\n        )}\n      >\n        <span className=\"font-medium text-foreground\">\n          {t.total} {t.total === 1 ? \"test\" : \"tests\"}\n          {runMeta?.kind === \"rerun\" ? ` · rerun #${runMeta.sequence}` : \"\"}\n        </span>\n        {chipRow}\n        {elapsed && (\n          <span className=\"inline-flex items-center gap-1\">\n            <Icon icon={UiClock} className=\"text-xs\" />\n            {elapsed}\n          </span>\n        )}\n        {t.total > 0 && (\n          <span className=\"inline-flex items-center gap-1.5\">\n            <ProgressBar className=\"w-24\" segments={segments} total={t.total} height=\"h-1.5\" />\n            <span className=\"text-xs font-medium text-green-600 dark:text-green-400\">\n              {pct(t.passed, t.total)}%\n            </span>\n          </span>\n        )}\n        {!done && <Icon icon={UiLoader} className=\"animate-spin text-blue-500\" />}\n      </div>\n    );\n  }\n\n  return (\n    <div className={cn(\"flex min-w-[18rem] flex-col items-end gap-1.5\", className)}>\n      <div className=\"flex flex-wrap items-center justify-end gap-x-3 gap-y-0.5 text-sm text-muted-foreground\">\n        <span className=\"font-medium text-foreground\">\n          {t.total} {t.total === 1 ? \"test\" : \"tests\"}\n          {runMeta?.kind === \"rerun\" ? ` · rerun #${runMeta.sequence}` : \"\"}\n        </span>\n        {chipRow}\n        {elapsed && (\n          <span className=\"inline-flex items-center gap-1\">\n            <Icon icon={UiClock} className=\"text-xs\" />\n            {elapsed}\n          </span>\n        )}\n        {!done && <Icon icon={UiLoader} className=\"animate-spin text-blue-500\" />}\n      </div>\n\n      {t.total > 0 && (\n        <div className=\"flex w-72 items-center gap-2\">\n          <ProgressBar className=\"flex-1\" segments={segments} total={t.total} height=\"h-2\" />\n          <span className=\"shrink-0 text-xs font-medium text-green-600 dark:text-green-400\">\n            {pct(t.passed, t.total)}%\n          </span>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}