npm - @mediaradar/design-components - Versions diffs - 0.13.0 → 0.15.0 - Mend

@mediaradar/design-components 0.13.0 → 0.15.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/dist/index.js CHANGED Viewed

@@ -403,7 +403,7 @@ function cn(...inputs) {
 }
 // src/Badge.tsx
-import { jsx as jsx4 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 var TONE = {
   neutral: "bg-subtle text-text-secondary",
   brand: "bg-brand-primarySoft text-brand-primaryAction",
@@ -442,17 +442,22 @@ var TONE_STYLE = {
   }
 };
 var KIND = {
-  label: "px-2 py-0.5",
+  // Twice the vertical room the first version had. At py-0.5 the pill hugged
+  // its text and read as a tight little tag; at py-1 it reads as a deliberate
+  // object. Taken from the status pills the product had already arrived at by
+  // hand, which were noticeably more comfortable than anything else -- the
+  // breathing room was what made them so, not their extra pixel of type.
+  label: "px-2.5 py-1",
   // Square-ish and centred, with a floor width so a 1-digit and a 3-digit
   // count are the same shape, and lining figures so the width does not shift
   // as the number changes.
   count: "h-[18px] min-w-[18px] justify-center px-1.5 tabular-nums",
   // The only kind that shouts. Caps need the letterspacing -- caps set tight
   // are harder to read than the sentence case they replaced.
-  eyebrow: "px-2 py-0.5 uppercase tracking-wider"
+  eyebrow: "px-2.5 py-1 uppercase tracking-wider"
 };
-function Badge({ tone = "neutral", kind = "label", children, className }) {
-  return /* @__PURE__ */ jsx4(
+function Badge({ tone = "neutral", kind = "label", dot = false, children, className }) {
+  return /* @__PURE__ */ jsxs4(
     "span",
     {
       style: TONE_STYLE[tone],
@@ -466,7 +471,10 @@ function Badge({ tone = "neutral", kind = "label", children, className }) {
         KIND[kind],
         className
       ),
-      children
+      children: [
+        dot && /* @__PURE__ */ jsx4("span", { "aria-hidden": "true", className: "size-1.5 shrink-0 rounded-full bg-current" }),
+        children
+      ]
     }
   );
 }
@@ -532,7 +540,7 @@ function CheckBoxBox({ checked, indeterminate, disabled, className }) {
 // src/DateRangeFilter.tsx
 import { useEffect as useEffect3, useMemo as useMemo2, useRef as useRef3, useState as useState3 } from "react";
 import { ChevronDown as ChevronDown2, ChevronLeft, ChevronRight } from "lucide-react";
-import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
 var DEFAULT_SHORTCUTS = [
   "Year to date",
   "Rolling 3 months",
@@ -738,8 +746,8 @@ function DateRangeFilter({
     onRangeChange?.(s, e);
     setOpen(false);
   };
-  return /* @__PURE__ */ jsxs4("div", { className: "relative", ref, children: [
-    /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsxs5("div", { className: "relative", ref, children: [
+    /* @__PURE__ */ jsxs5(
       "button",
       {
         type: "button",
@@ -749,7 +757,7 @@ function DateRangeFilter({
         className: "flex h-11 items-center gap-2 rounded-control border border-border-strong bg-input px-2.5 text-text-secondary transition-colors hover:bg-subtle hover:text-text-primary focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-border-focus",
         children: [
           icon && /* @__PURE__ */ jsx6("span", { className: "shrink-0 text-text-tertiary", children: icon }),
-          /* @__PURE__ */ jsxs4("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+          /* @__PURE__ */ jsxs5("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
             /* @__PURE__ */ jsx6("span", { className: showDates ? "text-[11px] text-text-tertiary" : "text-[10px] uppercase tracking-wide text-text-tertiary", children: showDates ? displayDatesLine : caption }),
             /* @__PURE__ */ jsx6("span", { className: "text-[12px] font-medium text-text-primary", children: displayValue })
           ] }),
@@ -757,7 +765,7 @@ function DateRangeFilter({
         ]
       }
     ),
-    open && /* @__PURE__ */ jsxs4(
+    open && /* @__PURE__ */ jsxs5(
       "div",
       {
         "data-testid": testIdPrefix && `${testIdPrefix}-popover`,
@@ -776,8 +784,8 @@ function DateRangeFilter({
             },
             s
           )) }),
-          /* @__PURE__ */ jsxs4("div", { className: "flex flex-col p-4", children: [
-            /* @__PURE__ */ jsxs4("div", { className: "flex items-end gap-3", children: [
+          /* @__PURE__ */ jsxs5("div", { className: "flex flex-col p-4", children: [
+            /* @__PURE__ */ jsxs5("div", { className: "flex items-end gap-3", children: [
               /* @__PURE__ */ jsx6(Field, { label: "Start Date", value: start ? fmt(start) : "\u2014" }),
               /* @__PURE__ */ jsx6("span", { className: "pb-2.5 text-text-tertiary", children: "\u2014" }),
               /* @__PURE__ */ jsx6(Field, { label: "End Date", value: end ? fmt(end) : start ? fmt(start) : "\u2014" })
@@ -786,17 +794,17 @@ function DateRangeFilter({
             /* @__PURE__ */ jsx6("div", { className: "flex gap-8", children: [0, 1].map((offset) => {
               const m = addMonths(leftMonth, offset);
               const grid = monthGrid(m.getFullYear(), m.getMonth());
-              return /* @__PURE__ */ jsxs4("div", { className: "w-[252px]", children: [
-                /* @__PURE__ */ jsxs4("div", { className: "mb-2 flex items-center justify-between", children: [
+              return /* @__PURE__ */ jsxs5("div", { className: "w-[252px]", children: [
+                /* @__PURE__ */ jsxs5("div", { className: "mb-2 flex items-center justify-between", children: [
                   offset === 0 ? /* @__PURE__ */ jsx6(NavBtn, { onClick: () => setLeftMonth(addMonths(leftMonth, -1)), "aria-label": "Previous month", children: /* @__PURE__ */ jsx6(ChevronLeft, { size: 16 }) }) : /* @__PURE__ */ jsx6("span", { className: "h-7 w-7" }),
-                  /* @__PURE__ */ jsxs4("span", { className: "text-[15px] font-semibold text-text-primary", children: [
+                  /* @__PURE__ */ jsxs5("span", { className: "text-[15px] font-semibold text-text-primary", children: [
                     MONTHS[m.getMonth()],
                     " ",
                     m.getFullYear()
                   ] }),
                   offset === 1 ? /* @__PURE__ */ jsx6(NavBtn, { onClick: () => setLeftMonth(addMonths(leftMonth, 1)), "aria-label": "Next month", children: /* @__PURE__ */ jsx6(ChevronRight, { size: 16 }) }) : /* @__PURE__ */ jsx6("span", { className: "h-7 w-7" })
                 ] }),
-                /* @__PURE__ */ jsxs4("div", { className: "grid grid-cols-7", children: [
+                /* @__PURE__ */ jsxs5("div", { className: "grid grid-cols-7", children: [
                   WEEKDAYS.map((w) => /* @__PURE__ */ jsx6("div", { className: "flex h-8 items-center justify-center text-[12px] font-semibold text-text-secondary", children: w }, w)),
                   grid.map((d, i) => {
                     const inMonth = d.getMonth() === m.getMonth();
@@ -812,7 +820,7 @@ function DateRangeFilter({
                       else if (end && isEnd) band = "left-0 right-1/2";
                       else band = "left-0 right-0";
                     }
-                    return /* @__PURE__ */ jsxs4("button", { type: "button", onClick: () => pickDay(d), className: "relative flex h-9 items-center justify-center", children: [
+                    return /* @__PURE__ */ jsxs5("button", { type: "button", onClick: () => pickDay(d), className: "relative flex h-9 items-center justify-center", children: [
                       band && /* @__PURE__ */ jsx6("span", { className: `absolute inset-y-[3px] bg-ai-tint ${band}`, "aria-hidden": "true" }),
                       /* @__PURE__ */ jsx6(
                         "span",
@@ -826,7 +834,7 @@ function DateRangeFilter({
                 ] })
               ] }, offset);
             }) }),
-            /* @__PURE__ */ jsxs4("div", { className: "mt-4 flex justify-end gap-2", children: [
+            /* @__PURE__ */ jsxs5("div", { className: "mt-4 flex justify-end gap-2", children: [
               /* @__PURE__ */ jsx6("button", { type: "button", "data-testid": testIdPrefix && `${testIdPrefix}-cancel`, onClick: () => setOpen(false), className: "rounded-control border border-border-default bg-surface px-5 py-2 text-[13px] font-semibold text-text-primary transition-colors hover:bg-subtle", children: "Cancel" }),
               /* @__PURE__ */ jsx6("button", { type: "button", "data-testid": testIdPrefix && `${testIdPrefix}-apply`, onClick: apply, className: "rounded-control bg-brand-primaryAction px-5 py-2 text-[13px] font-semibold text-white transition-[filter] hover:brightness-110", children: "Apply" })
             ] })
@@ -837,7 +845,7 @@ function DateRangeFilter({
   ] });
 }
 function Field({ label, value }) {
-  return /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-1.5", children: [
+  return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-1.5", children: [
     /* @__PURE__ */ jsx6("span", { className: "text-[12px] font-medium text-text-secondary", children: label }),
     /* @__PURE__ */ jsx6("div", { className: "flex h-10 min-w-[140px] items-center rounded-control border border-border-default bg-input px-3 text-[14px] font-medium text-text-primary", children: value })
   ] });
@@ -849,7 +857,7 @@ function NavBtn({ children, onClick, ...rest }) {
 // src/SearchBar.tsx
 import { useEffect as useEffect4, useRef as useRef4, useState as useState4 } from "react";
 import { AlertCircle, Check as Check3, ChevronDown as ChevronDown3, Search as Search3 } from "lucide-react";
-import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
 var DEFAULT_SEARCH_MATCH = { mode: "anyWord", wordJoin: "Or" };
 var MODE_LABEL = {
   anyWord: "Any Word",
@@ -886,7 +894,7 @@ function SearchBar({
     };
   }, [open]);
   const showMatch = variant === "filterable" && matchValue;
-  return /* @__PURE__ */ jsxs5(
+  return /* @__PURE__ */ jsxs6(
     "div",
     {
       className: cx2(
@@ -894,7 +902,7 @@ function SearchBar({
         className
       ),
       children: [
-        /* @__PURE__ */ jsxs5("label", { className: "flex min-w-0 flex-1 items-center gap-2 px-2.5", children: [
+        /* @__PURE__ */ jsxs6("label", { className: "flex min-w-0 flex-1 items-center gap-2 px-2.5", children: [
           /* @__PURE__ */ jsx7(Search3, { size: 15, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }),
           /* @__PURE__ */ jsx7(
             "input",
@@ -920,8 +928,8 @@ function SearchBar({
         // token package (insights-studio-prototype's own src/index.css;
         // mr-clientapps' own tailwind.config.ts `colors.border.DEFAULT`) --
         // an alias this shared component can't rely on existing.
-        /* @__PURE__ */ jsxs5("div", { className: "relative shrink-0 border-l border-border-default", ref, children: [
-          /* @__PURE__ */ jsxs5(
+        /* @__PURE__ */ jsxs6("div", { className: "relative shrink-0 border-l border-border-default", ref, children: [
+          /* @__PURE__ */ jsxs6(
             "button",
             {
               type: "button",
@@ -950,7 +958,7 @@ function SearchBar({
               "aria-label": "Search match type",
               "data-testid": testIdPrefix && `${testIdPrefix}-mode-popover`,
               className: "absolute right-0 top-[calc(100%+8px)] z-50 w-[400px] rounded-card border border-border-default bg-surface p-3 shadow-overlay",
-              children: /* @__PURE__ */ jsxs5("div", { role: "radiogroup", "aria-label": "Search match type", className: "flex flex-col", children: [
+              children: /* @__PURE__ */ jsxs6("div", { role: "radiogroup", "aria-label": "Search match type", className: "flex flex-col", children: [
                 /* @__PURE__ */ jsx7(
                   ModeRow,
                   {
@@ -960,7 +968,7 @@ function SearchBar({
                     testId: testIdPrefix && `${testIdPrefix}-mode-anyWord`,
                     description: /* @__PURE__ */ jsx7(Fragment3, { children: "Find creatives that contain your keyword(s) using an \u201COr\u201D (match any) or \u201CAnd\u201D (match all) conditional in any order." }),
                     infoText: "The Or/And choice applies only when Any Word is the active search mode.",
-                    extra: /* @__PURE__ */ jsxs5("span", { className: "flex items-center gap-3", children: [
+                    extra: /* @__PURE__ */ jsxs6("span", { className: "flex items-center gap-3", children: [
                       /* @__PURE__ */ jsx7(
                         RadioOption,
                         {
@@ -1040,7 +1048,7 @@ function ModeRow({
   onSelect,
   testId
 }) {
-  return /* @__PURE__ */ jsxs5(
+  return /* @__PURE__ */ jsxs6(
     "div",
     {
       role: "radio",
@@ -1056,9 +1064,9 @@ function ModeRow({
       },
       className: "flex cursor-pointer flex-col items-stretch gap-1 rounded-control p-1.5 text-left transition-colors hover:bg-subtle focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-border-focus",
       children: [
-        /* @__PURE__ */ jsxs5("div", { className: "flex items-center justify-between gap-2", children: [
-          /* @__PURE__ */ jsxs5("div", { className: "flex flex-wrap items-center gap-3", children: [
-            /* @__PURE__ */ jsxs5("span", { className: "flex items-center gap-1", children: [
+        /* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-between gap-2", children: [
+          /* @__PURE__ */ jsxs6("div", { className: "flex flex-wrap items-center gap-3", children: [
+            /* @__PURE__ */ jsxs6("span", { className: "flex items-center gap-1", children: [
               /* @__PURE__ */ jsx7("span", { className: "text-[14px] font-semibold text-text-primary", children: title }),
               /* @__PURE__ */ jsx7(RowInfoTip, { text: infoText })
             ] }),
@@ -1078,7 +1086,7 @@ function RadioOption({
   onSelect,
   testId
 }) {
-  return /* @__PURE__ */ jsxs5(
+  return /* @__PURE__ */ jsxs6(
     "button",
     {
       type: "button",
@@ -1117,7 +1125,7 @@ function RowInfoTip({ text }) {
     window.addEventListener("mousedown", onDown);
     return () => window.removeEventListener("mousedown", onDown);
   }, [open]);
-  return /* @__PURE__ */ jsxs5("span", { className: "relative inline-flex shrink-0 items-center", ref, children: [
+  return /* @__PURE__ */ jsxs6("span", { className: "relative inline-flex shrink-0 items-center", ref, children: [
     /* @__PURE__ */ jsx7(
       "button",
       {
@@ -1146,7 +1154,7 @@ function RowInfoTip({ text }) {
 // src/SectionRail.tsx
 import { useRef as useRef5 } from "react";
 import { ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight2 } from "lucide-react";
-import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
 function SectionRail({
   title,
   titleSerif,
@@ -1159,9 +1167,9 @@ function SectionRail({
   const scroll = (direction) => {
     scrollRef.current?.scrollBy({ left: direction * 320, behavior: "smooth" });
   };
-  return /* @__PURE__ */ jsxs6("section", { className: "flex flex-col gap-4", children: [
-    /* @__PURE__ */ jsxs6("header", { className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between", children: [
-      /* @__PURE__ */ jsxs6("div", { children: [
+  return /* @__PURE__ */ jsxs7("section", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ jsxs7("header", { className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between", children: [
+      /* @__PURE__ */ jsxs7("div", { children: [
         /* @__PURE__ */ jsx8(
           "h2",
           {
@@ -1171,8 +1179,8 @@ function SectionRail({
         ),
         /* @__PURE__ */ jsx8("p", { className: "mt-1 text-sm text-text-secondary", children: subtitle })
       ] }),
-      /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
-        viewAllLabel && viewAllHref && /* @__PURE__ */ jsxs6(
+      /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2", children: [
+        viewAllLabel && viewAllHref && /* @__PURE__ */ jsxs7(
           "a",
           {
             href: viewAllHref,
@@ -1219,7 +1227,7 @@ function SectionRail({
 // src/DataScopeFilter.tsx
 import { useEffect as useEffect5, useRef as useRef6, useState as useState5 } from "react";
 import { Check as Check4, ChevronDown as ChevronDown4 } from "lucide-react";
-import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
 var FINAL_ONLY_TEXT = "Trims time periods to data that has finalized across the selected media formats. Some formats (e.g. Network TV and Cinema) finalize later, so the most recent periods may still change. Turn on for stable, report-ready numbers.";
 function cx3(...classes) {
   return classes.filter(Boolean).join(" ");
@@ -1245,8 +1253,8 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
     onChange(v);
     setOpen(false);
   };
-  return /* @__PURE__ */ jsxs7("div", { className: "relative", ref, children: [
-    /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs8("div", { className: "relative", ref, children: [
+    /* @__PURE__ */ jsxs8(
       "button",
       {
         type: "button",
@@ -1255,7 +1263,7 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
         "aria-haspopup": "listbox",
         className: "flex h-11 items-center gap-2 rounded-control border border-border-strong bg-input px-2.5 text-text-secondary transition-colors hover:bg-subtle hover:text-text-primary focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-border-focus",
         children: [
-          /* @__PURE__ */ jsxs7("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+          /* @__PURE__ */ jsxs8("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
             /* @__PURE__ */ jsx9("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: "Data" }),
             /* @__PURE__ */ jsx9("span", { className: "text-[12px] font-medium text-text-primary", children: display })
           ] }),
@@ -1270,7 +1278,7 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
         ]
       }
     ),
-    open && /* @__PURE__ */ jsxs7(
+    open && /* @__PURE__ */ jsxs8(
       "div",
       {
         role: "listbox",
@@ -1293,7 +1301,7 @@ function Option({
   onClick,
   hint
 }) {
-  const option = /* @__PURE__ */ jsxs7(
+  const option = /* @__PURE__ */ jsxs8(
     "button",
     {
       type: "button",
@@ -1312,7 +1320,7 @@ function Option({
     }
   );
   if (!hint) return option;
-  return /* @__PURE__ */ jsxs7("div", { className: "flex items-center pr-2.5", children: [
+  return /* @__PURE__ */ jsxs8("div", { className: "flex items-center pr-2.5", children: [
     option,
     /* @__PURE__ */ jsx9(InfoTip, { text: hint, trigger: "hover", label: `About ${label}` })
   ] });
@@ -1322,7 +1330,7 @@ function Option({
 import { useCallback as useCallback2, useEffect as useEffect6, useLayoutEffect, useRef as useRef7, useState as useState6 } from "react";
 import { createPortal as createPortal2 } from "react-dom";
 import { Check as Check5, ChevronDown as ChevronDown5 } from "lucide-react";
-import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
 function cx4(...classes) {
   return classes.filter(Boolean).join(" ");
 }
@@ -1372,8 +1380,8 @@ function SelectFilter({
       window.removeEventListener("scroll", reposition, true);
     };
   }, [open, close, reposition]);
-  return /* @__PURE__ */ jsxs8("div", { className: cx4("relative", fullWidth && "w-full"), ref, children: [
-    /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs9("div", { className: cx4("relative", fullWidth && "w-full"), ref, children: [
+    /* @__PURE__ */ jsxs9(
       "button",
       {
         type: "button",
@@ -1387,7 +1395,7 @@ function SelectFilter({
           className
         ),
         children: [
-          /* @__PURE__ */ jsxs8("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+          /* @__PURE__ */ jsxs9("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
             /* @__PURE__ */ jsx10("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
             /* @__PURE__ */ jsx10("span", { className: "text-[12px] font-medium text-text-primary", children: value })
           ] }),
@@ -1417,7 +1425,7 @@ function SelectFilter({
           "aria-label": caption,
           children: /* @__PURE__ */ jsx10("div", { className: "max-h-[280px] overflow-y-auto p-1", children: options.map((o) => {
             const selected = o === value;
-            return /* @__PURE__ */ jsxs8(
+            return /* @__PURE__ */ jsxs9(
               "button",
               {
                 type: "button",
@@ -1452,7 +1460,7 @@ function SelectFilter({
 // src/Card.tsx
 import { forwardRef } from "react";
-import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
 var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, className, children, ...rest }, ref) {
   return /* @__PURE__ */ jsx11(
     "article",
@@ -1465,9 +1473,9 @@ var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, clas
         className
       ].filter(Boolean).join(" "),
       ...rest,
-      children: title ? /* @__PURE__ */ jsxs9("div", { className: "flex flex-1 flex-col p-card-padding", children: [
-        /* @__PURE__ */ jsxs9("div", { className: "flex items-start justify-between gap-2", children: [
-          /* @__PURE__ */ jsxs9("div", { children: [
+      children: title ? /* @__PURE__ */ jsxs10("div", { className: "flex flex-1 flex-col p-card-padding", children: [
+        /* @__PURE__ */ jsxs10("div", { className: "flex items-start justify-between gap-2", children: [
+          /* @__PURE__ */ jsxs10("div", { children: [
             /* @__PURE__ */ jsx11("h3", { className: "text-[15px] font-semibold leading-snug text-text-primary", children: title }),
             subtitle && /* @__PURE__ */ jsx11("p", { className: "mt-0.5 text-[12px] leading-snug text-text-tertiary", children: subtitle })
           ] }),
@@ -1481,7 +1489,7 @@ var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, clas
 // src/NoResultsEmptyState.tsx
 import { FilterX } from "lucide-react";
-import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
 var NO_RESULTS_TITLE = "No results match your filters";
 var NO_RESULTS_BODY = "Your filters may be too narrow, conflict with each other, or have no activity in this period.";
 function noResultsBody(workspaceName) {
@@ -1503,11 +1511,11 @@ function NoResultsEmptyState({
   const showClear = hasFilters !== false && Boolean(onClearFilters);
   const showEdit = Boolean(onEditFilters);
   const hasActions = showClear || showEdit || Boolean(actions && actions.length > 0);
-  return /* @__PURE__ */ jsxs10("div", { className: "flex flex-col items-center justify-center gap-3 text-center", "data-testid": testIdPrefix, children: [
+  return /* @__PURE__ */ jsxs11("div", { className: "flex flex-col items-center justify-center gap-3 text-center", "data-testid": testIdPrefix, children: [
     /* @__PURE__ */ jsx12("span", { className: "flex h-11 w-11 items-center justify-center rounded-full bg-subtle text-text-tertiary", children: /* @__PURE__ */ jsx12(FilterX, { size: 20, "aria-hidden": "true" }) }),
     /* @__PURE__ */ jsx12("h2", { className: "text-base font-semibold text-text-primary", children: title }),
     /* @__PURE__ */ jsx12("p", { className: "max-w-[420px] text-[13px] leading-relaxed text-text-secondary", children: bodyText }),
-    hasActions && /* @__PURE__ */ jsxs10("div", { className: "mt-1 flex flex-col items-center gap-3", children: [
+    hasActions && /* @__PURE__ */ jsxs11("div", { className: "mt-1 flex flex-col items-center gap-3", children: [
       showClear && /* @__PURE__ */ jsx12(
         "button",
         {
@@ -1545,7 +1553,7 @@ function NoResultsEmptyState({
 // src/WorkspaceSelectedCard.tsx
 import { useEffect as useEffect7, useRef as useRef8, useState as useState7 } from "react";
 import { ChevronDown as ChevronDown6, X as X2 } from "lucide-react";
-import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
 function cx5(...parts) {
   return parts.filter(Boolean).join(" ");
 }
@@ -1567,8 +1575,8 @@ function SummaryGroupItem({
     else if (expandCount === 0) setOpen(false);
     wasEmpty.current = expandCount === 0;
   }, [expandCount]);
-  return /* @__PURE__ */ jsxs11("div", { className: nested ? "" : "py-3 first:pt-0 last:pb-0", children: [
-    /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs12("div", { className: nested ? "" : "py-3 first:pt-0 last:pb-0", children: [
+    /* @__PURE__ */ jsxs12(
       "button",
       {
         type: "button",
@@ -1590,14 +1598,14 @@ function SummaryGroupItem({
         ]
       }
     ),
-    open && /* @__PURE__ */ jsx13("div", { className: "pt-2.5", children: ownCount === 0 && subCount === 0 ? /* @__PURE__ */ jsx13("p", { className: "text-[12px] text-text-secondary", children: "Nothing selected." }) : /* @__PURE__ */ jsxs11("div", { className: "flex flex-col gap-2.5", children: [
-      ownCount > 0 && /* @__PURE__ */ jsxs11("div", { className: "flex flex-col gap-1.5", children: [
-        group.items.map((item) => /* @__PURE__ */ jsxs11(
+    open && /* @__PURE__ */ jsx13("div", { className: "pt-2.5", children: ownCount === 0 && subCount === 0 ? /* @__PURE__ */ jsx13("p", { className: "text-[12px] text-text-secondary", children: "Nothing selected." }) : /* @__PURE__ */ jsxs12("div", { className: "flex flex-col gap-2.5", children: [
+      ownCount > 0 && /* @__PURE__ */ jsxs12("div", { className: "flex flex-col gap-1.5", children: [
+        group.items.map((item) => /* @__PURE__ */ jsxs12(
           "div",
           {
             className: "flex items-center justify-between gap-2 rounded-control border border-border-default bg-canvas px-2 py-1",
             children: [
-              /* @__PURE__ */ jsxs11("span", { className: "min-w-0 flex-1", children: [
+              /* @__PURE__ */ jsxs12("span", { className: "min-w-0 flex-1", children: [
                 /* @__PURE__ */ jsx13("span", { className: "block truncate text-[12px] text-text-primary", children: item.name }),
                 item.meta && /* @__PURE__ */ jsx13("span", { className: "block truncate text-[11px] text-text-secondary", children: item.meta })
               ] }),
@@ -1632,7 +1640,7 @@ function SummaryGroupItem({
 }
 // src/chart-placeholder-shared.tsx
-import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
 var GRID_ROWS = [0, 25, 50, 75, 100];
 var Y_TICK_WIDTHS = [26, 30, 30, 26, 20];
 var Y_AXIS_W = 48;
@@ -1644,8 +1652,8 @@ function AxisFrame({
   children
 }) {
   const gutter = xTicks > 0 ? X_AXIS_H : 0;
-  return /* @__PURE__ */ jsx14("div", { className: "w-full", style: { height }, role: "presentation", "aria-hidden": "true", children: /* @__PURE__ */ jsxs12("div", { className: "relative h-full w-full", children: [
-    /* @__PURE__ */ jsxs12("div", { className: "absolute inset-y-0 right-0", style: { left: Y_AXIS_W, bottom: gutter }, children: [
+  return /* @__PURE__ */ jsx14("div", { className: "w-full", style: { height }, role: "presentation", "aria-hidden": "true", children: /* @__PURE__ */ jsxs13("div", { className: "relative h-full w-full", children: [
+    /* @__PURE__ */ jsxs13("div", { className: "absolute inset-y-0 right-0", style: { left: Y_AXIS_W, bottom: gutter }, children: [
       GRID_ROWS.map((pct) => /* @__PURE__ */ jsx14(
         "div",
         {
@@ -1681,8 +1689,8 @@ function BlankLegend({ rows, reverse = false }) {
       className: `flex flex-1 justify-center gap-1.5 ${reverse ? "flex-col-reverse" : "flex-col"}`,
       role: "presentation",
       "aria-hidden": "true",
-      children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ jsxs12("li", { className: "flex items-center justify-between gap-2", children: [
-        /* @__PURE__ */ jsxs12("span", { className: "flex items-center gap-1.5", children: [
+      children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ jsxs13("li", { className: "flex items-center justify-between gap-2", children: [
+        /* @__PURE__ */ jsxs13("span", { className: "flex items-center gap-1.5", children: [
           /* @__PURE__ */ jsx14("span", { className: "h-2.5 w-2.5 rounded-xs bg-subtle" }),
           /* @__PURE__ */ jsx14(
             "span",
@@ -1706,7 +1714,7 @@ function BarChartPlaceholder({ height = 220 }) {
 }
 // src/LineChartPlaceholder.tsx
-import { jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
 var LINE_SERIES = [
   [58, 52, 55, 41, 45, 33, 36, 25, 28, 17],
   [74, 71, 66, 68, 59, 61, 54, 56, 48, 45],
@@ -1716,8 +1724,8 @@ var LINE_SERIES = [
 var LINE_FORECAST_FROM = 7;
 function LineChartPlaceholder({ height = 280 }) {
   const toPath = (pts, from, to) => pts.slice(from, to).map((y, i) => `${(i + from) / (pts.length - 1) * 100},${y}`).join(" ");
-  return /* @__PURE__ */ jsxs13(AxisFrame, { height, xTicks: LINE_SERIES[0].length, children: [
-    /* @__PURE__ */ jsx16("svg", { viewBox: "0 0 100 100", preserveAspectRatio: "none", className: "absolute inset-0 h-full w-full", children: LINE_SERIES.map((pts, s) => /* @__PURE__ */ jsxs13("g", { children: [
+  return /* @__PURE__ */ jsxs14(AxisFrame, { height, xTicks: LINE_SERIES[0].length, children: [
+    /* @__PURE__ */ jsx16("svg", { viewBox: "0 0 100 100", preserveAspectRatio: "none", className: "absolute inset-0 h-full w-full", children: LINE_SERIES.map((pts, s) => /* @__PURE__ */ jsxs14("g", { children: [
       /* @__PURE__ */ jsx16(
         "polyline",
         {
@@ -1762,12 +1770,12 @@ function LineChartPlaceholder({ height = 280 }) {
 }
 // src/PieChartPlaceholder.tsx
-import { jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
 var PIE_SEAMS = [0, 115, 180, 230, 262, 288, 310, 332];
 function PieChartPlaceholder({ height = 220, legendRows = 8 }) {
   const r = 45;
-  return /* @__PURE__ */ jsxs14("div", { className: "flex w-full items-center gap-3", style: { height }, role: "presentation", "aria-hidden": "true", children: [
-    /* @__PURE__ */ jsx17("div", { className: "flex h-full items-center justify-center", style: { width: "60%" }, children: /* @__PURE__ */ jsxs14("svg", { viewBox: "0 0 100 100", className: "h-full", style: { aspectRatio: "1 / 1" }, children: [
+  return /* @__PURE__ */ jsxs15("div", { className: "flex w-full items-center gap-3", style: { height }, role: "presentation", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx17("div", { className: "flex h-full items-center justify-center", style: { width: "60%" }, children: /* @__PURE__ */ jsxs15("svg", { viewBox: "0 0 100 100", className: "h-full", style: { aspectRatio: "1 / 1" }, children: [
       /* @__PURE__ */ jsx17("circle", { cx: "50", cy: "50", r, fill: "var(--mr-color-subtle)" }),
       PIE_SEAMS.map((deg) => {
         const rad = (deg - 90) * Math.PI / 180;
@@ -1790,7 +1798,7 @@ function PieChartPlaceholder({ height = 220, legendRows = 8 }) {
 }
 // src/StackedColumnPlaceholder.tsx
-import { jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
 var COLUMN_WEIGHTS = [20, 30, 15, 35, 24, 12, 28, 18];
 function columnBands(count) {
   const weights = Array.from({ length: count }, (_, i) => COLUMN_WEIGHTS[i % COLUMN_WEIGHTS.length]);
@@ -1815,7 +1823,7 @@ function StackedColumnPlaceholder({
     },
     i
   )) });
-  return /* @__PURE__ */ jsxs15("div", { className: "flex w-full gap-4", style: { height }, role: "presentation", "aria-hidden": "true", children: [
+  return /* @__PURE__ */ jsxs16("div", { className: "flex w-full gap-4", style: { height }, role: "presentation", "aria-hidden": "true", children: [
     axis ? /* @__PURE__ */ jsx18("div", { style: { width: "55%" }, children: /* @__PURE__ */ jsx18(AxisFrame, { height, xTicks: 0, children: /* @__PURE__ */ jsx18("div", { className: "flex h-full items-stretch justify-center", children: column }) }) }) : /* @__PURE__ */ jsx18("div", { className: "flex items-stretch py-1", children: column }),
     /* @__PURE__ */ jsx18(BlankLegend, { rows: legendRows, reverse: !axis })
   ] });
@@ -1824,10 +1832,23 @@ function StackedColumnPlaceholder({
 // src/Tooltip.tsx
 import { useEffect as useEffect8, useId, useLayoutEffect as useLayoutEffect2, useRef as useRef9, useState as useState8 } from "react";
 import { createPortal as createPortal3 } from "react-dom";
-import { jsx as jsx19, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
 function cx6(...parts) {
   return parts.filter(Boolean).join(" ");
 }
+function exitDurationMs(el) {
+  if (typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches) return 0;
+  const cs = window.getComputedStyle(el);
+  if (cs.transitionProperty === "none") return 0;
+  const toMs = (v) => {
+    const n = parseFloat(v);
+    if (!Number.isFinite(n)) return 0;
+    return v.trim().endsWith("ms") ? n : n * 1e3;
+  };
+  const durations = cs.transitionDuration.split(",").map(toMs);
+  const delays = cs.transitionDelay.split(",").map(toMs);
+  return Math.max(0, ...durations.map((d, i) => d + (delays[i] ?? delays[0] ?? 0)));
+}
 function Tooltip({
   label,
   children,
@@ -1847,6 +1868,10 @@ function Tooltip({
   const boxRef = useRef9(null);
   const hideTimer = useRef9(null);
   const showTimer = useRef9(null);
+  const exitTimer = useRef9(null);
+  const [shown, setShown] = useState8(false);
+  const openRef = useRef9(false);
+  const mountedRef = useRef9(false);
   const id = useId();
   const clearHideTimer = () => {
     if (hideTimer.current) {
@@ -1860,10 +1885,17 @@ function Tooltip({
       showTimer.current = null;
     }
   };
+  const clearExitTimer = () => {
+    if (exitTimer.current) {
+      clearTimeout(exitTimer.current);
+      exitTimer.current = null;
+    }
+  };
   useEffect8(
     () => () => {
       clearHideTimer();
       clearShowTimer();
+      clearExitTimer();
     },
     []
   );
@@ -1871,26 +1903,56 @@ function Tooltip({
     const el = anchorRef ? anchorRef.current : ref.current;
     if (!el) return;
     if (whenTruncated && el.scrollWidth <= el.clientWidth) return;
+    clearExitTimer();
+    openRef.current = true;
     const r = el.getBoundingClientRect();
-    setBoxWidth(null);
+    if (!mountedRef.current) setBoxWidth(null);
+    mountedRef.current = true;
     setAnchor({ top: r.top, left: r.left, width: r.width, height: r.height, bottom: r.bottom, right: r.right });
     if (anchorRef) el.setAttribute("aria-describedby", id);
   };
   const show = () => {
     clearHideTimer();
-    if (delay > 0) {
+    clearShowTimer();
+    if (delay > 0 && !mountedRef.current) {
       showTimer.current = setTimeout(reveal, delay);
     } else {
       reveal();
     }
   };
-  const hideNow = () => {
-    clearShowTimer();
-    clearHideTimer();
+  const unmount = () => {
+    clearExitTimer();
+    if (openRef.current || !mountedRef.current) return;
+    mountedRef.current = false;
     setAnchor(null);
     setBoxWidth(null);
     if (anchorRef?.current) anchorRef.current.removeAttribute("aria-describedby");
   };
+  const hideNow = () => {
+    clearShowTimer();
+    clearHideTimer();
+    openRef.current = false;
+    if (!mountedRef.current) return;
+    setShown(false);
+    clearExitTimer();
+    const ms = boxRef.current ? exitDurationMs(boxRef.current) : 0;
+    if (ms === 0) {
+      unmount();
+      return;
+    }
+    exitTimer.current = setTimeout(unmount, ms + 50);
+  };
+  const keepOpen = () => {
+    clearHideTimer();
+    if (openRef.current || !mountedRef.current) return;
+    clearExitTimer();
+    openRef.current = true;
+    setShown(true);
+  };
+  const onBoxTransitionEnd = (e) => {
+    if (e.target !== e.currentTarget || e.propertyName !== "opacity") return;
+    if (!openRef.current) unmount();
+  };
   const hide = () => {
     clearShowTimer();
     if (!interactive) {
@@ -1920,6 +1982,7 @@ function Tooltip({
     const el = boxRef.current;
     if (!el) return;
     setBoxWidth(el.getBoundingClientRect().width);
+    if (openRef.current) setShown(true);
   }, [anchor, label]);
   const margin = 8;
   let style = { top: 0, left: 0 };
@@ -1947,10 +2010,19 @@ function Tooltip({
         id,
         "data-testid": testIdPrefix && `${testIdPrefix}-tooltip`,
         style: { top: style.top, left: style.left, right: style.right, visibility: boxWidth == null ? "hidden" : "visible" },
-        onMouseEnter: interactive ? clearHideTimer : void 0,
+        onMouseEnter: interactive ? keepOpen : void 0,
         onMouseLeave: interactive ? hide : void 0,
+        onTransitionEnd: onBoxTransitionEnd,
         className: cx6(
           "fixed z-[90] w-max max-w-xs whitespace-normal break-words px-2.5 py-1.5 text-xs leading-snug",
+          // Fade in/out. The sys duration token rather than a ref one:
+          // it is what Button's hover/press transition uses, and a
+          // tooltip's fade is the same kind of interactive feedback.
+          // design-tokens has no in-out curve (ease-interactive is the
+          // decelerating "standard" curve), so ease-in-out is Tailwind's.
+          "transition-opacity duration-(--mr-motion-duration-interactive) ease-in-out motion-reduce:transition-none",
+          shown ? "opacity-100" : "opacity-0",
+          // Non-interactive: never a pointer target, fade-out included.
           interactive ? "pointer-events-auto" : "pointer-events-none",
           variant === "inverted" ? "rounded-control bg-text-primary text-surface" : "rounded-control border border-border-default bg-surface text-text-primary shadow-overlay",
           translate
@@ -1961,7 +2033,7 @@ function Tooltip({
     document.body
   ) : null;
   if (anchorRef) return floating;
-  return /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsxs17(
     "span",
     {
       ref,
@@ -1980,13 +2052,13 @@ function Tooltip({
 }
 // src/AdvertiserNoResults.tsx
-import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
 function AdvertiserNoResults({
   query,
   hint = "Try checking your spelling or searching for a broader brand name."
 }) {
-  return /* @__PURE__ */ jsxs17("div", { className: "flex flex-col items-center gap-1.5 px-4 py-8 text-center", children: [
-    /* @__PURE__ */ jsxs17("p", { className: "text-[13px] font-medium text-text-primary", children: [
+  return /* @__PURE__ */ jsxs18("div", { className: "flex flex-col items-center gap-1.5 px-4 py-8 text-center", children: [
+    /* @__PURE__ */ jsxs18("p", { className: "text-[13px] font-medium text-text-primary", children: [
       "No results found for \u201C",
       query,
       "\u201D"
@@ -1997,9 +2069,9 @@ function AdvertiserNoResults({
 // src/SelectAllVisible.tsx
 import { ListChecks as ListChecks2 } from "lucide-react";
-import { jsx as jsx21, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
 function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs19(
     "button",
     {
       type: "button",
@@ -2016,14 +2088,14 @@ function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
 // src/SelectedSection.tsx
 import { ChevronDown as ChevronDown7 } from "lucide-react";
-import { jsx as jsx22, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs as jsxs20 } from "react/jsx-runtime";
 function cx7(...parts) {
   return parts.filter(Boolean).join(" ");
 }
 function SelectedSection({ count, open, onToggle, children, testIdPrefix }) {
   if (count === 0) return null;
-  return /* @__PURE__ */ jsxs19("div", { className: "flex flex-col", children: [
-    /* @__PURE__ */ jsxs19(
+  return /* @__PURE__ */ jsxs20("div", { className: "flex flex-col", children: [
+    /* @__PURE__ */ jsxs20(
       "button",
       {
         type: "button",
@@ -2047,7 +2119,7 @@ function SelectedSection({ count, open, onToggle, children, testIdPrefix }) {
 import { useCallback as useCallback3, useEffect as useEffect9, useLayoutEffect as useLayoutEffect3, useMemo as useMemo3, useRef as useRef10, useState as useState9 } from "react";
 import { createPortal as createPortal4 } from "react-dom";
 import { Search as Search4, Plus, Info as Info2, ChevronRight as ChevronRight3, ChevronDown as ChevronDown8, Check as Check6, List, Loader2 } from "lucide-react";
-import { Fragment as Fragment4, jsx as jsx23, jsxs as jsxs20 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx23, jsxs as jsxs21 } from "react/jsx-runtime";
 function cx8(...parts) {
   return parts.filter(Boolean).join(" ");
 }
@@ -2142,8 +2214,8 @@ function SelectionPicker({
     }
   };
   const rowGridCols = showInfoColumn ? "grid-cols-[36px_1fr_44px]" : "grid-cols-[36px_1fr]";
-  return /* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-4", children: [
-    helper && /* @__PURE__ */ jsxs20(Fragment4, { children: [
+  return /* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-4", children: [
+    helper && /* @__PURE__ */ jsxs21(Fragment4, { children: [
       /* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-secondary", children: helper }),
       /* @__PURE__ */ jsx23("hr", { className: "-mx-5 -mt-2 border-border-default sm:-mx-6" })
     ] }),
@@ -2152,7 +2224,7 @@ function SelectionPicker({
       { id: "lists", label: "Account lists", icon: List }
     ].map((t) => {
       const on = source === t.id;
-      return /* @__PURE__ */ jsxs20(
+      return /* @__PURE__ */ jsxs21(
         "button",
         {
           type: "button",
@@ -2170,9 +2242,9 @@ function SelectionPicker({
         t.id
       );
     }) }),
-    source === "search" && /* @__PURE__ */ jsxs20("div", { className: "flex min-w-0 flex-col gap-3", children: [
-      /* @__PURE__ */ jsxs20("div", { className: "flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ jsxs20("div", { className: "flex h-9 min-w-[200px] flex-1 items-center gap-2 rounded-control border border-border-default bg-input px-3", children: [
+    source === "search" && /* @__PURE__ */ jsxs21("div", { className: "flex min-w-0 flex-col gap-3", children: [
+      /* @__PURE__ */ jsxs21("div", { className: "flex flex-wrap items-center gap-2", children: [
+        /* @__PURE__ */ jsxs21("div", { className: "flex h-9 min-w-[200px] flex-1 items-center gap-2 rounded-control border border-border-default bg-input px-3", children: [
           /* @__PURE__ */ jsx23(Search4, { size: 15, className: "text-text-secondary", "aria-hidden": "true" }),
           /* @__PURE__ */ jsx23(
             "input",
@@ -2202,14 +2274,14 @@ function SelectionPicker({
         )),
         toolbarExtra
       ] }),
-      !hasSearched ? /* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
+      !hasSearched ? /* @__PURE__ */ jsxs21("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
         /* @__PURE__ */ jsx23("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-subtle", children: /* @__PURE__ */ jsx23(Search4, { size: 20, className: "text-text-tertiary", "aria-hidden": "true" }) }),
-        /* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-1", children: [
+        /* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-1", children: [
           /* @__PURE__ */ jsx23("p", { className: "text-[14px] font-semibold text-text-primary", children: "Search to get started" }),
           /* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-tertiary", children: "Use the search or filters above to find and add options." })
         ] })
-      ] }) : /* @__PURE__ */ jsxs20("div", { className: "overflow-hidden rounded-control border border-border-default", children: [
-        /* @__PURE__ */ jsxs20(
+      ] }) : /* @__PURE__ */ jsxs21("div", { className: "overflow-hidden rounded-control border border-border-default", children: [
+        /* @__PURE__ */ jsxs21(
           "div",
           {
             className: cx8(
@@ -2238,8 +2310,8 @@ function SelectionPicker({
           const isLocked = lockedIds?.has(row.id) ?? false;
           const kids = getChildren?.(row);
           const isOpen = expanded.has(row.id);
-          return /* @__PURE__ */ jsxs20("div", { className: "border-t border-border-default/60 first:border-t-0", children: [
-            /* @__PURE__ */ jsxs20(
+          return /* @__PURE__ */ jsxs21("div", { className: "border-t border-border-default/60 first:border-t-0", children: [
+            /* @__PURE__ */ jsxs21(
               "div",
               {
                 onClick: isLocked ? void 0 : () => toggleRow(row),
@@ -2290,13 +2362,13 @@ function SelectionPicker({
             ),
             isOpen && kids && /* @__PURE__ */ jsx23("div", { className: "bg-canvas/60 pb-1.5 pl-10 pr-3", children: kids.map((kid) => {
               const kidSel = selectedIds.has(kid.id);
-              return /* @__PURE__ */ jsxs20(
+              return /* @__PURE__ */ jsxs21(
                 "div",
                 {
                   className: "flex items-center justify-between gap-2 border-t border-border-default/40 py-2 first:border-t-0",
                   children: [
                     /* @__PURE__ */ jsx23("span", { className: "truncate text-[13px] text-text-secondary", children: kid.name }),
-                    /* @__PURE__ */ jsxs20(
+                    /* @__PURE__ */ jsxs21(
                       "button",
                       {
                         type: "button",
@@ -2319,7 +2391,7 @@ function SelectionPicker({
             }) })
           ] }, row.id);
         }) }),
-        !loading && !error && hasMore && /* @__PURE__ */ jsxs20(
+        !loading && !error && hasMore && /* @__PURE__ */ jsxs21(
           "button",
           {
             type: "button",
@@ -2335,12 +2407,12 @@ function SelectionPicker({
         )
       ] })
     ] }),
-    source === "lists" && /* @__PURE__ */ jsxs20("div", { className: "flex min-w-0 flex-col gap-3", children: [
+    source === "lists" && /* @__PURE__ */ jsxs21("div", { className: "flex min-w-0 flex-col gap-3", children: [
       /* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-secondary", children: "Select an account list to add all of its accounts at once. Your workspace stays in sync as the list is updated." }),
-      accountLists && accountLists.length > 0 ? /* @__PURE__ */ jsxs20(Fragment4, { children: [
+      accountLists && accountLists.length > 0 ? /* @__PURE__ */ jsxs21(Fragment4, { children: [
         /* @__PURE__ */ jsx23(ScrollFade, { className: "flex max-h-[396px] flex-col gap-2 overflow-y-auto pr-0.5", children: accountLists.map((list) => {
           const on = (selectedListIds ?? []).includes(list.id);
-          return /* @__PURE__ */ jsxs20(
+          return /* @__PURE__ */ jsxs21(
             "button",
             {
               type: "button",
@@ -2362,9 +2434,9 @@ function SelectionPicker({
                     children: on ? /* @__PURE__ */ jsx23(Check6, { size: 16 }) : /* @__PURE__ */ jsx23(Plus, { size: 16 })
                   }
                 ),
-                /* @__PURE__ */ jsxs20("span", { className: "min-w-0 flex-1", children: [
+                /* @__PURE__ */ jsxs21("span", { className: "min-w-0 flex-1", children: [
                   /* @__PURE__ */ jsx23("span", { className: "flex min-w-0 items-center gap-2", children: /* @__PURE__ */ jsx23("span", { className: "truncate text-[14px] font-medium text-text-primary", children: list.name }) }),
-                  /* @__PURE__ */ jsxs20("span", { className: "block truncate text-[12px] text-text-secondary", children: [
+                  /* @__PURE__ */ jsxs21("span", { className: "block truncate text-[12px] text-text-secondary", children: [
                     list.count,
                     " accounts \xB7 ",
                     list.entityTypes.join(", "),
@@ -2378,7 +2450,7 @@ function SelectionPicker({
             list.id
           );
         }) }),
-        /* @__PURE__ */ jsxs20(
+        /* @__PURE__ */ jsxs21(
           "p",
           {
             className: "border-t border-border-default pt-2 text-right text-[12px] font-medium text-text-tertiary",
@@ -2390,9 +2462,9 @@ function SelectionPicker({
             ]
           }
         )
-      ] }) : /* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
+      ] }) : /* @__PURE__ */ jsxs21("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
         /* @__PURE__ */ jsx23("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-subtle", children: /* @__PURE__ */ jsx23(List, { size: 20, className: "text-text-tertiary", "aria-hidden": "true" }) }),
-        /* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-1", children: [
+        /* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-1", children: [
           /* @__PURE__ */ jsx23("p", { className: "text-[14px] font-semibold text-text-primary", children: "No account lists yet" }),
           /* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-tertiary", children: "Account lists set up for you will appear here." })
         ] })
@@ -2476,8 +2548,8 @@ function FilterDropdown({
   const count = active.size;
   const label = count === 0 ? filter.label : count === 1 ? [...active][0] : "Multiple";
   const filterSlug = slug4(filter.label);
-  return /* @__PURE__ */ jsxs20("div", { className: "relative", children: [
-    /* @__PURE__ */ jsxs20(
+  return /* @__PURE__ */ jsxs21("div", { className: "relative", children: [
+    /* @__PURE__ */ jsxs21(
       "button",
       {
         ref: btnRef,
@@ -2494,7 +2566,7 @@ function FilterDropdown({
       }
     ),
     open && pos && createPortal4(
-      /* @__PURE__ */ jsxs20(
+      /* @__PURE__ */ jsxs21(
         "div",
         {
           ref: menuRef,
@@ -2503,7 +2575,7 @@ function FilterDropdown({
           style: { top: pos.top, left: pos.left },
           className: "fixed z-[80] min-w-[220px] rounded-card border border-border-default bg-surface p-2 shadow-overlay",
           children: [
-            searchable && /* @__PURE__ */ jsxs20("div", { className: "mb-1.5 flex h-8 items-center gap-2 rounded-control border border-border-default bg-input px-2.5", children: [
+            searchable && /* @__PURE__ */ jsxs21("div", { className: "mb-1.5 flex h-8 items-center gap-2 rounded-control border border-border-default bg-input px-2.5", children: [
               /* @__PURE__ */ jsx23(Search4, { size: 14, className: "shrink-0 text-text-secondary", "aria-hidden": "true" }),
               /* @__PURE__ */ jsx23(
                 "input",
@@ -2518,7 +2590,7 @@ function FilterDropdown({
             ] }),
             /* @__PURE__ */ jsx23("div", { className: cx8("flex flex-col gap-0.5", searchable && "max-h-[240px] overflow-y-auto"), children: shownOptions.length === 0 ? /* @__PURE__ */ jsx23("p", { className: "px-2 py-3 text-center text-[12px] text-text-secondary", children: "No matches." }) : shownOptions.map((opt) => {
               const on = active.has(opt);
-              return /* @__PURE__ */ jsxs20(
+              return /* @__PURE__ */ jsxs21(
                 "label",
                 {
                   className: "flex cursor-pointer items-center gap-2 rounded-control px-2 py-1.5 text-[13px] text-text-primary hover:bg-subtle",
@@ -2554,7 +2626,7 @@ function gridForColumns(columns) {
 // src/PublisherBreakdownList.tsx
 import { useState as useState10 } from "react";
-import { jsx as jsx24, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
 function cx9(...parts) {
   return parts.filter(Boolean).join(" ");
 }
@@ -2583,7 +2655,7 @@ function BreakdownTag({ children }) {
   return /* @__PURE__ */ jsx24("span", { className: "inline-flex items-center whitespace-nowrap rounded-full bg-subtle px-2 py-0.5 text-[11px] font-medium text-text-secondary", children });
 }
 function DelayedTip({ label, children }) {
-  return /* @__PURE__ */ jsxs21("span", { className: "group/dt relative inline-flex", tabIndex: 0, "aria-label": label, children: [
+  return /* @__PURE__ */ jsxs22("span", { className: "group/dt relative inline-flex", tabIndex: 0, "aria-label": label, children: [
     children,
     /* @__PURE__ */ jsx24(
       "span",
@@ -2599,9 +2671,9 @@ var COL_CURRENT = 76;
 var COL_PREVIOUS = 76;
 var COL_YOY = 44;
 function MetricListHeader({ className }) {
-  return /* @__PURE__ */ jsxs21("div", { className: cx9("flex items-baseline gap-2 pb-2", className), children: [
+  return /* @__PURE__ */ jsxs22("div", { className: cx9("flex items-baseline gap-2 pb-2", className), children: [
     /* @__PURE__ */ jsx24("span", { className: "flex-1" }),
-    /* @__PURE__ */ jsxs21("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
+    /* @__PURE__ */ jsxs22("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
       /* @__PURE__ */ jsx24("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_CURRENT }, children: "Current" }),
       /* @__PURE__ */ jsx24(DelayedTip, { label: "Spend during the same time period one year ago.", children: /* @__PURE__ */ jsx24("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_PREVIOUS }, children: "Previous" }) }),
       /* @__PURE__ */ jsx24(DelayedTip, { label: "Percent change from this time period vs. the same time one year ago.", children: /* @__PURE__ */ jsx24("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_YOY }, children: "YoY" }) })
@@ -2611,10 +2683,10 @@ function MetricListHeader({ className }) {
 function MetricCells({ spendN, yoy }) {
   const prior = priorYearAmt(spendN, yoy);
   const up = yoy !== "NEW" && yoy >= 0;
-  return /* @__PURE__ */ jsxs21("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
+  return /* @__PURE__ */ jsxs22("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
     /* @__PURE__ */ jsx24("span", { className: "text-right text-[12px] font-bold tabular-nums text-text-primary", style: { width: COL_CURRENT }, children: fmtM(spendN) }),
     /* @__PURE__ */ jsx24("span", { className: "text-right text-[12px] font-normal tabular-nums text-text-primary", style: { width: COL_PREVIOUS }, children: prior ?? "\u2014" }),
-    /* @__PURE__ */ jsx24("span", { className: "flex justify-end", style: { width: COL_YOY }, children: yoy === "NEW" ? /* @__PURE__ */ jsx24("span", { className: "rounded-full bg-status-warning/15 px-1.5 text-[10px] font-semibold text-text-warning", children: "NEW" }) : /* @__PURE__ */ jsxs21("span", { className: cx9("text-right text-[12px] font-semibold tabular-nums", up ? "text-text-success" : "text-text-danger"), children: [
+    /* @__PURE__ */ jsx24("span", { className: "flex justify-end", style: { width: COL_YOY }, children: yoy === "NEW" ? /* @__PURE__ */ jsx24("span", { className: "rounded-full bg-status-warning/15 px-1.5 text-[10px] font-semibold text-text-warning", children: "NEW" }) : /* @__PURE__ */ jsxs22("span", { className: cx9("text-right text-[12px] font-semibold tabular-nums", up ? "text-text-success" : "text-text-danger"), children: [
       up ? "+" : "\u2212",
       Math.abs(yoy),
       "%"
@@ -2625,14 +2697,14 @@ function PublisherBreakdownList({ rows, defaultVisibleCount = 10, padded = true,
   const [showAll, setShowAll] = useState10(false);
   const visible = showAll ? rows : rows.slice(0, defaultVisibleCount);
   const rowPad = padded ? "px-5" : "";
-  return /* @__PURE__ */ jsxs21("div", { className: "flex flex-col", children: [
-    /* @__PURE__ */ jsxs21("div", { className: "flex flex-col", children: [
+  return /* @__PURE__ */ jsxs22("div", { className: "flex flex-col", children: [
+    /* @__PURE__ */ jsxs22("div", { className: "flex flex-col", children: [
       /* @__PURE__ */ jsx24(MetricListHeader, { className: rowPad }),
-      visible.map((p) => /* @__PURE__ */ jsxs21("div", { className: cx9("flex items-center justify-between gap-3 border-t border-border-default/60 py-2.5 first:border-t-0", rowPad), children: [
-        /* @__PURE__ */ jsxs21("div", { className: "flex min-w-0 items-center gap-2.5", children: [
+      visible.map((p) => /* @__PURE__ */ jsxs22("div", { className: cx9("flex items-center justify-between gap-3 border-t border-border-default/60 py-2.5 first:border-t-0", rowPad), children: [
+        /* @__PURE__ */ jsxs22("div", { className: "flex min-w-0 items-center gap-2.5", children: [
           renderLogo ? renderLogo(p) : /* @__PURE__ */ jsx24(Monogram, { name: p.brand, size: 28 }),
-          /* @__PURE__ */ jsxs21("div", { className: "min-w-0", children: [
-            /* @__PURE__ */ jsxs21("div", { className: "flex flex-wrap items-center gap-1.5", children: [
+          /* @__PURE__ */ jsxs22("div", { className: "min-w-0", children: [
+            /* @__PURE__ */ jsxs22("div", { className: "flex flex-wrap items-center gap-1.5", children: [
               /* @__PURE__ */ jsx24("span", { className: "text-[14px] font-semibold text-text-primary", children: p.brand }),
               p.tags.map((t) => /* @__PURE__ */ jsx24(BreakdownTag, { children: t }, t))
             ] }),
@@ -2642,14 +2714,14 @@ function PublisherBreakdownList({ rows, defaultVisibleCount = 10, padded = true,
         /* @__PURE__ */ jsx24(MetricCells, { spendN: p.spendN, yoy: p.yoy })
       ] }, p.brand))
     ] }),
-    rows.length > defaultVisibleCount && (viewAllHref ? /* @__PURE__ */ jsx24("div", { className: cx9("border-t border-border-default py-3", rowPad), children: /* @__PURE__ */ jsx24("a", { href: viewAllHref, className: "text-[12px] font-semibold text-text-link hover:underline", children: "See all publishers" }) }) : /* @__PURE__ */ jsxs21("div", { className: cx9("flex items-center gap-2 border-t border-border-default py-3 text-[12px] text-text-tertiary", rowPad), children: [
-      /* @__PURE__ */ jsxs21("span", { children: [
+    rows.length > defaultVisibleCount && (viewAllHref ? /* @__PURE__ */ jsx24("div", { className: cx9("border-t border-border-default py-3", rowPad), children: /* @__PURE__ */ jsx24("a", { href: viewAllHref, className: "text-[12px] font-semibold text-text-link hover:underline", children: "See all publishers" }) }) : /* @__PURE__ */ jsxs22("div", { className: cx9("flex items-center gap-2 border-t border-border-default py-3 text-[12px] text-text-tertiary", rowPad), children: [
+      /* @__PURE__ */ jsxs22("span", { children: [
         "Showing ",
         visible.length,
         " of ",
         rows.length
       ] }),
-      !showAll ? /* @__PURE__ */ jsxs21("button", { type: "button", onClick: () => setShowAll(true), className: "font-semibold text-text-link hover:underline", children: [
+      !showAll ? /* @__PURE__ */ jsxs22("button", { type: "button", onClick: () => setShowAll(true), className: "font-semibold text-text-link hover:underline", children: [
         "See all (",
         rows.length - defaultVisibleCount,
         " more)"
@@ -2663,7 +2735,7 @@ import { forwardRef as forwardRef2 } from "react";
 import { Slot } from "@radix-ui/react-slot";
 import { cva } from "class-variance-authority";
 import { Loader2 as Loader22 } from "lucide-react";
-import { jsx as jsx25, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs23 } from "react/jsx-runtime";
 var buttonVariants = cva(
   "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-control font-medium transition-all duration-(--mr-motion-duration-interactive) ease-interactive disabled:pointer-events-none disabled:opacity-40 focus-visible:outline-hidden focus-visible:ring-0",
   {
@@ -2690,34 +2762,32 @@ var buttonVariants = cva(
 );
 var Button = forwardRef2(
   ({ className, variant, size, asChild = false, loading = false, disabled, children, ...props }, ref) => {
-    const Comp = asChild ? Slot : "button";
-    return /* @__PURE__ */ jsxs22(
-      Comp,
-      {
-        className: cn(buttonVariants({ variant, size, className })),
-        ref,
-        disabled: disabled || loading,
-        "aria-busy": loading || void 0,
-        ...props,
-        children: [
-          loading && /* @__PURE__ */ jsx25(Loader22, { className: "size-4 shrink-0 animate-spin", "aria-hidden": "true" }),
-          children
-        ]
-      }
-    );
+    const shared = {
+      className: cn(buttonVariants({ variant, size, className })),
+      disabled: disabled || loading,
+      "aria-busy": loading || void 0,
+      ...props
+    };
+    if (asChild) {
+      return /* @__PURE__ */ jsx25(Slot, { ref, ...shared, children });
+    }
+    return /* @__PURE__ */ jsxs23("button", { ref, ...shared, children: [
+      loading && /* @__PURE__ */ jsx25(Loader22, { className: "size-4 shrink-0 animate-spin", "aria-hidden": "true" }),
+      children
+    ] });
   }
 );
 Button.displayName = "Button";
 // src/FilterDropdownFooter.tsx
-import { jsx as jsx26, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs24 } from "react/jsx-runtime";
 function FilterDropdownFooter({
   onClear,
   onApply,
   clearLabel = "Clear all",
   applyLabel = "Apply"
 }) {
-  return /* @__PURE__ */ jsxs23(
+  return /* @__PURE__ */ jsxs24(
     "div",
     {
       className: cn(
@@ -2735,7 +2805,7 @@ function FilterDropdownFooter({
 // src/NameListModal.tsx
 import { useEffect as useEffect10, useState as useState11 } from "react";
 import { createPortal as createPortal5 } from "react-dom";
-import { jsx as jsx27, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs25 } from "react/jsx-runtime";
 function NameListModal({
   title,
   initialName,
@@ -2765,7 +2835,7 @@ function NameListModal({
       {
         className: "fixed inset-0 z-70 flex items-center justify-center bg-scrim px-4",
         onMouseDown: (e) => e.target === e.currentTarget && onCancel(),
-        children: /* @__PURE__ */ jsxs24(
+        children: /* @__PURE__ */ jsxs25(
           "div",
           {
             role: "dialog",
@@ -2774,7 +2844,7 @@ function NameListModal({
             className: "w-full max-w-[420px] rounded-card border border-border-default bg-surface p-5 shadow-overlay",
             children: [
               /* @__PURE__ */ jsx27("h2", { className: "text-[16px] font-semibold text-text-primary", children: title }),
-              /* @__PURE__ */ jsxs24("div", { className: "mt-4 flex flex-col gap-1.5", children: [
+              /* @__PURE__ */ jsxs25("div", { className: "mt-4 flex flex-col gap-1.5", children: [
                 /* @__PURE__ */ jsx27("label", { htmlFor: "account-list-name", className: "text-[12px] font-medium text-text-secondary", children: fieldLabel }),
                 /* @__PURE__ */ jsx27(
                   "input",
@@ -2788,11 +2858,11 @@ function NameListModal({
                   }
                 )
               ] }),
-              options && options.length > 0 && /* @__PURE__ */ jsx27("div", { className: "mt-4 flex flex-col gap-2.5", children: options.map((o) => /* @__PURE__ */ jsxs24("label", { className: "flex cursor-pointer items-center gap-2.5 text-[13px] text-text-primary", children: [
+              options && options.length > 0 && /* @__PURE__ */ jsx27("div", { className: "mt-4 flex flex-col gap-2.5", children: options.map((o) => /* @__PURE__ */ jsxs25("label", { className: "flex cursor-pointer items-center gap-2.5 text-[13px] text-text-primary", children: [
                 /* @__PURE__ */ jsx27(CheckBox, { checked: !!checked[o.key], onChange: () => toggle(o.key), ariaLabel: o.label }),
                 o.label
               ] }, o.key)) }),
-              /* @__PURE__ */ jsxs24("div", { className: "mt-5 flex items-center justify-end gap-2", children: [
+              /* @__PURE__ */ jsxs25("div", { className: "mt-5 flex items-center justify-end gap-2", children: [
                 /* @__PURE__ */ jsx27(Button, { variant: "secondary", onClick: onCancel, children: "Cancel" }),
                 /* @__PURE__ */ jsx27(Button, { disabled: !name.trim(), onClick: () => onSubmit(name.trim(), checked), children: submitLabel })
               ] })
@@ -2806,7 +2876,7 @@ function NameListModal({
 }
 // src/ChipTrigger.tsx
-import { jsx as jsx28, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx28, jsxs as jsxs26 } from "react/jsx-runtime";
 function chipTriggerClass(variant = "box") {
   return cn(
     "flex h-11 items-center gap-2 rounded-control border bg-input px-2.5 text-text-secondary transition-colors hover:bg-subtle hover:text-text-primary focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-border-focus",
@@ -2817,12 +2887,12 @@ function chipTriggerClass(variant = "box") {
   );
 }
 function ChipContent({ caption, value, icon }) {
-  const stack = /* @__PURE__ */ jsxs25("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+  const stack = /* @__PURE__ */ jsxs26("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
     /* @__PURE__ */ jsx28("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
     /* @__PURE__ */ jsx28("span", { className: "text-[12px] font-medium text-text-primary", children: value })
   ] });
   if (icon) {
-    return /* @__PURE__ */ jsxs25("span", { className: "flex items-center gap-2", children: [
+    return /* @__PURE__ */ jsxs26("span", { className: "flex items-center gap-2", children: [
       /* @__PURE__ */ jsx28("span", { className: "shrink-0 text-text-tertiary", children: icon }),
       stack
     ] });
@@ -2832,10 +2902,10 @@ function ChipContent({ caption, value, icon }) {
 // src/FilterChipBar.tsx
 import { CircleSlash, X as X3 } from "lucide-react";
-import { jsx as jsx29, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx29, jsxs as jsxs27 } from "react/jsx-runtime";
 function FilterChipBar({ chips, onRemove, onClearAll, parkedKeys }) {
   if (chips.length === 0) return null;
-  return /* @__PURE__ */ jsxs26("div", { className: "flex flex-wrap items-center gap-1.5 border-t border-border-default pt-2.5", children: [
+  return /* @__PURE__ */ jsxs27("div", { className: "flex flex-wrap items-center gap-1.5 border-t border-border-default pt-2.5", children: [
     chips.map((c) => /* @__PURE__ */ jsx29(
       Chip,
       {
@@ -2855,8 +2925,8 @@ function Chip({
   parked,
   onRemove
 }) {
-  return /* @__PURE__ */ jsxs26("span", { className: "group relative inline-flex", children: [
-    /* @__PURE__ */ jsxs26(
+  return /* @__PURE__ */ jsxs27("span", { className: "group relative inline-flex", children: [
+    /* @__PURE__ */ jsxs27(
       "span",
       {
         className: cn(
@@ -2896,10 +2966,10 @@ function Chip({
 // src/SortButton.tsx
 import { ArrowUp, ArrowDown, ArrowUpDown } from "lucide-react";
-import { jsx as jsx30, jsxs as jsxs27 } from "react/jsx-runtime";
+import { jsx as jsx30, jsxs as jsxs28 } from "react/jsx-runtime";
 function SortButton({ label, sortKey, sort, onSort, disabled = false }) {
   const active = !disabled && sort.key === sortKey;
-  return /* @__PURE__ */ jsxs27(
+  return /* @__PURE__ */ jsxs28(
     "button",
     {
       type: "button",
@@ -2951,7 +3021,7 @@ function sortProp(sort) {
 // src/Pager.tsx
 import { ChevronLeft as ChevronLeft3, ChevronRight as ChevronRight4 } from "lucide-react";
-import { jsx as jsx31, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx31, jsxs as jsxs29 } from "react/jsx-runtime";
 function pageWindow(current, total) {
   if (total <= 7) return Array.from({ length: total }, (_, i) => i + 1);
   const keep = /* @__PURE__ */ new Set([1, total, current, current - 1, current + 1]);
@@ -2967,7 +3037,7 @@ function pageWindow(current, total) {
 }
 function Pager({ page, totalPages, onPage }) {
   const btn = "flex h-8 min-w-8 items-center justify-center rounded-control px-2 text-[13px] transition-colors";
-  return /* @__PURE__ */ jsxs28("div", { className: "flex items-center gap-1", children: [
+  return /* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-1", children: [
     /* @__PURE__ */ jsx31(
       "button",
       {
@@ -3056,7 +3126,7 @@ function Tag({ children, className }) {
 // src/TablePagination.tsx
 import { ChevronDown as ChevronDown9, ChevronFirst, ChevronLast, ChevronLeft as ChevronLeft4, ChevronRight as ChevronRight5 } from "lucide-react";
-import { jsx as jsx34, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs30 } from "react/jsx-runtime";
 function TablePagination({
   page,
   perPage,
@@ -3076,9 +3146,9 @@ function TablePagination({
     btn,
     "text-text-secondary hover:bg-subtle hover:text-text-primary disabled:pointer-events-none disabled:opacity-30"
   );
-  return /* @__PURE__ */ jsxs29("div", { className: cn("flex flex-wrap items-center justify-between gap-x-4 gap-y-2", className), children: [
-    /* @__PURE__ */ jsxs29("label", { className: "flex items-center gap-2 text-[13px] text-text-secondary", children: [
-      /* @__PURE__ */ jsxs29("span", { className: "relative", children: [
+  return /* @__PURE__ */ jsxs30("div", { className: cn("flex flex-wrap items-center justify-between gap-x-4 gap-y-2", className), children: [
+    /* @__PURE__ */ jsxs30("label", { className: "flex items-center gap-2 text-[13px] text-text-secondary", children: [
+      /* @__PURE__ */ jsxs30("span", { className: "relative", children: [
         /* @__PURE__ */ jsx34(
           "select",
           {
@@ -3100,7 +3170,7 @@ function TablePagination({
       ] }),
       "items per page"
     ] }),
-    /* @__PURE__ */ jsxs29("nav", { className: "flex items-center gap-1", "aria-label": "Pagination", children: [
+    /* @__PURE__ */ jsxs30("nav", { className: "flex items-center gap-1", "aria-label": "Pagination", children: [
       /* @__PURE__ */ jsx34(
         "button",
         {
@@ -3162,7 +3232,7 @@ function TablePagination({
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs29("span", { className: "text-[13px] text-text-tertiary tabular-nums", children: [
+    /* @__PURE__ */ jsxs30("span", { className: "text-[13px] text-text-tertiary tabular-nums", children: [
       rangeStart.toLocaleString(),
       " \u2013 ",
       rangeEnd.toLocaleString(),
@@ -3177,7 +3247,7 @@ function TablePagination({
 // src/DateRangePicker.tsx
 import { useEffect as useEffect11, useMemo as useMemo4, useRef as useRef11, useState as useState12 } from "react";
 import { ChevronDown as ChevronDown10 } from "lucide-react";
-import { jsx as jsx35, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs31 } from "react/jsx-runtime";
 var MONTH_ABBR = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
 var QUARTER_ABBR = ["Q1", "Q2", "Q3", "Q4"];
 var PRESETS = ["Rolling 3 months", "Rolling 6 months", "Rolling 12 months"];
@@ -3283,8 +3353,8 @@ function DateRangePicker({
     if (showFooter) setDraft(label);
     else commit(label);
   };
-  return /* @__PURE__ */ jsxs30("div", { className: "relative", ref, children: [
-    /* @__PURE__ */ jsxs30(
+  return /* @__PURE__ */ jsxs31("div", { className: "relative", ref, children: [
+    /* @__PURE__ */ jsxs31(
       "button",
       {
         type: "button",
@@ -3293,7 +3363,7 @@ function DateRangePicker({
         "aria-haspopup": "listbox",
         className: chipTriggerClass(),
         children: [
-          /* @__PURE__ */ jsxs30("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+          /* @__PURE__ */ jsxs31("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
             /* @__PURE__ */ jsx35("span", { className: "text-[10px] text-text-tertiary", children: spanLabel(value, end) }),
             /* @__PURE__ */ jsx35("span", { className: "text-[12px] font-medium text-text-primary", children: value })
           ] }),
@@ -3301,7 +3371,7 @@ function DateRangePicker({
         ]
       }
     ),
-    open && /* @__PURE__ */ jsxs30("div", { className: cn("absolute top-[calc(100%+8px)] z-30 w-[280px] overflow-hidden rounded-card border border-border-default bg-surface py-1 shadow-overlay", align === "right" ? "right-0" : "left-0"), children: [
+    open && /* @__PURE__ */ jsxs31("div", { className: cn("absolute top-[calc(100%+8px)] z-30 w-[280px] overflow-hidden rounded-card border border-border-default bg-surface py-1 shadow-overlay", align === "right" ? "right-0" : "left-0"), children: [
       presets.map((p) => /* @__PURE__ */ jsx35(
         "button",
         {
@@ -3312,20 +3382,20 @@ function DateRangePicker({
         },
         p
       )),
-      /* @__PURE__ */ jsxs30("div", { className: "mt-1 border-t border-border-default px-3 pb-2 pt-2", children: [
+      /* @__PURE__ */ jsxs31("div", { className: "mt-1 border-t border-border-default px-3 pb-2 pt-2", children: [
         /* @__PURE__ */ jsx35("div", { className: "text-[13px] font-semibold text-text-primary", children: "Custom Range" }),
-        /* @__PURE__ */ jsxs30("div", { className: "mt-2 flex flex-col gap-2", children: [
-          /* @__PURE__ */ jsxs30("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
+        /* @__PURE__ */ jsxs31("div", { className: "mt-2 flex flex-col gap-2", children: [
+          /* @__PURE__ */ jsxs31("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
             "From",
-            /* @__PURE__ */ jsxs30("span", { className: "flex gap-1", children: [
+            /* @__PURE__ */ jsxs31("span", { className: "flex gap-1", children: [
               granularity === "month" && /* @__PURE__ */ jsx35(MiniSelect, { value: fromMo, onChange: setFromMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
               granularity === "quarter" && /* @__PURE__ */ jsx35(MiniSelect, { value: fromQ, onChange: setFromQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
               /* @__PURE__ */ jsx35(MiniSelect, { value: fromYr, onChange: setFromYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs30("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
+          /* @__PURE__ */ jsxs31("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
             "To",
-            /* @__PURE__ */ jsxs30("span", { className: "flex gap-1", children: [
+            /* @__PURE__ */ jsxs31("span", { className: "flex gap-1", children: [
               granularity === "month" && /* @__PURE__ */ jsx35(MiniSelect, { value: toMo, onChange: setToMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
               granularity === "quarter" && /* @__PURE__ */ jsx35(MiniSelect, { value: toQ, onChange: setToQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
               /* @__PURE__ */ jsx35(MiniSelect, { value: toYr, onChange: setToYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
@@ -3351,7 +3421,7 @@ function DateRangePicker({
 // src/MultiSelectFilter.tsx
 import { useCallback as useCallback4, useEffect as useEffect12, useRef as useRef12, useState as useState13 } from "react";
 import { ChevronDown as ChevronDown11, Check as Check7, Minus as Minus2, Search as Search5, X as X4 } from "lucide-react";
-import { jsx as jsx36, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs32 } from "react/jsx-runtime";
 function MultiSelectFilter({
   caption,
   options = [],
@@ -3442,8 +3512,8 @@ function MultiSelectFilter({
     const kids = live.filter((c) => c.label.toLowerCase().includes(ql));
     return kids.length ? { ...g, children: kids } : null;
   }).filter((g) => g !== null) : [];
-  return /* @__PURE__ */ jsxs31("div", { className: cn("relative", fullWidth && "w-full"), ref, children: [
-    /* @__PURE__ */ jsxs31(
+  return /* @__PURE__ */ jsxs32("div", { className: cn("relative", fullWidth && "w-full"), ref, children: [
+    /* @__PURE__ */ jsxs32(
       "button",
       {
         type: "button",
@@ -3463,7 +3533,7 @@ function MultiSelectFilter({
         ]
       }
     ),
-    open && /* @__PURE__ */ jsxs31(
+    open && /* @__PURE__ */ jsxs32(
       "div",
       {
         className: cn(
@@ -3474,7 +3544,7 @@ function MultiSelectFilter({
         role: "dialog",
         "aria-label": caption,
         children: [
-          searchable && /* @__PURE__ */ jsx36("div", { className: "border-b border-border-default p-2", children: /* @__PURE__ */ jsxs31("div", { className: "flex h-9 items-center gap-2 rounded-control border border-border-default bg-input px-2.5", children: [
+          searchable && /* @__PURE__ */ jsx36("div", { className: "border-b border-border-default p-2", children: /* @__PURE__ */ jsxs32("div", { className: "flex h-9 items-center gap-2 rounded-control border border-border-default bg-input px-2.5", children: [
             /* @__PURE__ */ jsx36(Search5, { size: 14, className: "text-text-secondary", "aria-hidden": "true" }),
             /* @__PURE__ */ jsx36(
               "input",
@@ -3488,11 +3558,11 @@ function MultiSelectFilter({
             ),
             q && /* @__PURE__ */ jsx36("button", { type: "button", onClick: () => setQ(""), "aria-label": "Clear search", className: "text-text-tertiary hover:text-text-primary", children: /* @__PURE__ */ jsx36(X4, { size: 13 }) })
           ] }) }),
-          /* @__PURE__ */ jsxs31("div", { className: "max-h-[280px] overflow-y-auto p-1", children: [
+          /* @__PURE__ */ jsxs32("div", { className: "max-h-[280px] overflow-y-auto p-1", children: [
             groups ? visibleGroups.map((g) => {
               const state = groupState(g);
-              return /* @__PURE__ */ jsxs31("div", { children: [
-                /* @__PURE__ */ jsxs31(
+              return /* @__PURE__ */ jsxs32("div", { children: [
+                /* @__PURE__ */ jsxs32(
                   "button",
                   {
                     type: "button",
@@ -3507,7 +3577,7 @@ function MultiSelectFilter({
                 ),
                 g.children.map((c) => {
                   const checked = draft.includes(c.id);
-                  return /* @__PURE__ */ jsxs31(
+                  return /* @__PURE__ */ jsxs32(
                     "button",
                     {
                       type: "button",
@@ -3525,7 +3595,7 @@ function MultiSelectFilter({
               ] }, g.id);
             }) : items.map((o) => {
               const checked = draft.includes(o.id);
-              return /* @__PURE__ */ jsxs31(
+              return /* @__PURE__ */ jsxs32(
                 "button",
                 {
                   type: "button",
@@ -3551,7 +3621,7 @@ function MultiSelectFilter({
             }),
             (groups && !visibleGroups.length || !groups && !items.length) && /* @__PURE__ */ jsx36("div", { className: "py-6 text-center text-[13px] text-text-tertiary", children: "No matches." })
           ] }),
-          showFooter ? /* @__PURE__ */ jsx36(FilterDropdownFooter, { onClear: () => setDraft(clearValue), onApply: apply }) : min === 0 && draft.length > 0 && /* @__PURE__ */ jsx36("div", { className: "border-t border-border-default p-2", children: /* @__PURE__ */ jsxs31(
+          showFooter ? /* @__PURE__ */ jsx36(FilterDropdownFooter, { onClear: () => setDraft(clearValue), onApply: apply }) : min === 0 && draft.length > 0 && /* @__PURE__ */ jsx36("div", { className: "border-t border-border-default p-2", children: /* @__PURE__ */ jsxs32(
             "button",
             {
               type: "button",
@@ -3570,7 +3640,7 @@ function MultiSelectFilter({
 }
 function TriCheck({ state }) {
   const filled = state !== "none";
-  return /* @__PURE__ */ jsxs31(
+  return /* @__PURE__ */ jsxs32(
     "span",
     {
       className: cn(
@@ -3585,7 +3655,7 @@ function TriCheck({ state }) {
   );
 }
 function OptionCount({ n }) {
-  return /* @__PURE__ */ jsxs31("span", { className: "shrink-0 text-[12px] tabular-nums text-text-tertiary", children: [
+  return /* @__PURE__ */ jsxs32("span", { className: "shrink-0 text-[12px] tabular-nums text-text-tertiary", children: [
     "(",
     n.toLocaleString(),
     ")"
@@ -3633,11 +3703,11 @@ function Toggle({ checked, onChange, label, size = "md", disabled, className })
 // src/AISpark.tsx
 import { useId as useId2 } from "react";
 import { Sparkles } from "lucide-react";
-import { Fragment as Fragment5, jsx as jsx38, jsxs as jsxs32 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx38, jsxs as jsxs33 } from "react/jsx-runtime";
 function AISpark({ size = 16, className }) {
   const id = useId2();
-  return /* @__PURE__ */ jsxs32(Fragment5, { children: [
-    /* @__PURE__ */ jsx38("svg", { width: "0", height: "0", "aria-hidden": "true", style: { position: "absolute" }, children: /* @__PURE__ */ jsx38("defs", { children: /* @__PURE__ */ jsxs32("linearGradient", { id, x1: "0", y1: "0", x2: "1", y2: "1", children: [
+  return /* @__PURE__ */ jsxs33(Fragment5, { children: [
+    /* @__PURE__ */ jsx38("svg", { width: "0", height: "0", "aria-hidden": "true", style: { position: "absolute" }, children: /* @__PURE__ */ jsx38("defs", { children: /* @__PURE__ */ jsxs33("linearGradient", { id, x1: "0", y1: "0", x2: "1", y2: "1", children: [
       /* @__PURE__ */ jsx38("stop", { offset: "0%", stopColor: "var(--mr-color-brand-primary)" }),
       /* @__PURE__ */ jsx38("stop", { offset: "100%", className: "[stop-color:#9474ff] in-data-[theme=dark]:[stop-color:#a488ff]" })
     ] }) }) }),