@mediaradar/design-components 0.12.0 → 0.14.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.
- package/dist/index.cjs +19 -5
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +16 -5
- package/dist/index.d.ts +16 -5
- package/dist/index.js +199 -185
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -403,10 +403,16 @@ function cn(...inputs) {
|
|
|
403
403
|
}
|
|
404
404
|
|
|
405
405
|
// src/Badge.tsx
|
|
406
|
-
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
406
|
+
import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
407
407
|
var TONE = {
|
|
408
408
|
neutral: "bg-subtle text-text-secondary",
|
|
409
409
|
brand: "bg-brand-primarySoft text-brand-primaryAction",
|
|
410
|
+
// Solid, not a tint. A filter count's whole job is to be noticed -- it is
|
|
411
|
+
// what tells you the view you are looking at is filtered at all -- so it
|
|
412
|
+
// carries the full brand fill rather than the soft wash `brand` uses for a
|
|
413
|
+
// label like "Primary". Missed in the first pass, which collapsed both into
|
|
414
|
+
// one tone; the swap onto real call sites is what surfaced it.
|
|
415
|
+
brandSolid: "bg-brand-primaryAction text-brand-onprimary",
|
|
410
416
|
success: "bg-status-success/15 text-text-success",
|
|
411
417
|
// Heavier tint than success and danger on purpose. Equal opacity does not
|
|
412
418
|
// give equal presence: the warning amber (#b8843a) sits far closer to the
|
|
@@ -436,17 +442,22 @@ var TONE_STYLE = {
|
|
|
436
442
|
}
|
|
437
443
|
};
|
|
438
444
|
var KIND = {
|
|
439
|
-
|
|
445
|
+
// Twice the vertical room the first version had. At py-0.5 the pill hugged
|
|
446
|
+
// its text and read as a tight little tag; at py-1 it reads as a deliberate
|
|
447
|
+
// object. Taken from the status pills the product had already arrived at by
|
|
448
|
+
// hand, which were noticeably more comfortable than anything else -- the
|
|
449
|
+
// breathing room was what made them so, not their extra pixel of type.
|
|
450
|
+
label: "px-2.5 py-1",
|
|
440
451
|
// Square-ish and centred, with a floor width so a 1-digit and a 3-digit
|
|
441
452
|
// count are the same shape, and lining figures so the width does not shift
|
|
442
453
|
// as the number changes.
|
|
443
454
|
count: "h-[18px] min-w-[18px] justify-center px-1.5 tabular-nums",
|
|
444
455
|
// The only kind that shouts. Caps need the letterspacing -- caps set tight
|
|
445
456
|
// are harder to read than the sentence case they replaced.
|
|
446
|
-
eyebrow: "px-2 py-
|
|
457
|
+
eyebrow: "px-2.5 py-1 uppercase tracking-wider"
|
|
447
458
|
};
|
|
448
|
-
function Badge({ tone = "neutral", kind = "label", children, className }) {
|
|
449
|
-
return /* @__PURE__ */
|
|
459
|
+
function Badge({ tone = "neutral", kind = "label", dot = false, children, className }) {
|
|
460
|
+
return /* @__PURE__ */ jsxs4(
|
|
450
461
|
"span",
|
|
451
462
|
{
|
|
452
463
|
style: TONE_STYLE[tone],
|
|
@@ -460,7 +471,10 @@ function Badge({ tone = "neutral", kind = "label", children, className }) {
|
|
|
460
471
|
KIND[kind],
|
|
461
472
|
className
|
|
462
473
|
),
|
|
463
|
-
children
|
|
474
|
+
children: [
|
|
475
|
+
dot && /* @__PURE__ */ jsx4("span", { "aria-hidden": "true", className: "size-1.5 shrink-0 rounded-full bg-current" }),
|
|
476
|
+
children
|
|
477
|
+
]
|
|
464
478
|
}
|
|
465
479
|
);
|
|
466
480
|
}
|
|
@@ -526,7 +540,7 @@ function CheckBoxBox({ checked, indeterminate, disabled, className }) {
|
|
|
526
540
|
// src/DateRangeFilter.tsx
|
|
527
541
|
import { useEffect as useEffect3, useMemo as useMemo2, useRef as useRef3, useState as useState3 } from "react";
|
|
528
542
|
import { ChevronDown as ChevronDown2, ChevronLeft, ChevronRight } from "lucide-react";
|
|
529
|
-
import { jsx as jsx6, jsxs as
|
|
543
|
+
import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
530
544
|
var DEFAULT_SHORTCUTS = [
|
|
531
545
|
"Year to date",
|
|
532
546
|
"Rolling 3 months",
|
|
@@ -732,8 +746,8 @@ function DateRangeFilter({
|
|
|
732
746
|
onRangeChange?.(s, e);
|
|
733
747
|
setOpen(false);
|
|
734
748
|
};
|
|
735
|
-
return /* @__PURE__ */
|
|
736
|
-
/* @__PURE__ */
|
|
749
|
+
return /* @__PURE__ */ jsxs5("div", { className: "relative", ref, children: [
|
|
750
|
+
/* @__PURE__ */ jsxs5(
|
|
737
751
|
"button",
|
|
738
752
|
{
|
|
739
753
|
type: "button",
|
|
@@ -743,7 +757,7 @@ function DateRangeFilter({
|
|
|
743
757
|
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",
|
|
744
758
|
children: [
|
|
745
759
|
icon && /* @__PURE__ */ jsx6("span", { className: "shrink-0 text-text-tertiary", children: icon }),
|
|
746
|
-
/* @__PURE__ */
|
|
760
|
+
/* @__PURE__ */ jsxs5("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
747
761
|
/* @__PURE__ */ jsx6("span", { className: showDates ? "text-[11px] text-text-tertiary" : "text-[10px] uppercase tracking-wide text-text-tertiary", children: showDates ? displayDatesLine : caption }),
|
|
748
762
|
/* @__PURE__ */ jsx6("span", { className: "text-[12px] font-medium text-text-primary", children: displayValue })
|
|
749
763
|
] }),
|
|
@@ -751,7 +765,7 @@ function DateRangeFilter({
|
|
|
751
765
|
]
|
|
752
766
|
}
|
|
753
767
|
),
|
|
754
|
-
open && /* @__PURE__ */
|
|
768
|
+
open && /* @__PURE__ */ jsxs5(
|
|
755
769
|
"div",
|
|
756
770
|
{
|
|
757
771
|
"data-testid": testIdPrefix && `${testIdPrefix}-popover`,
|
|
@@ -770,8 +784,8 @@ function DateRangeFilter({
|
|
|
770
784
|
},
|
|
771
785
|
s
|
|
772
786
|
)) }),
|
|
773
|
-
/* @__PURE__ */
|
|
774
|
-
/* @__PURE__ */
|
|
787
|
+
/* @__PURE__ */ jsxs5("div", { className: "flex flex-col p-4", children: [
|
|
788
|
+
/* @__PURE__ */ jsxs5("div", { className: "flex items-end gap-3", children: [
|
|
775
789
|
/* @__PURE__ */ jsx6(Field, { label: "Start Date", value: start ? fmt(start) : "\u2014" }),
|
|
776
790
|
/* @__PURE__ */ jsx6("span", { className: "pb-2.5 text-text-tertiary", children: "\u2014" }),
|
|
777
791
|
/* @__PURE__ */ jsx6(Field, { label: "End Date", value: end ? fmt(end) : start ? fmt(start) : "\u2014" })
|
|
@@ -780,17 +794,17 @@ function DateRangeFilter({
|
|
|
780
794
|
/* @__PURE__ */ jsx6("div", { className: "flex gap-8", children: [0, 1].map((offset) => {
|
|
781
795
|
const m = addMonths(leftMonth, offset);
|
|
782
796
|
const grid = monthGrid(m.getFullYear(), m.getMonth());
|
|
783
|
-
return /* @__PURE__ */
|
|
784
|
-
/* @__PURE__ */
|
|
797
|
+
return /* @__PURE__ */ jsxs5("div", { className: "w-[252px]", children: [
|
|
798
|
+
/* @__PURE__ */ jsxs5("div", { className: "mb-2 flex items-center justify-between", children: [
|
|
785
799
|
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" }),
|
|
786
|
-
/* @__PURE__ */
|
|
800
|
+
/* @__PURE__ */ jsxs5("span", { className: "text-[15px] font-semibold text-text-primary", children: [
|
|
787
801
|
MONTHS[m.getMonth()],
|
|
788
802
|
" ",
|
|
789
803
|
m.getFullYear()
|
|
790
804
|
] }),
|
|
791
805
|
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" })
|
|
792
806
|
] }),
|
|
793
|
-
/* @__PURE__ */
|
|
807
|
+
/* @__PURE__ */ jsxs5("div", { className: "grid grid-cols-7", children: [
|
|
794
808
|
WEEKDAYS.map((w) => /* @__PURE__ */ jsx6("div", { className: "flex h-8 items-center justify-center text-[12px] font-semibold text-text-secondary", children: w }, w)),
|
|
795
809
|
grid.map((d, i) => {
|
|
796
810
|
const inMonth = d.getMonth() === m.getMonth();
|
|
@@ -806,7 +820,7 @@ function DateRangeFilter({
|
|
|
806
820
|
else if (end && isEnd) band = "left-0 right-1/2";
|
|
807
821
|
else band = "left-0 right-0";
|
|
808
822
|
}
|
|
809
|
-
return /* @__PURE__ */
|
|
823
|
+
return /* @__PURE__ */ jsxs5("button", { type: "button", onClick: () => pickDay(d), className: "relative flex h-9 items-center justify-center", children: [
|
|
810
824
|
band && /* @__PURE__ */ jsx6("span", { className: `absolute inset-y-[3px] bg-ai-tint ${band}`, "aria-hidden": "true" }),
|
|
811
825
|
/* @__PURE__ */ jsx6(
|
|
812
826
|
"span",
|
|
@@ -820,7 +834,7 @@ function DateRangeFilter({
|
|
|
820
834
|
] })
|
|
821
835
|
] }, offset);
|
|
822
836
|
}) }),
|
|
823
|
-
/* @__PURE__ */
|
|
837
|
+
/* @__PURE__ */ jsxs5("div", { className: "mt-4 flex justify-end gap-2", children: [
|
|
824
838
|
/* @__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" }),
|
|
825
839
|
/* @__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" })
|
|
826
840
|
] })
|
|
@@ -831,7 +845,7 @@ function DateRangeFilter({
|
|
|
831
845
|
] });
|
|
832
846
|
}
|
|
833
847
|
function Field({ label, value }) {
|
|
834
|
-
return /* @__PURE__ */
|
|
848
|
+
return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-1.5", children: [
|
|
835
849
|
/* @__PURE__ */ jsx6("span", { className: "text-[12px] font-medium text-text-secondary", children: label }),
|
|
836
850
|
/* @__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 })
|
|
837
851
|
] });
|
|
@@ -843,7 +857,7 @@ function NavBtn({ children, onClick, ...rest }) {
|
|
|
843
857
|
// src/SearchBar.tsx
|
|
844
858
|
import { useEffect as useEffect4, useRef as useRef4, useState as useState4 } from "react";
|
|
845
859
|
import { AlertCircle, Check as Check3, ChevronDown as ChevronDown3, Search as Search3 } from "lucide-react";
|
|
846
|
-
import { Fragment as Fragment3, jsx as jsx7, jsxs as
|
|
860
|
+
import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
847
861
|
var DEFAULT_SEARCH_MATCH = { mode: "anyWord", wordJoin: "Or" };
|
|
848
862
|
var MODE_LABEL = {
|
|
849
863
|
anyWord: "Any Word",
|
|
@@ -880,7 +894,7 @@ function SearchBar({
|
|
|
880
894
|
};
|
|
881
895
|
}, [open]);
|
|
882
896
|
const showMatch = variant === "filterable" && matchValue;
|
|
883
|
-
return /* @__PURE__ */
|
|
897
|
+
return /* @__PURE__ */ jsxs6(
|
|
884
898
|
"div",
|
|
885
899
|
{
|
|
886
900
|
className: cx2(
|
|
@@ -888,7 +902,7 @@ function SearchBar({
|
|
|
888
902
|
className
|
|
889
903
|
),
|
|
890
904
|
children: [
|
|
891
|
-
/* @__PURE__ */
|
|
905
|
+
/* @__PURE__ */ jsxs6("label", { className: "flex min-w-0 flex-1 items-center gap-2 px-2.5", children: [
|
|
892
906
|
/* @__PURE__ */ jsx7(Search3, { size: 15, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }),
|
|
893
907
|
/* @__PURE__ */ jsx7(
|
|
894
908
|
"input",
|
|
@@ -914,8 +928,8 @@ function SearchBar({
|
|
|
914
928
|
// token package (insights-studio-prototype's own src/index.css;
|
|
915
929
|
// mr-clientapps' own tailwind.config.ts `colors.border.DEFAULT`) --
|
|
916
930
|
// an alias this shared component can't rely on existing.
|
|
917
|
-
/* @__PURE__ */
|
|
918
|
-
/* @__PURE__ */
|
|
931
|
+
/* @__PURE__ */ jsxs6("div", { className: "relative shrink-0 border-l border-border-default", ref, children: [
|
|
932
|
+
/* @__PURE__ */ jsxs6(
|
|
919
933
|
"button",
|
|
920
934
|
{
|
|
921
935
|
type: "button",
|
|
@@ -944,7 +958,7 @@ function SearchBar({
|
|
|
944
958
|
"aria-label": "Search match type",
|
|
945
959
|
"data-testid": testIdPrefix && `${testIdPrefix}-mode-popover`,
|
|
946
960
|
className: "absolute right-0 top-[calc(100%+8px)] z-50 w-[400px] rounded-card border border-border-default bg-surface p-3 shadow-overlay",
|
|
947
|
-
children: /* @__PURE__ */
|
|
961
|
+
children: /* @__PURE__ */ jsxs6("div", { role: "radiogroup", "aria-label": "Search match type", className: "flex flex-col", children: [
|
|
948
962
|
/* @__PURE__ */ jsx7(
|
|
949
963
|
ModeRow,
|
|
950
964
|
{
|
|
@@ -954,7 +968,7 @@ function SearchBar({
|
|
|
954
968
|
testId: testIdPrefix && `${testIdPrefix}-mode-anyWord`,
|
|
955
969
|
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." }),
|
|
956
970
|
infoText: "The Or/And choice applies only when Any Word is the active search mode.",
|
|
957
|
-
extra: /* @__PURE__ */
|
|
971
|
+
extra: /* @__PURE__ */ jsxs6("span", { className: "flex items-center gap-3", children: [
|
|
958
972
|
/* @__PURE__ */ jsx7(
|
|
959
973
|
RadioOption,
|
|
960
974
|
{
|
|
@@ -1034,7 +1048,7 @@ function ModeRow({
|
|
|
1034
1048
|
onSelect,
|
|
1035
1049
|
testId
|
|
1036
1050
|
}) {
|
|
1037
|
-
return /* @__PURE__ */
|
|
1051
|
+
return /* @__PURE__ */ jsxs6(
|
|
1038
1052
|
"div",
|
|
1039
1053
|
{
|
|
1040
1054
|
role: "radio",
|
|
@@ -1050,9 +1064,9 @@ function ModeRow({
|
|
|
1050
1064
|
},
|
|
1051
1065
|
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",
|
|
1052
1066
|
children: [
|
|
1053
|
-
/* @__PURE__ */
|
|
1054
|
-
/* @__PURE__ */
|
|
1055
|
-
/* @__PURE__ */
|
|
1067
|
+
/* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-between gap-2", children: [
|
|
1068
|
+
/* @__PURE__ */ jsxs6("div", { className: "flex flex-wrap items-center gap-3", children: [
|
|
1069
|
+
/* @__PURE__ */ jsxs6("span", { className: "flex items-center gap-1", children: [
|
|
1056
1070
|
/* @__PURE__ */ jsx7("span", { className: "text-[14px] font-semibold text-text-primary", children: title }),
|
|
1057
1071
|
/* @__PURE__ */ jsx7(RowInfoTip, { text: infoText })
|
|
1058
1072
|
] }),
|
|
@@ -1072,7 +1086,7 @@ function RadioOption({
|
|
|
1072
1086
|
onSelect,
|
|
1073
1087
|
testId
|
|
1074
1088
|
}) {
|
|
1075
|
-
return /* @__PURE__ */
|
|
1089
|
+
return /* @__PURE__ */ jsxs6(
|
|
1076
1090
|
"button",
|
|
1077
1091
|
{
|
|
1078
1092
|
type: "button",
|
|
@@ -1111,7 +1125,7 @@ function RowInfoTip({ text }) {
|
|
|
1111
1125
|
window.addEventListener("mousedown", onDown);
|
|
1112
1126
|
return () => window.removeEventListener("mousedown", onDown);
|
|
1113
1127
|
}, [open]);
|
|
1114
|
-
return /* @__PURE__ */
|
|
1128
|
+
return /* @__PURE__ */ jsxs6("span", { className: "relative inline-flex shrink-0 items-center", ref, children: [
|
|
1115
1129
|
/* @__PURE__ */ jsx7(
|
|
1116
1130
|
"button",
|
|
1117
1131
|
{
|
|
@@ -1140,7 +1154,7 @@ function RowInfoTip({ text }) {
|
|
|
1140
1154
|
// src/SectionRail.tsx
|
|
1141
1155
|
import { useRef as useRef5 } from "react";
|
|
1142
1156
|
import { ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight2 } from "lucide-react";
|
|
1143
|
-
import { jsx as jsx8, jsxs as
|
|
1157
|
+
import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
1144
1158
|
function SectionRail({
|
|
1145
1159
|
title,
|
|
1146
1160
|
titleSerif,
|
|
@@ -1153,9 +1167,9 @@ function SectionRail({
|
|
|
1153
1167
|
const scroll = (direction) => {
|
|
1154
1168
|
scrollRef.current?.scrollBy({ left: direction * 320, behavior: "smooth" });
|
|
1155
1169
|
};
|
|
1156
|
-
return /* @__PURE__ */
|
|
1157
|
-
/* @__PURE__ */
|
|
1158
|
-
/* @__PURE__ */
|
|
1170
|
+
return /* @__PURE__ */ jsxs7("section", { className: "flex flex-col gap-4", children: [
|
|
1171
|
+
/* @__PURE__ */ jsxs7("header", { className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between", children: [
|
|
1172
|
+
/* @__PURE__ */ jsxs7("div", { children: [
|
|
1159
1173
|
/* @__PURE__ */ jsx8(
|
|
1160
1174
|
"h2",
|
|
1161
1175
|
{
|
|
@@ -1165,8 +1179,8 @@ function SectionRail({
|
|
|
1165
1179
|
),
|
|
1166
1180
|
/* @__PURE__ */ jsx8("p", { className: "mt-1 text-sm text-text-secondary", children: subtitle })
|
|
1167
1181
|
] }),
|
|
1168
|
-
/* @__PURE__ */
|
|
1169
|
-
viewAllLabel && viewAllHref && /* @__PURE__ */
|
|
1182
|
+
/* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2", children: [
|
|
1183
|
+
viewAllLabel && viewAllHref && /* @__PURE__ */ jsxs7(
|
|
1170
1184
|
"a",
|
|
1171
1185
|
{
|
|
1172
1186
|
href: viewAllHref,
|
|
@@ -1213,7 +1227,7 @@ function SectionRail({
|
|
|
1213
1227
|
// src/DataScopeFilter.tsx
|
|
1214
1228
|
import { useEffect as useEffect5, useRef as useRef6, useState as useState5 } from "react";
|
|
1215
1229
|
import { Check as Check4, ChevronDown as ChevronDown4 } from "lucide-react";
|
|
1216
|
-
import { jsx as jsx9, jsxs as
|
|
1230
|
+
import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1217
1231
|
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.";
|
|
1218
1232
|
function cx3(...classes) {
|
|
1219
1233
|
return classes.filter(Boolean).join(" ");
|
|
@@ -1239,8 +1253,8 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
|
|
|
1239
1253
|
onChange(v);
|
|
1240
1254
|
setOpen(false);
|
|
1241
1255
|
};
|
|
1242
|
-
return /* @__PURE__ */
|
|
1243
|
-
/* @__PURE__ */
|
|
1256
|
+
return /* @__PURE__ */ jsxs8("div", { className: "relative", ref, children: [
|
|
1257
|
+
/* @__PURE__ */ jsxs8(
|
|
1244
1258
|
"button",
|
|
1245
1259
|
{
|
|
1246
1260
|
type: "button",
|
|
@@ -1249,7 +1263,7 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
|
|
|
1249
1263
|
"aria-haspopup": "listbox",
|
|
1250
1264
|
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",
|
|
1251
1265
|
children: [
|
|
1252
|
-
/* @__PURE__ */
|
|
1266
|
+
/* @__PURE__ */ jsxs8("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
1253
1267
|
/* @__PURE__ */ jsx9("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: "Data" }),
|
|
1254
1268
|
/* @__PURE__ */ jsx9("span", { className: "text-[12px] font-medium text-text-primary", children: display })
|
|
1255
1269
|
] }),
|
|
@@ -1264,7 +1278,7 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
|
|
|
1264
1278
|
]
|
|
1265
1279
|
}
|
|
1266
1280
|
),
|
|
1267
|
-
open && /* @__PURE__ */
|
|
1281
|
+
open && /* @__PURE__ */ jsxs8(
|
|
1268
1282
|
"div",
|
|
1269
1283
|
{
|
|
1270
1284
|
role: "listbox",
|
|
@@ -1287,7 +1301,7 @@ function Option({
|
|
|
1287
1301
|
onClick,
|
|
1288
1302
|
hint
|
|
1289
1303
|
}) {
|
|
1290
|
-
const option = /* @__PURE__ */
|
|
1304
|
+
const option = /* @__PURE__ */ jsxs8(
|
|
1291
1305
|
"button",
|
|
1292
1306
|
{
|
|
1293
1307
|
type: "button",
|
|
@@ -1306,7 +1320,7 @@ function Option({
|
|
|
1306
1320
|
}
|
|
1307
1321
|
);
|
|
1308
1322
|
if (!hint) return option;
|
|
1309
|
-
return /* @__PURE__ */
|
|
1323
|
+
return /* @__PURE__ */ jsxs8("div", { className: "flex items-center pr-2.5", children: [
|
|
1310
1324
|
option,
|
|
1311
1325
|
/* @__PURE__ */ jsx9(InfoTip, { text: hint, trigger: "hover", label: `About ${label}` })
|
|
1312
1326
|
] });
|
|
@@ -1316,7 +1330,7 @@ function Option({
|
|
|
1316
1330
|
import { useCallback as useCallback2, useEffect as useEffect6, useLayoutEffect, useRef as useRef7, useState as useState6 } from "react";
|
|
1317
1331
|
import { createPortal as createPortal2 } from "react-dom";
|
|
1318
1332
|
import { Check as Check5, ChevronDown as ChevronDown5 } from "lucide-react";
|
|
1319
|
-
import { jsx as jsx10, jsxs as
|
|
1333
|
+
import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1320
1334
|
function cx4(...classes) {
|
|
1321
1335
|
return classes.filter(Boolean).join(" ");
|
|
1322
1336
|
}
|
|
@@ -1366,8 +1380,8 @@ function SelectFilter({
|
|
|
1366
1380
|
window.removeEventListener("scroll", reposition, true);
|
|
1367
1381
|
};
|
|
1368
1382
|
}, [open, close, reposition]);
|
|
1369
|
-
return /* @__PURE__ */
|
|
1370
|
-
/* @__PURE__ */
|
|
1383
|
+
return /* @__PURE__ */ jsxs9("div", { className: cx4("relative", fullWidth && "w-full"), ref, children: [
|
|
1384
|
+
/* @__PURE__ */ jsxs9(
|
|
1371
1385
|
"button",
|
|
1372
1386
|
{
|
|
1373
1387
|
type: "button",
|
|
@@ -1381,7 +1395,7 @@ function SelectFilter({
|
|
|
1381
1395
|
className
|
|
1382
1396
|
),
|
|
1383
1397
|
children: [
|
|
1384
|
-
/* @__PURE__ */
|
|
1398
|
+
/* @__PURE__ */ jsxs9("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
1385
1399
|
/* @__PURE__ */ jsx10("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
|
|
1386
1400
|
/* @__PURE__ */ jsx10("span", { className: "text-[12px] font-medium text-text-primary", children: value })
|
|
1387
1401
|
] }),
|
|
@@ -1411,7 +1425,7 @@ function SelectFilter({
|
|
|
1411
1425
|
"aria-label": caption,
|
|
1412
1426
|
children: /* @__PURE__ */ jsx10("div", { className: "max-h-[280px] overflow-y-auto p-1", children: options.map((o) => {
|
|
1413
1427
|
const selected = o === value;
|
|
1414
|
-
return /* @__PURE__ */
|
|
1428
|
+
return /* @__PURE__ */ jsxs9(
|
|
1415
1429
|
"button",
|
|
1416
1430
|
{
|
|
1417
1431
|
type: "button",
|
|
@@ -1446,7 +1460,7 @@ function SelectFilter({
|
|
|
1446
1460
|
|
|
1447
1461
|
// src/Card.tsx
|
|
1448
1462
|
import { forwardRef } from "react";
|
|
1449
|
-
import { jsx as jsx11, jsxs as
|
|
1463
|
+
import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1450
1464
|
var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, className, children, ...rest }, ref) {
|
|
1451
1465
|
return /* @__PURE__ */ jsx11(
|
|
1452
1466
|
"article",
|
|
@@ -1459,9 +1473,9 @@ var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, clas
|
|
|
1459
1473
|
className
|
|
1460
1474
|
].filter(Boolean).join(" "),
|
|
1461
1475
|
...rest,
|
|
1462
|
-
children: title ? /* @__PURE__ */
|
|
1463
|
-
/* @__PURE__ */
|
|
1464
|
-
/* @__PURE__ */
|
|
1476
|
+
children: title ? /* @__PURE__ */ jsxs10("div", { className: "flex flex-1 flex-col p-card-padding", children: [
|
|
1477
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-start justify-between gap-2", children: [
|
|
1478
|
+
/* @__PURE__ */ jsxs10("div", { children: [
|
|
1465
1479
|
/* @__PURE__ */ jsx11("h3", { className: "text-[15px] font-semibold leading-snug text-text-primary", children: title }),
|
|
1466
1480
|
subtitle && /* @__PURE__ */ jsx11("p", { className: "mt-0.5 text-[12px] leading-snug text-text-tertiary", children: subtitle })
|
|
1467
1481
|
] }),
|
|
@@ -1475,7 +1489,7 @@ var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, clas
|
|
|
1475
1489
|
|
|
1476
1490
|
// src/NoResultsEmptyState.tsx
|
|
1477
1491
|
import { FilterX } from "lucide-react";
|
|
1478
|
-
import { jsx as jsx12, jsxs as
|
|
1492
|
+
import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1479
1493
|
var NO_RESULTS_TITLE = "No results match your filters";
|
|
1480
1494
|
var NO_RESULTS_BODY = "Your filters may be too narrow, conflict with each other, or have no activity in this period.";
|
|
1481
1495
|
function noResultsBody(workspaceName) {
|
|
@@ -1497,11 +1511,11 @@ function NoResultsEmptyState({
|
|
|
1497
1511
|
const showClear = hasFilters !== false && Boolean(onClearFilters);
|
|
1498
1512
|
const showEdit = Boolean(onEditFilters);
|
|
1499
1513
|
const hasActions = showClear || showEdit || Boolean(actions && actions.length > 0);
|
|
1500
|
-
return /* @__PURE__ */
|
|
1514
|
+
return /* @__PURE__ */ jsxs11("div", { className: "flex flex-col items-center justify-center gap-3 text-center", "data-testid": testIdPrefix, children: [
|
|
1501
1515
|
/* @__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" }) }),
|
|
1502
1516
|
/* @__PURE__ */ jsx12("h2", { className: "text-base font-semibold text-text-primary", children: title }),
|
|
1503
1517
|
/* @__PURE__ */ jsx12("p", { className: "max-w-[420px] text-[13px] leading-relaxed text-text-secondary", children: bodyText }),
|
|
1504
|
-
hasActions && /* @__PURE__ */
|
|
1518
|
+
hasActions && /* @__PURE__ */ jsxs11("div", { className: "mt-1 flex flex-col items-center gap-3", children: [
|
|
1505
1519
|
showClear && /* @__PURE__ */ jsx12(
|
|
1506
1520
|
"button",
|
|
1507
1521
|
{
|
|
@@ -1539,7 +1553,7 @@ function NoResultsEmptyState({
|
|
|
1539
1553
|
// src/WorkspaceSelectedCard.tsx
|
|
1540
1554
|
import { useEffect as useEffect7, useRef as useRef8, useState as useState7 } from "react";
|
|
1541
1555
|
import { ChevronDown as ChevronDown6, X as X2 } from "lucide-react";
|
|
1542
|
-
import { jsx as jsx13, jsxs as
|
|
1556
|
+
import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1543
1557
|
function cx5(...parts) {
|
|
1544
1558
|
return parts.filter(Boolean).join(" ");
|
|
1545
1559
|
}
|
|
@@ -1561,8 +1575,8 @@ function SummaryGroupItem({
|
|
|
1561
1575
|
else if (expandCount === 0) setOpen(false);
|
|
1562
1576
|
wasEmpty.current = expandCount === 0;
|
|
1563
1577
|
}, [expandCount]);
|
|
1564
|
-
return /* @__PURE__ */
|
|
1565
|
-
/* @__PURE__ */
|
|
1578
|
+
return /* @__PURE__ */ jsxs12("div", { className: nested ? "" : "py-3 first:pt-0 last:pb-0", children: [
|
|
1579
|
+
/* @__PURE__ */ jsxs12(
|
|
1566
1580
|
"button",
|
|
1567
1581
|
{
|
|
1568
1582
|
type: "button",
|
|
@@ -1584,14 +1598,14 @@ function SummaryGroupItem({
|
|
|
1584
1598
|
]
|
|
1585
1599
|
}
|
|
1586
1600
|
),
|
|
1587
|
-
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__ */
|
|
1588
|
-
ownCount > 0 && /* @__PURE__ */
|
|
1589
|
-
group.items.map((item) => /* @__PURE__ */
|
|
1601
|
+
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: [
|
|
1602
|
+
ownCount > 0 && /* @__PURE__ */ jsxs12("div", { className: "flex flex-col gap-1.5", children: [
|
|
1603
|
+
group.items.map((item) => /* @__PURE__ */ jsxs12(
|
|
1590
1604
|
"div",
|
|
1591
1605
|
{
|
|
1592
1606
|
className: "flex items-center justify-between gap-2 rounded-control border border-border-default bg-canvas px-2 py-1",
|
|
1593
1607
|
children: [
|
|
1594
|
-
/* @__PURE__ */
|
|
1608
|
+
/* @__PURE__ */ jsxs12("span", { className: "min-w-0 flex-1", children: [
|
|
1595
1609
|
/* @__PURE__ */ jsx13("span", { className: "block truncate text-[12px] text-text-primary", children: item.name }),
|
|
1596
1610
|
item.meta && /* @__PURE__ */ jsx13("span", { className: "block truncate text-[11px] text-text-secondary", children: item.meta })
|
|
1597
1611
|
] }),
|
|
@@ -1626,7 +1640,7 @@ function SummaryGroupItem({
|
|
|
1626
1640
|
}
|
|
1627
1641
|
|
|
1628
1642
|
// src/chart-placeholder-shared.tsx
|
|
1629
|
-
import { jsx as jsx14, jsxs as
|
|
1643
|
+
import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1630
1644
|
var GRID_ROWS = [0, 25, 50, 75, 100];
|
|
1631
1645
|
var Y_TICK_WIDTHS = [26, 30, 30, 26, 20];
|
|
1632
1646
|
var Y_AXIS_W = 48;
|
|
@@ -1638,8 +1652,8 @@ function AxisFrame({
|
|
|
1638
1652
|
children
|
|
1639
1653
|
}) {
|
|
1640
1654
|
const gutter = xTicks > 0 ? X_AXIS_H : 0;
|
|
1641
|
-
return /* @__PURE__ */ jsx14("div", { className: "w-full", style: { height }, role: "presentation", "aria-hidden": "true", children: /* @__PURE__ */
|
|
1642
|
-
/* @__PURE__ */
|
|
1655
|
+
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: [
|
|
1656
|
+
/* @__PURE__ */ jsxs13("div", { className: "absolute inset-y-0 right-0", style: { left: Y_AXIS_W, bottom: gutter }, children: [
|
|
1643
1657
|
GRID_ROWS.map((pct) => /* @__PURE__ */ jsx14(
|
|
1644
1658
|
"div",
|
|
1645
1659
|
{
|
|
@@ -1675,8 +1689,8 @@ function BlankLegend({ rows, reverse = false }) {
|
|
|
1675
1689
|
className: `flex flex-1 justify-center gap-1.5 ${reverse ? "flex-col-reverse" : "flex-col"}`,
|
|
1676
1690
|
role: "presentation",
|
|
1677
1691
|
"aria-hidden": "true",
|
|
1678
|
-
children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */
|
|
1679
|
-
/* @__PURE__ */
|
|
1692
|
+
children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ jsxs13("li", { className: "flex items-center justify-between gap-2", children: [
|
|
1693
|
+
/* @__PURE__ */ jsxs13("span", { className: "flex items-center gap-1.5", children: [
|
|
1680
1694
|
/* @__PURE__ */ jsx14("span", { className: "h-2.5 w-2.5 rounded-xs bg-subtle" }),
|
|
1681
1695
|
/* @__PURE__ */ jsx14(
|
|
1682
1696
|
"span",
|
|
@@ -1700,7 +1714,7 @@ function BarChartPlaceholder({ height = 220 }) {
|
|
|
1700
1714
|
}
|
|
1701
1715
|
|
|
1702
1716
|
// src/LineChartPlaceholder.tsx
|
|
1703
|
-
import { jsx as jsx16, jsxs as
|
|
1717
|
+
import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1704
1718
|
var LINE_SERIES = [
|
|
1705
1719
|
[58, 52, 55, 41, 45, 33, 36, 25, 28, 17],
|
|
1706
1720
|
[74, 71, 66, 68, 59, 61, 54, 56, 48, 45],
|
|
@@ -1710,8 +1724,8 @@ var LINE_SERIES = [
|
|
|
1710
1724
|
var LINE_FORECAST_FROM = 7;
|
|
1711
1725
|
function LineChartPlaceholder({ height = 280 }) {
|
|
1712
1726
|
const toPath = (pts, from, to) => pts.slice(from, to).map((y, i) => `${(i + from) / (pts.length - 1) * 100},${y}`).join(" ");
|
|
1713
|
-
return /* @__PURE__ */
|
|
1714
|
-
/* @__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__ */
|
|
1727
|
+
return /* @__PURE__ */ jsxs14(AxisFrame, { height, xTicks: LINE_SERIES[0].length, children: [
|
|
1728
|
+
/* @__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: [
|
|
1715
1729
|
/* @__PURE__ */ jsx16(
|
|
1716
1730
|
"polyline",
|
|
1717
1731
|
{
|
|
@@ -1756,12 +1770,12 @@ function LineChartPlaceholder({ height = 280 }) {
|
|
|
1756
1770
|
}
|
|
1757
1771
|
|
|
1758
1772
|
// src/PieChartPlaceholder.tsx
|
|
1759
|
-
import { jsx as jsx17, jsxs as
|
|
1773
|
+
import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
1760
1774
|
var PIE_SEAMS = [0, 115, 180, 230, 262, 288, 310, 332];
|
|
1761
1775
|
function PieChartPlaceholder({ height = 220, legendRows = 8 }) {
|
|
1762
1776
|
const r = 45;
|
|
1763
|
-
return /* @__PURE__ */
|
|
1764
|
-
/* @__PURE__ */ jsx17("div", { className: "flex h-full items-center justify-center", style: { width: "60%" }, children: /* @__PURE__ */
|
|
1777
|
+
return /* @__PURE__ */ jsxs15("div", { className: "flex w-full items-center gap-3", style: { height }, role: "presentation", "aria-hidden": "true", children: [
|
|
1778
|
+
/* @__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: [
|
|
1765
1779
|
/* @__PURE__ */ jsx17("circle", { cx: "50", cy: "50", r, fill: "var(--mr-color-subtle)" }),
|
|
1766
1780
|
PIE_SEAMS.map((deg) => {
|
|
1767
1781
|
const rad = (deg - 90) * Math.PI / 180;
|
|
@@ -1784,7 +1798,7 @@ function PieChartPlaceholder({ height = 220, legendRows = 8 }) {
|
|
|
1784
1798
|
}
|
|
1785
1799
|
|
|
1786
1800
|
// src/StackedColumnPlaceholder.tsx
|
|
1787
|
-
import { jsx as jsx18, jsxs as
|
|
1801
|
+
import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1788
1802
|
var COLUMN_WEIGHTS = [20, 30, 15, 35, 24, 12, 28, 18];
|
|
1789
1803
|
function columnBands(count) {
|
|
1790
1804
|
const weights = Array.from({ length: count }, (_, i) => COLUMN_WEIGHTS[i % COLUMN_WEIGHTS.length]);
|
|
@@ -1809,7 +1823,7 @@ function StackedColumnPlaceholder({
|
|
|
1809
1823
|
},
|
|
1810
1824
|
i
|
|
1811
1825
|
)) });
|
|
1812
|
-
return /* @__PURE__ */
|
|
1826
|
+
return /* @__PURE__ */ jsxs16("div", { className: "flex w-full gap-4", style: { height }, role: "presentation", "aria-hidden": "true", children: [
|
|
1813
1827
|
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 }),
|
|
1814
1828
|
/* @__PURE__ */ jsx18(BlankLegend, { rows: legendRows, reverse: !axis })
|
|
1815
1829
|
] });
|
|
@@ -1818,7 +1832,7 @@ function StackedColumnPlaceholder({
|
|
|
1818
1832
|
// src/Tooltip.tsx
|
|
1819
1833
|
import { useEffect as useEffect8, useId, useLayoutEffect as useLayoutEffect2, useRef as useRef9, useState as useState8 } from "react";
|
|
1820
1834
|
import { createPortal as createPortal3 } from "react-dom";
|
|
1821
|
-
import { jsx as jsx19, jsxs as
|
|
1835
|
+
import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
1822
1836
|
function cx6(...parts) {
|
|
1823
1837
|
return parts.filter(Boolean).join(" ");
|
|
1824
1838
|
}
|
|
@@ -1955,7 +1969,7 @@ function Tooltip({
|
|
|
1955
1969
|
document.body
|
|
1956
1970
|
) : null;
|
|
1957
1971
|
if (anchorRef) return floating;
|
|
1958
|
-
return /* @__PURE__ */
|
|
1972
|
+
return /* @__PURE__ */ jsxs17(
|
|
1959
1973
|
"span",
|
|
1960
1974
|
{
|
|
1961
1975
|
ref,
|
|
@@ -1974,13 +1988,13 @@ function Tooltip({
|
|
|
1974
1988
|
}
|
|
1975
1989
|
|
|
1976
1990
|
// src/AdvertiserNoResults.tsx
|
|
1977
|
-
import { jsx as jsx20, jsxs as
|
|
1991
|
+
import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
1978
1992
|
function AdvertiserNoResults({
|
|
1979
1993
|
query,
|
|
1980
1994
|
hint = "Try checking your spelling or searching for a broader brand name."
|
|
1981
1995
|
}) {
|
|
1982
|
-
return /* @__PURE__ */
|
|
1983
|
-
/* @__PURE__ */
|
|
1996
|
+
return /* @__PURE__ */ jsxs18("div", { className: "flex flex-col items-center gap-1.5 px-4 py-8 text-center", children: [
|
|
1997
|
+
/* @__PURE__ */ jsxs18("p", { className: "text-[13px] font-medium text-text-primary", children: [
|
|
1984
1998
|
"No results found for \u201C",
|
|
1985
1999
|
query,
|
|
1986
2000
|
"\u201D"
|
|
@@ -1991,9 +2005,9 @@ function AdvertiserNoResults({
|
|
|
1991
2005
|
|
|
1992
2006
|
// src/SelectAllVisible.tsx
|
|
1993
2007
|
import { ListChecks as ListChecks2 } from "lucide-react";
|
|
1994
|
-
import { jsx as jsx21, jsxs as
|
|
2008
|
+
import { jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
1995
2009
|
function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
|
|
1996
|
-
return /* @__PURE__ */
|
|
2010
|
+
return /* @__PURE__ */ jsxs19(
|
|
1997
2011
|
"button",
|
|
1998
2012
|
{
|
|
1999
2013
|
type: "button",
|
|
@@ -2010,14 +2024,14 @@ function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
|
|
|
2010
2024
|
|
|
2011
2025
|
// src/SelectedSection.tsx
|
|
2012
2026
|
import { ChevronDown as ChevronDown7 } from "lucide-react";
|
|
2013
|
-
import { jsx as jsx22, jsxs as
|
|
2027
|
+
import { jsx as jsx22, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
2014
2028
|
function cx7(...parts) {
|
|
2015
2029
|
return parts.filter(Boolean).join(" ");
|
|
2016
2030
|
}
|
|
2017
2031
|
function SelectedSection({ count, open, onToggle, children, testIdPrefix }) {
|
|
2018
2032
|
if (count === 0) return null;
|
|
2019
|
-
return /* @__PURE__ */
|
|
2020
|
-
/* @__PURE__ */
|
|
2033
|
+
return /* @__PURE__ */ jsxs20("div", { className: "flex flex-col", children: [
|
|
2034
|
+
/* @__PURE__ */ jsxs20(
|
|
2021
2035
|
"button",
|
|
2022
2036
|
{
|
|
2023
2037
|
type: "button",
|
|
@@ -2041,7 +2055,7 @@ function SelectedSection({ count, open, onToggle, children, testIdPrefix }) {
|
|
|
2041
2055
|
import { useCallback as useCallback3, useEffect as useEffect9, useLayoutEffect as useLayoutEffect3, useMemo as useMemo3, useRef as useRef10, useState as useState9 } from "react";
|
|
2042
2056
|
import { createPortal as createPortal4 } from "react-dom";
|
|
2043
2057
|
import { Search as Search4, Plus, Info as Info2, ChevronRight as ChevronRight3, ChevronDown as ChevronDown8, Check as Check6, List, Loader2 } from "lucide-react";
|
|
2044
|
-
import { Fragment as Fragment4, jsx as jsx23, jsxs as
|
|
2058
|
+
import { Fragment as Fragment4, jsx as jsx23, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
2045
2059
|
function cx8(...parts) {
|
|
2046
2060
|
return parts.filter(Boolean).join(" ");
|
|
2047
2061
|
}
|
|
@@ -2136,8 +2150,8 @@ function SelectionPicker({
|
|
|
2136
2150
|
}
|
|
2137
2151
|
};
|
|
2138
2152
|
const rowGridCols = showInfoColumn ? "grid-cols-[36px_1fr_44px]" : "grid-cols-[36px_1fr]";
|
|
2139
|
-
return /* @__PURE__ */
|
|
2140
|
-
helper && /* @__PURE__ */
|
|
2153
|
+
return /* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-4", children: [
|
|
2154
|
+
helper && /* @__PURE__ */ jsxs21(Fragment4, { children: [
|
|
2141
2155
|
/* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-secondary", children: helper }),
|
|
2142
2156
|
/* @__PURE__ */ jsx23("hr", { className: "-mx-5 -mt-2 border-border-default sm:-mx-6" })
|
|
2143
2157
|
] }),
|
|
@@ -2146,7 +2160,7 @@ function SelectionPicker({
|
|
|
2146
2160
|
{ id: "lists", label: "Account lists", icon: List }
|
|
2147
2161
|
].map((t) => {
|
|
2148
2162
|
const on = source === t.id;
|
|
2149
|
-
return /* @__PURE__ */
|
|
2163
|
+
return /* @__PURE__ */ jsxs21(
|
|
2150
2164
|
"button",
|
|
2151
2165
|
{
|
|
2152
2166
|
type: "button",
|
|
@@ -2164,9 +2178,9 @@ function SelectionPicker({
|
|
|
2164
2178
|
t.id
|
|
2165
2179
|
);
|
|
2166
2180
|
}) }),
|
|
2167
|
-
source === "search" && /* @__PURE__ */
|
|
2168
|
-
/* @__PURE__ */
|
|
2169
|
-
/* @__PURE__ */
|
|
2181
|
+
source === "search" && /* @__PURE__ */ jsxs21("div", { className: "flex min-w-0 flex-col gap-3", children: [
|
|
2182
|
+
/* @__PURE__ */ jsxs21("div", { className: "flex flex-wrap items-center gap-2", children: [
|
|
2183
|
+
/* @__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: [
|
|
2170
2184
|
/* @__PURE__ */ jsx23(Search4, { size: 15, className: "text-text-secondary", "aria-hidden": "true" }),
|
|
2171
2185
|
/* @__PURE__ */ jsx23(
|
|
2172
2186
|
"input",
|
|
@@ -2196,14 +2210,14 @@ function SelectionPicker({
|
|
|
2196
2210
|
)),
|
|
2197
2211
|
toolbarExtra
|
|
2198
2212
|
] }),
|
|
2199
|
-
!hasSearched ? /* @__PURE__ */
|
|
2213
|
+
!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: [
|
|
2200
2214
|
/* @__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" }) }),
|
|
2201
|
-
/* @__PURE__ */
|
|
2215
|
+
/* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-1", children: [
|
|
2202
2216
|
/* @__PURE__ */ jsx23("p", { className: "text-[14px] font-semibold text-text-primary", children: "Search to get started" }),
|
|
2203
2217
|
/* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-tertiary", children: "Use the search or filters above to find and add options." })
|
|
2204
2218
|
] })
|
|
2205
|
-
] }) : /* @__PURE__ */
|
|
2206
|
-
/* @__PURE__ */
|
|
2219
|
+
] }) : /* @__PURE__ */ jsxs21("div", { className: "overflow-hidden rounded-control border border-border-default", children: [
|
|
2220
|
+
/* @__PURE__ */ jsxs21(
|
|
2207
2221
|
"div",
|
|
2208
2222
|
{
|
|
2209
2223
|
className: cx8(
|
|
@@ -2232,8 +2246,8 @@ function SelectionPicker({
|
|
|
2232
2246
|
const isLocked = lockedIds?.has(row.id) ?? false;
|
|
2233
2247
|
const kids = getChildren?.(row);
|
|
2234
2248
|
const isOpen = expanded.has(row.id);
|
|
2235
|
-
return /* @__PURE__ */
|
|
2236
|
-
/* @__PURE__ */
|
|
2249
|
+
return /* @__PURE__ */ jsxs21("div", { className: "border-t border-border-default/60 first:border-t-0", children: [
|
|
2250
|
+
/* @__PURE__ */ jsxs21(
|
|
2237
2251
|
"div",
|
|
2238
2252
|
{
|
|
2239
2253
|
onClick: isLocked ? void 0 : () => toggleRow(row),
|
|
@@ -2284,13 +2298,13 @@ function SelectionPicker({
|
|
|
2284
2298
|
),
|
|
2285
2299
|
isOpen && kids && /* @__PURE__ */ jsx23("div", { className: "bg-canvas/60 pb-1.5 pl-10 pr-3", children: kids.map((kid) => {
|
|
2286
2300
|
const kidSel = selectedIds.has(kid.id);
|
|
2287
|
-
return /* @__PURE__ */
|
|
2301
|
+
return /* @__PURE__ */ jsxs21(
|
|
2288
2302
|
"div",
|
|
2289
2303
|
{
|
|
2290
2304
|
className: "flex items-center justify-between gap-2 border-t border-border-default/40 py-2 first:border-t-0",
|
|
2291
2305
|
children: [
|
|
2292
2306
|
/* @__PURE__ */ jsx23("span", { className: "truncate text-[13px] text-text-secondary", children: kid.name }),
|
|
2293
|
-
/* @__PURE__ */
|
|
2307
|
+
/* @__PURE__ */ jsxs21(
|
|
2294
2308
|
"button",
|
|
2295
2309
|
{
|
|
2296
2310
|
type: "button",
|
|
@@ -2313,7 +2327,7 @@ function SelectionPicker({
|
|
|
2313
2327
|
}) })
|
|
2314
2328
|
] }, row.id);
|
|
2315
2329
|
}) }),
|
|
2316
|
-
!loading && !error && hasMore && /* @__PURE__ */
|
|
2330
|
+
!loading && !error && hasMore && /* @__PURE__ */ jsxs21(
|
|
2317
2331
|
"button",
|
|
2318
2332
|
{
|
|
2319
2333
|
type: "button",
|
|
@@ -2329,12 +2343,12 @@ function SelectionPicker({
|
|
|
2329
2343
|
)
|
|
2330
2344
|
] })
|
|
2331
2345
|
] }),
|
|
2332
|
-
source === "lists" && /* @__PURE__ */
|
|
2346
|
+
source === "lists" && /* @__PURE__ */ jsxs21("div", { className: "flex min-w-0 flex-col gap-3", children: [
|
|
2333
2347
|
/* @__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." }),
|
|
2334
|
-
accountLists && accountLists.length > 0 ? /* @__PURE__ */
|
|
2348
|
+
accountLists && accountLists.length > 0 ? /* @__PURE__ */ jsxs21(Fragment4, { children: [
|
|
2335
2349
|
/* @__PURE__ */ jsx23(ScrollFade, { className: "flex max-h-[396px] flex-col gap-2 overflow-y-auto pr-0.5", children: accountLists.map((list) => {
|
|
2336
2350
|
const on = (selectedListIds ?? []).includes(list.id);
|
|
2337
|
-
return /* @__PURE__ */
|
|
2351
|
+
return /* @__PURE__ */ jsxs21(
|
|
2338
2352
|
"button",
|
|
2339
2353
|
{
|
|
2340
2354
|
type: "button",
|
|
@@ -2356,9 +2370,9 @@ function SelectionPicker({
|
|
|
2356
2370
|
children: on ? /* @__PURE__ */ jsx23(Check6, { size: 16 }) : /* @__PURE__ */ jsx23(Plus, { size: 16 })
|
|
2357
2371
|
}
|
|
2358
2372
|
),
|
|
2359
|
-
/* @__PURE__ */
|
|
2373
|
+
/* @__PURE__ */ jsxs21("span", { className: "min-w-0 flex-1", children: [
|
|
2360
2374
|
/* @__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 }) }),
|
|
2361
|
-
/* @__PURE__ */
|
|
2375
|
+
/* @__PURE__ */ jsxs21("span", { className: "block truncate text-[12px] text-text-secondary", children: [
|
|
2362
2376
|
list.count,
|
|
2363
2377
|
" accounts \xB7 ",
|
|
2364
2378
|
list.entityTypes.join(", "),
|
|
@@ -2372,7 +2386,7 @@ function SelectionPicker({
|
|
|
2372
2386
|
list.id
|
|
2373
2387
|
);
|
|
2374
2388
|
}) }),
|
|
2375
|
-
/* @__PURE__ */
|
|
2389
|
+
/* @__PURE__ */ jsxs21(
|
|
2376
2390
|
"p",
|
|
2377
2391
|
{
|
|
2378
2392
|
className: "border-t border-border-default pt-2 text-right text-[12px] font-medium text-text-tertiary",
|
|
@@ -2384,9 +2398,9 @@ function SelectionPicker({
|
|
|
2384
2398
|
]
|
|
2385
2399
|
}
|
|
2386
2400
|
)
|
|
2387
|
-
] }) : /* @__PURE__ */
|
|
2401
|
+
] }) : /* @__PURE__ */ jsxs21("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
|
|
2388
2402
|
/* @__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" }) }),
|
|
2389
|
-
/* @__PURE__ */
|
|
2403
|
+
/* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-1", children: [
|
|
2390
2404
|
/* @__PURE__ */ jsx23("p", { className: "text-[14px] font-semibold text-text-primary", children: "No account lists yet" }),
|
|
2391
2405
|
/* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-tertiary", children: "Account lists set up for you will appear here." })
|
|
2392
2406
|
] })
|
|
@@ -2470,8 +2484,8 @@ function FilterDropdown({
|
|
|
2470
2484
|
const count = active.size;
|
|
2471
2485
|
const label = count === 0 ? filter.label : count === 1 ? [...active][0] : "Multiple";
|
|
2472
2486
|
const filterSlug = slug4(filter.label);
|
|
2473
|
-
return /* @__PURE__ */
|
|
2474
|
-
/* @__PURE__ */
|
|
2487
|
+
return /* @__PURE__ */ jsxs21("div", { className: "relative", children: [
|
|
2488
|
+
/* @__PURE__ */ jsxs21(
|
|
2475
2489
|
"button",
|
|
2476
2490
|
{
|
|
2477
2491
|
ref: btnRef,
|
|
@@ -2488,7 +2502,7 @@ function FilterDropdown({
|
|
|
2488
2502
|
}
|
|
2489
2503
|
),
|
|
2490
2504
|
open && pos && createPortal4(
|
|
2491
|
-
/* @__PURE__ */
|
|
2505
|
+
/* @__PURE__ */ jsxs21(
|
|
2492
2506
|
"div",
|
|
2493
2507
|
{
|
|
2494
2508
|
ref: menuRef,
|
|
@@ -2497,7 +2511,7 @@ function FilterDropdown({
|
|
|
2497
2511
|
style: { top: pos.top, left: pos.left },
|
|
2498
2512
|
className: "fixed z-[80] min-w-[220px] rounded-card border border-border-default bg-surface p-2 shadow-overlay",
|
|
2499
2513
|
children: [
|
|
2500
|
-
searchable && /* @__PURE__ */
|
|
2514
|
+
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: [
|
|
2501
2515
|
/* @__PURE__ */ jsx23(Search4, { size: 14, className: "shrink-0 text-text-secondary", "aria-hidden": "true" }),
|
|
2502
2516
|
/* @__PURE__ */ jsx23(
|
|
2503
2517
|
"input",
|
|
@@ -2512,7 +2526,7 @@ function FilterDropdown({
|
|
|
2512
2526
|
] }),
|
|
2513
2527
|
/* @__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) => {
|
|
2514
2528
|
const on = active.has(opt);
|
|
2515
|
-
return /* @__PURE__ */
|
|
2529
|
+
return /* @__PURE__ */ jsxs21(
|
|
2516
2530
|
"label",
|
|
2517
2531
|
{
|
|
2518
2532
|
className: "flex cursor-pointer items-center gap-2 rounded-control px-2 py-1.5 text-[13px] text-text-primary hover:bg-subtle",
|
|
@@ -2548,7 +2562,7 @@ function gridForColumns(columns) {
|
|
|
2548
2562
|
|
|
2549
2563
|
// src/PublisherBreakdownList.tsx
|
|
2550
2564
|
import { useState as useState10 } from "react";
|
|
2551
|
-
import { jsx as jsx24, jsxs as
|
|
2565
|
+
import { jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
2552
2566
|
function cx9(...parts) {
|
|
2553
2567
|
return parts.filter(Boolean).join(" ");
|
|
2554
2568
|
}
|
|
@@ -2577,7 +2591,7 @@ function BreakdownTag({ children }) {
|
|
|
2577
2591
|
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 });
|
|
2578
2592
|
}
|
|
2579
2593
|
function DelayedTip({ label, children }) {
|
|
2580
|
-
return /* @__PURE__ */
|
|
2594
|
+
return /* @__PURE__ */ jsxs22("span", { className: "group/dt relative inline-flex", tabIndex: 0, "aria-label": label, children: [
|
|
2581
2595
|
children,
|
|
2582
2596
|
/* @__PURE__ */ jsx24(
|
|
2583
2597
|
"span",
|
|
@@ -2593,9 +2607,9 @@ var COL_CURRENT = 76;
|
|
|
2593
2607
|
var COL_PREVIOUS = 76;
|
|
2594
2608
|
var COL_YOY = 44;
|
|
2595
2609
|
function MetricListHeader({ className }) {
|
|
2596
|
-
return /* @__PURE__ */
|
|
2610
|
+
return /* @__PURE__ */ jsxs22("div", { className: cx9("flex items-baseline gap-2 pb-2", className), children: [
|
|
2597
2611
|
/* @__PURE__ */ jsx24("span", { className: "flex-1" }),
|
|
2598
|
-
/* @__PURE__ */
|
|
2612
|
+
/* @__PURE__ */ jsxs22("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
|
|
2599
2613
|
/* @__PURE__ */ jsx24("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_CURRENT }, children: "Current" }),
|
|
2600
2614
|
/* @__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" }) }),
|
|
2601
2615
|
/* @__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" }) })
|
|
@@ -2605,10 +2619,10 @@ function MetricListHeader({ className }) {
|
|
|
2605
2619
|
function MetricCells({ spendN, yoy }) {
|
|
2606
2620
|
const prior = priorYearAmt(spendN, yoy);
|
|
2607
2621
|
const up = yoy !== "NEW" && yoy >= 0;
|
|
2608
|
-
return /* @__PURE__ */
|
|
2622
|
+
return /* @__PURE__ */ jsxs22("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
|
|
2609
2623
|
/* @__PURE__ */ jsx24("span", { className: "text-right text-[12px] font-bold tabular-nums text-text-primary", style: { width: COL_CURRENT }, children: fmtM(spendN) }),
|
|
2610
2624
|
/* @__PURE__ */ jsx24("span", { className: "text-right text-[12px] font-normal tabular-nums text-text-primary", style: { width: COL_PREVIOUS }, children: prior ?? "\u2014" }),
|
|
2611
|
-
/* @__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__ */
|
|
2625
|
+
/* @__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: [
|
|
2612
2626
|
up ? "+" : "\u2212",
|
|
2613
2627
|
Math.abs(yoy),
|
|
2614
2628
|
"%"
|
|
@@ -2619,14 +2633,14 @@ function PublisherBreakdownList({ rows, defaultVisibleCount = 10, padded = true,
|
|
|
2619
2633
|
const [showAll, setShowAll] = useState10(false);
|
|
2620
2634
|
const visible = showAll ? rows : rows.slice(0, defaultVisibleCount);
|
|
2621
2635
|
const rowPad = padded ? "px-5" : "";
|
|
2622
|
-
return /* @__PURE__ */
|
|
2623
|
-
/* @__PURE__ */
|
|
2636
|
+
return /* @__PURE__ */ jsxs22("div", { className: "flex flex-col", children: [
|
|
2637
|
+
/* @__PURE__ */ jsxs22("div", { className: "flex flex-col", children: [
|
|
2624
2638
|
/* @__PURE__ */ jsx24(MetricListHeader, { className: rowPad }),
|
|
2625
|
-
visible.map((p) => /* @__PURE__ */
|
|
2626
|
-
/* @__PURE__ */
|
|
2639
|
+
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: [
|
|
2640
|
+
/* @__PURE__ */ jsxs22("div", { className: "flex min-w-0 items-center gap-2.5", children: [
|
|
2627
2641
|
renderLogo ? renderLogo(p) : /* @__PURE__ */ jsx24(Monogram, { name: p.brand, size: 28 }),
|
|
2628
|
-
/* @__PURE__ */
|
|
2629
|
-
/* @__PURE__ */
|
|
2642
|
+
/* @__PURE__ */ jsxs22("div", { className: "min-w-0", children: [
|
|
2643
|
+
/* @__PURE__ */ jsxs22("div", { className: "flex flex-wrap items-center gap-1.5", children: [
|
|
2630
2644
|
/* @__PURE__ */ jsx24("span", { className: "text-[14px] font-semibold text-text-primary", children: p.brand }),
|
|
2631
2645
|
p.tags.map((t) => /* @__PURE__ */ jsx24(BreakdownTag, { children: t }, t))
|
|
2632
2646
|
] }),
|
|
@@ -2636,14 +2650,14 @@ function PublisherBreakdownList({ rows, defaultVisibleCount = 10, padded = true,
|
|
|
2636
2650
|
/* @__PURE__ */ jsx24(MetricCells, { spendN: p.spendN, yoy: p.yoy })
|
|
2637
2651
|
] }, p.brand))
|
|
2638
2652
|
] }),
|
|
2639
|
-
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__ */
|
|
2640
|
-
/* @__PURE__ */
|
|
2653
|
+
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: [
|
|
2654
|
+
/* @__PURE__ */ jsxs22("span", { children: [
|
|
2641
2655
|
"Showing ",
|
|
2642
2656
|
visible.length,
|
|
2643
2657
|
" of ",
|
|
2644
2658
|
rows.length
|
|
2645
2659
|
] }),
|
|
2646
|
-
!showAll ? /* @__PURE__ */
|
|
2660
|
+
!showAll ? /* @__PURE__ */ jsxs22("button", { type: "button", onClick: () => setShowAll(true), className: "font-semibold text-text-link hover:underline", children: [
|
|
2647
2661
|
"See all (",
|
|
2648
2662
|
rows.length - defaultVisibleCount,
|
|
2649
2663
|
" more)"
|
|
@@ -2657,7 +2671,7 @@ import { forwardRef as forwardRef2 } from "react";
|
|
|
2657
2671
|
import { Slot } from "@radix-ui/react-slot";
|
|
2658
2672
|
import { cva } from "class-variance-authority";
|
|
2659
2673
|
import { Loader2 as Loader22 } from "lucide-react";
|
|
2660
|
-
import { jsx as jsx25, jsxs as
|
|
2674
|
+
import { jsx as jsx25, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
2661
2675
|
var buttonVariants = cva(
|
|
2662
2676
|
"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",
|
|
2663
2677
|
{
|
|
@@ -2685,7 +2699,7 @@ var buttonVariants = cva(
|
|
|
2685
2699
|
var Button = forwardRef2(
|
|
2686
2700
|
({ className, variant, size, asChild = false, loading = false, disabled, children, ...props }, ref) => {
|
|
2687
2701
|
const Comp = asChild ? Slot : "button";
|
|
2688
|
-
return /* @__PURE__ */
|
|
2702
|
+
return /* @__PURE__ */ jsxs23(
|
|
2689
2703
|
Comp,
|
|
2690
2704
|
{
|
|
2691
2705
|
className: cn(buttonVariants({ variant, size, className })),
|
|
@@ -2704,14 +2718,14 @@ var Button = forwardRef2(
|
|
|
2704
2718
|
Button.displayName = "Button";
|
|
2705
2719
|
|
|
2706
2720
|
// src/FilterDropdownFooter.tsx
|
|
2707
|
-
import { jsx as jsx26, jsxs as
|
|
2721
|
+
import { jsx as jsx26, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
2708
2722
|
function FilterDropdownFooter({
|
|
2709
2723
|
onClear,
|
|
2710
2724
|
onApply,
|
|
2711
2725
|
clearLabel = "Clear all",
|
|
2712
2726
|
applyLabel = "Apply"
|
|
2713
2727
|
}) {
|
|
2714
|
-
return /* @__PURE__ */
|
|
2728
|
+
return /* @__PURE__ */ jsxs24(
|
|
2715
2729
|
"div",
|
|
2716
2730
|
{
|
|
2717
2731
|
className: cn(
|
|
@@ -2729,7 +2743,7 @@ function FilterDropdownFooter({
|
|
|
2729
2743
|
// src/NameListModal.tsx
|
|
2730
2744
|
import { useEffect as useEffect10, useState as useState11 } from "react";
|
|
2731
2745
|
import { createPortal as createPortal5 } from "react-dom";
|
|
2732
|
-
import { jsx as jsx27, jsxs as
|
|
2746
|
+
import { jsx as jsx27, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
2733
2747
|
function NameListModal({
|
|
2734
2748
|
title,
|
|
2735
2749
|
initialName,
|
|
@@ -2759,7 +2773,7 @@ function NameListModal({
|
|
|
2759
2773
|
{
|
|
2760
2774
|
className: "fixed inset-0 z-70 flex items-center justify-center bg-scrim px-4",
|
|
2761
2775
|
onMouseDown: (e) => e.target === e.currentTarget && onCancel(),
|
|
2762
|
-
children: /* @__PURE__ */
|
|
2776
|
+
children: /* @__PURE__ */ jsxs25(
|
|
2763
2777
|
"div",
|
|
2764
2778
|
{
|
|
2765
2779
|
role: "dialog",
|
|
@@ -2768,7 +2782,7 @@ function NameListModal({
|
|
|
2768
2782
|
className: "w-full max-w-[420px] rounded-card border border-border-default bg-surface p-5 shadow-overlay",
|
|
2769
2783
|
children: [
|
|
2770
2784
|
/* @__PURE__ */ jsx27("h2", { className: "text-[16px] font-semibold text-text-primary", children: title }),
|
|
2771
|
-
/* @__PURE__ */
|
|
2785
|
+
/* @__PURE__ */ jsxs25("div", { className: "mt-4 flex flex-col gap-1.5", children: [
|
|
2772
2786
|
/* @__PURE__ */ jsx27("label", { htmlFor: "account-list-name", className: "text-[12px] font-medium text-text-secondary", children: fieldLabel }),
|
|
2773
2787
|
/* @__PURE__ */ jsx27(
|
|
2774
2788
|
"input",
|
|
@@ -2782,11 +2796,11 @@ function NameListModal({
|
|
|
2782
2796
|
}
|
|
2783
2797
|
)
|
|
2784
2798
|
] }),
|
|
2785
|
-
options && options.length > 0 && /* @__PURE__ */ jsx27("div", { className: "mt-4 flex flex-col gap-2.5", children: options.map((o) => /* @__PURE__ */
|
|
2799
|
+
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: [
|
|
2786
2800
|
/* @__PURE__ */ jsx27(CheckBox, { checked: !!checked[o.key], onChange: () => toggle(o.key), ariaLabel: o.label }),
|
|
2787
2801
|
o.label
|
|
2788
2802
|
] }, o.key)) }),
|
|
2789
|
-
/* @__PURE__ */
|
|
2803
|
+
/* @__PURE__ */ jsxs25("div", { className: "mt-5 flex items-center justify-end gap-2", children: [
|
|
2790
2804
|
/* @__PURE__ */ jsx27(Button, { variant: "secondary", onClick: onCancel, children: "Cancel" }),
|
|
2791
2805
|
/* @__PURE__ */ jsx27(Button, { disabled: !name.trim(), onClick: () => onSubmit(name.trim(), checked), children: submitLabel })
|
|
2792
2806
|
] })
|
|
@@ -2800,7 +2814,7 @@ function NameListModal({
|
|
|
2800
2814
|
}
|
|
2801
2815
|
|
|
2802
2816
|
// src/ChipTrigger.tsx
|
|
2803
|
-
import { jsx as jsx28, jsxs as
|
|
2817
|
+
import { jsx as jsx28, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
2804
2818
|
function chipTriggerClass(variant = "box") {
|
|
2805
2819
|
return cn(
|
|
2806
2820
|
"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",
|
|
@@ -2811,12 +2825,12 @@ function chipTriggerClass(variant = "box") {
|
|
|
2811
2825
|
);
|
|
2812
2826
|
}
|
|
2813
2827
|
function ChipContent({ caption, value, icon }) {
|
|
2814
|
-
const stack = /* @__PURE__ */
|
|
2828
|
+
const stack = /* @__PURE__ */ jsxs26("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
2815
2829
|
/* @__PURE__ */ jsx28("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
|
|
2816
2830
|
/* @__PURE__ */ jsx28("span", { className: "text-[12px] font-medium text-text-primary", children: value })
|
|
2817
2831
|
] });
|
|
2818
2832
|
if (icon) {
|
|
2819
|
-
return /* @__PURE__ */
|
|
2833
|
+
return /* @__PURE__ */ jsxs26("span", { className: "flex items-center gap-2", children: [
|
|
2820
2834
|
/* @__PURE__ */ jsx28("span", { className: "shrink-0 text-text-tertiary", children: icon }),
|
|
2821
2835
|
stack
|
|
2822
2836
|
] });
|
|
@@ -2826,10 +2840,10 @@ function ChipContent({ caption, value, icon }) {
|
|
|
2826
2840
|
|
|
2827
2841
|
// src/FilterChipBar.tsx
|
|
2828
2842
|
import { CircleSlash, X as X3 } from "lucide-react";
|
|
2829
|
-
import { jsx as jsx29, jsxs as
|
|
2843
|
+
import { jsx as jsx29, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
2830
2844
|
function FilterChipBar({ chips, onRemove, onClearAll, parkedKeys }) {
|
|
2831
2845
|
if (chips.length === 0) return null;
|
|
2832
|
-
return /* @__PURE__ */
|
|
2846
|
+
return /* @__PURE__ */ jsxs27("div", { className: "flex flex-wrap items-center gap-1.5 border-t border-border-default pt-2.5", children: [
|
|
2833
2847
|
chips.map((c) => /* @__PURE__ */ jsx29(
|
|
2834
2848
|
Chip,
|
|
2835
2849
|
{
|
|
@@ -2849,8 +2863,8 @@ function Chip({
|
|
|
2849
2863
|
parked,
|
|
2850
2864
|
onRemove
|
|
2851
2865
|
}) {
|
|
2852
|
-
return /* @__PURE__ */
|
|
2853
|
-
/* @__PURE__ */
|
|
2866
|
+
return /* @__PURE__ */ jsxs27("span", { className: "group relative inline-flex", children: [
|
|
2867
|
+
/* @__PURE__ */ jsxs27(
|
|
2854
2868
|
"span",
|
|
2855
2869
|
{
|
|
2856
2870
|
className: cn(
|
|
@@ -2890,10 +2904,10 @@ function Chip({
|
|
|
2890
2904
|
|
|
2891
2905
|
// src/SortButton.tsx
|
|
2892
2906
|
import { ArrowUp, ArrowDown, ArrowUpDown } from "lucide-react";
|
|
2893
|
-
import { jsx as jsx30, jsxs as
|
|
2907
|
+
import { jsx as jsx30, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
2894
2908
|
function SortButton({ label, sortKey, sort, onSort, disabled = false }) {
|
|
2895
2909
|
const active = !disabled && sort.key === sortKey;
|
|
2896
|
-
return /* @__PURE__ */
|
|
2910
|
+
return /* @__PURE__ */ jsxs28(
|
|
2897
2911
|
"button",
|
|
2898
2912
|
{
|
|
2899
2913
|
type: "button",
|
|
@@ -2945,7 +2959,7 @@ function sortProp(sort) {
|
|
|
2945
2959
|
|
|
2946
2960
|
// src/Pager.tsx
|
|
2947
2961
|
import { ChevronLeft as ChevronLeft3, ChevronRight as ChevronRight4 } from "lucide-react";
|
|
2948
|
-
import { jsx as jsx31, jsxs as
|
|
2962
|
+
import { jsx as jsx31, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
2949
2963
|
function pageWindow(current, total) {
|
|
2950
2964
|
if (total <= 7) return Array.from({ length: total }, (_, i) => i + 1);
|
|
2951
2965
|
const keep = /* @__PURE__ */ new Set([1, total, current, current - 1, current + 1]);
|
|
@@ -2961,7 +2975,7 @@ function pageWindow(current, total) {
|
|
|
2961
2975
|
}
|
|
2962
2976
|
function Pager({ page, totalPages, onPage }) {
|
|
2963
2977
|
const btn = "flex h-8 min-w-8 items-center justify-center rounded-control px-2 text-[13px] transition-colors";
|
|
2964
|
-
return /* @__PURE__ */
|
|
2978
|
+
return /* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-1", children: [
|
|
2965
2979
|
/* @__PURE__ */ jsx31(
|
|
2966
2980
|
"button",
|
|
2967
2981
|
{
|
|
@@ -3050,7 +3064,7 @@ function Tag({ children, className }) {
|
|
|
3050
3064
|
|
|
3051
3065
|
// src/TablePagination.tsx
|
|
3052
3066
|
import { ChevronDown as ChevronDown9, ChevronFirst, ChevronLast, ChevronLeft as ChevronLeft4, ChevronRight as ChevronRight5 } from "lucide-react";
|
|
3053
|
-
import { jsx as jsx34, jsxs as
|
|
3067
|
+
import { jsx as jsx34, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
3054
3068
|
function TablePagination({
|
|
3055
3069
|
page,
|
|
3056
3070
|
perPage,
|
|
@@ -3070,9 +3084,9 @@ function TablePagination({
|
|
|
3070
3084
|
btn,
|
|
3071
3085
|
"text-text-secondary hover:bg-subtle hover:text-text-primary disabled:pointer-events-none disabled:opacity-30"
|
|
3072
3086
|
);
|
|
3073
|
-
return /* @__PURE__ */
|
|
3074
|
-
/* @__PURE__ */
|
|
3075
|
-
/* @__PURE__ */
|
|
3087
|
+
return /* @__PURE__ */ jsxs30("div", { className: cn("flex flex-wrap items-center justify-between gap-x-4 gap-y-2", className), children: [
|
|
3088
|
+
/* @__PURE__ */ jsxs30("label", { className: "flex items-center gap-2 text-[13px] text-text-secondary", children: [
|
|
3089
|
+
/* @__PURE__ */ jsxs30("span", { className: "relative", children: [
|
|
3076
3090
|
/* @__PURE__ */ jsx34(
|
|
3077
3091
|
"select",
|
|
3078
3092
|
{
|
|
@@ -3094,7 +3108,7 @@ function TablePagination({
|
|
|
3094
3108
|
] }),
|
|
3095
3109
|
"items per page"
|
|
3096
3110
|
] }),
|
|
3097
|
-
/* @__PURE__ */
|
|
3111
|
+
/* @__PURE__ */ jsxs30("nav", { className: "flex items-center gap-1", "aria-label": "Pagination", children: [
|
|
3098
3112
|
/* @__PURE__ */ jsx34(
|
|
3099
3113
|
"button",
|
|
3100
3114
|
{
|
|
@@ -3156,7 +3170,7 @@ function TablePagination({
|
|
|
3156
3170
|
}
|
|
3157
3171
|
)
|
|
3158
3172
|
] }),
|
|
3159
|
-
/* @__PURE__ */
|
|
3173
|
+
/* @__PURE__ */ jsxs30("span", { className: "text-[13px] text-text-tertiary tabular-nums", children: [
|
|
3160
3174
|
rangeStart.toLocaleString(),
|
|
3161
3175
|
" \u2013 ",
|
|
3162
3176
|
rangeEnd.toLocaleString(),
|
|
@@ -3171,7 +3185,7 @@ function TablePagination({
|
|
|
3171
3185
|
// src/DateRangePicker.tsx
|
|
3172
3186
|
import { useEffect as useEffect11, useMemo as useMemo4, useRef as useRef11, useState as useState12 } from "react";
|
|
3173
3187
|
import { ChevronDown as ChevronDown10 } from "lucide-react";
|
|
3174
|
-
import { jsx as jsx35, jsxs as
|
|
3188
|
+
import { jsx as jsx35, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
3175
3189
|
var MONTH_ABBR = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
|
|
3176
3190
|
var QUARTER_ABBR = ["Q1", "Q2", "Q3", "Q4"];
|
|
3177
3191
|
var PRESETS = ["Rolling 3 months", "Rolling 6 months", "Rolling 12 months"];
|
|
@@ -3277,8 +3291,8 @@ function DateRangePicker({
|
|
|
3277
3291
|
if (showFooter) setDraft(label);
|
|
3278
3292
|
else commit(label);
|
|
3279
3293
|
};
|
|
3280
|
-
return /* @__PURE__ */
|
|
3281
|
-
/* @__PURE__ */
|
|
3294
|
+
return /* @__PURE__ */ jsxs31("div", { className: "relative", ref, children: [
|
|
3295
|
+
/* @__PURE__ */ jsxs31(
|
|
3282
3296
|
"button",
|
|
3283
3297
|
{
|
|
3284
3298
|
type: "button",
|
|
@@ -3287,7 +3301,7 @@ function DateRangePicker({
|
|
|
3287
3301
|
"aria-haspopup": "listbox",
|
|
3288
3302
|
className: chipTriggerClass(),
|
|
3289
3303
|
children: [
|
|
3290
|
-
/* @__PURE__ */
|
|
3304
|
+
/* @__PURE__ */ jsxs31("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
3291
3305
|
/* @__PURE__ */ jsx35("span", { className: "text-[10px] text-text-tertiary", children: spanLabel(value, end) }),
|
|
3292
3306
|
/* @__PURE__ */ jsx35("span", { className: "text-[12px] font-medium text-text-primary", children: value })
|
|
3293
3307
|
] }),
|
|
@@ -3295,7 +3309,7 @@ function DateRangePicker({
|
|
|
3295
3309
|
]
|
|
3296
3310
|
}
|
|
3297
3311
|
),
|
|
3298
|
-
open && /* @__PURE__ */
|
|
3312
|
+
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: [
|
|
3299
3313
|
presets.map((p) => /* @__PURE__ */ jsx35(
|
|
3300
3314
|
"button",
|
|
3301
3315
|
{
|
|
@@ -3306,20 +3320,20 @@ function DateRangePicker({
|
|
|
3306
3320
|
},
|
|
3307
3321
|
p
|
|
3308
3322
|
)),
|
|
3309
|
-
/* @__PURE__ */
|
|
3323
|
+
/* @__PURE__ */ jsxs31("div", { className: "mt-1 border-t border-border-default px-3 pb-2 pt-2", children: [
|
|
3310
3324
|
/* @__PURE__ */ jsx35("div", { className: "text-[13px] font-semibold text-text-primary", children: "Custom Range" }),
|
|
3311
|
-
/* @__PURE__ */
|
|
3312
|
-
/* @__PURE__ */
|
|
3325
|
+
/* @__PURE__ */ jsxs31("div", { className: "mt-2 flex flex-col gap-2", children: [
|
|
3326
|
+
/* @__PURE__ */ jsxs31("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
|
|
3313
3327
|
"From",
|
|
3314
|
-
/* @__PURE__ */
|
|
3328
|
+
/* @__PURE__ */ jsxs31("span", { className: "flex gap-1", children: [
|
|
3315
3329
|
granularity === "month" && /* @__PURE__ */ jsx35(MiniSelect, { value: fromMo, onChange: setFromMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
|
|
3316
3330
|
granularity === "quarter" && /* @__PURE__ */ jsx35(MiniSelect, { value: fromQ, onChange: setFromQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
|
|
3317
3331
|
/* @__PURE__ */ jsx35(MiniSelect, { value: fromYr, onChange: setFromYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
|
|
3318
3332
|
] })
|
|
3319
3333
|
] }),
|
|
3320
|
-
/* @__PURE__ */
|
|
3334
|
+
/* @__PURE__ */ jsxs31("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
|
|
3321
3335
|
"To",
|
|
3322
|
-
/* @__PURE__ */
|
|
3336
|
+
/* @__PURE__ */ jsxs31("span", { className: "flex gap-1", children: [
|
|
3323
3337
|
granularity === "month" && /* @__PURE__ */ jsx35(MiniSelect, { value: toMo, onChange: setToMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
|
|
3324
3338
|
granularity === "quarter" && /* @__PURE__ */ jsx35(MiniSelect, { value: toQ, onChange: setToQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
|
|
3325
3339
|
/* @__PURE__ */ jsx35(MiniSelect, { value: toYr, onChange: setToYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
|
|
@@ -3345,7 +3359,7 @@ function DateRangePicker({
|
|
|
3345
3359
|
// src/MultiSelectFilter.tsx
|
|
3346
3360
|
import { useCallback as useCallback4, useEffect as useEffect12, useRef as useRef12, useState as useState13 } from "react";
|
|
3347
3361
|
import { ChevronDown as ChevronDown11, Check as Check7, Minus as Minus2, Search as Search5, X as X4 } from "lucide-react";
|
|
3348
|
-
import { jsx as jsx36, jsxs as
|
|
3362
|
+
import { jsx as jsx36, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
3349
3363
|
function MultiSelectFilter({
|
|
3350
3364
|
caption,
|
|
3351
3365
|
options = [],
|
|
@@ -3436,8 +3450,8 @@ function MultiSelectFilter({
|
|
|
3436
3450
|
const kids = live.filter((c) => c.label.toLowerCase().includes(ql));
|
|
3437
3451
|
return kids.length ? { ...g, children: kids } : null;
|
|
3438
3452
|
}).filter((g) => g !== null) : [];
|
|
3439
|
-
return /* @__PURE__ */
|
|
3440
|
-
/* @__PURE__ */
|
|
3453
|
+
return /* @__PURE__ */ jsxs32("div", { className: cn("relative", fullWidth && "w-full"), ref, children: [
|
|
3454
|
+
/* @__PURE__ */ jsxs32(
|
|
3441
3455
|
"button",
|
|
3442
3456
|
{
|
|
3443
3457
|
type: "button",
|
|
@@ -3457,7 +3471,7 @@ function MultiSelectFilter({
|
|
|
3457
3471
|
]
|
|
3458
3472
|
}
|
|
3459
3473
|
),
|
|
3460
|
-
open && /* @__PURE__ */
|
|
3474
|
+
open && /* @__PURE__ */ jsxs32(
|
|
3461
3475
|
"div",
|
|
3462
3476
|
{
|
|
3463
3477
|
className: cn(
|
|
@@ -3468,7 +3482,7 @@ function MultiSelectFilter({
|
|
|
3468
3482
|
role: "dialog",
|
|
3469
3483
|
"aria-label": caption,
|
|
3470
3484
|
children: [
|
|
3471
|
-
searchable && /* @__PURE__ */ jsx36("div", { className: "border-b border-border-default p-2", children: /* @__PURE__ */
|
|
3485
|
+
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: [
|
|
3472
3486
|
/* @__PURE__ */ jsx36(Search5, { size: 14, className: "text-text-secondary", "aria-hidden": "true" }),
|
|
3473
3487
|
/* @__PURE__ */ jsx36(
|
|
3474
3488
|
"input",
|
|
@@ -3482,11 +3496,11 @@ function MultiSelectFilter({
|
|
|
3482
3496
|
),
|
|
3483
3497
|
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 }) })
|
|
3484
3498
|
] }) }),
|
|
3485
|
-
/* @__PURE__ */
|
|
3499
|
+
/* @__PURE__ */ jsxs32("div", { className: "max-h-[280px] overflow-y-auto p-1", children: [
|
|
3486
3500
|
groups ? visibleGroups.map((g) => {
|
|
3487
3501
|
const state = groupState(g);
|
|
3488
|
-
return /* @__PURE__ */
|
|
3489
|
-
/* @__PURE__ */
|
|
3502
|
+
return /* @__PURE__ */ jsxs32("div", { children: [
|
|
3503
|
+
/* @__PURE__ */ jsxs32(
|
|
3490
3504
|
"button",
|
|
3491
3505
|
{
|
|
3492
3506
|
type: "button",
|
|
@@ -3501,7 +3515,7 @@ function MultiSelectFilter({
|
|
|
3501
3515
|
),
|
|
3502
3516
|
g.children.map((c) => {
|
|
3503
3517
|
const checked = draft.includes(c.id);
|
|
3504
|
-
return /* @__PURE__ */
|
|
3518
|
+
return /* @__PURE__ */ jsxs32(
|
|
3505
3519
|
"button",
|
|
3506
3520
|
{
|
|
3507
3521
|
type: "button",
|
|
@@ -3519,7 +3533,7 @@ function MultiSelectFilter({
|
|
|
3519
3533
|
] }, g.id);
|
|
3520
3534
|
}) : items.map((o) => {
|
|
3521
3535
|
const checked = draft.includes(o.id);
|
|
3522
|
-
return /* @__PURE__ */
|
|
3536
|
+
return /* @__PURE__ */ jsxs32(
|
|
3523
3537
|
"button",
|
|
3524
3538
|
{
|
|
3525
3539
|
type: "button",
|
|
@@ -3545,7 +3559,7 @@ function MultiSelectFilter({
|
|
|
3545
3559
|
}),
|
|
3546
3560
|
(groups && !visibleGroups.length || !groups && !items.length) && /* @__PURE__ */ jsx36("div", { className: "py-6 text-center text-[13px] text-text-tertiary", children: "No matches." })
|
|
3547
3561
|
] }),
|
|
3548
|
-
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__ */
|
|
3562
|
+
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(
|
|
3549
3563
|
"button",
|
|
3550
3564
|
{
|
|
3551
3565
|
type: "button",
|
|
@@ -3564,7 +3578,7 @@ function MultiSelectFilter({
|
|
|
3564
3578
|
}
|
|
3565
3579
|
function TriCheck({ state }) {
|
|
3566
3580
|
const filled = state !== "none";
|
|
3567
|
-
return /* @__PURE__ */
|
|
3581
|
+
return /* @__PURE__ */ jsxs32(
|
|
3568
3582
|
"span",
|
|
3569
3583
|
{
|
|
3570
3584
|
className: cn(
|
|
@@ -3579,7 +3593,7 @@ function TriCheck({ state }) {
|
|
|
3579
3593
|
);
|
|
3580
3594
|
}
|
|
3581
3595
|
function OptionCount({ n }) {
|
|
3582
|
-
return /* @__PURE__ */
|
|
3596
|
+
return /* @__PURE__ */ jsxs32("span", { className: "shrink-0 text-[12px] tabular-nums text-text-tertiary", children: [
|
|
3583
3597
|
"(",
|
|
3584
3598
|
n.toLocaleString(),
|
|
3585
3599
|
")"
|
|
@@ -3627,11 +3641,11 @@ function Toggle({ checked, onChange, label, size = "md", disabled, className })
|
|
|
3627
3641
|
// src/AISpark.tsx
|
|
3628
3642
|
import { useId as useId2 } from "react";
|
|
3629
3643
|
import { Sparkles } from "lucide-react";
|
|
3630
|
-
import { Fragment as Fragment5, jsx as jsx38, jsxs as
|
|
3644
|
+
import { Fragment as Fragment5, jsx as jsx38, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
3631
3645
|
function AISpark({ size = 16, className }) {
|
|
3632
3646
|
const id = useId2();
|
|
3633
|
-
return /* @__PURE__ */
|
|
3634
|
-
/* @__PURE__ */ jsx38("svg", { width: "0", height: "0", "aria-hidden": "true", style: { position: "absolute" }, children: /* @__PURE__ */ jsx38("defs", { children: /* @__PURE__ */
|
|
3647
|
+
return /* @__PURE__ */ jsxs33(Fragment5, { children: [
|
|
3648
|
+
/* @__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: [
|
|
3635
3649
|
/* @__PURE__ */ jsx38("stop", { offset: "0%", stopColor: "var(--mr-color-brand-primary)" }),
|
|
3636
3650
|
/* @__PURE__ */ jsx38("stop", { offset: "100%", className: "[stop-color:#9474ff] in-data-[theme=dark]:[stop-color:#a488ff]" })
|
|
3637
3651
|
] }) }) }),
|