@thewhatmatters/wmds 0.4.9 → 0.4.27

package/dist/components/molecules/LogView/logViewStyles.d.ts

@@ -0,0 +1,11 @@
+export declare const logViewRootClasses = "flex min-h-0 flex-col overflow-hidden rounded-xl border border-border bg-surface";
+export declare const logViewToolbarClasses = "flex h-9 shrink-0 items-center gap-2 border-b border-border px-3";
+export declare const logViewCountClasses: string;
+export declare const logViewActionsClasses = "ml-auto flex items-center gap-2";
+export declare const logViewScrollerClasses = "min-h-40 flex-1 overflow-auto scroll-fade-y";
+export declare const logViewLineClasses = "flex gap-3 px-3";
+export declare const logViewNumberClasses = "type-code w-8 shrink-0 text-end text-muted tabular-nums";
+export declare const logViewTextClasses = "type-code min-w-0 flex-1 whitespace-pre-wrap break-all";
+export declare const logViewEmptyClasses: string;
+export declare const logViewSkeletonClasses = "m-3";
+//# sourceMappingURL=logViewStyles.d.ts.map

package/dist/components/molecules/LogView/logViewStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"logViewStyles.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/LogView/logViewStyles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,kBAAkB,qFACqD,CAAC;AAErF,eAAO,MAAM,qBAAqB,qEACkC,CAAC;AAErE,eAAO,MAAM,mBAAmB,QAA0D,CAAC;AAE3F,eAAO,MAAM,qBAAqB,oCAAoC,CAAC;AAEvE,eAAO,MAAM,sBAAsB,gDAAgD,CAAC;AAEpF,eAAO,MAAM,kBAAkB,oBAAoB,CAAC;AAEpD,eAAO,MAAM,oBAAoB,4DAC0B,CAAC;AAE5D,eAAO,MAAM,kBAAkB,2DAA2D,CAAC;AAE3F,eAAO,MAAM,mBAAmB,QAAuD,CAAC;AAExF,eAAO,MAAM,sBAAsB,QAAQ,CAAC"}

package/dist/components/molecules/LogView/logViewStyles.js

@@ -0,0 +1,6 @@
+"use client";
+import { typographyClass as e } from "../../../lib/typography.js";
+//#region src/components/molecules/LogView/logViewStyles.ts
+var t = "flex min-h-0 flex-col overflow-hidden rounded-xl border border-border bg-surface", n = "flex h-9 shrink-0 items-center gap-2 border-b border-border px-3", r = `${e("caption")} tabular-nums text-muted`, i = "ml-auto flex items-center gap-2", a = "min-h-40 flex-1 overflow-auto scroll-fade-y", o = "flex gap-3 px-3", s = "type-code w-8 shrink-0 text-end text-muted tabular-nums", c = "type-code min-w-0 flex-1 whitespace-pre-wrap break-all", l = `${e("caption")} px-3 py-4 text-muted`;
+//#endregion
+export { i as logViewActionsClasses, r as logViewCountClasses, l as logViewEmptyClasses, o as logViewLineClasses, s as logViewNumberClasses, t as logViewRootClasses, a as logViewScrollerClasses, c as logViewTextClasses, n as logViewToolbarClasses };

package/dist/components/molecules/NavList/NavList.d.ts

@@ -10,11 +10,22 @@ export interface NavListItemDef {
     label: string;
     icon?: NavListIcon;
     count?: number;
+    /** Plain URL. The row is an anchor, so a server-rendered app does not need `onSelect` to navigate. */
+    href?: string;
+    /**
+     * Router link in place of `href` — `render={<Link href="/tasks/ikea" />}`.
+     * Pass `href` or `render`, not both.
+     */
+    render?: ReactElement;
+    /** Trailing mark — a **Status** dot or a **Badge** `status` pill. Not a second label. */
+    trailing?: ReactNode;
 }
 export interface NavListSectionDef {
     label?: string;
     /** `brand` aligns the first section overline to an adjacent 56px header band. */
     labelAlign?: NavListLabelAlignment;
+    /** Section control — filter or more. Pass **IconButton**. */
+    action?: ReactNode;
     items: NavListItemDef[];
 }
 export interface NavListProps {
@@ -29,6 +40,8 @@ export interface NavListProps {
 export interface NavListSectionProps {
     label?: string;
     labelAlign?: NavListLabelAlignment;
+    /** Section control — filter or more. Pass **IconButton**. */
+    action?: ReactNode;
     children: ReactNode;
     className?: NavListLayoutClassName;
 }
@@ -37,16 +50,22 @@ export interface NavListItemProps {
     label: string;
     icon?: NavListIcon;
     count?: number;
+    /** Plain URL. The row is an anchor. */
+    href?: string;
+    /** Router link in place of `href`. Pass one, not both. */
+    render?: ReactElement;
+    /** Trailing mark — a **Status** dot or a **Badge** `status` pill. */
+    trailing?: ReactNode;
     selected?: boolean;
     onSelect?: (id: string) => void;
     className?: NavListLayoutClassName;
 }
-declare function NavListSectionRoot({ label, labelAlign, children, className, }: NavListSectionProps): import("react").JSX.Element;
-declare function NavListItemRoot({ id, label, icon, count, selected: selectedProp, onSelect, className, }: NavListItemProps): import("react").JSX.Element;
+declare function NavListSectionRoot({ label, labelAlign, action, children, className, }: NavListSectionProps): import("react").JSX.Element;
+declare function NavListItemRoot({ id, label, icon, count, href, render, trailing, selected: selectedProp, onSelect, className, }: NavListItemProps): import("react").JSX.Element;
 declare function NavListRoot({ sections, activeId, onSelect, children, "aria-label": ariaLabel, className, }: NavListProps): import("react").JSX.Element;
 /**
- * Sectioned secondary navigation — inset pills with optional icons and counts.
- * Compose **NavList.Item** with **Button** `layout="nav"` or pass a `sections` array.
+ * Sectioned secondary navigation — inset pills with optional icons, counts, and trailing marks.
+ * `href` or `render` makes a row a link. Compose **NavList.Item** or pass a `sections` array.
  */
 export declare const NavList: typeof NavListRoot & {
     Section: typeof NavListSectionRoot;

package/dist/components/molecules/NavList/NavList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavList.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/NavList/NavList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,YAAY,EACjB,KAAK,SAAS,EACd,KAAK,QAAQ,EACd,MAAM,OAAO,CAAC;AAIf,OAAO,EAUL,KAAK,qBAAqB,EAC3B,MAAM,iBAAiB,CAAC;AAEzB,YAAY,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AAEzD,6DAA6D;AAC7D,MAAM,MAAM,sBAAsB,GAAG,MAAM,CAAC;AAE5C,MAAM,MAAM,WAAW,GAAG,YAAY,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;AAEhE,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iFAAiF;IACjF,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,KAAK,EAAE,cAAc,EAAE,CAAC;CACzB;AAED,MAAM,WAAW,YAAY;IAC3B,4FAA4F;IAC5F,QAAQ,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC/B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,sBAAsB,CAAC;CACpC;AAED,MAAM,WAAW,mBAAmB;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,sBAAsB,CAAC;CACpC;AAED,MAAM,WAAW,gBAAgB;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,sBAAsB,CAAC;CACpC;AA0CD,iBAAS,kBAAkB,CAAC,EAC1B,KAAK,EACL,UAAsB,EACtB,QAAQ,EACR,SAAS,GACV,EAAE,mBAAmB,+BAOrB;AAED,iBAAS,eAAe,CAAC,EACvB,EAAE,EACF,KAAK,EACL,IAAI,EACJ,KAAK,EACL,QAAQ,EAAE,YAAY,EACtB,QAAQ,EACR,SAAS,GACV,EAAE,gBAAgB,+BAqBlB;AAED,iBAAS,WAAW,CAAC,EACnB,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,YAAY,EAAE,SAAqB,EACnC,SAAS,GACV,EAAE,YAAY,+BA8Bd;AAED;;;GAGG;AACH,eAAO,MAAM,OAAO;;;CAGlB,CAAC"}
+{"version":3,"file":"NavList.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/NavList/NavList.tsx"],"names":[],"mappings":"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"}

package/dist/components/molecules/NavList/NavList.js

@@ -2,102 +2,115 @@
 import { cn as e } from "../../../lib/cn.js";
 import { ButtonIcon as t } from "../../atoms/Button/ButtonIcon.js";
 import { Button as n } from "../../atoms/Button/Button.js";
-import { navListItemCountClasses as r, navListItemIconClasses as i, navListItemLabelClasses as a, navListItemWrapClasses as o, navListLabelAlignments as s, navListSectionBrandBandClasses as c, navListSectionClasses as l, navListSectionLabelBrandClasses as u, navListSectionLabelDefaultClasses as d, navListShellClasses as f } from "./navListStyles.js";
-import { cloneElement as p, createContext as m, isValidElement as h, useContext as g } from "react";
-import { jsx as _, jsxs as v } from "react/jsx-runtime";
+import { navListItemCountClasses as r, navListItemIconClasses as i, navListItemLabelClasses as a, navListItemTrailClasses as o, navListItemWrapClasses as s, navListLabelAlignments as c, navListSectionBrandBandClasses as l, navListSectionClasses as u, navListSectionLabelBrandClasses as d, navListSectionLabelClasses as f, navListSectionLabelDefaultClasses as p, navListSectionLabelRowClasses as m, navListShellClasses as h } from "./navListStyles.js";
+import { cloneElement as g, createContext as _, createElement as v, isValidElement as y, useContext as b } from "react";
+import { jsx as x, jsxs as S } from "react/jsx-runtime";
 //#region src/components/molecules/NavList/NavList.tsx
-var y = m({});
-function b({ icon: n, selected: r }) {
-	let a = h(n) ? p(n, {
+var C = _({});
+function w({ icon: n, selected: r }) {
+	let a = y(n) ? g(n, {
 		strokeWidth: r ? 2.25 : 1.75,
 		...r ? {
 			fill: "currentColor",
 			fillOpacity: .12
 		} : { fill: "none" }
 	}) : n;
-	return /* @__PURE__ */ _("span", {
+	return /* @__PURE__ */ x("span", {
 		className: e("inline-flex shrink-0", i(r)),
-		children: /* @__PURE__ */ _(t, {
+		children: /* @__PURE__ */ x(t, {
 			size: "sm",
 			children: a
 		})
 	});
 }
-function x({ label: e, labelAlign: t = "section" }) {
-	return t === "brand" ? /* @__PURE__ */ _("div", {
-		className: c,
-		children: /* @__PURE__ */ _("p", {
-			className: u,
-			children: e
-		})
-	}) : /* @__PURE__ */ _("p", {
-		className: d,
-		children: e
+function T({ label: t, labelAlign: n = "section", action: r }) {
+	return n === "brand" ? /* @__PURE__ */ S("div", {
+		className: e(l, r != null && "justify-between gap-2"),
+		children: [/* @__PURE__ */ x("p", {
+			className: d,
+			children: t
+		}), r]
+	}) : /* @__PURE__ */ S("div", {
+		className: e(p, m),
+		children: [/* @__PURE__ */ x("p", {
+			className: f,
+			children: t
+		}), r]
 	});
 }
-function S({ label: t, labelAlign: n = "section", children: r, className: i }) {
-	return /* @__PURE__ */ v("div", {
-		className: e(l, i),
-		children: [t == null ? null : /* @__PURE__ */ _(x, {
+function E({ label: t, labelAlign: n = "section", action: r, children: i, className: a }) {
+	return /* @__PURE__ */ S("div", {
+		className: e(u, a),
+		children: [t == null ? null : /* @__PURE__ */ x(T, {
 			label: t,
-			labelAlign: n
-		}), r]
+			labelAlign: n,
+			action: r
+		}), i]
 	});
 }
-function C({ id: t, label: i, icon: s, count: c, selected: l, onSelect: u, className: d }) {
-	let f = g(y), p = l ?? f.activeId === t, m = u ?? f.onSelect;
-	return /* @__PURE__ */ _("div", {
-		className: e(o, d),
-		children: /* @__PURE__ */ v(n, {
+function D(e, t) {
+	if (t != null && e != null && console.warn("[WMDS NavList] Pass `href` or `render` on an item, not both. `render` is used."), t != null) return t;
+	if (e != null) return v("a", { href: e });
+}
+function O({ id: t, label: i, icon: c, count: l, href: u, render: d, trailing: f, selected: p, onSelect: m, className: h }) {
+	let g = b(C), _ = p ?? g.activeId === t, v = m ?? g.onSelect, y = D(u, d);
+	return /* @__PURE__ */ x("div", {
+		className: e(s, h),
+		children: /* @__PURE__ */ S(n, {
 			layout: "nav",
 			type: "button",
-			selected: p,
-			onClick: m == null ? void 0 : () => m(t),
+			selected: _,
+			render: y,
+			onClick: v == null ? void 0 : () => v(t),
 			children: [
-				s == null ? null : /* @__PURE__ */ _(b, {
-					icon: s,
-					selected: p
+				c == null ? null : /* @__PURE__ */ x(w, {
+					icon: c,
+					selected: _
 				}),
-				/* @__PURE__ */ _("span", {
+				/* @__PURE__ */ x("span", {
 					className: a,
 					children: i
 				}),
-				c == null ? null : /* @__PURE__ */ _("span", {
-					className: r,
-					children: c.toLocaleString()
-				})
+				l != null || f != null ? /* @__PURE__ */ S("span", {
+					className: o,
+					children: [l == null ? null : /* @__PURE__ */ x("span", {
+						className: r,
+						children: l.toLocaleString()
+					}), f]
+				}) : null
 			]
 		})
 	});
 }
-function w({ sections: t, activeId: n, onSelect: r, children: i, "aria-label": a = "Section", className: o }) {
+function k({ sections: t, activeId: n, onSelect: r, children: i, "aria-label": a = "Section", className: o }) {
 	let s = {
 		activeId: n,
 		onSelect: r
 	};
-	return t == null ? /* @__PURE__ */ _("nav", {
+	return t == null ? /* @__PURE__ */ x("nav", {
 		"aria-label": a,
-		className: e(f, o),
-		children: /* @__PURE__ */ _(y.Provider, {
+		className: e(h, o),
+		children: /* @__PURE__ */ x(C.Provider, {
 			value: s,
 			children: i
 		})
-	}) : /* @__PURE__ */ _("nav", {
+	}) : /* @__PURE__ */ x("nav", {
 		"aria-label": a,
-		className: e(f, o),
-		children: /* @__PURE__ */ _(y.Provider, {
+		className: e(h, o),
+		children: /* @__PURE__ */ x(C.Provider, {
 			value: s,
-			children: t.map((e, t) => /* @__PURE__ */ _(S, {
+			children: t.map((e, t) => /* @__PURE__ */ x(E, {
 				label: e.label,
+				action: e.action,
 				labelAlign: e.labelAlign ?? (t === 0 && e.label != null ? "brand" : "section"),
-				children: e.items.map((e) => /* @__PURE__ */ _(C, { ...e }, e.id))
+				children: e.items.map((e) => /* @__PURE__ */ x(O, { ...e }, e.id))
 			}, e.label ?? t))
 		})
 	});
 }
-var T = Object.assign(w, {
-	Section: S,
-	Item: C
+var A = Object.assign(k, {
+	Section: E,
+	Item: O
 });
 //#endregion
-export { T as NavList, s as navListLabelAlignments };
+export { A as NavList, c as navListLabelAlignments };

package/dist/components/molecules/NavList/navListStyles.d.ts

@@ -10,6 +10,8 @@ export declare const navListSectionLabelBrandClasses: string;
 export declare const navListSectionLabelDefaultClasses: string;
 export declare const navListItemWrapClasses = "relative w-full px-2";
 export declare const navListItemLabelClasses = "min-w-0 flex-1 truncate text-left";
+export declare const navListItemTrailClasses = "ml-auto flex shrink-0 items-center gap-2";
 export declare const navListItemCountClasses: string;
+export declare const navListSectionLabelRowClasses = "flex items-center justify-between gap-2";
 export declare function navListItemIconClasses(selected: boolean): "text-muted" | "text-fg";
 //# sourceMappingURL=navListStyles.d.ts.map

package/dist/components/molecules/NavList/navListStyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"navListStyles.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/NavList/navListStyles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,sBAAsB,+BAAgC,CAAC;AAEpE,MAAM,MAAM,qBAAqB,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAC;AAE5E,oFAAoF;AACpF,eAAO,MAAM,mBAAmB,sCAAsC,CAAC;AAEvE,eAAO,MAAM,qBAAqB,wBAAwB,CAAC;AAE3D,kFAAkF;AAClF,eAAO,MAAM,8BAA8B,QAG1C,CAAC;AAEF,eAAO,MAAM,0BAA0B,QAAgD,CAAC;AAExF,eAAO,MAAM,+BAA+B,QAA6B,CAAC;AAE1E,eAAO,MAAM,iCAAiC,QAG7C,CAAC;AAEF,eAAO,MAAM,sBAAsB,yBAAyB,CAAC;AAE7D,eAAO,MAAM,uBAAuB,sCAAsC,CAAC;AAE3E,eAAO,MAAM,uBAAuB,QAInC,CAAC;AAEF,wBAAgB,sBAAsB,CAAC,QAAQ,EAAE,OAAO,4BAEvD"}
+{"version":3,"file":"navListStyles.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/NavList/navListStyles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,sBAAsB,+BAAgC,CAAC;AAEpE,MAAM,MAAM,qBAAqB,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAC;AAE5E,oFAAoF;AACpF,eAAO,MAAM,mBAAmB,sCAAsC,CAAC;AAEvE,eAAO,MAAM,qBAAqB,wBAAwB,CAAC;AAE3D,kFAAkF;AAClF,eAAO,MAAM,8BAA8B,QAG1C,CAAC;AAEF,eAAO,MAAM,0BAA0B,QAAgD,CAAC;AAExF,eAAO,MAAM,+BAA+B,QAA6B,CAAC;AAE1E,eAAO,MAAM,iCAAiC,QAG7C,CAAC;AAEF,eAAO,MAAM,sBAAsB,yBAAyB,CAAC;AAE7D,eAAO,MAAM,uBAAuB,sCAAsC,CAAC;AAE3E,eAAO,MAAM,uBAAuB,6CAA6C,CAAC;AAElF,eAAO,MAAM,uBAAuB,QAInC,CAAC;AAEF,eAAO,MAAM,6BAA6B,4CAA4C,CAAC;AAEvF,wBAAgB,sBAAsB,CAAC,QAAQ,EAAE,OAAO,4BAEvD"}

package/dist/components/molecules/NavList/navListStyles.js

@@ -3,9 +3,9 @@ import { cn as e } from "../../../lib/cn.js";
 import { typographyClass as t } from "../../../lib/typography.js";
 import { pageHeaderAppBandHeightClasses as n } from "../PageHeader/pageHeaderStyles.js";
 //#region src/components/molecules/NavList/navListStyles.ts
-var r = ["brand", "section"], i = "flex h-full min-h-0 w-52 flex-col", a = "flex flex-col gap-1", o = e("box-border flex shrink-0 items-center px-4", n), s = e(t("overline"), "text-muted"), c = s, l = e(s, "px-4 pb-1 pt-3"), u = "relative w-full px-2", d = "min-w-0 flex-1 truncate text-left", f = e("ml-auto tabular-nums", t("caption"), "text-muted");
-function p(e) {
+var r = ["brand", "section"], i = "flex h-full min-h-0 w-52 flex-col", a = "flex flex-col gap-1", o = e("box-border flex shrink-0 items-center px-4", n), s = e(t("overline"), "text-muted"), c = s, l = e(s, "px-4 pb-1 pt-3"), u = "relative w-full px-2", d = "min-w-0 flex-1 truncate text-left", f = "ml-auto flex shrink-0 items-center gap-2", p = e("tabular-nums", t("caption"), "text-muted"), m = "flex items-center justify-between gap-2";
+function h(e) {
 	return e ? "text-fg" : "text-muted";
 }
 //#endregion
-export { f as navListItemCountClasses, p as navListItemIconClasses, d as navListItemLabelClasses, u as navListItemWrapClasses, r as navListLabelAlignments, o as navListSectionBrandBandClasses, a as navListSectionClasses, c as navListSectionLabelBrandClasses, s as navListSectionLabelClasses, l as navListSectionLabelDefaultClasses, i as navListShellClasses };
+export { p as navListItemCountClasses, h as navListItemIconClasses, d as navListItemLabelClasses, f as navListItemTrailClasses, u as navListItemWrapClasses, r as navListLabelAlignments, o as navListSectionBrandBandClasses, a as navListSectionClasses, c as navListSectionLabelBrandClasses, s as navListSectionLabelClasses, l as navListSectionLabelDefaultClasses, m as navListSectionLabelRowClasses, i as navListShellClasses };

package/dist/components/molecules/PageHeader/PageHeader.js

@@ -9,10 +9,10 @@ var l = {
 	toolbar: "span"
 };
 function u({ title: t, variant: o = "page", start: u, end: d, "aria-label": f, className: p }) {
-	let m = l[o], h = t != null && t.length > 0, g = h ? void 0 : f;
+	let m = l[o], h = t != null && t.length > 0;
 	return o === "toolbar" ? /* @__PURE__ */ c("div", {
 		role: "toolbar",
-		"aria-label": g,
+		"aria-label": h ? void 0 : f,
 		className: e(r.toolbar, p),
 		children: [u != null || h ? /* @__PURE__ */ c("div", {
 			className: i,
@@ -25,7 +25,7 @@ function u({ title: t, variant: o = "page", start: u, end: d, "aria-label": f, c
 			children: d
 		})]
 	}) : /* @__PURE__ */ c("header", {
-		"aria-label": g,
+		"aria-label": f,
 		className: e(r[o], p),
 		children: [/* @__PURE__ */ c("div", {
 			className: i,

package/dist/components/molecules/SegmentedControl/segmentedControlStyles.js

@@ -1,21 +1,21 @@
 "use client";
 import { cn as e } from "../../../lib/cn.js";
-import { motionTransition as t } from "../../../lib/motion.js";
-import { clusterHeightClasses as n } from "../../../lib/clusterScale.js";
+import { clusterHeightClasses as t } from "../../../lib/clusterScale.js";
+import { motionTransition as n } from "../../../lib/motion.js";
 //#region src/components/molecules/SegmentedControl/segmentedControlStyles.ts
 var r = [
 	"sm",
 	"md",
 	"lg"
-], i = ["hug", "stretch"], a = e("relative inline-flex items-stretch rounded-full bg-body p-0.5 shadow-hairline", t("fast")), o = "flex w-full min-w-0", s = {
-	sm: n.sm,
-	md: n.md,
-	lg: n.lg
+], i = ["hug", "stretch"], a = e("relative inline-flex items-stretch rounded-full bg-body p-0.5 shadow-hairline", n("fast")), o = "flex w-full min-w-0", s = {
+	sm: t.sm,
+	md: t.md,
+	lg: t.lg
 }, c = {
 	sm: "px-2.5 text-xs leading-none",
 	md: "px-3 text-sm leading-none",
 	lg: "px-4 text-sm leading-none"
-}, l = e("relative inline-flex shrink-0 cursor-pointer items-center justify-center rounded-full font-sans font-medium tracking-normal", "transition-[color] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus-visible:ring-inset", t("fast")), u = "min-w-0 flex-1", d = "relative z-10 inline-flex min-w-0 items-center justify-center", f = "w-full", p = {
+}, l = e("relative inline-flex shrink-0 cursor-pointer items-center justify-center rounded-full font-sans font-medium tracking-normal", "transition-[color] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus-visible:ring-inset", n("fast")), u = "min-w-0 flex-1", d = "relative z-10 inline-flex min-w-0 items-center justify-center", f = "w-full", p = {
 	sm: "gap-1",
 	md: "gap-1.5",
 	lg: "gap-2"

package/dist/components/molecules/Stat/Stat.d.ts

@@ -7,10 +7,18 @@ export type StatLayoutClassName = string;
 export interface StatTrend {
     /** Trend copy — e.g. `+2.1%` or `-0.8%`. */
     value: string;
+    /** `up` / `down` tint the badge. `neutral` and `flat` stay muted. */
     direction?: StatTrendDirection;
-    /** Optional context — exposed as `title` on the trend badge for sighted tooltips. */
+    /** Optional tooltip on the trend badge. Visible "vs" copy belongs on `context`. */
     label?: string;
 }
+/** Replaces the figure when the metric source is not wired. */
+export interface StatUnavailable {
+    /** Stand-in for the figure. Default `Not connected`. */
+    label?: string;
+    /** Why the figure is missing — visible under the stand-in. */
+    reason: string;
+}
 export interface StatProps {
     /** Metric name — e.g. Followers, ER, Reach. */
     label: string;
@@ -18,9 +26,25 @@ export interface StatProps {
     value: ReactNode;
     /** Compact delta — **Badge** `emphasis="muted"` in the value row. */
     trend?: StatTrend;
-    /** Leading slot — inline with the label row. */
+    /**
+     * Visible secondary line under the figure — e.g. `vs $14,850` or `of $1M goal`.
+     * Tabular figures. Hidden while `unavailable` is set (the reason takes this line).
+     */
+    context?: ReactNode;
+    /**
+     * One tabular line under the figure — for example "3 new" or "vs last scan".
+     * Hidden while `loading` or `unavailable`.
+     */
+    detail?: ReactNode;
+    /** Leading tile — pass a Lucide glyph. Composed with **ButtonIcon**. */
+    icon?: ReactNode;
+    /** Label-row action — pass **Button** `size="sm"` (e.g. View details). */
+    action?: ReactNode;
+    /** Replaces the figure and hides `trend`, `context`, and `detail` when the source is not wired. */
+    unavailable?: StatUnavailable;
+    /** Leading slot — inline with the label row, after `icon`. */
     start?: ReactNode;
-    /** Trailing slot — inline with the label row (e.g. share, kebab). */
+    /** Trailing slot — inline with the label row, before `action`. */
     end?: ReactNode;
     size?: StatSize;
     /** Skeleton label + value — sets `aria-busy` on the tile. */
@@ -35,11 +59,13 @@ export interface StatGroupProps {
     columns?: StatGroupColumns;
     className?: StatLayoutClassName;
 }
-declare function StatRoot({ label, value, trend, start, end, size, loading, className, }: StatProps): import("react").JSX.Element;
+declare function StatRoot({ label, value, trend, context, detail, icon, action, unavailable, start, end, size, loading, className, }: StatProps): import("react").JSX.Element;
 declare function StatGroup({ children, "aria-label": ariaLabel, columns, className, }: StatGroupProps): import("react").JSX.Element;
 /**
  * At-a-glance metric tile — label, headline value, optional muted trend badge.
- * Compose in **Stat.Group** for insights rows; pair **Card** + **Chart** below for history.
+ * `size="lg"` is the hero figure (`type-display-3`, tabular). `context` is the visible
+ * "vs" line. `detail` is one tabular line under the figure. Compose in **Stat.Group**
+ * for insights rows; pair **Card** + **Chart** below for history.
  */
 export declare const Stat: typeof StatRoot & {
     Group: typeof StatGroup;

package/dist/components/molecules/Stat/Stat.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Stat.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/Stat/Stat.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,EAeL,KAAK,gBAAgB,EACrB,KAAK,QAAQ,EACb,KAAK,kBAAkB,EACxB,MAAM,cAAc,CAAC;AAEtB,YAAY,EACV,gBAAgB,EAChB,QAAQ,EACR,kBAAkB,GACnB,MAAM,cAAc,CAAC;AACtB,OAAO,EACL,gBAAgB,EAChB,oBAAoB,EACpB,SAAS,EACT,mBAAmB,GACpB,MAAM,cAAc,CAAC;AAEtB,2EAA2E;AAC3E,MAAM,MAAM,mBAAmB,GAAG,MAAM,CAAC;AAEzC,MAAM,WAAW,SAAS;IACxB,4CAA4C;IAC5C,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,qFAAqF;IACrF,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,SAAS;IACxB,+CAA+C;IAC/C,KAAK,EAAE,MAAM,CAAC;IACd,wDAAwD;IACxD,KAAK,EAAE,SAAS,CAAC;IACjB,qEAAqE;IACrE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,gDAAgD;IAChD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,qEAAqE;IACrE,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,6DAA6D;IAC7D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,mBAAmB,CAAC;CACjC;AAED,MAAM,WAAW,cAAc;IAC7B,QAAQ,EAAE,SAAS,CAAC;IACpB,2FAA2F;IAC3F,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6DAA6D;IAC7D,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,SAAS,CAAC,EAAE,mBAAmB,CAAC;CACjC;AAiCD,iBAAS,QAAQ,CAAC,EAChB,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,GAAG,EACH,IAAW,EACX,OAAe,EACf,SAAS,GACV,EAAE,SAAS,+BA0BX;AAED,iBAAS,SAAS,CAAC,EACjB,QAAQ,EACR,YAAY,EAAE,SAAS,EACvB,OAAW,EACX,SAAS,GACV,EAAE,cAAc,+BAUhB;AAED;;;GAGG;AACH,eAAO,MAAM,IAAI;;CAEf,CAAC"}
+{"version":3,"file":"Stat.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/Stat/Stat.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,OAAO,EAyBL,KAAK,gBAAgB,EACrB,KAAK,QAAQ,EACb,KAAK,kBAAkB,EACxB,MAAM,cAAc,CAAC;AAEtB,YAAY,EACV,gBAAgB,EAChB,QAAQ,EACR,kBAAkB,GACnB,MAAM,cAAc,CAAC;AACtB,OAAO,EACL,gBAAgB,EAChB,oBAAoB,EACpB,SAAS,EACT,mBAAmB,GACpB,MAAM,cAAc,CAAC;AAEtB,2EAA2E;AAC3E,MAAM,MAAM,mBAAmB,GAAG,MAAM,CAAC;AAEzC,MAAM,WAAW,SAAS;IACxB,4CAA4C;IAC5C,KAAK,EAAE,MAAM,CAAC;IACd,qEAAqE;IACrE,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,mFAAmF;IACnF,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,+DAA+D;AAC/D,MAAM,WAAW,eAAe;IAC9B,wDAAwD;IACxD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8DAA8D;IAC9D,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,SAAS;IACxB,+CAA+C;IAC/C,KAAK,EAAE,MAAM,CAAC;IACd,wDAAwD;IACxD,KAAK,EAAE,SAAS,CAAC;IACjB,qEAAqE;IACrE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,wEAAwE;IACxE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,0EAA0E;IAC1E,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,mGAAmG;IACnG,WAAW,CAAC,EAAE,eAAe,CAAC;IAC9B,8DAA8D;IAC9D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kEAAkE;IAClE,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,6DAA6D;IAC7D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,mBAAmB,CAAC;CACjC;AAED,MAAM,WAAW,cAAc;IAC7B,QAAQ,EAAE,SAAS,CAAC;IACpB,2FAA2F;IAC3F,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6DAA6D;IAC7D,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,SAAS,CAAC,EAAE,mBAAmB,CAAC;CACjC;AAoCD,iBAAS,QAAQ,CAAC,EAChB,KAAK,EACL,KAAK,EACL,KAAK,EACL,OAAO,EACP,MAAM,EACN,IAAI,EACJ,MAAM,EACN,WAAW,EACX,KAAK,EACL,GAAG,EACH,IAAW,EACX,OAAe,EACf,SAAS,GACV,EAAE,SAAS,+BAmDX;AAED,iBAAS,SAAS,CAAC,EACjB,QAAQ,EACR,YAAY,EAAE,SAAS,EACvB,OAAW,EACX,SAAS,GACV,EAAE,cAAc,+BAUhB;AAED;;;;;GAKG;AACH,eAAO,MAAM,IAAI;;CAEf,CAAC"}

package/dist/components/molecules/Stat/Stat.js

@@ -1,76 +1,110 @@
 "use client";
 import { cn as e } from "../../../lib/cn.js";
 import { Badge as t } from "../../atoms/Badge/Badge.js";
-import { Skeleton as n } from "../../atoms/Skeleton/Skeleton.js";
-import { statContentClasses as r, statGroupColumns as i, statGroupGridClasses as a, statLabelClasses as o, statLabelEndClasses as s, statLabelRowClasses as c, statLabelStartClasses as l, statLabelTextClasses as u, statLoadingLabelHeights as d, statLoadingValueHeights as f, statShellClasses as p, statShellSizeClasses as m, statSizes as h, statTrendBadgeVariant as g, statTrendDirections as _, statValueRowClasses as v, statValueSizeClasses as y } from "./statStyles.js";
-import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
+import { ButtonIcon as n } from "../../atoms/Button/ButtonIcon.js";
+import { Skeleton as r } from "../../atoms/Skeleton/Skeleton.js";
+import { statContentClasses as i, statContextClasses as a, statDetailClasses as o, statGroupColumns as s, statGroupGridClasses as c, statIconButtonSize as l, statIconTileClasses as u, statIconTileSizeClasses as d, statLabelClasses as f, statLabelEndClasses as p, statLabelLgClasses as m, statLabelRowClasses as h, statLabelStartClasses as g, statLabelTextClasses as _, statLabelTrailClasses as v, statLoadingLabelHeights as y, statLoadingValueHeights as b, statShellClasses as x, statShellSizeClasses as S, statSizes as C, statTrendBadgeVariant as w, statTrendDirections as T, statUnavailableClasses as E, statValueRowClasses as D, statValueSizeClasses as O } from "./statStyles.js";
+import { Fragment as k, jsx as A, jsxs as j } from "react/jsx-runtime";
 //#region src/components/molecules/Stat/Stat.tsx
-function C({ trend: e }) {
+function M({ trend: e }) {
 	let n = e.direction ?? "neutral";
-	return /* @__PURE__ */ x("span", {
+	return /* @__PURE__ */ A("span", {
 		title: e.label,
-		children: /* @__PURE__ */ x(t, {
+		children: /* @__PURE__ */ A(t, {
 			size: "sm",
 			emphasis: "muted",
-			variant: g(n),
+			variant: w(n),
 			children: e.value
 		})
 	});
 }
-function w({ size: e, index: t = 0 }) {
-	return /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(n, {
-		width: "45%",
-		height: d[e],
-		radius: "inner",
-		index: t
-	}), /* @__PURE__ */ x(n, {
-		width: "70%",
-		height: f[e],
-		radius: "inner",
-		index: t + 1
-	})] });
+function N({ size: e, index: t = 0 }) {
+	return /* @__PURE__ */ j(k, { children: [
+		/* @__PURE__ */ A(r, {
+			width: "45%",
+			height: y[e],
+			radius: "inner",
+			index: t
+		}),
+		/* @__PURE__ */ A(r, {
+			width: "70%",
+			height: b[e],
+			radius: "inner",
+			index: t + 1
+		}),
+		e === "lg" ? /* @__PURE__ */ A(r, {
+			width: "40%",
+			height: 16,
+			radius: "inner",
+			index: t + 2
+		}) : null
+	] });
 }
-function T({ label: t, value: n, trend: i, start: a, end: d, size: f = "sm", loading: h = !1, className: g }) {
-	return /* @__PURE__ */ x("article", {
-		className: e(p, m[f], g),
-		"aria-busy": h || void 0,
-		"aria-label": h ? t : void 0,
-		children: /* @__PURE__ */ x("div", {
-			className: r,
-			children: h ? /* @__PURE__ */ x(w, { size: f }) : /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ S("div", {
-				className: c,
+function P({ label: t, value: r, trend: s, context: c, detail: y, icon: b, action: C, unavailable: w, start: T, end: P, size: F = "sm", loading: I = !1, className: L }) {
+	let R = P != null || C != null;
+	return /* @__PURE__ */ A("article", {
+		className: e(x, S[F], L),
+		"aria-busy": I || void 0,
+		"aria-label": I ? t : void 0,
+		children: /* @__PURE__ */ A("div", {
+			className: e(i, F === "lg" && "gap-2"),
+			children: I ? /* @__PURE__ */ A(N, { size: F }) : /* @__PURE__ */ j(k, { children: [/* @__PURE__ */ j("div", {
+				className: h,
 				children: [
-					a == null ? null : /* @__PURE__ */ x("div", {
-						className: l,
-						children: a
+					b == null ? null : /* @__PURE__ */ A("span", {
+						className: e(u, d[F]),
+						children: /* @__PURE__ */ A(n, {
+							size: l[F],
+							children: b
+						})
 					}),
-					/* @__PURE__ */ x("span", {
-						className: e(o, u),
+					T == null ? null : /* @__PURE__ */ A("div", {
+						className: g,
+						children: T
+					}),
+					/* @__PURE__ */ A("span", {
+						className: F === "lg" ? m : e(f, _),
 						children: t
 					}),
-					d == null ? null : /* @__PURE__ */ x("div", {
-						className: s,
-						children: d
-					})
+					R ? /* @__PURE__ */ j("div", {
+						className: C == null ? p : v,
+						children: [P, C]
+					}) : null
 				]
-			}), /* @__PURE__ */ S("div", {
-				className: v,
-				children: [/* @__PURE__ */ x("span", {
-					className: y[f],
-					children: n
-				}), i == null ? null : /* @__PURE__ */ x(C, { trend: i })]
-			})] })
+			}), w == null ? /* @__PURE__ */ j(k, { children: [
+				/* @__PURE__ */ j("div", {
+					className: D,
+					children: [/* @__PURE__ */ A("span", {
+						className: O[F],
+						children: r
+					}), s == null ? null : /* @__PURE__ */ A(M, { trend: s })]
+				}),
+				c == null ? null : /* @__PURE__ */ A("p", {
+					className: a,
+					children: c
+				}),
+				y == null ? null : /* @__PURE__ */ A("p", {
+					className: o,
+					children: y
+				})
+			] }) : /* @__PURE__ */ j(k, { children: [/* @__PURE__ */ A("p", {
+				className: E,
+				children: w.label ?? "Not connected"
+			}), /* @__PURE__ */ A("p", {
+				className: a,
+				children: w.reason
+			})] })] })
 		})
 	});
 }
-function E({ children: t, "aria-label": n, columns: r = 4, className: i }) {
-	return /* @__PURE__ */ x("div", {
-		className: e(a(r), i),
+function F({ children: t, "aria-label": n, columns: r = 4, className: i }) {
+	return /* @__PURE__ */ A("div", {
+		className: e(c(r), i),
 		role: n == null ? void 0 : "group",
 		"aria-label": n,
 		children: t
 	});
 }
-var D = Object.assign(T, { Group: E });
+var I = Object.assign(P, { Group: F });
 //#endregion
-export { D as Stat, i as statGroupColumns, a as statGroupGridClasses, h as statSizes, _ as statTrendDirections };
+export { I as Stat, s as statGroupColumns, c as statGroupGridClasses, C as statSizes, T as statTrendDirections };